@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800');

/*************************
FONTS
font-family: 'Open Sans', sans-serif;


Colors
Blue: #005eb8
Green: #53771b
*************************/

/** Basic Settings **/

body{
 line-height: normal;
 font-size: 16px !important;
 color: #231F20 !important;
 font-weight: 400;
 font-family: 'Open Sans', sans-serif !important;}

.container{
 max-width: 1200px;
 margin: 0 auto;}

.inside-padding20{
 padding: 20px;}

a{
 color: #005eb8;
 text-decoration: none;}

a:hover,
a:focus{
 color: #005eb8;
 text-decoration: underline;}

.bold{
 font-weight: 700;}

/** PubWrapper **/
.optionRows > ul > li{
 margin: 8px 2px 0px 2px;}

.CMS_adminBar,
.CMS_DragDropWrapper{
 font-size: 13px;}

/** Header **/
#header > .inside-padding{
 padding: 10px 10px 20px 10px;}

#header #searchBox{
 text-align: right;
 position: relative;}

#header #searchBox input#ctl00_SearchTerm{
 width: 220px;
 height: 30px;
 font-size: 14px;
 padding: 0 7px;
 color: #4c4c4c;
 border: solid 2px #898989;}

#header #searchBox a#ctl00_btnSearch{
 position: absolute;
 top: 12px;
 right: 12px;
 color: #767676;}

#header #searchBox a#ctl00_btnSearch:hover,
#header #searchBox a#ctl00_btnSearch:focus{
 color: #005eb8;}

#header #searchBox a#ctl00_btnSearch img{
 display: none;}

#header .header-left{
 width: 45%;
 float: left;}

#header .header-right{
 width: 55%;
 float: left;}

#header a{
 text-decoration: none;}

#header .header-left a{
 display: block;
 margin-top: 30px;}

#header .logo{
 display: inline-block;}

#header .school-name{
 display: inline-block;
 margin: 15px 0 0 10px;}

#header .school-name h1{
 font-size: 33px;
 line-height: 33px;
 margin: 0;
 font-weight: 700;}

#header .school-name h1 span{
 display: block;}

/** Sticky Header **/
#sticky-header{
 z-index: 9999;
 background: #fff;
 position: fixed;
 /* top: 38px; */
 left: 0;
 width: 100%;
 box-shadow: 0 3px 10px -3px #999;
 -webkit-box-shadow: 0 3px 10px -3px #999;
 -moz-box-shadow: 0 3px 10px -3px #999;
 display: none;
 animation: fadeIn 0.2s;
 -webkit-animation: fadeIn 0.2s;
 -moz-animation: fadeIn 0.2s;}

#sticky-header .header-left{
 width: 35%;
 float: left;}

#sticky-header .header-right{
 width: 65%;
 float: left;}

#header a{
 text-decoration: none;}

#header .header-left a{
 display: block;
 margin-top: 30px;}

#sticky-header .logo{
 display: inline-block;}
	
#sticky-header .logo img{
 max-height: 70px;}

#sticky-header .school-name{
 display: inline-block;
 margin: 15px 0 0 10px;}

#sticky-header .school-name h1{
 font-size: 20px;
 line-height: 20px;
 font-weight: 700;
 margin: 0;}

#sticky-header a h1 span{
 display: block;}

/** Main quick links**/
ul#quicklinks{
 float: right;
 margin: 10px 0 0 0;
 padding: 0;
 list-style: none;
 width: 100%;}

ul#quicklinks li{
 display: inline-block;
 width: 16.6666%;}

ul#quicklinks li a{
 display: block;
 text-align: center;}

ul#quicklinks li a .icon{
 display: block;
 width: 70px;
 height: 70px;
 margin: 0 auto;
 border-radius: 50%;
 -moz-border-radius: 50%;
 -webkit-border-radius: 50%;
 background-color: #fff;}

ul#quicklinks li a .icon.blue{
 border: 3px solid #00a3e0;}

