@media (min-width: 768px) {
    body {
        padding: 0;
    }

    #home-header {
        display: inline-block;
        width: 100%;
        height: 450px;
        background-image: url("/images/iStock_000018283527_Full.jpg");
        background-size: cover;
        background-color: #555555;
        background-repeat: no-repeat;
        background-position: top center;
        padding-top: 0;
    }

    #content-header {
        display: inline-block;
        width: 100%;
        height: 214px;
        background-color: #555555;
        padding-top: 0;
        color: black;
    }

    .top-menu {
        position: absolute;
        width: 100%;
        top: 18px;
        right: 20px;
    }

        .top-menu a {
            padding: 7px 10px;
            font-size: 16px;
            font-weight: 600;
            color: white;
            text-decoration: none;
            border: none;
            outline: none;
        }

            .top-menu a:hover {
                border: 2px solid white;
            }

    .top-menu-links {
        display: initial;
        float: right;
    }

    .search-container {
        display: none;
        position: absolute;
        top: 30px;
        right: 0px;
        border-radius: 6px;
        overflow: hidden;
        font-size: 15px;
        line-height: 1.42857;
        z-index: 5;
        background-color: #555555;
        padding: 10px;
    }

        .search-container #search-cancel, .search-container #search-submit {
            position: relative;
            float: right;
            padding: 0px 10px;
            font-size: 20px;
            font-weight: 700;
            color: white;
        }

            .search-container #search-cancel:hover, .search-container #search-submit:hover {
                cursor: pointer;
            }

    .search-textfield {
        width: 150px;
    }

    #search-form-enable {
        font-size:larger;
    }

    .branding {
        position: initial;
        display: table;
        width: 100%;
        table-layout: fixed;
        margin-top: 55px;
        margin-bottom: 10px;
    }

        .branding div {
            display: table-cell;
        }


    .branding-left {
        width: 100px;
        text-align: center;
        padding-left: 15px;
    }

        .branding-left img {
            position: initial;
            display: initial;
            top: 0px;
        }

    .branding-center {
        width: 100%;
        text-align: center;
        padding-right: 100px;
    }

        .branding-center > p {
            display: inline-block;
            color: white;
            text-shadow: 2px 2px #000000;
            vertical-align: middle;
            text-align: left;
        }

            .branding-center > p > .org-top-row {
                font-size: large;
                font-weight: 600;
            }

            .branding-center > p > .org-bottom-row {
                font-size: x-large;
                font-weight: 700;
            }

    nav {
        text-align: center;
    }

    #main-nav {
        display: block;
        background-color: white;
        border-bottom: 2px solid #ffc926;
    }

        #main-nav > #main-menu {
            max-width: 1160px;
            margin: 0px auto;
        }

    .round-pix-container {
        display: block;
        position: absolute;
        top: 240px;
        min-height: 50px;
        width: 100%;
        text-align: center;
    }


        .round-pix-container img {
            padding: 25px 30px;
            height: 220px;
        }



    .head-slogan {
        display: table;
        min-height: 170px;
        background-color: #EDEDED;
        width: 100%;
    }

        .head-slogan .slogan-left {
            display: table-cell;
            width: 60%;
            text-align: left;
            font-size: xx-large;
            font-weight: lighter;
            padding-left: 40px;
        }

        .head-slogan .slogan-right {
            display: table-cell;
            width: 50%;
            font-size: x-large;
            text-align: left;
            padding-left: 120px;
            padding-right: 30px;
        }

        .head-slogan hr {
            display: none;
        }

    .home-nav-controls {
        display: table;
        width: 100%;
        min-height: 200px;
        padding: 0px 45px;
    }

    .dropdown-container {
        display: table-cell;
        width: 100%;
    }

    #breadcrumbs {
        display: block;
        background-color: #EDEDED;
        width: 100%;
        min-height: 60px;
        text-align: left;
        padding-top: 30px;
    }

    #breadcrumbs a {
        padding: 3px 10px 3px 23px;
		text-decoration:none;
        color: black;
		}	
		
		#breadcrumbs a:hover {
		text-decoration:underline;
		}

    .btn {
        display: inline-block;
        padding: 12px 12px;
        width: 200px;
        margin-bottom: 0;
        font-size: 24px;
        font-weight: 400;
        line-height: 1.42857143;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        -ms-touch-action: manipulation;
        touch-action: manipulation;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-image: none;
        border: 1px solid transparent;
        border-radius: 0px;
    }

    .btn-default {
        color: #ffffff;
        background-color: #4A7D7D;
        border-color: #ccc;
    }

        .btn-default.focus,
        .btn-default:focus {
            color: #ffffff;
            background-color: #4A7D7D;
            border-color: #ccc;
        }

        .btn-default:hover {
            color: #ffffff;
            background-color: #666;
            border-color: #adadad;
        }

        .btn-default.active,
        .btn-default:active,
        .open > .dropdown-toggle.btn-default {
            color: #ffffff;
            background-color: #4A7D7D;
            border-color: #adadad;
        }

            .btn-default.active.focus,
            .btn-default.active:focus,
            .btn-default.active:hover,
            .btn-default:active.focus,
            .btn-default:active:focus,
            .btn-default:active:hover,
            .open > .dropdown-toggle.btn-default.focus,
            .open > .dropdown-toggle.btn-default:focus,
            .open > .dropdown-toggle.btn-default:hover {
                color: #ffffff;
                background-color: #4A7D7D;
                border-color: #8c8c8c;
            }

        .btn-default.active,
        .btn-default:active,
        .open > .dropdown-toggle.btn-default {
            background-image: none;
        }

        .btn-default .badge {
            color: #fff;
            background-color: #333;
        }

        .hcd-modal-button {
        background-color: white;
        border-color: #888888;
        color: black;
        width: 350px;
        height: 100px;
        margin: 25px;
        vertical-align: middle;
        text-align: center;
        padding-top: 30px;
    }

    .hcd-modal-button:hover {
        background-color: #888888;
        font-weight: bold;
        color: white;
    }

    .level-one-sidenav {
        min-width: 200px;
        background-color: #356363;
        color: white;
    }

        .level-one-sidenav a {
            color: white;
            text-decoration: none;
        }

    .section-index {
        background-color: #EDEDED;
    }

        .section-index td {
            vertical-align: top;
            padding: 0px 10px;
        }

        .section-index li {
            display: block;
            padding-bottom: 5px;
        }

            .section-index li:before {
                /*Using a Bootstrap glyphicon as the bullet point*/         
                font-family: 'Glyphicons Halflings';
                content: "\e074";
                font-size: 9px;
                float: left;
                margin-top: 4px;
                margin-left: -17px;
                color: #365363;
            }
			
			
			
