*{
         box-sizing:border-box; 
     -moz-box-sizing:border-box; 
     -webkit-box-sizing:border-box; 
     -ms-box-sizing:border-box;
}
body{
    margin:0;
    font-size:62.5%;
}

a{
    text-decoration: none;
    font-family: 'Work Sans', sans-serif;
}

a[href^="tel:"] {
  color: #1F4877;
  text-decoration: none;
}

.content a{color:#264C79;}

.content a:hover{color:#A94C3C;}

footer a[href^="tel:"] {
  color: #FFF;
  text-decoration: none;
}

h1, h2, h3, h4, li, blockquote, table{
    font-family: 'Work Sans', sans-serif;
}

p, .content li, .content table tr td{
    font-size: 1.3em;
    font-family: 'Work Sans', sans-serif;
    color: #6F6F6F;
}

.clear::before{display: block; clear: both; content: "";}

header{
    display: block;
    width: 100%;
    height: 200px;
    background-color: #FFF4D7;
    padding: 0 2%;
}

#logo{
    float: left;
    max-width:185px;
    margin-top:20px;
}

.handle{
display:none;
}

#topNav{
    float:right;
    font-size: 1.5em;
    font-weight: 400;
    margin-top:25px;
    margin-bottom: 10px;
}

#mainNav{
    display: table;
    clear:right;
    float:right;
    font-size: 1.5em;
    font-weight: 400;
}

#topNav nav ul, #mainNav nav ul{
    padding-left: 0;
}

#topNav nav ul li{
    display: table-cell;
    text-align: center;
    padding:0 20px;
}

#topNav nav ul li a, #topNav a{
    color:#1F4877;
    -webkit-transition: all 0.25s ease-in;
    -moz-transition: all 0.25s ease-in;
    -o-transition: all 0.25s ease-in;
    transition: all 0.25s ease-in;
}

#topNav nav ul li a:hover, #topNav a:hover, #mainNav nav ul li a:hover{
    color:#A94C3C;
}

#topNav p{
    text-align: center;
    color: #A94C3C;
    font-size: inherit;
    font-weight: 900;
}

#topNav nav ul, #mainNav nav ul{
    padding-left: 0;
    list-style-type: none;
}

#mainNav nav ul li{
    display: table-cell;
    text-align: center;
    padding-left: 90px;
}

#mainNav nav ul li:first-child{padding-left:0;}

#mainNav nav ul li a::after{
    content: '';
    display: block;
    height: 3px;
    width: 0;
    background: transparent;
    transition: width .5s ease, background-color .5s ease;
}

#mainNav nav ul li:hover a::after{
    width:100%;
    background: #1F4877;
}

#mainNav nav ul li a{
    color:#1F4877;
    font-weight: 900;
    font-size: 1.1em;
    -webkit-transition: all 0.25s ease-in;
    -moz-transition: all 0.25s ease-in;
    -o-transition: all 0.25s ease-in;
    transition: all 0.25s ease-in;
}

#mainNav nav ul li.current a{color:#A94C3C;}
#mainNav nav ul li.current a::after{
    width:100%;
    background: #1F4877;
}
.hero{
    display: table;
    table-layout: fixed;
    width: 100%;
    height: 100%;
    max-height: 480px;
    background-color: #FFF4D7;
}

.heroText{
    display: table-cell;
    font-family: 'Work Sans', sans-serif;
    padding-left:5%;
    width:50%;
    vertical-align: middle;
    padding-right: 40px;
}

.heroText h2{
    font-size: 4vw;
    font-weight: 600;
    color:#F8A41B;
    margin: 0;
}

.heroText p{
    font-size: 1.2vw;
    color:#264C79;
    margin-left: 20px;
    font-weight: 600;
}

.heroText a{
    display: inline-block;
    background-color: #A94C3C;
    border-radius: 10px;
    color:#FFF;
    font-size: 1.3rem;
    font-weight: 400;
    padding:12px 20px;
    float: right;
    margin-top:10px;
    -webkit-transition: background 0.25s ease-in;
    -moz-transition: background 0.25s ease-in;
    -o-transition: background 0.25s ease-in;
    transition: background 0.25s ease-in;
}

.heroText a:hover{
    background-color:#1F51A4;
}

.headerKids{
    display: table-cell;
    background-image: url(/images/uploads/site/header-bck.svg);
    background-repeat: no-repeat;
    background-position: bottom;
    vertical-align: bottom;
    width:45%;
}

.headerKids img{width:100%;max-width:35%;display: inline-block;padding-bottom: 14%;}
.headerKids img:nth-child(1){margin-left:80px}

#welcome{
    display: table;
    table-layout: fixed;
    width: 100%;
    height:380px;
    background-color:#FFCD36;
}

.welcomeImg{
    display: table-cell;
    width:50%;
    text-align: center;
    background-image: url(/images/uploads/site/welcome-bck.svg);
    background-repeat: no-repeat;
    background-position: center bottom;
}

.welcomeImg img{max-height:500px; vertical-align: bottom;}

.welcomeTxt{
    display: table-cell;
    width:50%;
    vertical-align: middle;
}