ul#quicklinks li a .icon.green{
 border: 3px solid #7abf23;}

ul#quicklinks li a .icon.orange{
 border: 3px solid #ffb500;}

ul#quicklinks li a .icon em{
 font-size: 33px;
 line-height: 70px;
 color: #666666;}

ul#quicklinks li a .text{
 display: block;
 text-transform: uppercase;
 color: #24344e;
 font-size: 12px;
 font-weight: 600;
 margin-top: 7px;}

/** Sticky quick links**/
ul#sticky-quicklinks{
 float: right;
 margin: 15px 0 0 0;
 padding: 0;
 list-style: none;
 width: initial;}

ul#sticky-quicklinks li{
 float: left;
 width: initial;
 margin-right: 10px;}

ul#sticky-quicklinks li a{
 display: block;
 text-align: center;}

ul#sticky-quicklinks li a .icon{
 margin: 0 auto;
 border-radius: 50%;
 -moz-border-radius: 50%;
 -webkit-border-radius: 50%;
 background-color: #fff;
 width: 45px;
 height: 45px;
 display: inline-block;}

ul#sticky-quicklinks li a .icon.blue{
 border: 3px solid #00a3e0;}

ul#sticky-quicklinks li a .icon.green{
 border: 3px solid #7abf23;}

ul#sticky-quicklinks li a .icon.orange{
 border: 3px solid #ffb500;}

ul#sticky-quicklinks li a .icon em{
 font-size: 20px;
 line-height: 45px;
 color: #666666;}

ul#sticky-quicklinks li a .text{
 text-transform: uppercase;
 color: #24344e;
 font-size: 12px;
 font-weight: 600;	
 display: none;
 margin-left: 5px;}

ul#sticky-quicklinks li a:hover .text,
ul#sticky-quicklinks li a:focus .text{
 display: inline-block;}

.fixed-new{
 position: fixed;
 top: 50px;
 left: 0;
 z-index: 2;
 width: 100%;
 z-index: 9999;
 animation: fadeIn 0.2s;
 -webkit-animation: fadeIn 0.2s;
 -moz-animation: fadeIn 0.2s;}

.fixed-old{
 position: fixed;
 top: 35px;
 z-index: 2;
 width: 100%;
 z-index: 9999;
 animation: fadeIn 0.2s;
 -webkit-animation: fadeIn 0.2s;
 -moz-animation: fadeIn 0.2s;}

.is-fixed {
 position: fixed;
 top: 0;
 left: 0;
 z-index: 2;
 width: 100%;
 z-index: 9999;
 animation: fadeIn 0.2s;
 -webkit-animation: fadeIn 0.2s;
 -moz-animation: fadeIn 0.2s;}


/** Mobile quick links **/
#mobile-quick-links{
 background: rgba(0, 0, 0, 0.9);
 color: #fff;
 padding: 10px;
 font-weight: 600;
 text-transform: uppercase;
 text-align: center;
 position: fixed;
 bottom: 0;
 left: 0;
 width: 100%;
 z-index: 999;
 box-sizing: border-box;
 display: none;}

#mobile-quick-links ul{
 padding: 10px 13px;
 list-style: none;}

#mobile-quick-links ul li{
 display: inline-block;
 width: 50%;
 margin: 12px 0;}

#mobile-quick-links ul li a{
 display: block;
 text-align: left;
 text-decoration: none;}

#mobile-quick-links ul li a .icon{
 display: inline-block;
 width: 30px;
 height: 30px;
 margin: 0 auto;
 border-radius: 50%;
 -moz-border-radius: 50%;
 -webkit-border-radius: 50%;
 background-color: #fff;
 text-align: center;}

#mobile-quick-links ul li a em{
 line-height: 30px;
 color: #666666;}

#mobile-quick-links ul li a .icon.blue{
 border: 2px solid #00a3e0;}