.program-outer {
	background: #f7f7f7;
}
    .layout-table {
        display: table;
    }

    .layout-cell {
        display: table-cell;
        vertical-align: top;
    }

    .cell-100 {
        width: 100%;
    }
	.cell-80 {
        width: 80%;
    }

    .cell-50 {
        width: 50%;
    }
	.cell-30 {
        width: 30%;
    }

    .cell-fixed-400 {
        width: 400px;
    }

    .cell-fixed-300 {
        width: 300px;
    }

    .cell-fixed-200 {
        width: 200px;
    }

     .pad-50 {
        padding: 50px;
    }

    .pad-horiz-50 {
        padding: 0px 50px;
    }

    .pad-vert-50 {
        padding: 50px 0px;
    }

    .pad-25 {
        padding: 25px;
    }

    .pad-horiz-25 {
        padding: 0px 25px;
    }
	.pad-horiz-10 {
        padding: 0px 10px;
    }

    .pad-vert-25 {
        padding: 25px 0px;
    }

    .centered {
        text-align: center;
		padding-left: 20px;
		padding-right: 20px
    }

    .italics {
        font-style: italic;
    }

    .serif {
        font-family: serif;
    }

    .global-footer {
        width: 100%;
        color: white;
        background-color: #555555;
        padding: 10px;
    }

        .global-footer a {
            color: white;
            text-decoration: none;
        }

        .footer-em,
        .footer-nav > p,
        .global-footer h4 {
            font-weight: bold;
            color: white;
		}
