/** Colors

Navy ==> #1B365D (new on 7/23/21)
Green => #007041
Crimson ==> #862633
Blue => #69B3E7
**old** Navy ==> #1C3462

**/

/* Body */
body {
    font-family: "Nunito Sans",'Open Sans',Helvetica,Arial,sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    font-family: inherit;
}

/* Header */
.nav-secondary {
    background-color: #f2f2f2;
    border: none;
    text-align: right;
}
.nav-secondary a {
    color: #1B365D;
    font-size: 16px;
    font-weight: 600;
    padding: 7px 0;
}
.nav-secondary a:hover {
    color: #142545;
}
.site-header {
    background-color: white;
}
.site-header .wrap {
    height: 14rem;
    padding: 34px 0;
}

.header-image .title-area {
    background: none;
    /* background: url(../images/district-logo-2021.png) 0 30%/175px no-repeat; */
}
.site-header .site-title>a {
    padding-top: 20px;
    background: none;
    color: #1B365D;
    /* background: url(../images/district-logo-2021.png) 0 30%/175px no-repeat; */
}
.site-header .site-title a {
    font-family: 'Nunito Sans', Arial, Helvetica, sans-serif;
    min-height: 135px;
    text-indent: 0;
    /* text-transform: uppercase; */
}
.site-header .site-title a:hover {
    color: #1B365D;
}
.site-header .site-description {
    font-size: 100%;
    font-weight: 500;
    line-height: 1.5;
    font-family: 'Nunito Sans';
    position: relative;
    /* top: -5rem; */
    /* right: 5rem; */
    /* float: right; */
    /* color: #fdfdfd; */
    top: inherit;
    right: inherit;
    float: left;
    color: #1B365D;
}
.site-header .widget-area {
    margin-top: 4rem;
    width: 40rem;
    margin-right: 3rem;
}
.site-header .search-form {
    float: inherit;
    width: inherit;
    height: inherit;
    margin-top: 0;
}
.site-header .search-form input[type=search] {
    font-size: inherit;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: transparent;
}
.site-header .search-form input[type=submit] {
    color: #666;
}
.custom-logo {
    max-width: 200px;
}
.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
    /* padding: 10px; */
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    min-width: 28rem;
}
.wp-block-search .wp-block-search__button {
    border: none;
    background: transparent;
}
input#wp-block-search__input-1 {
    /* border: 2px solid pink; */
    /* border-radius: 6px; */
    padding: 10px;
    /* border: 1px solid #e3e3e3; */
}
.nav-primary {
    border-top: 2px solid #254683;
    border-bottom: 2px solid #142946;
    background-color: #1B365D;
}
.nav-primary a {
    color: #ffffff;
}

.nav-primary .genesis-nav-menu {
    text-align: center;
}
.genesis-nav-menu .sub-menu a {
    font-size: 15px;
    font-weight: 600;
    color: #1B365D;
}

/* Mobile Header */

@media only screen and (max-width: 1023px) {
    .site-header .wrap {
        width: 100%;
        /* height: 300px; */
        margin: 0 auto;
    }
    .site-header .site-title {
        background-position: center top;
        margin-top: 10rem;
        min-height: unset;
    }
    .site-header .site-title>a {
        font-size: 30px;
        float: none;
        padding-top: 13rem;;
        text-align: center;
        text-indent: 0;
        background-position: 50% 50%;
        background-position-x: 50%;
        background-size: 200px;
    }
    .site-header .site-description {
        position: relative;
        top: 0;
        right: 0;
        float: none;
        margin: 0;
        text-align: center;
    }
    .site-header .widget-area {
        font-size: 18px;
        float: left;
        width: 100%;
        margin-top: 3.5rem;
        margin-right: 0;
    }
    .site-header .search-form {
        height: 5rem;
        margin: 0;
    }
    .js .genesis-nav-menu .sub-menu {
        position: static;
        display: none;
        clear: both;
        width: 100%;
        margin: 1rem 0;
        opacity: 1;
        background: #25447d;
        padding: 3px 0;
    }
    .js .genesis-nav-menu .sub-menu a {
        color: white;
    }
    .site-header .title-area {
        width: 100%;
        background-position: center top;
        text-align: center;
        margin: 1rem 0;
    }
    .custom-logo {
        max-width: 16rem;
    }

    .nav-secondary {
        color: #1B365D !important;
        font-weight: 700;
        text-align: center;
    }
    .nav-secondary .menu-toggle, .nav-secondary .sub-menu-toggle {
        color: #1B365D;
    }
    .nav-secondary button.sub-menu-toggle:hover {
        background-color: #f2f2f2;
        border-radius: 6px;
    }
    .nav-secondary .sub-menu-toggle:focus {
        background: none;
    }

    .nav-primary {
        color: #FFFFFF !important;
        font-weight: 700;
        background:#25447d;
    }
    .nav-primary .menu-toggle, .nav-primary .sub-menu-toggle {
        color: white;
    }
    .nav-primary button.sub-menu-toggle:hover {
        background-color: #1B365D;
        border-radius: 6px;
    }
    .nav-primary .sub-menu-toggle:focus {
        background: none;
    }
    button#mobile-nav-secondary {
        background-color: #f2f2f2;
    }
    button#mobile-genesis-nav-primary {
        background-color:#1B365D;
    }
}

