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

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

* {margin:0; padding:0;}

/* --------------------- COLORS ---------------------- */

/*- Header Background Color -*/
#header, #header .inside-padding, #header:after {
    background: #505c32;
}


/*- School Name Color -*/
#header a.logo {
 color: #ffffff;
}

/*- Motto Text Color -*/
#header .motto {
    color: #cccccc;
}

/*- Header Info Separator Color -*/
#header .motto:after, #header a.logo:after {
    background: #fff;
}

/*- Address Text Color -*/
#header .address {
    color: #cdcdcd;
}

/*- Social Media Background and Text Color -*/
ul.socialMedia li a {
    background: #145993;
    color: #ffffff;
}

/*- Menubar Border Top Color -*/
#menubar {
    border-top-color: #6d7d40;
}

/*- Banner Radio Background HOVER -*/
#banner .nivo-controlNav a.active {
    background: #6d7d40;
}

/*- News/Events Heading Text Color -*/
.sectionName {
    color: #505c32;
}

/*- News Title Text Color -*/
.newsTitle {
    color: #505c32;
}

/*- News Date Background Color -*/
.newsDate {
    background: #505c32;
}

/*- Events Clock Background and Text Color -*/
a.event .time span.fa {
    color: #ffffff;
    background: #6d7d40;
}

/*- Weather Background and Text Color -*/
.weather-wrapper {
    background: #505c32;
    color: #ffffff;
}

/*- Weather Separator Color -*/
.weather-temp:before {
    background: #145993;
}

/*- Subpage Page Title Text Color -*/
.mainContent h2.pageTitle {
    color: #505c32;
}

/*- Side Nav Current Page Background and Text Color -*/
.currentpage a.navLink {
    background: #6d7d40;
    color: #ffffff;
}

/*- Side Nav Current Page Text Color HOVER -*/
.currentpage a.navLink:hover {
 color: #ffffff;
}

/*- Mobile Sub-Menu Toggle Background -*/
.nav-toggle {
 background: #6d7d40;
}

/*- Mobile Sub-Menu Toggle Text Color -*/
.nav-toggle a {
 color: #ffffff;
}

/*- Mobile Sub-Menu Color (Hidden Item should match background) -*/
.nav-toggle span {
 color: #6d7d40;
}

/*- Mobile Sub-Menu '+' Color -*/
.nav-toggle span {
 color: #ffffff;
}

/*- Footer Border Top Color -*/
#footer {
    border-top-color: #6d7d40;
}


/*---- TELERIK COLORS ----*/

/*--TOP LEVEL STYLES--*/

/*--Normal State--*/
.inner-bar a,
.telerik_main_menu .rmRootGroup a {
 color: #666666;
}

.telerik_main_menu .rmRootGroup a span {
 color: #666666;
}

/*--Over and Focused State ***/
.inner-bar a:hover,
.telerik_main_menu .rmRootGroup a:hover,
.telerik_main_menu .rmRootGroup a.rmFocused {
 color: #ffffff;
}

.telerik_main_menu .rmRootGroup a:hover span,
.telerik_main_menu .rmRootGroup a.rmFocused span {
 color: #ffffff;
}

/*--TOP LEVEL HOVER BG COLOR AND IMAGES (two images)--*/
.telerik_main_menu .rmRootGroup a:hover,
.telerik_main_menu .rmRootGroup a.rmFocused {
 background-color: #6d7d40;
}

/*--END OF TOP LEVEL STYLES--*/


/*--DROPDOWN MENU STYLES--*/

/*--Normal State--*/
.telerik_main_menu .rmGroup a {
 color: #ffffff;
 background: #505c32;
}

.telerik_main_menu .rmGroup a span {
 color: #ffffff;
 background: #505c32;
}

/*--Over and Focused State--*/
.telerik_main_menu .rmGroup a:hover,
.telerik_main_menu .rmGroup a.rmFocused {
 background: #E6F2FF;
 color: #ffffff;
}

.telerik_main_menu .rmGroup a:hover span,
.telerik_main_menu .rmGroup a.rmFocused span {
 background: #E6F2FF;
 color: #ffffff;
}

/*--END OF DROPDOWN MENU STYLES--*/

.rmItem:hover {
 background-color: #6d7d40;
 color: #ffffff;
}

.telerik_main_menu .rmRootGroup > li:hover > a span {
 color: #ffffff;
}

.rmVertical .rmItem:hover a span, .rmVertical .rmItem:hover a {
  color:#000;
 background-color: #E6F2FF;
}

/*--DROPDOWN LV2 MENU STYLES--*/