#mobile-quick-links ul li a .icon.green{
 border: 2px solid #7abf23;}

#mobile-quick-links ul li a .icon.orange{
 border: 2px solid #ffb500;}

#mobile-quick-links ul li a .text{
 margin-left: 10px;
 color: #fff;}

#mobile-quick-links ul li a:hover .text,
#mobile-quick-links ul li a:focus .text{
 text-decoration: underline;}

#mobile-quick-links .qbText{
 margin-left: 5px;
 font-size: 18px;}


/** Menubar **/
#menubar{
 background: #005eb8;}

#menubar .inside-padding{
 padding: 0 10px;}

/** Mobile Bar **/
#mobile-bar{
 color: #fff;
 padding: 10px 0;}

/** Banner **/
#banner .nivo-directionNav{
 display: none;}

.nivo-controlNav{
 z-index: 998 !important;}

/** News & Social Network Basic Setting **/
.content-container{
 padding: 30px 0;}

#news .section-title,
#social-network .section-title{
 background-color: #1175b3;
 position: relative;}

#news .section-title:after,
#social-network .section-title:after{
 display: block;
 content: "";
 width: 0; 
 height: 0; 
 border-left: 18px solid transparent;
 border-right: 18px solid transparent;
 border-top: 18px solid #1175b3;
 position: absolute;
 bottom: -17px;
 left: 50%;
 margin-left: -18px;
 margin-top: -18px;}

#news .section-title h2,
#social-network .section-title h2{
 font-size: 26px;
 font-weight: 700;
 color: #fff;
 text-align: center;
 margin: 0;
 padding: 5px 0;}


/** News **/
#news .content-container{
 background-color: #3f414c;}

#news .view-more{
 text-align: center;}

#news .view-more a{
 background: #53771b;
 color: #fff;
 border: solid 2px #53771b;
 padding: 8px 20px;
 display: inline-block;
 text-decoration: none;
 margin-top: 20px;
 font-weight: 600;
 transition: all 0.2s ease-in;
 -webkit-transition: all 0.2s ease-in;
 -moz-transition: all 0.2s ease-in;}

#news .view-more a:hover,
#news .view-more a:focus{
 background: #fff;
 border: solid 2px #53771b;
 color: #53771b;}

/** Social Network **/
#social-network .content-container{
 background-color: #f7f7f7;}

#social-network .box-left{
 width: 49%;
 float: left;}

#social-network .box-right{
 width: 49%;
 float: right;}

#social-network .box-left .sub-heading{
 background: #4867aa;}

#social-network .box-right .sub-heading{
 background: #1175b3;}

#social-network .box-left h3,
#social-network .box-right h3{
 color: #fff;
 font-size: 22px;
 font-weight: 600;
 text-align: center;
 margin: 16px 0;}

#social-network .box-left .sub-box-container,
#social-network .box-right .sub-box-container{
 background: #fff;}

.facebook_center{
 text-align: center;}

/** Subpage **/
.subpage .header-image{
 width: 100%;
 height: 250px;
 background-size: cover;
 background-position: center center;}

.subpage .ptl_col_1{
 padding: 0;}

#page {
  overflow-y: hidden;}

.subpage #sub-content-left{
 width: 25%;
 float: left;
 background: #f7f7f7;
 position: relative;}

#sub-content-left:before {
 content: "";
 display: block;
 position: absolute;
 top: 0;
 right: 100%;
 background: rgb(247, 247, 247);
 width: 300%;
 height: 10000%;}

#sub-content-left:after {
 content: "";
 display: block;
 position: absolute;
 background: rgb(247, 247, 247);
 width: 100%;
 height: 10000%;}

.subpage #sub-content-right{
 width: 75%;
 float: left;}


.subpage #sub-content-left a{
 color: #1d1d1d;
 text-decoration: none;
 display: block;}

.subpage #sub-content-left a:hover,
.subpage #sub-content-left a:focus{
 text-decoration: underline;}