@media screen and (max-width: 570px) {
    .site-header .wrap .title-area {
        height: 16rem;
    }
    .site-header .wrap .title-area .site-title {
        margin: 0;
    }
    .site-header .wrap .title-area .site-title>a {
        font-size: 24px;
        padding-top: 13rem;
    }
    .site-header .wrap .title-area .site-description {
        font-size: 12px;
        right: 0;
        margin: 0px;
        text-align: center;
    }
    .site-header .custom-logo {
        max-width: 300px;
    }
    .site-header .widget-area {
        margin-top: 0;
        width: 100%;
    }
    .site-header .wrap .widget-area {
        padding: 0;
        margin: 0;
    }
    .site-header .search-form {
        width: 90%;
        margin: 0 auto;
        margin-top: 0;
    }
    .site-container .menu-toggle .nav-secondary {
        color: #1B365D;
        background: #f2f2f2;
    }
    .site-container .menu-toggle .nav-secondary a {
        color: #1B365D;
    }
    .menu-toggle, .sub-menu-toggle {
        color: #1B365D;
    }
    .site-container .menu-toggle .nav-primary {
        color: #f2f2f2;
        background: #1B365D;
    }
    .genesis-nav-menu .sub-menu a {
        background: #f2f2f2;
    }
    button#mobile-genesis-nav-primary {
        color: #ffffff;
        background-color:#1B365D;
    }
    #genesis-nav-primary {
        background-color: #25447d;
    }
    .nav-secondary {
        padding: 1rem 0 1rem 0;
    }
    .js .genesis-nav-menu .menu-secondary .menu-item a {
        color: #1B365D !important;
    }
    
    .js .genesis-nav-menu .menu-secondary .sub-menu .menu-item {
        padding: 1rem 0;
    }
    .js .genesis-nav-menu .menu-secondary .sub-menu .menu-item a {
        color: #FFFFFF !important;
        font-size: 18px;
    }
    .genesis-nav-menu .menu-primary .sub-menu {
        background: #254683;
        padding: 1rem;
    }
    .sub-menu > .menu-item a {
        color: white;
    }
}

/* Main */
a {
    color: #1B365D;
}
.entry-title a, .sidebar .widget-title a {
    color: #1B365D;
}
.widget-title {
    font-family: inherit;
}

/* Custom Content */
.content-divider {
    background: #1B365D;
}

/* Copied from "Additional CSS" on live fhps.net */
.page-id-54230 li.document {
	list-style-type: none;
}
.page-id-54230 ul.documents {
	margin: 0;
}

.su-row .su-colum .video {
	margin: 1rem 0 0 0 !important;
}

.page-id-54646 .su-column.su-column-size-1-3 {
    margin-right: 28px;
}

#menu-coronavirus-dashboards {
	text-align: center;
}

#menu-coronavirus-dashboards li.menu-item {
    display: inline-block;
    width: 24%;
	  margin-top: 20px;
		margin-left: 3px;
		margin-right: 3px;
    list-style-type: none;
    text-align: center;
    border-radius: 4px;
    background: #fff;
}

#menu-coronavirus-dashboards > li {
	padding: 20px;
	border: 1px solid #dcdcdc;
}

#menu-coronavirus-dashboards > li a {
	font-size: 14px;
	font-weight: bold;
}

#menu-coronavirus-dashboards li.menu-item a i {
    font-size: 40px;
    display: block;
    margin: 0;
}

@media only screen and (max-width: 1200px) {
	#menu-coronavirus-dashboards > li {
	padding: 24px;
	}
}

@media only screen and (max-width: 1023px) {
	#menu-coronavirus-dashboards li.menu-item {
		display:block;
		width: 100%;
		margin: 0;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#menu-coronavirus-dashboards li.menu-item a i {
		font-size: 40px;
	}
	#menu-coronavirus-dashboards > li {
		padding: 1rem;
	}
    .menu-item i._mi {
        /* font-size: 1rem;
        width: inherit;
        text-align: center; */
        display: none;
    }
}

article.post-55253 .su-post-meta {
	display: none;
}

article.post-55253 .su-post {
	border: 1px solid lightgray;
	border-radius: 6px;
	background: #f2f2f2;
	padding: 15px 30px;	
	margin-top: 1.5rem
}

.breadcrumb {
	font-size: 14px;
}

span.simcal-event-title {
	font-size: 1rem;
}

.simcal-default-calendar-list .simcal-event-details {
	margin-top: 1.25rem;
}

article.type-live .entry-time { display: none;
}

@media only screen and (max-width: 783px) {
  .menu-item i._mi {
    /* font-size: 1rem;
    width: inherit;
    text-align: center; */
    display: none;
} } 

button.button.btn.wdt-clear-filters-button {
    color: #ffffff;
    border-radius: 4px;
    background-color: #1B365D;
}

#su-post-61633 {
	margin-bottom: 0 !important;
}

