@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,700,400italic);

/*
font-family: 'Open Sans', sans-serif;
*/

/* --------------------- COLORS ---------------------- */

/*- Header Background Color -*/
#header, #footer {
 background-color: #ffffff;
}

#footer {
  border-top: solid 5px #0666b2; }

/*- Motto Border Left Color -*/
.slogan {
    border-left-color: #55597f;
}

/*- Menubar Background Color -*/
#menubar {
 background: #0666b2;
 color: #ffffff;
}

/*- Banner Radio Background HOVER -*/
#banner .nivo-controlNav a.active {
    background: #055392;
    border-color: #32354c;
}

/*- Section Title Text Color -*/
h2.sec-title {
    color: #32354c;
}

/*- News Section Title Text Color -*/
.row.news h2.sec-title {
    color: #ffffff;
}

/*- Event Title Text Color -*/
.event .eventDate {
    color: #2061a0;
}

/*- Quick Links Color -*/
.quickLinks a {
    color: #2061a0;
}

/*- Quick Links Color HOVER -*/
.quickLinks a:hover {
 text-decoration: none;
    color: #2061a0;
}

/*- News Area Background Color -*/
.row.news {
 background: #003561;
}

/*- News Tab Area Background -*/
ul.tabs-menu {
    background: #055392;
}

ul.tabs-menu:after {
    background: none !important; }

/*- Inactive News Tab Arrow (Same As Above) -*/
ul.tabs-menu li a:after {
 border-color: transparent transparent transparent #055392;
}

/*- Active and HOVER News Tab -*/
ul.tabs-menu li.current a, ul.tabs-menu li a:hover {
 background: #0666b2;
}

/*- Inactive News Tab Border Left Color -*/
span.titleText {
    border-left: 3px solid #0666b2;
}

/*- Active News Tab Border Left Color -*/
li.current span.titleText, a:hover span.titleText {
    border-left: 3px solid #ffffff;
}


/*- Active and HOVER News Tab Arrow -*/
ul.tabs-menu li.current a:after, ul.tabs-menu li a:hover:after {
 border-color: transparent transparent transparent #0666b2;
}

/*- News Title Text Color -*/
.newsTitle {
    color: #055392;
}

.tab-content .image .inside {
    height: 460px; }

/*- Side Nav Background Color -*/
#inside-nav {
    background: #0666b2;
}

/*- Side Nav Current Page Background Color -*/
.currentpage a.navLink {
    background: #eeeeee; 
    opacity: 1 !important; }


/*---- TELERIK COLORS ----*/

/*--TOP LEVEL STYLES--*/

/*--Normal State--*/
.inner-bar a,
.telerik_main_menu .rmRootGroup a {
 color: #ffffff;
}

.telerik_main_menu .rmRootGroup a span {
 color: #ffffff;
}

/*--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: #055392;
}

/*--END OF TOP LEVEL STYLES--*/


/*--DROPDOWN MENU STYLES--*/

/*--Normal State--*/
.telerik_main_menu .rmGroup a {
 color: #ffffff;
 background: #2E6EAB;
}

.telerik_main_menu .rmGroup a span {
 color: #ffffff;
 background: #2E6EAB;
}

/*--Over and Focused State--*/
.telerik_main_menu .rmGroup a:hover,
.telerik_main_menu .rmGroup a.rmFocused {
 background: #055392;
 color: #ffffff;
}

.telerik_main_menu .rmGroup a:hover span,
.telerik_main_menu .rmGroup a.rmFocused span {
 background: #055392;
 color: #ffffff;
}

/*--END OF DROPDOWN MENU STYLES--*/

.rmItem:hover {
 background-color: #2E6EAB;
 color: #ffffff;
}

.telerik_main_menu .rmRootGroup > li:hover > a span {
 color: #ffffff;
}

.rmVertical .rmItem:hover a span, .rmVertical .rmItem:hover a {
 background-color: #055392;
}

/*--DROPDOWN LV2 MENU STYLES--*/

/*--Normal State--*/
.telerik_main_menu .rmGroup .rmGroup a {
 color: #ffffff;
 background: #222A2B;
}

.telerik_main_menu .rmGroup .rmGroup a span {
 color: #ffffff;
 background: #222A2B;
}