.welcomeTxt h2{
    font-size: 2vw;
    color: #0E6E38;
    text-transform: uppercase;
    margin-top:0;
    margin-bottom: 8px
}

.welcomeTxt p, .welcomeTxt table{
    font-size: 1.55em;
    color:#264C79;
    font-weight: 900;
}

.welcomeTxt table th{
	display:none;
}

.welcomeTxt table td{
    padding-top:5px;
    padding-bottom:5px;
}

.welcomeTxt table td:nth-child(odd){padding-right:80px}


.heroInternal{
    width: 100%;
    height: auto;
    background-color: #FFF4D7;
    text-align: center;
    margin-top:-40px;
}

.heroInternal h1{
    display: inline-block;
    font-size:6em;
    font-weight: 600;
    color:#F8A41B;
    margin-right:80px;
    position: relative;
    right:30px;
}

.heroInternal img{max-width:200px;vertical-align: middle;position: relative;z-index: 1;right:20px;}


.content{
    background-color: #F8E6AF;
    padding:2%;
    position: relative;
    z-index: 2;
}

.content::after{content: "";display: block;clear:both;}
.content p, .content ul li, .content ol li, .content table tr td{font-size: 1.45em;}
.content img{border-radius: 50%;}
.content img.right{float:right;}
.content img.left{float: left;}
.content h2:nth-child(1){margin-top: 0;}
.content table tr td{padding: 5px;}
.content table td:nth-child(odd){padding-right:30px;padding-left:0;}
.content .col1 h2:nth-child(1){margin-top: 0;}
.content .col2 h2:nth-child(1){margin-top: 0;}
.content h2{font-size: 3.2em; margin-bottom: 5px;color: #264C79;}
.content h3{font-size: 2.9em; margin-bottom: 5px; color:#A94C3C;}
.content h4{font-size: 2.4em; margin-bottom: 5px; color:#A94C3C;}
.content ul li, .content ol li{padding:3px 0;}
.col1{
    float:left;
    margin-right:2%;
    width:48%;
    
}

.col2{width:48%;float:right;margin-left:2%}
.staffList{margin-top:50px;}
.staffList::before, .staffList::after{display: block; clear: both; content: "";}
.staffList h2{margin-bottom:0;}
.staffList h3{margin-top:0; margin-bottom: 0;font-size: 2em;}
.staffList img{margin-left: 30px;}
label {
    color: #454545;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    display: block;
    margin-bottom: 3px;
    font-size: 1.43em;
}

input, textarea {
    width: 100%;
    padding: 5px;
    font-size: 1.43em;
    font-family: Arial, Helvetica, sans-serif;
}

textarea{
height:150px;
}

.phone, .email{max-width:44%; width:100%; display:inline-block;}
.email{margin-right:10%;}

input[type="submit"], .btn-success {
    background-color: #1F4877;
    border:0;
    margin-top: 10px;
    color: white;
    text-transform: uppercase;
    font-size: 1.5em;
    cursor: pointer;
    width:auto;
    padding:10px 40px;
    -webkit-transition: all 0.25s ease-in;
    -moz-transition: all 0.25s ease-in;
    -o-transition: all 0.25s ease-in;
    transition: all 0.25s ease-in;
}

input[type="submit"]:hover, .btn-success:hover {
background-color: #F8A41B;
}

footer{
    clear:both;
    display: table;
    table-layout:fixed;
    width: 100%;
    background-color: #264C79;
    padding-bottom: 15px;
    position: relative;
    z-index: 2;
}

footer #fRight, footer #fmid, footer #fLeft{
    display: table-cell;
    width:33.333%
}

footer h4{
    color: #f8a41b;
    font-size: 2em;
    font-weight: 600;
    margin-bottom: 0;
}

footer p{color:#fff4d7;}


#fLeft{padding-left: 2%;}

#fmid{
    text-align: center;
    padding:0 2%;
}

#fmid a{
    display: inline-block;
    background-color: #f8a41b;
    padding:10px 40px;
    border-radius: 5px;
    color:#264C79;
    font-weight: 900;
    font-size:1.3em;
    -webkit-transition: background 0.25s ease-in;
    -moz-transition: background 0.25s ease-in;
    -o-transition: background 0.25s ease-in;
    transition: background 0.25s ease-in;
}

#fmid a:hover{
    background-color:#fff4d7;
}

#fRight{
    width:30%;
    text-align: right;
    padding-right: 2%;
}

#fRight a i{
	font-size: 2.5em;
    color: #FFF;
    display: inline-block;
    margin-left: 10px;
    vertical-align:middle;
}

#fRight a i:hover, #fRight a.trox:hover{
    color:#f8a41b;
}

#fRight a.trox{color: #FFF;}