.subpage #breadcrumbs a{
 text-decoration: none;
 color: #1d1d1d;}

.subpage .sec-header{
 border-bottom: solid 3px #ffb500;
 margin-bottom: 20px;}

.subpage .sec-header h2{
 font-size: 25px;
 margin-bottom: 7px;}

#breadcrumbs a:hover,
#breadcrumbs a:focus{
 text-decoration: underline;}

#sub-content{
 width: 100%;}

/** Subpage News **/
.subpage #news-summary .content .read-more {
 background: #53771b;
 border: solid 2px  #53771b;
 color: #fff;
 font-size: 14px;
 padding: 3px 5px;
 text-decoration: none;
 transition: all 0.2s ease-in;
 -webkit-transition: all 0.2s ease-in;
 -moz-transition: all 0.2s ease-in;}

.subpage #news-summary .content a.read-more:hover,
.subpage #news-summary .content a.read-more:focus {
 background: #fff;
 border: solid 2px  #53771b;
 color: #53771b;
 text-decoration: none;}

/** Footer **/
#footer{
 background: #005eb8;
 color: #fff;}

#footer .inside-padding{
 padding: 30px 10px}

#footer ul{
 margin: 0;
 padding: 0;
 list-style: none;}

#footer .footer-left {
 width: 35%;
 float: left;
}

#footer .footer-center{
 width: 20%;
 float: left;
}

#footer .footer-center a{
color:#fff;
}

#footer .footer-center a.disc {
 padding-bottom:10px;
}   

#footer .footer-right{
 width: 45%;
 float: left;}

#footer .footer-center a img {
 width: 70%;
}

#footer a{
 text-decoration: none;
 display: block;}

#footer .logo{
 display: inline-block;}

#footer .school-name{
 display: inline-block;
 margin: 15px 0 0 10px;}

#footer .school-name h3{
 font-size: 24px;
 line-height: 33px;
 font-weight: 700;
 margin: 0;
 color: #fff;}

#footer .school-name h3 span{
 display: block;}

#footer .footer-left-sub,
#footer .footer-right-sub{
 width: 50%;
 float: left;
 border-left: solid 3px #0158ab;
 padding: 0 10px;
 box-sizing: border-box;}

#footer .footer-left-sub #location{
 margin-bottom: 15px;}

#footer .footer-left-sub a,
#footer .footer-left-sub a:hover{
 color: #fff;}

#footer .footer-right-sub #login a{
width: 60%;
color: #fff;
background: #00478b;
border: solid 3px #003f7b;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
padding: 10px;
text-align: center;
margin-bottom: 20px;
text-transform: uppercase;
 transition: all 0.2s ease-in;
 -webkit-transition: all 0.2s ease-in;
 -moz-transition: all 0.2s ease-in;}

#footer .footer-right-sub #login a:hover,
#footer .footer-right-sub #login a:focus{
 color: #00478b;
 background: #fff; 
 border: solid 3px #003f7b;}

#footer .footer-right-sub ul#socialLinks{
 margin-bottom: 15px;}

#footer .footer-right-sub ul#socialLinks li{
 width: 32px;
 height: 32px;
 float: left;
 margin-right: 7px;
 border-radius: 5px;
 -moz-border-radius: 5px;
 -webkit-border-radius: 5px;}

#footer .footer-right-sub ul#socialLinks li button{
 border: none;
 background: none;
 padding: 0;}

#footer .footer-right-sub ul#socialLinks li button .stButton{
 margin: 0;}

#footer .footer-right-sub ul#socialLinks li.shareThis{
 background: #2E7D32;}

#footer .footer-right-sub ul#socialLinks li.facebook{
 background: #3b5998;}

#footer .footer-right-sub ul#socialLinks li.youtube{
 background: #cd201f;}


#footer .footer-right-sub ul#socialLinks li.instagram{
 background: #000000;}