/*--Normal State--*/
.telerik_main_menu .rmGroup .rmGroup a {
 color: #ffffff;
 background: #323538;
}

.telerik_main_menu .rmGroup .rmGroup a span {
 color: #ffffff;
 background: #323538;
}

/*--Over and Focused State--*/
.telerik_main_menu .rmGroup .rmGroup a:hover,
.telerik_main_menu .rmGroup .rmGroup a.rmFocused {
 background: #E6F2FF;
 color: #000000;
}

.telerik_main_menu .rmGroup .rmGroup a:hover span,
.telerik_main_menu .rmGroup .rmGroup a.rmFocused span {
 background: #E6F2FF;
 color: #000000;
}

/*--SECOND LEVEL BORDER LEFT--*/

.rmLevel2 {
 border-left: 4px solid #E6F2FF;
}

/*--END OF DROPDOWN MENU STYLES--*/

/*---- END TELERIK COLORS ----*/

/*------------------------------- END COLORS -------------------------------*/

/* --------------------- IMAGES ---------------------- */

/*--Navigation Arrow BG--*/
.telerik_main_menu .rmGroup .rmItem .rmExpandRight:after {
 background: url('https://cdnsm5-hosted.civiclive.com/UserFiles/Servers/Server_11725438/Templates/arrows-sprite.png');
}

/*--Navigation Arrow--*/

/*--Light--*/
.telerik_main_menu .rmGroup .rmItem .rmExpandRight:after {
 background-position: -18px -44px !important;
}

/*or*/

/*--Dark--*/

.telerik_main_menu .rmGroup .rmItem a:hover .rmExpandRight:after,
.telerik_main_menu .rmGroup .rmItem .rmFocused .rmExpandRight:after,
.telerik_main_menu .rmGroup .rmItem .rmExpanded .rmExpandRight:after {
 background-position: -18px -8px !important;
}


/*------------------------------- END IMAGES -------------------------------*/

.CMS_DragDropWrapper {
 background: #1d2228;
}

a:not(.link) {
    transition: all .2s ease-in-out;
}

.portletEditMode a, .designMode a {
    transition: none;
}

body #pubWrapper .container {
 max-width: 100%;
}

body .inside-padding {
 max-width: 100%;
}

.w-66 > .inside-padding, .w-33 > .inside-padding {padding: 10px 35px 10px 35px}

.pageContent {
    font-family: 'Merriweather', serif;
}

.subpage .pageContent h1, .subpage .pageContent h2, .subpage .pageContent h3, .subpage .pageContent h4, .subpage .pageContent h5, .subpage .pageContent h6 {
 font-family: 'Open Sans', sans-serif;
}

body {
 font-family: 'Open Sans', sans-serif;
 font-size: 16px;
 font-weight: normal;
 line-height: normal;
 color: #666666;
 -webkit-font-smoothing: antialiased;
}

.responsiveTemplate #pubWrapper {
 position: fixed;
 top: 0px;
 right: 0%;
 width: 75%;
 z-index: 7004;
 color: #ffffff;
}

a.logo img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

#header {
 position: fixed;
 top: 0px;
 left; 0px;
 width: 25%;
 height: 100%;
 color: #ffffff;
 display: table;
 z-index: 7004;
}

#header:after {
    content: '';
    display: block;
    position: absolute;
    right: -1px;
    width: 1px;
    height: 100%;
}

#header > .inside-padding {
 display: table-cell;
 vertical-align: middle;
 text-align: center;
}

.contentWrapper {
 width: 75%;
 margin-left: 25%;
}

#menubar {
    width: 75%;
    position: fixed;
    top: 0px;
    right: 0px;
    background: #ffffff;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.7);
    z-index: 7003;
    border-top-width: 4px;
    border-top-style: solid;
}

.guestView #menubar {
    top: 35px;
}

.adminbarV1.adminbarVisible #pubWrapper {
    top: 50px;
}

.adminbarV1.adminbarVisible #menubar {
    top: 85px;
}

.classicAdminbar.adminbarVisible #pubWrapper {
    top: 35px;
}

.classicAdminbar.adminbarVisible #menubar {
    top: 70px;
}

.adminbarV1.adminbarVisible.designMode #pubWrapper {
    top: 247px;
}

.adminbarV1.adminbarVisible.designMode #menubar {
    top: 282px;
}

.adminbarV1.adminbarVisible.designMode.dragAndDropDisabled #pubWrapper {
    top: 86px;
}

.adminbarV1.adminbarVisible.designMode.dragAndDropDisabled #menubar {
    top: 121px;
}

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