/*--Over and Focused State--*/
.telerik_main_menu .rmGroup .rmGroup a:hover,
.telerik_main_menu .rmGroup .rmGroup a.rmFocused {
 background: #2d3738;
 color: #ffffff;
}

.telerik_main_menu .rmGroup .rmGroup a:hover span,
.telerik_main_menu .rmGroup .rmGroup a.rmFocused span {
 background: #2d3738;
 color: #ffffff;
}

/*--SECOND LEVEL BORDER LEFT--*/

.rmLevel2 {
 border-left: 4px solid #055392;
}

/*--END OF DROPDOWN MENU STYLES--*/

/*---- END TELERIK COLORS ----*/

/*------------------------------- END COLORS -------------------------------*/

/* --------------------- IMAGES ---------------------- */

/*--Navigation Arrow BG--*/
.telerik_main_menu .rmGroup .rmItem .rmExpandRight:after {
 background: url(/Common/resources/DesignPortfolio/SiteThemes/Metric/Blue/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 .rmExpandRight:after {
 background-position: -18px -8px !important;
}
*/

/*------------------------------- END IMAGES -------------------------------*/

.homepage .ptl_portlet_vertical {
 overflow: visible;
}

a:not(.link) {
    transition: all .2s ease-in-out;
}

.portletEditMode a, .designMode a {
    transition: none;
}

.subpage .ptl_page a {
 text-decoration: underline;
 font-weight: bold;
}

.w-20 {
 width: 20%;
 display: inline-block;
 vertical-align: top;
}

html body {
 background-color: #fdfdfd !important;
 font-family: 'Open Sans', sans-serif;
 font-size: 16px;
 line-height: normal;
 color: #706f6f;
 -webkit-font-smoothing: antialiased;
}

.tableLayout {
 display: table;
 width: 100%;
}

#menubar { color: #ffffff; }
#menubar .inside-padding { padding: 0px 10px 0px 10px; }
#menubar .row { margin: 0px; }

/*---- HEADER ----*/
#header, #footer {
 color: #000000;
}

.responsiveTemplate #header > .inside-padding, .responsiveTemplate #footer > .inside-padding {
    padding: 30px 10px 30px 10px;
}

#header a.homeBtn, #footer a.homeBtn {
 color: #ffffff;
 display: block;
}

#header a.homeBtn:hover, #footer a.homeBtn:hover {
 color: #ffffff;
 opacity: 0.6;
 text-decoration: none;
}


/*---- LOGO ----*/
#header .inside, #footer .inside {
    display: table;
    margin: 0px auto;
}

#header .inside > *, #footer .inside > div {
    display: table-cell;
    vertical-align: middle;
}

.logo {
    padding: 0; }

.logo img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%; }

#footer .logo img {
    max-width: 70%;
    margin: 0 auto;
    display: block; }

.schoolName {
    /* font-weight: 700;
    font-size: 30px;
    margin: 0; */
    display: none !important; }

.schoolName span {
    /* font-weight: 400;
    font-size: 70%; */
    display: none !important; }

.slogan {
    font-size: 15px;
    border-left-width: 4px;
    border-left-style: solid;
    padding-left: 10px;
}

/*---- HOMEPAGE LAYOUT ----*/

.row.news > .inside-padding {
    padding: 30px 10px 30px 10px;
}

h2.sec-title {
    font-weight: normal;
    text-align: center;
    margin: 20px 0px 40px;
}

.homepage a.ptl_portlet_map_link {
 height: 200px;
 max-width: 100% !important;
 display: block;
}

.tableLayout .w-33, .tableLayout .w-66 {
 display: table-cell;
 float: none;
 vertical-align: middle;
}

/*---- 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;
}


/*---- SUBPAGE LAYOUT ----*/
.subpage #page > .inside-padding {
    padding: 50px 0px 50px 0px;
}

.sideBar {
    width: 23%;
    float: left;
}

.sideBar > .inside-padding { padding: 0 !important; }

.mainContent {
    width: 77%;
    float: left;
}

.mainContent .inside-padding {
    border-left: 1px solid #eeeeee;
    min-height: 500px;
}

#inside-nav {
    padding: 10px;
    margin: 0px 10px 0px 0px;
}

a.navLink {
    color: #ffffff;
    padding: 10px;
    display: block;
    font-size: 14px;
}