#footer .footer-right-sub ul#socialLinks li.email{
 background: #536b78;}

#footer .footer-right-sub ul#socialLinks li.email span{
 display: none;}

#footer .footer-right-sub ul#socialLinks li a{
 color: #fff;
 font-size: 21px;
 text-align: center;
 line-height: 32px;
 transition: all 0.2s ease-in;
 -moz-transition: all 0.2s ease-in;
 -webkit-transition: all 0.2s ease-in;}

#footer .footer-right-sub ul#socialLinks li a:hover,
#footer .footer-right-sub ul#socialLinks li a:focus,
#footer .footer-right-sub ul#socialLinks li button:hover,
#footer .footer-right-sub ul#socialLinks li button:focus{
 opacity: 0.7;}

/** Credits **/
#credits{
 background: #00478b;
 color: #fff;
 text-align: center;}

#credits .inside-padding{
 padding: 5px 10px;}

#credits .label_skin_corporation{
 font-weight: 300;
 font-size: 13px;}

#credits a{
 color: #fff;
 text-decoration: none;}

#credits a:hover,
#credits a:focus{
 color: #fff;
 text-decoration: underline;}

/** Others **/
#btn_month_418920{
 color: #000;}

/** Media queris based on Skelton **/
/* Larger than Desktop HD */
@media print,screen and (max-width: 1200px) {

}

@media print,screen and (min-width: 1100px){
ul#quicklinks li a .icon em{
 font-size: 33px;
 line-height: 70px;
 color: #666666;
 transition: all 0.2s ease-in;
 -webkit-transition: all 0.2s ease-in;
 -moz-transition: all 0.2s ease-in;}

ul#quicklinks li a:hover .icon em,
ul#quicklinks li a:focus .icon em{
 font-size: 28px;}

}


@media print,screen and (max-width: 1100px){

/** Header **/
#header .header-left{
 width: 35%;}

#header .header-right{
 width: 65%;}
	
#header .logo img{
 max-height: 70px;}

#header .school-name h1{
 font-size: 20px;
 line-height: 20px;}
	
/** Main quick links **/
ul#quicklinks{
 width: initial;}
	
ul#quicklinks li{
 width: initial;
 float: left;
 margin-right: 10px;}
	
ul#quicklinks li a .icon{
 width: 45px;
 height: 45px;
 display: inline-block;}
	
ul#quicklinks li a .icon em{
 font-size: 20px;
 line-height: 45px;}

ul#quicklinks li a .text{
 display: none;
 margin-left: 5px;}

ul#quicklinks li a:hover .text,
ul#quicklinks li a:focus .text{
 display: inline-block;}
	
/** Footer **/
#footer .footer-left{
 width: 35%;}

#footer .footer-center{
 width: 20%;
 padding-bottom: 15px;
 padding-top: 27px;}



#footer .footer-right{
 width: 65%;}
	
#footer .logo img{
 max-height: 70px;}

#footer .school-name h3{
 font-size: 20px;
 line-height: 20px;}

#header .header-left a{
 margin-top: 10px;}
	
}

/** Keyframes **/
@keyframes fadeIn{
 0% { opacity: 0;}
 100% { opacity: 1;}
}

@-webkit-keyframes fadeIn{
 0% { opacity: 0;}
 100% { opacity: 1;}
}

@-moz-keyframes fadeIn{
 0% { opacity: 0;}
 100% { opacity: 1;}
}

/* Larger than desktop */
@media print,screen and (max-width: 1000px) {


}

@media print,screen and (max-width: 950px){

#menubar{
 position: static;
 top: 0px !important;}

#sticky-header{
 display: none !important;}

#mobile-bar {
 display: block;}

.telerik_main_menu, .centerWrapper{
 display: none;}
	
}

/* Larger than tablet */