#menubar .row {
 margin-bottom: 0px;
}


/*---- HEADER ----*/

body #header > .inside-padding {
 padding: 30px;
}

h1.schoolName {
    margin: 0px;
    font-weight: normal;
}

#header a.logo {
 display: block;
}

#header a.logo:hover {
 text-decoration: none;
 opacity: 0.7;
}

#header a.logo:after {
    content: '';
    display: block;
    width: 40%;
    height: 1px;
    margin: 20px auto;
}

#header .motto {
    font-size: 15px;
    font-style: italic;
}

#header .motto:after {
    content: '';
    display: block;
    width: 40%;
    height: 1px;
    margin: 20px auto;
}

#header .address {
    margin-bottom: 20px;
}

ul.socialMedia {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

ul.socialMedia li {
    display: inline;
}

ul.socialMedia li a {
    border-radius: 50%;
    width: 50px;
    line-height: 50px;
    font-size: 20px;
    margin: 0px 5px 10px 5px;
    text-align: center;
}

ul.socialMedia li a:hover {
 text-decoration: none;
 opacity: 0.7;
}


/*---- WEATHER ----*/
.weather-wrapper {
    text-align: center;
    padding: 20px;
}

.weather-location {
 display: none;
}

.weather-temp {
    font-size: 45px;
    font-weight: 700;
    line-height: 65px;
}

.weather-temp:before {
    content: '';
    display: block;
    width: 60%;
    height: 1px;
    margin: 0px auto 20px;
}

.weather-temp span.typ {
    display: none;
}

.weather-temp span.deg {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
    top: -0.5em;
}

.weather-img img {
    max-width: 100px;
}

/*---- HOMEPAGE LAYOUT ----*/
#bg-d {
    color: #ffffff;
    text-align: center;
    background-size: cover;
    background-position: center center;
    position: relative;
    background-color: #171717;
}

#bg-d:after {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(31,31,31,0.7);
    z-index: 1;
}

#bg-d > .inside-padding {
    position: relative;
    z-index: 2;
    padding: 50px 10px 50px 10px;
}

#bg-d p {
    margin-bottom: 0px;
}

#contentArea > .inside-padding {
    background: #E6F2FF;
    margin: 10px 35px 10px 35px;
    padding: 20px;
}

/*---- QUICK LINKS ----*/
#bg-d .ptl_portlet_vertical {
 overflow: visible;
}

#bg-d a {
    color: #ffffff;
    transition: all .2s ease-in-out;
}

#bg-d a:hover {
    text-decoration: none;
}

#bg-d a span {
    transition: all .2s ease-in-out;
}

#bg-d a:hover span {
    -ms-transform: scale(1.1,1.1);
    -webkit-transform: scale(1.1,1.1);
    transform: scale(1.1,1.1);
}

/*---- SUBPAGE ----*/
.sideBar {
    width: 24%;
    float: right;
}

.mainContent {
    width: 76%;
    float: right;
}

.mainContent h2.pageTitle {
    font-size: 20px;
    font-weight: bold;
    text-transform: uppercase;
    margin: 0px;
    background: #f2f2f2;
    padding: 10px;
}

#breadcrumbs, #breadcrumbs a {
    font-family: 'Merriweather', serif;
    font-size: 14px;
    color: #666666;
}

#breadcrumbs {
    padding: 10px;
    background: #e6e6e6;
    margin-bottom: 20px;
}

a.navLink {
    font-family: 'Merriweather', serif;
    color: #666666;
    font-size: 14px;
    padding: 10px;
    display: block;
}

a.navLink:hover {
 opacity: 0.7;
 text-decoration: none;
    color: #666666;
}

.currentpage a.navLink {
    display: block;
    padding: 10px;
    font-weight: 700;
    font-family: 'Open Sans', sans-serif;
    margin-bottom: 10px;
    font-size: 17px;
}

.nav-toggle a {
    font-weight: 700;
    font-family: 'Open Sans', sans-serif;
}

.nav-toggle a:hover {
 text-decoration: none;
 color: #ffffff;
}


/*---- FOOTER ----*/
#footer {
    background: #1F1F1F;
    border-top-width: 4px;
    border-top-style: solid;
    color: #cccccc;
}

#footer a.logo {
    width: 100%;
    display: table;
    float: left;
    color: #ffffff;
}

#footer a.logo:hover {
    text-decoration: none;
}

#footer a.logo:hover .logoIcon, #footer a.logo:hover .schoolName {
 opacity: 0.7;
}

#footer .logoIcon {
    display: table-cell;
    vertical-align: middle;
    padding-right: 10px;