/* Removed by RW 3/23/2020. Look is inconsistent when hoveing over links in footer. Visted links and hover are the same color		
#footer-nav a:visited,
*/ 
#footer-nav a:hover {color:#CCC}
#footer-nav a:active {color:#CCC;}
/* Change made so that social media icons size properly 7-7-2017 */
.gi-3x{font-size: 3em;}
/* end */
        }

    .footer-nav {
        min-width: 120px;
        padding: 7px 10px;
    }

        .footer-nav a {
            font-size: large;
        }

    .footer-contact {
        width: 30%;
        padding: 0px 10px;
    }

        .footer-contact > p {
            color: lightgray;
        }

    .footer-social-media {
        width: 25%;
        padding: 0px 10px;
    }
    
     /* Added by RW 11/21/2019 */
        .footer-campaign-media {
        width: 20%;
        padding: 0px 10px;
    }
    
    /* End added by RW */

    .footer-leadership {
        width: 25%;
        min-width: 200px;
        padding: 0px 10px;
        overflow: hidden;
    }

        .footer-leadership img {
            margin-right: 15px;
            float: left;
        }
    /* Copyright */
    div.footer-copyright {
        padding: 20px 0 10px;
        text-align: center;
    }

        div.footer-copyright nav {
            /*float: right;*/
        }

            div.footer-copyright nav ul {
                list-style: none;
                margin: 0;
                padding: 0;
            }

                div.footer-copyright nav ul li {
                    border-left: 1px solid #ffffff;
                    display: inline-block;
                    line-height: 12px;
                    margin: 0;
                    padding: 0 8px;
                }

                    div.footer-copyright nav ul li:first-child {
                        border: medium none;
                        padding-left: 0;
                    }

        div.footer-copyright p {
            color: #ccc;
            margin: 0;
            padding: 0;
        }

    .custom-bullet li {
        display: block;
    }

        .custom-bullet li:before {
            /*Using a Bootstrap glyphicon as the bullet point*/
            content: "\e074";
            font-family: 'Glyphicons Halflings';
            font-size: 9px;
            float: left;
            margin-top: 4px;
            margin-left: -17px;
            color: #CCCCCC;
        }		
.wide { 
    text-align:left;
    font-weight:bold;
    background:#ebebeb;
    margin-left:-100%;
    margin-right:-100%;
    height: 300px;
    }
	
#container3 {
	clear:left;
	float:left;
	width:100%;
	overflow:hidden;
	background:#f7f7f7; /* column 3 background colour */
	color:black;

}
#container2 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:33.333%;
	background:#f7f7f7; /* column 2 background colour */
}
#container1 {
	float:left;
	width:100%;
	position:relative;
	right:33.33%;
	background:#f7f7f7; /* column 1 background colour */
}
#col1 {
	float:left;
	width:29.33%;
	position:relative;
	left:68.67%;
	overflow:hidden;
    min-width:300px;
}
#col2 {
	float:left;
	width:29.33%;
	position:relative;
	left:72.67%;
	overflow:hidden;
	min-width:300px;

}
#col3 {
	float:left;
	width:29.33%;
	position:relative;
	left:76.67%;
	overflow:hidden;
	min-width:300px;

}
.program-contact {
	color:white;
}	
#program-contact a:link {color: white;}
#program-contact a:visited, 
#program-contact a:hover,
#program-contact a:active {color:#E6E6E6;}	

.program-details {
	margin-bottom: 20px;
	overflow: hidden;
	position: relative;
	background-color: #356363;

}

.program-contact {
	background-color: #356363;
	height:auto;
	width: 340px;
	padding-left:30px;
	float: left;
	overflow: hidden;
}

.program-container2 {
	overflow: hidden;
	padding-left:40px;
	padding-top:10px;
	height:auto;
	background:#f7f7f7;
}
@media screen and (max-width: 479px) {
   .walk-listing .photo { 
    float: none;
    margin-right:0;
    width:auto;
  }

}

/* Added by O. Nistor 5/22/2017 */
.button-quick-access {
    background-color: #4A7D7D;
    border-color: #8c8c8c;
    color: white;
    border: 1px inset;
    border-radius: 0px;
    height: 100px;
    width: 250px;
    padding-top: 35px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 5px 5px;
    cursor: pointer;
}


/* end O. Nistor */


/* Added by O. Nistor 8/13/2018 */
#BtTBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #1a468c;
  color: white;
  cursor: pointer;
  padding: 8px;
  border-radius: 4px;
}

#BtTBtn:hover {
  background-color: #3396c0;
}
/* end O. Nistor */

/* added by RW 8-6-2019. Get highlight color to stand out more when using tab key */

a:focus {
	border: 2px dotted #E31C29 !important;
  outline: 0;
}

/* end RW 8-6-2019 */

/* Added by RW 12-27-2019 */

.alert-codes-info {
	color: #30596ef;
	background-color: #FFBC5E;
	border-color: #bce8f1;
}

/* end RW 8-6-2019 */

/* Added by ON 09/02/2020 */

    .button-quick-access-2 {
    background-color: #4A7D7D;
    border-color: #8c8c8c;
    color: white;
    border: 1px inset;
    border-radius: 0px;
    height: 100px;
    width: 250px;
    padding-top: 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 5px 5px;
    cursor: pointer;
}
        .button-quick-access:hover {
    color: #ffffff;
    background-color: #666;
    border-color: #adadad;
}
    .button-quick-access-2:hover {
    color: #ffffff;
    background-color: #666;
    border-color: #adadad;
}

.newspaper2 {
    column-count: 2;
}
/* End ON 09/02/2020 */