@media only screen and (max-width: 795px) {
    
    header{height: auto;}
     #mainNav .responsive{
        width:100%;
        height:100%;
        opacity: 1;
        clear:right;
        float:none;
      }
    
    #mainNav{
        display: block;
        float: none;
    }

     #mainNav nav{
        opacity: 0;
    -webkit-transition: all 0.30s ease-in;
    -moz-transition: all 0.30s ease-in;
    -o-transition: all 0.30s ease-in;
    transition: all 0.30s ease-in;
     }
    
    #mainNav nav ul{
        display: none;
    }
    
       #mainNav nav.responsive ul{
        float:none;
           display: block;
        width:100%;
        text-align:center;
        margin:0;
        padding:10px 0;
         position: relative;
         z-index: 999;
         display: block;
         background-color:#015683;
     }

     #mainNav nav ul li{
        display: block;
        padding:20px 0;
        border-bottom: 1px solid  rgba(245, 245, 245, 0.3);
        width:100%;
        margin:0 auto;
     }
     #mainNav nav ul li:nth-last-of-type(1){
     border-bottom:0;
}
    
    #mainNav nav ul li a{
        color:#FFF;
        font-weight: normal;
    }

    #mainNav nav ul li a::after{
        display: none;
    }

    #mainNav nav ul li:hover a::after{
        display: none;
    }
   
	#mainNav nav ul li.current a{color:#F8A41B;}
    
    #handler span, #handler span:before, #handler span:after {
      cursor: pointer;
      border-radius: 1px;
      height: 5px;
      width: 35px;
      background: #1F4877;
      position: absolute;
      display: block;
      content: '';
    }
    #handler span:before {
      top: 20px;
      display:inline-block;
    }
    #handler span:after {
      bottom: -10px;
      display:inline-block;
    }

    #handler span, #handler span:before, #handler span:after {
      transition: all 500ms ease-in-out;
    }
    #handler.active span {
      background-color: transparent;
    }
    #handler.active span:before, #handler.active span:after {
      top: 0;
    }
    #handler.active span:before {
      transform: rotate(45deg);
    }
    #handler.active span:after {
      transform: rotate(-45deg);
    }
    
    #logo{
        float:none;
        display: block;
        margin:0 auto;
        padding-top:20px;
    }
    #topNav{
        float:none;
        display: block;
        margin:20px 0;
        text-align: center;
    }
    #handler{
        display: block;
        float: none;
        margin:35px auto 0 auto;
        width:35px;
        height:30px;
        padding: 0;
        z-index: 999;
        color: #1F4877;
        cursor: pointer;
    }
    .hero{
        display: block;
        width: 100%;
        height: 100%;
        max-height:inherit;
        background-color: #FFF4D7;
        padding-top: 20px;
    }

    .heroText{
        display: block;
        padding-left:0;
        width:100%;
        padding-right: 0;
        text-align: center;
    }

    .heroText h2{
        font-size: 3.2em;
        margin: 0;
    }

    .heroText p{
        font-size: 1.8em;
        color:#264C79;
        margin-left: 20px;
        font-weight: 600;
    }

    .heroText a{
        display:block;
        background-color: #A94C3C;
        float: none;
        margin-top:10px;
        margin-right:10px;
        margin-left:10px;
    }
   
    .headerKids{display: block;width: 100%;margin-top:30px;}
    .headerKids img:nth-child(1) {margin-left: 20px;}
    
    #welcome{display: block;height: auto;padding-bottom: 20px;}
    .welcomeImg {display: block;text-align: center;width: 100%;}
    .welcomeImg img {width: 50%;}
    
    .welcomeTxt{display: block; width: 100%;}
    .welcomeTxt h2{
    font-size: 5vw;
    text-align: center;
    margin-top:20px;
}
    .welcomeTxt table, .content table{display: block;}
    .welcomeTxt table tbody, .welcomeTxt table tr, .content table tbody, .content table tr{display:block;}
    .welcomeTxt table tr td, .content table tr td{
        display:block; 
        width:100%;
        position: relative; 
        text-align: center;
    }
    .welcomeTxt table td:nth-child(odd){padding-right:0;}
    
    .heroInternal{margin-top: auto;height:100%;}
    .heroInternal h1 {font-size: 9vw; display: block;margin:0; padding:20px 0;right: auto;}
    .heroInternal img{max-width:150px;position: relative;z-index: 1;right:0;margin:0 auto;}
    .col1, .col2{
        float: none;
        display: block;
        margin: 0;
        padding:0 2%;
        width:100%;
        text-align: center;
    }
	.col2{margin-top:30px;}
	.content{text-align:center;}
    .content img{display: block;margin-right:auto;margin-left: auto;width:100%;}
    .content img.right, .content img.left, .rte-img-chosen{float: none !important;margin-right: auto;margin-left: auto;}
    .content ul, .content ol{list-style-type: none;padding-left: 0;}
    .content table td:nth-child(odd){padding-right:0;}
    .staffList img{margin-left: 0;}
    iframe{width:100%;padding:15px;}
    .phone, .email{max-width:100%; display:block;}
	.email{margin-right:0;}
    footer{display: block;padding-top: 20px;}
    footer #fRight, footer #fmid, footer #fLeft{
        display: block;
        width: 100%;
        text-align: center;
    }
    #fRight{padding-right:0;margin-bottom: 2%;}
    #fLeft{padding-left:0;}
    #fRight a i{margin-left:auto;margin-right:auto;margin-top:8px;display:block;}
}