transition: all .2s ease-in-out;
}

#footer .schoolName {
    display: table-cell;
    vertical-align: middle;
transition: all .2s ease-in-out;
font-weight: normal;
}

#footer .address {
    display: table-cell;
    vertical-align: middle;
    padding-left: 10px;
}

.credits {
 background: #333333;
 text-align: center;
    color: #cccccc;
}
.credits a {
 color: #ffffff;
}
.credits a:hover {
 color: #ffffff;
 text-decoration: underline;
}


/*---- BANNER BUTTONS ----*/
#banner .nivo-controlNav a {
    display: inline-block;
    background: #ffffff;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    float: none;
    margin: 0px 6px 0px 6px;
    border: 1px solid #E0DFDF;
}

#banner .nivo-controlNav {
    text-align: center;
    width: 100%;
    padding: 0px;
    right: 0px;
    left: 0px;
    bottom: 10px !important;
}

.RadMenu a.rmLink {
 line-height: 45px;
}

/*** START OF TOP LEVEL MENU STYLES ***/

.telerik_main_menu a,
.telerik_main_menu a:hover {
 text-decoration: none;
 font-size: 13px;
 font-weight: normal;
}

.telerik_main_menu .rmText {
 padding-top: 5px !important;
 padding-bottom: 15px !important;
}

.telerik_main_menu .rmGroup .rmText {
 padding-bottom: 5px !important;
}

.RadMenu .rmItem {
 height: auto;
 margin-right: 0px;
}

.RadMenu .rmText {
 font-weight: normal;
 font-size: 12pt;
}

.RadMenu .rmLink {
 float: left;
 outline: 0 none;
 padding-left: 0px !important;
}

.RadMenu .rmHorizontal .rmText {
 padding: 0px 10px 0px 10px !important;
 letter-spacing: 0.06em;
}

.RadMenu .rmGroup .rmText {
 margin-left: 0px !important;
 padding: 8px 10px 8px 10px !important;
 margin-bottom: 4px;
}

.rmrootGroup .rmHorizontal li.rmItem {
 margin-left: 10px;
}

/*** Normal State ***/
.telerik_main_menu .rmRootGroup a {
 text-decoration: none;
 font-size: 18px;
}

.telerik_main_menu .rmRootGroup a span {
 text-decoration: none;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 700;
}

/*** Over and Focused State ***/
.telerik_main_menu .rmRootGroup a:hover,
.telerik_main_menu .rmRootGroup a.rmFocused {
 text-decoration: none;
 background-position: left top, right top;
 background-repeat: no-repeat;
}

.telerik_main_menu .rmRootGroup a:hover span,
.telerik_main_menu .rmRootGroup a.rmFocused span {
 text-decoration: none;
}

/*** END OF TOP LEVEL MENU STYLES ***/

/*** START OF DROPDOWN MENU STYLES ***/

/*** Normal State ***/

.telerik_main_menu .rmGroup {
}

.telerik_main_menu .rmGroup a {
 text-decoration: none;
 font-size: 10pt;
 font-weight: normal;
}

.telerik_main_menu .rmGroup a span {
 text-decoration: none;
 font-size: 15px;
 font-weight: 400;
 line-height: normal !important;
 text-transform: none;
}

.telerik_main_menu .rmGroup .rmItem .rmExpandRight:after {
 content: '';
 position: absolute;
 top: 5px;
 right: 5px;
width: 18px;
height: 26px;
}

/*** Over and Focused State ***/
.telerik_main_menu .rmGroup a:hover,
.telerik_main_menu .rmGroup a.rmFocused {
 text-decoration: none;
 border-bottom: none !important;
}

.telerik_main_menu .rmGroup a:hover span,
.telerik_main_menu .rmGroup a.rmFocused span {
 text-decoration: none;
}

/*** Dropdown border ***/
.RadMenu .rmRootGroup .rmItem ul.rmGroup {
 width: 200px;
 padding: 0px;
}

/*** END OF DROPDOWN MENU STYLES ***/


a#mobile-bar {
    line-height: 45px;
    color: #666666;
    font-size: 21px;
    text-transform: uppercase;
}

a#mobile-bar span {
    margin-right: 10px;
}


@media screen and (max-width: 1370px) {

 #header { width: 20%; }

 .contentWrapper { width: 80%; margin-left: 20%; }

 .responsiveTemplate #pubWrapper { width: 80%; }

 #menubar { width: 80%; }


}