a.navLink:hover {
    color: #ffffff; }

.currentpage a.navLink {
    color: #000000;
    font-weight: 500;
    font-size: 16px;
}

.currentpage a.navLink:hover {
   color: #000000;
   text-decoration: none;
   opacity: 0.7;
}

h2.pageTitle {
    color: #32354c;
    font-weight: normal;
    text-align: center;
    margin: 0px 0px 20px;
}

#breadcrumbs {
    padding: 10px;
    background: #eeeeee;
    margin-bottom: 20px;
}


/*---- FOOTER ----*/
#footer .phone a { color: #ffffff; }

ul.socialMedia {
    list-style: none;
    margin: 0px;
    padding: 0px;
    text-align: center;
}

ul.socialMedia li {
    display: inline-block;
}

ul.socialMedia li a {
    font-size: 24px;
    color: #0666b2;
    line-height: 40px;
    margin: 0px 10px;
}

ul.socialMedia li a:hover {
    text-decoration: none;
    opacity: 0.7;
}

#footer .address, #footer .phone {
    text-align: center;
    font-size: 15px;
    margin-bottom: 5px;
}

.credits {
    background: #333333;
    text-align: center;
    color: #ffffff;
}
.credits a {
 color: #ffffff;
}
.credits a:hover {
 color: #ffffff;
 text-decoration: underline;
}

/*---- QUICK LINKS ----*/
.row.quickLinks {
 text-align: center;
 margin-bottom: 20px;
}

.quickLinks a {
    text-align: center;
    font-weight: bold;
}

.quickLinks a:hover {
 text-decoration: none;
}

.quickLinks a span {
    display: block;
    transition: all .2s ease-in-out;
}

.quickLinks a:hover span {
    -ms-transform: scale(1.1,1.1);
    -webkit-transform: scale(1.1,1.1);
    transform: scale(1.1,1.1);
}


.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;
}

.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: 17px;
    font-weight: 400;
}

/*** 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 {
    font-size: 17px;
    font-weight: 400;
    color: #ffffff;
    line-height: 55px;
}

a#mobile-bar span {
    margin-right: 10px;
}

@media screen and (max-width: 850px) {

 a.event {
   width: 40%;
   text-align: center;
   margin-bottom: 20px;
 }

 .eventsList a.event:after { display: none; }

}

@media screen and (max-width: 850px) {

 .sideBar { width: 27%; float: left; }

.mainContent { width: 73%; float: left; }

 .w-20 { width: 33.33334%; }

 ul.tabs-menu { width: 35%; }
 #homeNewsWrapper .tab > div { width: 65%; }

 .tab-content .inside > div.image, .tab-content .inside > div { width: 100%; display: block; }

}

@media screen and (max-width: 730px) {

 .sideBar, .mainContent { width: 100%; float: none; }

 #header .inside, #footer .inside { display: block; text-align: center; }
 #header .inside > div, #footer .inside > div { display: block; }
 .schoolName span { display: block; margin-bottom: 20px; }

}

@media screen and (max-width: 640px) {

 .tableLayout .w-33, .tableLayout .w-66 { display: block; width: 100%; }

 #homeNewsWrapper .tab { background: transparent; box-shadow: none; }

 #homeNewsWrapper .tab > ul { display: none; }
 #homeNewsWrapper .tab > div { display: block; width: 100%; }

 .tab-content .image .inside { height: 160px; }

 #homeNewsWrapper .inside-padding { padding: 15px; }

 #homeNewsWrapper .tab > div {
    position: static;
    margin-bottom: 20px;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.5);
    background: #ffffff;
 }

 a.event {
   width: 90%;
   text-align: center;
   margin-bottom: 20px;
 }

}

@media screen and (max-width: 470px) {

 .w-20 { width: 50%; }

}

.row.quickLinks .w-20{
  width: 14%;
  min-width: 94px;
}

@media screen and (max-width: 730px){
    a.navLink,
    a.navLink:hover {
        color: #1d1d1d;
    }
}

h2.pageTitle {
    color: #0666b2 !important;
}

.subpage .ptl_page a {
 color: #0666b2;
}

.subpage .ptl_page a:hover {
 color: #000;
}

.homepage a, a:hover {
 color: #0666b2;
}

#breadcrumbs {
  color: #000 !important; }