/* WP Datatables */
.wpdt-c a {
    color: #1B365D;
}

/* Color Switcher - Central Green #007041 */
/* .central .title-area>a {
    background: url(../images/district-logo-white-green.png) 0 50%/200px no-repeat !important;
} */
.central .site-header {
    background-color: white;
}
.central .building-homepage-heading, 
.central .content-divider {
    background: #007041;
}
.central .site-inner a {
    color: #007041;
}
.central .nav-secondary {
    border-bottom: none;
    background-color: #f2f2f2;
}
.central .nav-primary {
    border-top: none;
    background-color: #1B365D;
}

/** Color Switcher - Northern Blue #69B3E7
 ** This blue is too light against a white background. Only a 2.03:1 contrast ratio..
 ** Try this instead for a 4.66:1 ratio, slightly darker blue ==> #1E6DAE
 **/
.northern .site-header {
    background-color: white;
}
.northern .nav-primary {
    border-top: none;
    background-color: #1B365D;
}
.northern .nav-secondary {
    border-bottom: none;
    background-color: #f2f2f2;
}
.northern .building-homepage-heading, .northern .content-divider {
    background: #69B3E7;
    color: #404040;
}
.northern .site-inner a {
    color: #1E6DAE;
}
.northern .sidebar .widget a {
    color: #1E6DAE;
}

/* Color Switcher - Eastern Crimson #862633 */
.eastern .site-header {
    background-color: white;
}
.eastern .building-homepage-heading, .eastern .content-divider {
    background: #862633;
}
.eastern .site-inner a {
    color: #862633;
}
.eastern .nav-primary {
    border-top: none;
    background-color: #1B365D;
}
.eastern .nav-secondary {
    border-bottom: none;
    background-color: #f2f2f2;
}

/* FHPS Logo Switcher */

body.northern .title-area .custom-logo-link img, body.central .title-area .custom-logo-link img, body.eastern .title-area .custom-logo-link img {
    display: none;
}

body.northern .site-header .title-area {
    height: 10rem;
    width: 14rem;
    background: url(../png/district-logo-lightblue.png) left/200px no-repeat;
}
body.eastern .site-header .title-area {
    height: 10rem;
    width: 14rem;
    background: url(../png/district-logo-crimson.png) left/200px no-repeat;
}
body.central .site-header .title-area {
    height: 10rem;
    width: 14rem;
    background: url(../png/district-logo-green.png) left/200px no-repeat;
}

@media screen and (max-width: 1023px) {
    body.northern .site-header .title-area {
        height: 14rem;
        width: 100%;
        background: url(../png/district-logo-lightblue.png) center/256px no-repeat;
    }
    body.eastern .site-header .title-area {
        height: 14rem;
        width: 100%;
        background: url(../png/district-logo-crimson.png) center/256px no-repeat;
    }
    body.central .site-header .title-area {
        height: 14rem;
        width: 100%;
        background: url(../png/district-logo-green.png) center/256px no-repeat;
    }
    body.northern .site-header .header-widget-area, body.eastern .site-header .header-widget-area, body.central .site-header .header-widget-area {
        margin-top: 0;
    }
}
@media screen and (max-width: 570px) {
    body.northern .site-header .title-area {
        height: 16rem;
        width: 100%;
        background: url(../png/district-logo-lightblue.png) center/250px no-repeat;
    }
    body.eastern .site-header .title-area {
        height: 16rem;
        width: 100%;
        background: url(../png/district-logo-crimson.png) center/250px no-repeat;
    }
    body.central .site-header .title-area {
        height: 16rem;
        width: 100%;
        background: url(../png/district-logo-green.png) center/250px no-repeat;
    }
}

/** Bus Service Updates widget area (non-mobile, desktop, full width) **/
.su-posts-bus-service-updates-loop {
    border-radius: 6px;
    border: 1px solid #d6d6d6;
    background-color: white;
    margin: 20px 0;
}

.su-posts-bus-service-updates-loop>h1 {
    font-weight: bold;
    text-align: center;
    font-size: 1.5rem;
    background: #333333;
    color: white;
    padding: 1rem;
    margin-top: 0;
}

.su-posts-bus-service-updates-loop .entry-content {
    /* width: 50%; */
    /* margin: 0 auto; */
    padding: 1rem 2rem;
    font-size: 18px;
}

.su-posts-bus-service-updates-loop .entry-content ul>li {
    list-style-type: none;
}
.su-posts-bus-service-updates-loop .entry-content ol, 
.su-posts-bus-service-updates-loop.entry-content ul {
    margin: 0;
    font-size: 18px;
}

@media screen and (max-width: 1023px) {
    .su-posts-bus-service-updates-loop .entry-content {
        width: 100%;
        margin: 0 auto;
        padding: 1rem 2rem;
    }
    .su-posts-bus-service-updates-loop .entry-content ol, 
    .su-posts-bus-service-updates-loop.entry-content ul {
        margin-left: 0px;
        font-size: 20px;
    }
    .su-posts-bus-service-updates-loop .entry-content ul > li {
        margin-bottom: 10px;
    }

}