@media print,screen and (max-width: 750px) {

/*
#logo {
    float: none;
    width: initial;
    display: inline-block;
}
#school-name {
    float: none;
    display: inline-block;
    width: initial;
}
*/

/** Main quick links **/	
ul#quicklinks{
 display: none;}

/** Mobile quick links **/
#mobile-quick-links{
 display: block;}

/** Header **/	
#header .header-left{
 width: 100%;
 float: none;
 text-align: center;}
	
#header .header-right{
 width: 100%;
 float: none;}

#header #searchBox{
 position: relative;
 width: 246px;
 margin: 10px auto;}

/** Social Networks **/	
#social-network .box-left,
#social-network .box-right{
 width: 100%;
 float: none;}

/** Subpage **/
.subpage .header-image{
 height: 150px;}

.subpage #subpage-content-container{
 background: none;}
	
.subpage #sub-content-left,
.subpage #sub-content-right{
 width: 100%;
 float: none;}

#sub-content-left:after{
 display: none;}

.anchorLink{
 margin-top: -40px;
 padding-top: 40px;}
	
/** Footer **/	
#footer .footer-left,
#footer .footer-center,
#footer .footer-right{
 width: 100%;
 float: none;}

#footer .footer-center a img {
 width: 50%;
 padding-left: 25%;
} 
#footer .footer-center a.disc {
 padding-left: 25%;
}   

#footer .footer-left a{
 text-align: center;
 margin-bottom: 20px;}

#footer .footer-left-sub,
#footer .footer-right-sub{
 width: 100%;
 float: none;
 border-left: none;
 text-align: center;}

#footer .footer-right-sub #login a{
margin: 20px auto;}

#footer .footer-right-sub ul#socialLinks{
 display: inline-block;
 margin: 10px auto;}
	
}

/* Larger than phablet */
@media print,screen and (max-width: 550px) {

#news .section-title h2, #social-network .section-title h2{
 font-size: 23px;
 padding: 0px;}

#social-network .box-left h3, #social-network .box-right h3{
 font-size: 20px;}

#news .view-more a{
 width: 100px;
 font-size: 16px;
 font-weight: 600;
 padding: 7px 10px;}

.jssocials-share{
 display: block;
 margin: 0.3em 0;}

.jssocials-share-link{
 width: 100%;}

}

/* Larger than mobile */
@media print,screen and (max-width: 400px) {

#mobile-quick-links ul li{
 width: 100%;}
	
}

/** Focus **/
#menubar a:focus,
#news a.newsItem:focus,
#news .view-more a:focus,
#banner .nivo-controlNav a:focus,
#events #upcoming-event-wrapper a.eventPlaceHolder:focus,
#events a.cal-link:focus,
#footer a:focus,
#footer button:focus,
#credits a:focus{
 outline: none !important;
 z-index: 999;
 box-shadow: 0 0 3px 3px #ffb500;}

/** Anchor CSS **/

a.anchor{
 display: block; 
 position: relative; 
 top: -250px; 
 visibility: hidden;
}
a{
	
 color: #0066CC;
}

.video-wrapper.local-video video {
    height: 100%;
    position: relative;
    top: -40px;
}

.video-wrapper.local-video {
    max-height: 500px;
    overflow: hidden;
    display: flex;
    align-items: flex-start;
}

@media screen and (max-width: 1000px) {
.video-wrapper.local-video video {
    top: auto;
}
}

.js-accordion__panel[aria-hidden][aria-hidden="false"] {
    max-height: 100%;
}

@media only screen and (max-width: 800px) {
div#menubar {
    position: relative;
    top: auto;
}
}


.ptl_page .ptl_col_1_2 {
    width: 48%;
}

.ptl_col_1_3{
    float:right !important;
    width:40% !important;
}

.ptl_col_2_3{
    width: 55% !important;
}

@media print,screen and (max-width: 886px) {

    .ptl_col_1_3, .ptl_col_2_3{
        float:none !important;
        width:100% !important;
    }
}
#banner div.portlet-title {
 max-width: none;
}