/*
 *   Fonts
 */
/* 

/* This stylesheet generated by Transfonter (https://transfonter.org) on October 5, 2017 3:06 AM */

@font-face {
    font-family: 'Blokletters Viltstift';
    src: url('/fonts/Blokletters-Viltstift.eot');
    src: url('/fonts/Blokletters-Viltstift.eot?#iefix') format('embedded-opentype'),
    url('/fonts/Blokletters-Viltstift.woff2') format('woff2'),
    url('/fonts/Blokletters-Viltstift.woff') format('woff'),
    url('/fonts/Blokletters-Viltstift.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Neo Sans Std';
    src: url('/fonts/NeoSansStd-Regular.eot');
    src: url('/fonts/NeoSansStd-Regular.eot?#iefix') format('embedded-opentype'),
    url('/fonts/NeoSansStd-Regular.woff2') format('woff2'),
    url('/fonts/NeoSansStd-Regular.woff') format('woff'),
    url('/fonts/NeoSansStd-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Helvetica LT Std';
    src: url('/fonts/HelveticaLTStd-Light.eot');
    src: url('/fonts/HelveticaLTStd-Light.eot?#iefix') format('embedded-opentype'),
    url('/fonts/HelveticaLTStd-Light.woff2') format('woff2'),
    url('/fonts/HelveticaLTStd-Light.woff') format('woff'),
    url('/fonts/HelveticaLTStd-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Blokletters Potlood';
    src: url('/fonts/Blokletters-Potlood.eot');
    src: url('/fonts/Blokletters-Potlood.eot?#iefix') format('embedded-opentype'),
    url('/fonts/Blokletters-Potlood.woff2') format('woff2'),
    url('/fonts/Blokletters-Potlood.woff') format('woff'),
    url('/fonts/Blokletters-Potlood.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}





/*
 *   Reset
 */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, select, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

fieldset, img {
    border: 0;
}

.absolute {position: absolute;}
.relative {position: relative;}

address, caption, cite, code, dfn, em, th, var {
    font-style: normal;
    font-weight: normal;
}

strong {
    font-weight: bold !important;
}

.fadein {opacity: 0;}

ol, ul {
    list-style: none;
}

u {text-decoration: underline;}

p, span, li {
    font-family: 'Raleway', sans-serif !important;
    font-weight: 400;
    line-height: 150%;
}

caption, th {
    text-align: left;
}

q:before, q:after {
    content: '';
}

abbr, acronym {
    border: 0;
}

button::-moz-focus-inner {
    border: 0;
    padding: 0;
}

.text-align-right {
    text-align: right;
}
.text-align-center {
    text-align: center;
}
.text-align-left {
    text-align: left;
}

.google-maps {
    position: relative;
    padding-bottom: 75%;
    height: 0;
    overflow: hidden;
}
.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/* Responsive iFrame */
.responsive-iframe-container {
    position: relative;
    padding-bottom: 100%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
.responsive-iframe-container iframe,
.vresponsive-iframe-container object,
.vresponsive-iframe-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Buttons */
.btn {
    text-align: center;
    display: inline-block;
    font-size: 21px;
    /*height: 50px;*/
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    cursor: pointer;
    border: 3px solid #810e33;
    background: #fff;
    color: #810e33 !important;
    text-decoration: none !important;
    line-height: 50px;
    letter-spacing: 1px;
    padding-right: 15px;
    padding-left: 15px;
    font-weight: 900;
    font-family: 'Raleway', sans-serif;
}
.btn small{float:right; margin:0 0 0 20px; color:rgba(255, 255, 255, 0.61); font-size:12px; line-height:50px; text-transform:uppercase; vertical-align:middle;}
.btn:hover small {color:rgba(255,255,255,.75);}
.btn:hover {
    background: #810e33 !important;
    color: #fff !important;
}

.btn.pushable{ background: #810e33; color: #fff !important; -webkit-box-shadow: -2px 4px rgba(181, 110, 129, 0.9), 2px 4px rgba(181, 110, 129, 0.9); box-shadow: -2px 4px rgba(181, 110, 129, 0.9), 2px 4px rgba(181, 110, 129, 0.9); border: none; font-weight: 300; line-height: 50px; text-decoration: none !important;}
.btn.pushable:hover {background: rgba(129, 14, 51, 0.88) !important; border: none;}
.btn.pushable:active {position: relative; top: 6px; -webkit-box-shadow: 0px 0px #7f8c8d; box-shadow: 0px 0px #7f8c8d;}


* {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    text-decoration: none;
}

html {
    min-height: 100%;
    height: 100%;
}

body {
    font-family: 'Raleway', sans-serif !important;
    min-height: 100%;
    height: 100%;
    color: #000;
}

body,
input,
select,
textarea {
    font-weight: 500;
    font-size: 18px;
}

p {
    margin: 0 0 1em 0;
}

h1 {
    margin: 0 0 20px 0;
    /*text-transform: uppercase;*/
}

h2 {
    margin: 0 0 12px 0;
    /*text-transform: uppercase;*/
}

h3 {
    font-size: 24px;
    /*text-transform: uppercase;*/
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
    font-family: 'Raleway', sans-serif; -webkit-font-feature-settings: "calt" 0; font-feature-settings: "calt" 0;
}

h2 {
    font-size: 38px;
    font-weight: 500;
    text-transform: capitalize;
    font-family: 'Raleway', sans-serif;
}


.full-width {width: 100%;}

h3 {
    font-weight: bold;
}

ul {
    margin: 0 0 1em 0;
}
a:link,
a:visited {
    color: #000;
    text-decoration: none;
}

.skoolbag-text a:link, a:visited {text-decoration: underline;}
nav a:link, nav a:visited {display: inline-block;}
header a:hover {text-decoration: none;}
/*a:hover {
    text-decoration: underline;
}*/


.pointer {
    cursor: pointer;
}
.float-left { float: left; width: 50%;}
.float-right { float: right; width: 50%;}.display-block {display: block;}

.panel {
    float: left;
    width: 100%;
}

.panel .inner {
    width: 1024px;
    margin: 0 auto;
}

.bord {
    border: 1px dotted red;
}
.inline-block {
    display: inline-block;
}
.display-block {
    display: block !important;
    opacity: 1 !important;
}
.clearfix {
    overflow: auto;
    zoom: 1;
}
.youtube-embed-wrapper { margin-top: 25px; margin-bottom: 25px; }

/* Read more ckeditor plugin */
.read-more-hide-prev {display: none;}
.read-more-content {display: none;}


/*Facebook Like Widget*/
.home-page .fb_iframe_widget {float: right; left: -5px;}
.sub-page .fb_iframe_widget {position: relative; top: -37px; left: 30px;}


.text-left {text-align: left}
.text-right {text-align: right}
.text-center {text-align: center}
.vert-align-block-left {position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}
.vert-align-block-right {position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}
.arrow-left { position: relative; left: 10px; width: 0; height: 0; border-top: 22px solid transparent; border-bottom: 22px solid transparent; border-right:22px solid #fff;}
.arrow-left:hover { cursor: pointer; border-right: 22px solid #d6d5d5;}
.fa-icon {font-size: 15px; background: #00008a; border-radius: 50%; color: #fff; width: 30px !important; height: 30px !important; text-align: center; line-height: 30px !important;}
.pointer { cursor: pointer;}


.home-page .panel.hoist {position: relative; top: -198px;}
.sub-page .panel.hoist {top: 0px !important;}


/* Header/Nav */
header.header.panel {position: relative; width: 100%; z-index: 200; background-color: rgb(255,255,255);}
header .inner {padding-left: 0px !important; padding-right: 0px !important; top: 15.5px; position: relative;}
header .margin-left {margin-left: 140px; display: inline-block; width: 1px; height: 100px; line-height: 100px;}
header h1 {margin: 0; line-height: 1em; float: left; text-indent: -9999em;}
header .panel {position:relative; height: 198px;}
header .school-logo {float: left;}
header .school-logo img {position: relative; left: 12px; top: -8px; width: 238px;}
header .header-links {position: relative; top: 48px; left: -33px;}
header .header-top {margin-bottom: 2px;}
header .header-links a:link,
header .header-links a:visited,
.sub-page .subnav-links a:link,
.sub-page .subnav-links a:visited {
    float: right;
    color: #fff !important;
    line-height: 36px !important;
    font-size: 17px !important;
    border-radius: 12px !important;
    box-shadow: 0px 3.5px rgba(253, 155, 74, 0.4);
    -webkit-box-shadow: 0px 3.5px rgba(253, 155, 74, 0.4);
    font-weight: 400;
    background: #fd9b4a;
    border: none !important;
    font-family: 'Neo Sans Std', sans-serif;
    margin-left: 10px;
    text-align: center;
    display: inline-block;
    box-sizing: content-box;
    cursor: pointer;
    text-decoration: none;
    padding-right: 15px;
    padding-left: 15px;
}
header .header-links a:link:hover,
header .header-links a:visited:hover,
.sub-page .subnav-links a:link:hover,
.sub-page .subnav-links a:visited:hover {
    background: rgba(253, 155, 74, 0.8);
}

header #google_translate_element {float: right;}
#google_translate_element .goog-te-gadget-icon {display: none;}
.goog-te-gadget-simple {border: none !important; background: none !important;}
.goog-te-gadget-simple span { color: #fff !important; border: none !important;}

.sub-page header .panel {height: 172px;}
.sub-page header .school-logo img { width: 190px; top: -10px;}
.sub-page header .inner {top: 13.5px;}
.sub-page header .header-values {font-size: 17px; color: #ca8b55; font-weight: bold; font-family: 'Blokletters Potlood', cursive !important;}
.sub-page header .header-links .header-values {float: right; position: relative; left: -2px;}
.sub-page header .header-links {top: 39px;}
.sub-page header .header-top {margin-bottom: 1px;}

@media all and (max-width: 1100px) {
    header .header-links {left: -17px;}
}


nav * {font-family: 'Neo Sans Std', sans-serif; font-size: 17.5px; letter-spacing: 0.2px;}
nav {float: left; clear: left; margin: 0; width: 100%; line-height: 50px;}
nav ul ul a:link, nav ul ul a:visited {color: #fff;}
nav a:link, nav a:visited {color: #810e33;}
nav ul.normal {position: relative;}
nav ul {list-style: none; float: left; margin: 0; width: 100%;}
nav ul ul li.hover {background: #e8bc35;}
nav ul ul li.hover > a:link, nav ul ul li.hover > a:visited  {color: #fff;}
nav ul li a:link, nav ul li a:visited {margin: 0 1px 0 0; padding: 0px 11.5px; text-decoration: none; height: 55px; width: 100%;}
nav ul li a:link div, nav ul li a:visited div {line-height: 55px;}
nav ul ul li a:link, nav ul ul li a:visited {margin: 0 1px 0 0; padding: 0px 21.5px; text-decoration: none; height: 46px; line-height: 46px; width: 100%;}
nav ul li ul li div {line-height: 46px !important;}
nav ul li.bars {float: right; height: 50px !important; position: absolute; right: 3px;}
nav ul li {vertical-align: middle; float: left; position: relative; width: auto; text-align: left}
.show-mobile {display: none;}
nav .more {position: fixed; z-index: 102; top: 0; left: 0; max-width: 80%; height: 100%; overflow-y: auto; overflow-x: hidden; margin: 0 0 0 100%; -webkit-box-shadow: 0 0 5px 5px rgba(0,0,0,0.1); box-shadow: 0 0 5px 5px rgba(0,0,0,0.1); background: #b1b1db;}
nav ul li a.bars i {font-size: 30px; color: #810e33; position: relative; top: 6px;}
nav ul li a.bars:hover {background: rgba(255, 255, 255, .1); height: 50px !important;}
nav ul ul {position: absolute; top: 100%; left: 0; min-width: 270px; list-style: none; z-index: 101; display: none;}
nav ul ul li {float: left; width: 100%; height: auto; margin: 0; border: 0; background-color: #810e33;}
nav li.on > a:link, nav li.on > a:visited, .home-page nav li.home > a:link, .home-page nav li.home > a:visited {
    color: #fd831e;
    background: url(/images/header_rollover.png) no-repeat;
    background-position: center top;
}
nav ul li > a:link:hover, nav ul > li > a:visited:hover {
    background: url(/images/header_rollover.png) no-repeat;
    background-position: center top;
}
nav .bars {background: none !important;}
nav ul li ul a:link:hover, nav ul li ul a:visited:hover {background: none;}


/*Truncate long titles*/
nav ul ul li div { -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 220px;}

.fa-chevron-right {pointer-events: none !important;}
/* Nested Menus */
nav ul li.hassub ul li.hassub i.fa-chevron-right {position: absolute; top: 17px; right: 10px; z-index: 1000 !important; color: rgba(255,255,255,0.81);}
nav ul ul ul {left: 100%; top: 0;}
nav ul ul li {float: left; width: 100%; height: 46px; margin: 0; border: 0; }

/*!* Home Page Hero *!*/
.home-page .hero { position: relative; height: 100vh;}
.home-page .hero .post-it * {font-family: 'Helvetica LT Std', sans-serif !important;}
.home-page .hero .post-it {
    position: absolute;
    z-index: 5;
    top: 245px;
    left: 44px;
    margin: 0;
    padding: 113px 40px 0 27px;
    width: 309px;
    height: 331px;
    background: url(/images/postit.png);
    background-repeat: no-repeat;
}
.home-page .hero .post-it p {font-size: 17px; letter-spacing: -1px; line-height: 22px; font-weight: bold; margin: 0 0 0.5em 0;}
.home-page .hero .post-it-text {height: 125px; overflow: hidden; position: relative; top: -9px; left: 12px;}
.home-page .hero .post-it .post-it-arrow {position: absolute; right: 39px; bottom: 60px;}

.home-page .hero-controls {position: absolute; width: 100%; text-align: center; margin: 0 auto; bottom: 60px; z-index: 100;}
.home-page .hero-toggle-circle {height: 18px; width: 18px; border-radius: 50%; background-color: #cccfd0; display: inline-block; margin: 0 10px; cursor: pointer;}
.home-page .hero-toggle-circle.active {background-color: #ca8b55;}


/*!* Home Page - Welcome *!*/
.home-page .welcome {bottom: 30px; position: absolute;}
.home-page .welcome .welcome-header-text {color: #810e33; font-size: 48px; font-weight: 600;}
.home-page .welcome .welcome-header-text:first-of-type {padding-top: 15px;}
.home-page .welcome .float-left {padding-left: 20px;}
.home-page .welcome .float-left img {position: absolute; width: 420px;}
.home-page .welcome .float-right {color: #810e33; padding-left: 45px; padding-top: 12.5px;}
.home-page .welcome .float-right p {text-align: justify; width: 94%;}
.home-page .welcome .float-right .btn {color: #1d7867; border: 1.5px solid #1d7867;}
.home-page .welcome .float-right .btn:hover {background: rgb(246, 223, 163);}
.home-page .welcome .float-right a:link, .home-page .welcome .float-right a:visited {text-decoration: underline;}


/*!* Home Page - Introduction *!*/
.home-page .introduction * {color: #fff; font-weight: 300; font-size: 19px;}
.home-page .introduction {padding-top: 80px; padding-bottom: 70px; background: #810b35;}
.home-page .introduction .float-right {width: 435px; padding: 0px 25px 0px 0px; position: relative;}
.home-page .introduction .introduction-text p {margin: 0; font-size: 19px; text-align: justify;
    line-height: 1.498;
    -moz-transform: matrix( 0.99975500542541,0,0,1,0,0);
    -webkit-transform: matrix( 0.99975500542541,0,0,1,0,0);
    -ms-transform: matrix( 0.99975500542541,0,0,1,0,0);
    margin-bottom: 1.75rem;
}
.home-page .introduction .languages-background {position: absolute; left: -561px; top: 25px; transform: scale(0.9);}
@media all and (min-width: 1075px) {
    .home-page .introduction .languages-background {position: absolute; left: -600px; top: 25px; transform: scale(1);}
}
@media all and (max-width: 650px) {
    .home-page .introduction .float-right {width: 100%; display: block; float: none; padding: 0 15px;}
    .home-page .introduction .languages-background {transform: scale(1.1); width: 90%; display: block; margin-left: auto; margin-right: auto; margin-bottom: 50px; position: static;}
    .home-page .introduction {padding-top: 60px; padding-bottom: 40px;}
}


/*!* Home Page - Values *!*/
.home-page .values {padding-top: 110px; padding-bottom: 110px;}
.home-page .values .left, .home-page .values .right {display: inline-block; width: 49.5%;}
/*.home-page .values .value {width: 49.5%; display: inline-block; text-align: center; height: 220px; vertical-align: bottom; position: relative;}*/
.home-page .values .value {width: 237.89px; display: inline-block; text-align: center; height: 220px; vertical-align: bottom; position: relative;}
.home-page .values .value h3 {font-size: 22px; margin-top: 33px; font-weight: bold; font-family: 'Blokletters Viltstift', sans-serif; color: #981f1f;}
.home-page .values .value .value-img {height: 145px; width: 100%; vertical-align: middle;}
.home-page .values .value .value-img img {vertical-align: middle;}
.home-page .value.respect .value-img img {padding-top: 40px;}
.home-page .value.respect .value-img img.rollover {position: absolute; top: -81px; left: 1px;}
.home-page .value.achievement .value-img img.rollover {position: absolute; top: -25px; left: 28px;}
.home-page .value.diversity .value-img img {padding-top:33px;}
.home-page .value.belonging .value-img img {padding-top: 16px;}
.home-page .value.belonging .value-img img.rollover {position: absolute; top: -36px; left: 4px;}
.home-page .value.diversity .value-img img.rollover {position: absolute; top: -38px; left: -1px;}
.home-page .values .value-wrapper {display: inline-block;}

/* Rollovers*/
.home-page .values .value.respect:hover .default {display: none;}
.home-page .values .value.respect:hover .rollover {display: block !important;}
.home-page .values .value.achievement:hover .default {display: none;}
.home-page .values .value.achievement:hover .rollover {display: block !important;}
.home-page .values .value.belonging:hover .default {display: none;}
.home-page .values .value.belonging:hover .rollover {display: block !important;}
.home-page .values .value.diversity:hover .default {display: none;}
.home-page .values .value.diversity:hover .rollover {display: block !important;}
/*.home-page .values .value.respect:hover .default {opacity: 0.7;}*/
/*.home-page .values .value.respect:hover .rollover {display: block !important; opacity: 0.5;}*/
/*.home-page .values .value.achievement:hover .default {opacity: 0.7;}*/
/*.home-page .values .value.achievement:hover .rollover {display: block !important; opacity: 0.5;}*/
/*.home-page .values .value.belonging:hover .default {opacity: 0.7;}*/
/*.home-page .values .value.belonging:hover .rollover {display: block !important; opacity: 0.5;}*/
/*.home-page .values .value.diversity:hover .default {opacity: 0.7;}*/
/*.home-page .values .value.diversity:hover .rollover {display: block !important; opacity: 0.5;}*/


@media all and (max-width: 1020px) {
    .home-page .values { padding-top: 70px; padding-bottom: 70px; }
    .home-page .values .left, .home-page .values .right {display: block; width: 100%;}
    .home-page .values .right {margin-top: 30px;}
    .home-page .values .value-wrapper {display: inline-block; width: 49.5%; text-align: center;}
}

@media all and (max-width: 600px) {
    .home-page .values .inner {padding-left: 0px !important; padding-right: 0px !important;}
}

@media all and (max-width: 480px) {
    .home-page .values { padding-top: 50px; padding-bottom: 50px; }
    .home-page .values .right {margin-top: 0;}
    .home-page .values .value-wrapper {width: 100%;}
    .home-page .values .respect {margin-bottom: 50px;}
    .home-page .values .achievement {margin-bottom: 30px;}
    .home-page .values .diversity {margin-bottom: 50px;}
    .home-page .values .belonging {margin-bottom: 0;}
}








.home-page .stem {padding-top: 60px; padding-bottom: 60px; padding-left: 15px; padding-right: 15px; background: #ffda99;}
.home-page .stem h2,
.home-page .stem p {color: #810e33;}
.home-page .stem h2 {font-weight: 900; font-size: 52px; }
.home-page .stem p {font-size: 20px; line-height: 33px; margin-top: 20px; padding-bottom: 7px; text-align: justify;}
.home-page .stem .float-left {width: 415px;}
.home-page .stem .btn {width: 80%; max-width: 287px; letter-spacing: 2px; font-size: 21px; background-color: #810e33 !important; color: #fff !important;}
.home-page .stem .float-right {text-align: center; width: 515px; position: relative; top: 69px; left: -15px;}
.home-page .stem .float-right img {margin: 15px 20px; vertical-align: middle;}
.home-page .stem .btn:hover {background: #fff !important; color: #810e33 !important;}
@media all and (max-width: 1010px) {
    /*.home-page .partnership .float-right img {max-width: 100%; position: absolute; top: 0; bottom: 0; margin: auto; }*/
    /*.home-page .partnership .float-right {width:calc(100% - 445px); position: relative; height: 259px; }*/
    .home-page .stem .float-right {display: none;}
    .home-page .stem .float-left {width: 100%;}
}
@media all and (max-width: 880px) {
    .home-page .stem .float-left {display: block; float: none; margin: 0 auto;}
    .home-page .stem .float-left img {display: block !important; margin-top: 50px; max-width: 100%; margin-left: auto; margin-right: auto;}
    .home-page .stem .float-right {display: none;}
}
@media all and (max-width: 600px) {
    .home-page .stem .float-left {width: 100% !important;}
}
@media all and (max-width: 500px) {
    .home-page .stem {padding-top: 50px; padding-bottom: 50px;}
}
@media all and (max-width: 380px) {
    .home-page .stem h2 {font-size: 46px;}
    .home-page .stem .btn {max-width: 100%;}
}

/*!* Home Page - Links *!*/
.home-page .links {background: #f8f6f6; padding: 65px 0 65px;}
.home-page .links .inner {text-align: center;}
.home-page .links .link-wrapper {display: inline-block; width: 32.5%; text-align: center;}
.home-page .links .link {width: 248px; height: 243px; display: inline-block; vertical-align: top; border-radius: 50%; background: black; transition: transform 0.2s ease;}
.home-page .links .link .link-name {padding-bottom: 25px; color: #fff; font-size: 35px; line-height: 243px; text-decoration-color: #fff !important;}
.home-page .links .link .link-name span {font-weight: bold; text-shadow: 1.5px 1px rgba(0, 0, 0, 0.7)}
.home-page .links a:link:hover .link {-webkit-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1);}
.home-page .links .dates {background: linear-gradient(rgba(152, 31, 31, 0.65), rgba(152, 31, 31, 0.65)), url(/images/link_calendar.jpg); background-size: cover; background-repeat: no-repeat;}
.home-page .links a:link:hover .link.dates {background: rgb(152, 31, 31) !important;}
.home-page .links .parentinformation {background: linear-gradient(rgba(169, 211, 122, 0.65), rgba(169, 211, 122, 0.65)), url(/images/link_parentinfo.jpg); background-size: cover; background-repeat: no-repeat;}
.home-page .links a:link:hover .link.parentinformation {background: rgb(169, 211, 122) !important;}
.home-page .links .policies {background: linear-gradient(rgba(91, 207, 243, 0.60), rgba(91, 207, 243, 0.60)), url(/images/link_policies.jpg); background-size: cover; background-repeat: no-repeat;}
.home-page .links a:link:hover .link.policies {background: rgb(91, 207, 243) !important;}
@media all and (max-width: 880px) {
    .home-page .links {padding: 75px 0 75px;}
    .home-page .links .link-wrapper {display: block; width: 100%; margin-bottom: 85px;}
    .home-page .links .link-wrapper .link {-webkit-transform: scale(1.125);-ms-transform: scale(1.125);transform: scale(1.125);;}
    .home-page .links a:link:hover .link {-webkit-transform: scale(1.20);-ms-transform: scale(1.20);transform: scale(1.20);}
    .home-page .links .link-wrapper:last-of-type {margin-bottom: 0;}
}


/*!* Home Page - Skoolbag *!*/
.home-page .skoolbag {padding: 85px 0; background: url(/images/skoolbag_background.png); background-repeat: no-repeat; background-position: center center; background-size: cover;}
.home-page .skoolbag iframe {margin-top: 20px;}
.home-page .skoolbag .float-right {width: 50%; margin-right: 50px; min-width: 484px;}
.home-page .skoolbag .float-left {width: 43%; text-align: center;}
.home-page .skoolbag .skoolbag-text p {font-size: 20px; text-align: justify;}
.home-page .skoolbag .skoolbag-text {padding: 0 50px 20px;}
.home-page .skoolbag-button {padding: 0 34px;}
@media all and (max-width: 985px) {
    .home-page .skoolbag .float-left {width: 40%;}
    .home-page .skoolbag .float-right {margin-right: 0;}
}
@media all and (max-width: 860px) {
    .home-page .skoolbag {padding: 45px 0 55px;}
    .home-page .skoolbag .float-left, .skoolbag .float-right {float: none;}
    .home-page .skoolbag .float-left {width: auto !important; margin-bottom: 40px;}
    .home-page .skoolbag .float-right {width: 85%; margin: 0 auto !important;}
}
@media all and (max-width: 650px) {
    .home-page .skoolbag .float-left, .home-page .skoolbag .float-right {width: 100%; min-width: inherit;}
    .home-page .skoolbag .skoolbag-text {padding: 0 27.5px 25px; }
    .home-page .skoolbag .skoolbag-button {padding: 0 1em;}
    .home-page .skoolbag p {text-align: justify;}
    .home-page .skoolbag span {font-weight: 300 !important;}
}
@media all and (max-width: 510px) {
    .home-page .skoolbag .skoolbag-button #parent {display: none;}
    .home-page .skoolbag .skoolbag-button {max-width: 90%;}

}
@media all and (max-width: 420px) {
    .home-page .skoolbag .skoolbag-text {padding: 0 10px 25px;}
    .home-page .skoolbag iframe {width: 100% !important;}
}
@media all and (max-width: 370px) {
    .home-page .skoolbag .skoolbag-button #skoolbag {display: none;}
}




/* Sitemap */
.sitemap a.root {font-weight: bold; font-size: 28px; margin-top: 15px;}
.sitemap a.root:first-of-type {margin-top: 0px;}
.sitemap a:link, .sitemap a:visited {float: left; clear: left; width: auto; min-width: 150px; line-height: 1.4em; text-decoration: none !important;}


/* Sub Page */
.sub-page .main {position: relative;}
.sub-page .main .middle {position: relative; z-index: 2; float: right; width: 675px; min-height: 600px; margin: 0 0 0 60px; padding: 63px 0 65px 0; font-size: 18px; line-height: 25px; color: #393939;}
.sub-page .main .left {position: relative; z-index: 2; width: 291px; padding-top: 65px; margin-right: 13px;}
@media all and (min-width: 1030px) {
    .sub-page .main .left {margin-right: 27px;}
}
.sub-page .main h1:first-of-type {font-size: 48px !important;}
.sub-page h1 {text-transform: none; font-size: 44px !important }
.sub-page h2 {line-height: 50px; font-size: 31px !important;}
.sub-page .main .middle h1 {font-size: 35px; font-weight: 600; line-height: 1em; margin: 0 0 40px 0; color: #810e33;}
.sub-page .main .middle li {list-style-type: disc !important; list-style-position: inside;}
.sub-page .main .middle a:link, .sub-page .main .middle a:visited {color: #810e33; text-decoration: underline;}
.sub-page .main .left ul.subnav {margin: 0 0 65px 10px; list-style: none; max-width: 25vw; font-size: 20px; text-align: left;}
.sub-page .main .left ul.subnav li {display: block; width: 100%; text-align: left;}
.sub-page .main .left ul.subnav li:hover {background: rgba(255,255,255,0.1);}
.sub-page .main .left ul.subnav li.second span {position: relative; left: 20px;}
.sub-page .hero {background-size: cover; background-position: center center; background-repeat: no-repeat; height: 445px !important;}
@media all and (min-width: 1050px) {
    .sub-page .hero {height: 485px !important;}
}
@media all and (min-width: 1300px) {
    .sub-page .hero {height: 620px !important;}
}
/*@media all and (min-width: 1500px) {*/
/*.sub-page .hero {height: 725px !important;}*/
/*}*/
.sub-page .left-bg {background-color: #810b32; position: absolute; left: 0px; top: 0px; right: 50%; bottom: 0px; margin: 0 220px 0 0;}
.sub-page .main .left * {font-family: 'Neo Sans Std', sans-serif !important;}
.sub-page .main .left a:link, .sub-page .main .left a:visited {text-align: left; font-weight: 500; color: #fff;}
.sub-page .main .left ul.subnav li.title {margin-bottom: 20px; font-size: 28px;}
.sub-page .main .left ul.subnav li.title span {font-weight: bold;}
.sub-page .main .left ul.subnav li.title a:link {text-decoration: none !important;}
.sub-page .main .left ul.subnav li {padding: 7px 15px 7px 20px; position: relative; left: 1px; margin-bottom: 5px;}
.sub-page .main .left ul.subnav li.title a:link, .sub-page .main .left ul.subnav li.title a:visited {font-size: 27px; font-weight: 600; text-transform: uppercase;}
.sub-page .main .left ul.subnav li:hover a:link, .sub-page .main .left ul.subnav li:hover a:visited {text-decoration: underline;}
.sub-page .main .left ul.subnav li.on a:link, .sub-page .main .left ul.subnav li.on a:visited {font-weight: 900;}
.sub-page .main .left ul.subnav li.on {background: #e8bc35 !important;}
.sub-page .main .left ul.subnav li.on span {color: #fff;}
.sub-page .subnav-links {margin-bottom: 355px;}
.sub-page .subnav-links a:link,
.sub-page .subnav-links a:visited {
    float: none;
    margin-bottom: 13px;
    position: relative;
    left: 20px;
}
.sub-values-wrapper {height: 0;}
.sub-values {position: relative; top: -277px; width: 245px; left: 28px;}
.sub-values span {display: block; color: #fd9b4a; font-family: 'Blokletters Potlood', cursive !important; font-size: 37px !important;}



/* Sub Page - Content -- Shared with content editor */
.sub-page .middle img {max-width: 100%;}
.sub-page .middle h1,
.sub-page .middle h2,
.sub-page .middle h3,
.sub-page .middle h4,
.sub-page .middle ul,
.sub-page .middle p,
.sub-page .middle span {font-family: 'Raleway', sans-serif;}

.sub-page .middle h1,
.sub-page .middle h2,
.sub-page .middle h3,
.sub-page .middle h4{margin: 24px 0 6px 0; line-height: 1.35em;}
.sub-page .middle h1, .sub-page .middle h2, .sub-page .middle h3, .sub-page .middle h4, .sub-page .middle h5 { color: #810e33;}
.sub-page .middle li {color: #303030;}
.sub-page .middle td {padding: 10px 20px;}
.sub-page .middle h1 {font-size: 44px;}
.sub-page .middle h2 {clear:left; font-size: 32px !important;}
.sub-page .middle h3 {clear:left; font-size:22px !important;}
.sub-page .middle h4 {clear:left; font-size:18px;}
.sub-page .middle ul,
.sub-page .middle ol,
.sub-page .middle p {clear:left; margin:0 0 1em 0; font-size:18px; line-height:25px; font-weight: 500;}
.sub-page .middle strong, .sub-page .middle b, .sub-page .middle em {font-weight: bold;}

.sub-page .middle a.button {padding: 20px 14px; border: 3px solid #810e33 !important; color: #810e33 !important; text-decoration: none !important;}
.sub-page .middle a.button:hover {background: #fff3d4 !important;}
.sub-page .middle a.button:hover a:link {font-weight: 600 !important;}
.sub-page .middle a.button a:link, .sub-page .middle a.button a:visited {text-decoration: none !important;}
.sub-page .middle a.button small {padding-left: 50px;}
.sub-page .middle th {padding-right: 20px;}




/* Footer */
footer {position: relative; background: #810e33 !important; padding-top: 30px; padding-bottom: 20px; color: #fff; padding-right: 15px !important; padding-left: 15px !important; background: url(/images/footer-background.png); background-size: cover; background-repeat: no-repeat;}
.sub-page footer {background: #2a2a2a !important;}
footer .inner {position: relative; z-index: 2;}
footer .footer-column {display: inline-block; width: 32%; vertical-align: top;}
footer a:hover {text-decoration: underline;}
footer, footer p, footer a:link, footer a:visited {font-family: 'Helvetica LT Std', sans-serif; font-size: 13px; font-weight: 300; color: rgba(255,255,255,0.875); }
footer .decd {display: block; margin-bottom: 29px; ; }
footer .neals {position: relative; top: -15px;}
footer .cc {position: relative; left: -21px; top: -12px;}
footer .logos {margin-bottom: 8px;}
footer .sagov {position: relative; top: -5px; margin-right: 30px;}
footer .center {width: 250px; margin: 0 auto; text-align: center;}
footer .center div a:first-of-type img {margin-right: 50px;}
footer .center img {margin-bottom: 22.5px; width: 95px;}
footer .creativecommons {position: relative; top: -7px;}
footer .footer-column:last-of-type {width: 300px; text-align: right; float: right;}
footer .footer-column:last-of-type p {margin: 0; padding: 0; line-height: 15px;}
footer .nbsp-spacer {font-size: 8px !important; line-height: 8px !important;}
footer .home-page .values .values-large {display: none;}



/* Slide Nav */
.slide-nav {position: fixed;z-index: 102;top: 0;right: 0;width: 375px; max-width: 100%;height: 100%; text-align: left; overflow-y: auto;overflow-x: hidden;margin: 0 0 0 100%;-webkit-box-shadow: 0px 0px 5px 5px rgba(0,0,0,.1);box-shadow: 0px 0px 5px 5px rgba(0,0,0,.1);background: #810e33;border-left: 10px solid rgba(0,0,0,.2);}
.slide-nav a {color: #fff;}
/*.ie10 #slide-nav-overlay {display: none !important;}*/
#slide-nav-overlay {position: fixed;width: 100vw;height: 100%;top: 0; left: 0;background: rgba(0, 0, 0, 0.6);opacity: 0;pointer-events: none;z-index: 95;-webkit-transition: opacity .7s;-o-transition: opacity .7s;transition: opacity .7s;}
#slide-nav-overlay.display-block {pointer-events: all;}

/*!*IE 9*!*/
.ie9 + #slide-nav-overlay {display: none !important;}
/*IE 10*/
html[data-useragent*='MSIE 10.0'] #slide-nav-overlay {
    display: none !important;
}

.slide-nav a {display: block;}
.slide-nav ul li {display: block; padding-bottom: 10px;}
.slide-nav .hide-mobile {display: block;}
.slide-nav ul .fa {display: none;}
.slide-nav ul li:hover {border-bottom: none;}
.slide-nav ul a:hover {border-bottom: 3px solid #fac011;}
.slide-nav a:link,
.slide-nav a:visited {float: left;width: 100%;margin: 0;padding: 6px 20px;color: #fff;text-decoration: none;}
.slide-nav a:hover,
.slide-nav a:active {background: rgba( 255,255,255, .2 );}
.slide-nav .small a:link,
.slide-nav .small a:visited {padding: 8px 20px;font-size: 80%;color: rgba( 255,255,255, .75 );}
.slide-nav a.depth-1, .slide-nav a.depth-2, .slide-nav a.depth-3 {text-transform: inherit !important; padding: 8px 20px !important;}
.slide-nav a.depth-0 {font-weight: bold; font-size: 20px;}
.slide-nav a.depth-1 {padding-left: 40px !important;font-size: 17px;}
.slide-nav a.depth-2 {padding-left: 65px !important;font-size: 17px;}
.slide-nav .close {position: absolute;z-index: 103;right: 0px;top: 0px; width: 55px !important; padding: 10px;color: #000;font-size: 30px;font-weight: 700;text-decoration: none; height: 62px;}

@media all and (max-width: 1100px) {
    .panel .inner {width: 100%; padding-left: 15px; padding-right: 15px;}
    header.panel .inner {width: calc(98.5vw) !important; padding-left: 0 !important; padding-right: 0 !important;}
    .sub-page .left {width: 265px;}
    .sub-page .main .left ul.subnav {margin-left: 10px;}
}

@media all and (max-width: 1020px) {
    header.panel .inner {width: calc(95vw) !important; padding-left: 0 !important; padding-right: 0 !important;}
    header nav {margin-top: 4px;}
    header .float-right {background: none;}
    .sub-page .main .middle {width: 100%; min-height: 400px; padding: 60px 30px; margin: 0;}
    .sub-page .main .left {width: 100%; background-color: #810e33; padding: 35px 25px; margin: 0; float: right; position: static !important;}
    .sub-page .main .left ul.subnav {margin-top: 0; margin-left: 0; margin-right: 0; max-width: 100vw; }
    .sub-page .left-bg {display: none;}
    .sub-page ul.subnav li {text-align: left !important;}
    .sub-page ul.subnav li.title {padding-bottom: 21px !important;}
    .sub-page .main .inner {padding-right: 0 !important; padding-left: 0 !important;}



    header .float-right {width: 100%; float: none; display: block; height: 131px !important;}
    /*header .school-logo {width: 100%; text-align: center;}*/
    .home-page header .school-name {display: none !important;}

    nav ul li a:link, nav ul li a:visited {height: 50px; line-height: 50px;}
    /*nav {margin-top: 0 !important; position: relative; top: -4px;}*/
    /*nav ul.normal {position: relative; text-align: center !important;}*/
    nav ul li {display: inline-block !important; float: none;}

    .sub-values { width: auto; left: 0; text-align: center;}
    .sub-page .subnav-links {margin-bottom: 295px; text-align: center;}
    .sub-page .subnav-links a:link, .sub-page .subnav-links a:visited {left: 0;}


}



@media all and (max-width: 1020px) {
    .show-mobile {display: block}
    .hide-mobile {display: none !important;}

}

@media all and (max-width: 960px) {
    footer .footer-column {display: block; width: 100%;}
    footer .decd {margin: 0 auto; max-width: 100%;}
    footer .footer-column:last-of-type {text-align: center; width: 100%;}
    footer .footer-column:first-of-type {margin-bottom: 40px;}
    footer .footer-column:nth-of-type(2) {margin-bottom: 10px;}

    footer .copyright-left {display: none !important;}
    footer .copyright-right {display: block !important;}

    footer p {line-height: 21px !important;}
}




/*@media all and (max-width: 700px) {*/
    /*header .menu-item.home {display: none !important;}*/
/*}*/

@media all and (max-width: 830px) {
    /*.home-page .hero {height: 450px !important; top: 0 !important;}*/
    /*.home-page .hoist {top: 0 !important;}*/
    /*header .panel {height: 250px;}*/
    /*header .header-top {display: block; width: 100%; text-align: center;}*/
    /*header .header-top .school-logo {display: block; margin: 0 auto; float: none;}*/
    /*header .header-top .header-links {display: block; margin: 1rem auto; float: none; position: static;}*/
    /*header .header-links a:link, header .header-links a:visited {float: none;}*/
    /*header .inner {top: 10px;}*/
    /*header .school-logo  img {position: static;}*/
    .home-page .post-it {display: none;}
    header .header-links {display: none;}
    header .inner {top: 0px;}


    .home-page .hero { height: 450px !important;}
    .home-page .panel.hoist {top: 0;}
    .home-page header .panel {height: 172px;}
    /*.home-page .hero .background-overlay {position: absolute; height: 450px; width: 100%; background: rgba(255,255,255,0.8); z-index: 2;}*/
    /*.home-page .hero .logo-vertical {display: block !important; z-index: 10; height: 450px; position: absolute; width: 100%; margin: 0 auto;}*/
    /*.home-page .hero .logo-vertical img {*/
        /*margin: 0 auto;*/
        /*width: 200px;*/
        /*vertical-align: middle;*/
        /*position: relative;*/
        /*!*top: calc(225px - 423px / 2);*!*/
        /*top: 100px;*/
        /*display: block;*/
        /*left: 12px;*/
    /*}*/
    /*.home-page .hero-controls {bottom: 19px;}*/
    /*.home-page header.header.panel {background-color: rgba(255,255,255,0) !important;}*/
    /*.home-page header img {display: none !important;}*/


    header .menu-item {display: none !important;}
    header .menu-item:nth-of-type(2) {display: inline-block !important;}
    header .school-logo img {width: 190px; top: -10px;}
    header .inner {top: 13.5px;}
    nav ul.normal {text-align: center;}
    .school-logo img {left: 0;}
    .school-logo {text-align: center; float: none !important;}
    header .menu-item:nth-of-type(3) {display: inline-block !important;}
    .sub-page .hero {max-height: 325px !important;}

    footer .fb-like {display: block !important; float: none !important; left: 0 !important; text-align: center; margin-bottom: 10px;}



    /*.home-page .hero .home-logo-small {display: block !important; max-width: 100%;}*/
}
@media all and (max-width: 530px) {
    header .home {display: none !important;}
}

@media all and (max-width: 385px) {
    .home-page .hero .school-name {bottom: 44px;}
    header .menu-item:nth-of-type(2) {display: none !important;}

}

@media all and (max-height: 535px) {
    .home-page .hero .post-it {display: none !important;}
}


/* Calendar */
@media (max-width: 600px) {
    .calendar-full {
        display: none;
    }
    .responsive-iframe-container { padding-bottom: 150%; }
}
@media (min-width: 600px) {
    .calendar-agenda {
        display: none;
    }
}

@media (max-width: 425px) {
    .sub-page .main .middle {
        padding: 30px 15px;
    }
}