@media screen and (max-width: 1270px) {

 .w-66 > .inside-padding, .w-33 > .inside-padding { padding: 10px; }

 #contentArea > .inside-padding { margin: 10px; }

}


@media screen and (max-width: 1210px) {

 #header { width: 100%; position: static; }

 #header a.logo { float: left; }

 #header .motto:after, #header a.logo:after { display: none; }

 .contentWrapper { width: 100%; margin-left: 0px; }

 #menubar { position: static; width: 100%; }

 .responsiveTemplate #pubWrapper { position: relative; top: 0px !important; width: 100%; }

 #theme { padding-top: 0px !important; }

 #theme.subpage #page { min-height: auto !important; }

}

@media screen and (max-width: 1000px) {

 .RadMenu .rmHorizontal .rmText { letter-spacing: 0; }

}

@media screen and (max-width: 890px) {

 #header a.logo { float: none; }

 #header .motto:after, #header a.logo:after { display: block; }

 body #theme .w-33, body #theme .w-66 { width: 50%; }

 body #theme #bg-d .w-33 { width: 33.33334%; }

 .newsItem { width: 100%; float: none; }

 .newsItem > .inside { height: auto; }

 .newsItem .image .inside { height: 100px; }

 .sideBar { width: 26%; }

 .mainContent { width: 74%; }

 #footer { text-align: center; }

 #footer .w-33, #footer .w-66, #footer a.logo, #footer .logoIcon, #footer .schoolName, #footer .address { display: block; width: 100%; float: none; padding: 0px; }

 #footer .socialMedia { margin-top: 10px; }

}

@media screen and (max-width: 730px) {

 .sideBar, .mainContent { width: 100%; float: none; }

}

@media screen and (max-width: 670px) {

  body #theme .w-33, body #theme .w-66, body #theme #bg-d .w-33 { width: 100%; float: none; }

}



/* add*/

.newsItem > .inside, a.event {background:#E6F2FF;}
.telerik_main_menu .rmGroup a:hover span, .telerik_main_menu .rmGroup a.rmFocused span {color:#000;}
.rmVertical.rmGroup.rmLevel1 .rmItem:hover {color:#000;}
.newsItem .image {
    border-bottom: 3px solid #89956b;
}

/* Q/A -------*/

/* footer link*/
.credits a {text-decoration: underline;}
.credits a:hover {opacity: 0.8;}

a.navLink:hover {opacity:0.9; text-decoration: underline;}

/* calendar go button fix */
button[title="Change to selected Month"] {background: #2f353e !important;}
#divCalendar tbody a[style*="170"] {color: #000 !important;}

/* staff directory */
.PO-staffDirectory .PO-search .DIR-sGroup .DIR-sGroupFName .DIR-sGFN {color: #333;}
.PO-paging ul li a.selected {color:#000 !important;}
.PO-staffDirectory .DIR-card .DIR-photo em {color:#000 !important;}
.PO-staffDirectory .DIR-card .DIR-cardInfo ul .DIR-quickLinks li a {color:#000 !important;}


a.event .time, .readMore, #menubar { background: #f2e3c9 !important;}

#news-summary .content .date {color:#333;}
.eventsList .date {
background: #d4d4d4;
    display: inline-block;
    font-size: 14px !important;
    text-transform: uppercase;
    padding: .5em 1em;
    text-align: center;
    font-weight: bold;
}

.eventsList .date .day {
display: block;
    font-size: 20px;
}

.eventsList  span.numTime {
    top: 0;
    vertical-align: top;
    display: inline-block;
    box-sizing: border-box;
    padding: 1.5em 1em;
}

.subpage .mainContent .pageContent a {
   text-decoration: underline;
   font-weight: bold;
color: #6d7d40;
}

.subpage .mainContent .pageContent a:hover {
   text-decoration: none;
}






/* level0 */

.rmHorizontal > li > a.rmExpanded > span,.rmHorizontal > li > a.rmFocused > span,.rmHorizontal > li > a.rmSelected > span {


    background: #6d7d40;
    color: #ffffff;
}






/* arrow */


#menubar .telerik_main_menu .rmGroup .rmItem:hover .rmExpandRight:after, 
#menubar .telerik_main_menu .rmGroup .rmExpanded .rmExpandRight:after, 
#menubar .telerik_main_menu .rmGroup .rmFocused .rmExpandRight:after

{
 background-position: -18px -8px !important;
}




/* level 1 */

.telerik_main_menu .rmGroup a:hover span, .telerik_main_menu .rmGroup a.rmFocused span, .telerik_main_menu .rmGroup a.rmExpanded span {

background: #E6F2FF;
color: #000;

}