/* #Reset & Basics ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
body {min-width:320px; position:relative; overflow-x: hidden;}
ol, ul {list-style:none;}
table {border-collapse:collapse; border-spacing:0;}

/* #Basic Styles ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
:root{--blue:#0058a0; --white:#ffffff; --cream:#fff7d6; --red:#c70926; --slaty:#798897;}
body, html {font-size:16px; line-height:1.6em; font-family: 'Lato', sans-serif; font-weight:400; color:#444; -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%; height:100%;}
a, a:visited {text-decoration:none; outline:0; -webkit-transition:.3s all ease; -moz-transition:.3s all ease;  -o-transition:.3s all ease; transition:.3s all ease;}
p a, p a:visited {line-height: inherit;}
li {line-height:1.4em;}
h1, h2, h3, h4, h5, h6 { font-family: 'Oswald', sans-serif;}
strong {font-weight:bold;}
em {font-style:italic;}
small {font-size:85%;}
sup{font-size:75%; vertical-align: super;}
img {vertical-align:top; max-width:100%; height:auto;}
*, *:before, *:after{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.no-touchevents a[href^="tel:"] { pointer-events: none; cursor: text; }

/* #Misc ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.clearfix:before, .clearfix:after{content:'\0020'; display:block; overflow:hidden; visibility:hidden; width:0; height:0;}
.clearfix:after { clear: both;}
.clearfix {zoom: 1;}
.ie7 .clearfix {clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}
.clear {clear: both;}
.container {position: relative; min-height:100%; overflow:hidden;}
.text-center {text-align:center;}
.wraper {margin: 0 auto; position:relative; padding: 0; width:92%; max-width:1300px; z-index:1;}
.smallwrap {margin:0 auto; max-width:950px;}
.bigfont {font-size: 1.2em; line-height: 1.6em;}

.col12{width:48%;}
.col23{width:65.333%;}
.col13{width:30.666%;}
.col20{width:20%;}
.col80{width:80%;}

.row{display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex: 0 1 auto; -webkit-flex: 0 1 auto; flex: 0 1 auto; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap:wrap;}
.nowrap{-webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap:nowrap;}
.row-reverse{-webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction:row-reverse;}
.vcenter{align-self:center;}
.itemcenter{align-items:center;}
.justify{-webkit-justify-content:space-between; -ms-justify-content:space-between; justify-content:space-between;}
.contentcenter { -webkit-justify-content: center; -ms-justify-content: center; justify-content: center;}

.space-wrap{position:relative; padding-bottom:60px; padding-top:60px;}

/* #header ~~~~~~~~~~~~~~~~~~~~~~~~ */
.header { position:relative; background-color:var(--blue); z-index:5; padding-top:15px; padding-bottom: 15px;}
.logo { position: relative;}
.logo img {width:100px;}
.logo:after { content: ''; position: absolute; background: rgba(255, 255, 255, 0.75); top: -15px; left: -15px; right: -15px; bottom: -15px; z-index: -1; }

.home .header {position:absolute; width:100%; background-color: transparent;}
.home .logo img {width:150px; }
.home .logo:after {display:none;}

.banner {width:100%; position:relative;}
.banner img{width:100%;}
.video-box { z-index: 2; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0;}
.video-box:before { position: absolute; z-index: 1; left: 0; right: 0; top: 0; bottom:0; content: ""; background: rgba(0,0,0,.12);}
.videobtn { background-color: #fff; position: absolute; width: 80px; height: 80px; padding: 26px 33px; border-radius: 50px; z-index: 1; top: 0; left: 0; bottom: 0; right: 0; margin: auto; }
.videobtn:after { position: absolute; content: ""; top: 0; left: 0; bottom: 0; right: 0; border: 1px solid rgba(255, 255, 255, 1); border-radius: 100%; animation: circle-fade-inf 2s infinite ease-in-out; transition: all 0.5s; }
.videobtn:before { content: ""; display: block; width: 0; height: 0; border-style: solid; border-width: 14px 0 14px 21px; border-color: transparent transparent transparent #ac1f2e; }
.videobtn:hover:before { border-color: transparent transparent transparent #154681; }
@keyframes circle-fade-inf {
	0% { transform: scale(1); opacity: 1; }
	100% { transform: scale(1.4); opacity: 0; }
}

.boxes .col13 {position:relative; background-color: rgba(38,86,163,0.8); color:var(--white); border:5px solid var(--white); padding:40px 20px; margin-top: -90px;}
.boxes .col13 svg { fill: #fff; display: block; width: 60px; height: 60px; margin: 0 auto; }
.boxes .hotext { position: absolute; left: 0; right: 0; top: 0; bottom: 0; padding: 30px; background-color: #fff; color: #0058a0; font-size: 1.8em; line-height: 1.2em; opacity: 0; -webkit-transition:0.3s all ease; -moz-transition:0.3s all ease; transition:0.3s all ease;} 
.boxes .hotext:before { border-width: 3px 0 0 3px; left: 30px; top: 30px;}
.boxes .hotext:before, .boxes .hotext:after { content: ""; position: absolute; width: 40px; height: 40px; border-style: solid; border-color: #c70926;}
.boxes .hotext:after { border-width: 0 3px 3px 0; right: 30px; bottom: 30px;}
.boxes .col13:hover {box-shadow:0px 5px 10px 0 rgba(0, 0, 0, .07)}
.boxes .col13:hover .hotext {opacity:1;}

.subheading, .editor h2.subheading { color: var(--blue); font-size:1.2em; font-family: 'Lato', sans-serif;}
.welcome-wrap.editor h1, .staff-wrap.editor h1 {margin-bottom: 10px; border-bottom: 3px solid var(--red); display: inline-block; padding-bottom: 5px; color: var(--blue); font-weight: 600;}

.feature-wrap .row > div {width:24%; position: relative; overflow: hidden;}
.feature-wrap .row > div svg { fill:#fff; display: block; width:44px; height:44px; margin: 0 auto; }
.feature-wrap > div .text { position: absolute; background-color: rgba(38,86,163,0.8); padding: 20px; min-height: 180px; color: var(--white); bottom:-90px; line-height: 1.2em; cursor: pointer; width: 100%; -webkit-transition: 0.3s all ease; -moz-transition: 0.3s all ease; transition: 0.3s all ease; }
.feature-wrap .text .content { position: relative;}
.feature-wrap .text p {font-size: .85em; position: absolute; top: 0; line-height: 1.3em;}
.feature-wrap .row > div:hover .text { bottom:-30px;}

.members { margin-top:30px; margin-bottom:30px; }
.members > div {width:15.66%; position:relative;}
.members > div img {border:3px solid var(--slaty); font-size:1.2em; line-height: 1em;}
.editor .members h4 {margin-bottom:0; color:var(--red);}
.members .text { font-size: .9em;}
.staff-in {margin-top:0;}
.staff-in > div {width:16.66%; padding:10px;}

.newsletter { justify-content:center; background-color: var(--cream); }
.newsletter__logo { max-width:10em; width: 100%;}
#nav-topmenu .newsletter__logo { max-width: 4em; }
.newsletter__text { margin: 0 1em;}

.footer {border-top: 1px solid #aaa; color: var(--white); background-color: var(--blue); padding-top:15px;}
.footer .address h5 {color: var(--cream); font-size: 1.3em; margin-top:10px;}
.footer .contact a { color: var(--white); display: block;}
.footer .contact a:hover {color: var(--cream);}
.footer .contact svg { width: 20px; height: 20px; fill: #fff; display: inline-block; margin-right: 7px; vertical-align: middle;}
.footer .social a {padding: 5px; border-radius: 50%; width: 50px; height: 50px; display: inline-block; border: 3px solid transparent;}
.footer .social a:hover { border-color: var(--cream);}
.footer .social svg { width:100%; height: 100%; fill: #fff;}
.footer .accreditation img { width:120px; padding:0 10px;}
.footer .accreditation span.wasclogo img { width: 200px;}
.copyright { width: 100%; line-height: 22px; border-top: 1px solid rgba(255, 255, 255, 0.2); margin-top:15px; padding-top: 15px; padding-bottom: 15px; font-size:0.9em;}
.copyright span {display: inline-block; padding: 0 10px; opacity: 0.3;}

.editor h1 {font-size:2.2em; line-height:1em; margin-bottom:20px; }
.editor h2 {font-size:1.5em; margin:15px 0;}
.editor h3 {font-size:1.4em; margin:15px 0;}
.editor h4 {font-size:1.3em; margin:15px 0;}
.editor h5 {font-size:1.1em; margin:15px 0;}
.editor ul {margin:20px 0 20px 5px;}
.editor ul li ul {margin: 10px 0 15px 5px;}
.editor ul li {background:url(//dwscbcy9jc8hm.cloudfront.net/sites/57/comfy/cms/files/3836/files/original/dot.png) 0 9px no-repeat; padding:0 0 0 17px; margin-bottom:8px; display:block;}
.editor ol {margin:20px 0 20px 10px;}
.editor ol li {padding:0px 0 6px 0px; list-style-type: decimal; margin-left:15px;}
.editor table {margin:10px 0; font-size:.9em; color:#333; background:#fff;}
.editor table th {padding:5px; text-align:left; font-size:1em; background: var(--blue); border: 1px solid #4177d4; color:#fff; font-weight:700;}
.editor table td {padding:5px; text-align:left; border:1px solid #bad3ff;}
.editor table tr:nth-child(2n+1) td {background-color:#f7f7fb;}
.editor a {color:#132a55; text-decoration:none;}
.editor a:hover {color:#ed1b2d;}
.editor p {margin-bottom:15px;}
.editor p:last-child {margin-bottom:0;}
.editor hr {clear:both; font-size:1px; line-height:1px; height:1px; margin:30px 0; border:0px; border-top:2px solid #e9e8f7;}
.fulltable {width:100%;}
.fulltable caption { font-size: 1.2em; padding-bottom: 20px; }

.editor blockquote{font-style: italic; padding: 30px 23px 30px 54px; border-left: 8px solid var(--blue); line-height: 1.6; position: relative; background: #f3f3f3; font-size: 1.2em;}
.editor blockquote::before{ content: "\201C"; color: var(--red); font-size: 4em; position: absolute; left: 5px; top: -14px; font-family: 'Oswald', sans-serif; }
.editor blockquote strong{ display:block; color:#333; font-style:normal; font-weight: bold; margin-top:1em;}

.editor .btn a, .btn a{position:relative; padding:7px 15px 8px; background-color:var(--blue); color:#fff; display:inline-block; font-weight:600; margin-top:10px; border:1px solid transparent;}
.editor .btn a:hover, .btn a:hover{ background-color:transparent; border-color:var(--blue); color:var(--blue);}

.content {padding:40px 0 30px; position:relative;}
.twocolumn {-moz-column-count:2; -webkit-column-count:2; column-count:2;}
.content.editor > h1:first-child {margin-bottom:30px; border-bottom: 3px solid var(--red); display: inline-block; padding-bottom: 5px; color: var(--blue); font-weight: 600;}
.gslide-image img {-o-object-fit: inherit; object-fit: inherit !important;}

/* Navigation */
.home .nav { background-color: rgba(255, 255, 255, 0.8);}
.menu {margin-top:26px;}
.menu, .menu > li {display: -ms-flexbox; display: -webkit-flex; display: flex;}
.menu.topmenu {top:0; right:0; position:absolute; margin-top:0;}  
.menu > li {position:relative; padding:0 15px;}
.menu.topmenu li ul li a{color:var(--blue);}
.menu.topmenu > li {padding: 0 10px;}
.menu.topmenu > li > a { line-height:36px; font-size:1em; }
.menu.topmenu > li > a:before {display:none;}

.menu li a {color:var(--white); margin:0; display:block; font-family: "Oswald",sans-serif;}
.menu > li > a {color:var(--white); line-height:44px; position: relative; font-size: 1.3em;}
.menu > li > a:before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; background-color:var(--cream); height:0px; -webkit-transition:0.3s all ease; -moz-transition:0.3s all ease; transition:0.3s all ease;}

.home .menu > li > a {color:var(--blue);}
.home .menu {margin-top:0;}
.home .menu > li > a:before {background-color: #ed1b2d;}
.home .menu > li.active > a, .home .menu > li:hover > a {color:#ed1b2c;}

@-webkit-keyframes pull-up { 0% { transform: translate(0, 20px); }
  100% { transform: translate(0, 0); } }
@keyframes pull-up { 0% { transform: translate(0, 20px); }
  100% { transform: translate(0, 0); } }

.menu ul {width:220px; padding:0; position:absolute; left:0px; top:100%; background-color:rgba(0, 88, 160, 0.9); visibility: hidden; opacity: 0; z-index: -1; -webkit-transition: visibility 0s linear .25s; -moz-transition: visibility 0s linear .25s; -ms-transition: visibility 0s linear .25s; transition: visibility 0s linear .25s; -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15); -moz-box-shadow:0px 10px 20px rgba(0, 0, 0, 0.15); box-shadow:0px 10px 20px rgba(0, 0, 0, 0.15);}
.menu > li:hover > ul{visibility: visible; opacity: 1; -webkit-transition: opacity .5s; -moz-transition: opacity .5s; -ms-transition: opacity .5s; transition: opacity .5s; animation: pull-up .3s; z-index: 90;}
.menu > li li:hover > ul{left:inherit; right:100%; top:0; width:180px; visibility: visible; opacity: 1; -webkit-transition: opacity .5s; -moz-transition: opacity .5s; -ms-transition: opacity .5s; transition: opacity .5s; animation: pull-up .3s; z-index:90; }
.menu > li:last-child > ul{left:inherit; right:0;}
.menu > li.active > a, .menu > li:hover > a {color:var(--cream);}
.menu > li.active > a:before, .menu > li:hover > a:before {height:3px;}

.menu li ul li {width:100%; padding:0px; position:relative;}
/*.menu li:last-child{border-bottom:none;}*/
.menu li ul li a{ padding:7px 5px 7px 15px; color:var(--white); line-height: 1.4em;}
.menu li:hover li > a:hover, .menu li:hover li:hover > a, .menu li.active li.active > a, 
.menu ul li:hover li:hover > a:hover, .menu li.active li.active li.active > a{background-color:#014e82;}

/* Mobile */
#menu-trigger {display:none; position:absolute; z-index:11; width:30px; height:34px; margin:auto; cursor:pointer; right:0; background-color:#fff; padding: 20px 26px;}
#menu-trigger span, #menu-trigger span:before, #menu-trigger span:after {position:absolute; width:34px; left:0; right:0; height:3px; background-color:var(--blue); -webkit-transition:all 0.3s ease; transition:all 0.3s ease;}
#menu-trigger span { top:50%; margin:-1px auto auto; display: block; font-size: 0px;}
#menu-trigger span:after {top:10px; content: '';}
#menu-trigger span:before {top:-10px; content: '';}

.mobimenu #menu-trigger span {background-color: transparent;}
.mobimenu #menu-trigger span:before{-webkit-transform: translateY(0) rotate(45deg); transform: translateY(0) rotate(45deg); top:0; left:0;}
.mobimenu #menu-trigger span:after { -webkit-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); top:0; left:0;}

@media screen and (max-width: 1023px) {
  .editor h1 { font-size: 1.8em;}
  .subheading, .editor h2.subheading {font-size:1.1em;}
  .space-wrap {padding-top:30px; padding-bottom:30px;}
  .home .logo img { width:90px;}
  .home .menu.topmenu { margin-top: -15px;}
  .menu > li {padding: 0 10px;}
  .menu > li > a {font-size:1em;}
  .boxes .hotext { padding: 10px; font-size:1.4em;}
  .boxes .hotext:before { left:10px; top:10px;}
  .boxes .hotext:after { right:10px; bottom:10px; }
  .feature-wrap .row > div { width:49%;}
  .feature-wrap .row > div:nth-child(-n+2){margin-bottom:20px;}
  .members > div { width:32.33%;}
  .members > div:nth-child(-n+3){margin-bottom:20px;}
  .staff-in > div {width: 25%;}
  .bottomspace {display:none;}
  .footer {position:relative;}
}

@media screen and (max-width:767px) {
  body, html {font-size:14px;}
  .editor h1 {font-size: 1.4em; }
  .editor h2, .editor h3, .editor h4 {font-size: 1.2em;}

  .content {padding:20px 0;}
  .col12, .col23, .col13 {width: 100%;}
  .col12 + .col12 {margin-top:20px;}
  .twocolumn { -moz-column-count: inherit; -webkit-column-count: inherit; column-count: inherit;}
  .content.editor > h1:first-child { margin-bottom: 15px;  }

  .home .header { position: inherit; background-color:var(--blue);}
  .home .logo img, .logo img { width:60px; }
  .boxes .col13 { background-color: var(--blue); padding-top:20px; padding-bottom:20px; margin-top: 0; width: 100%;}
  .feature-wrap > div .text {padding:10px; bottom:-82px;}
  .feature-wrap .text p { font-size: .75em;}
  .staff-in > div {width:33.33%;}
  
  .videobtn { width: 60px; height: 60px; padding: 20px 23px;}
  .videobtn:before { border-width: 10px 0 10px 16px;}


  .nav {width: auto; margin-top:0; margin-bottom: 0;}
  .nav, .mobimenu .nav,  .menu > li > a:before, .menu > li:hover > ul, .menu ul, .menu > li li > ul, .menu > li li:hover > ul { display:none; } 
  #menu-trigger, .mobimenu .nav {display:block;}
  .home .nav, .nav {position:absolute; top:100%; right:0px; z-index:5; background-color:var(--blue); -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15); box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15);}
  .home .menu.topmenu { margin-top: 0;display: flex;flex-flow: column;}
  .menu.topmenu {position: relative; top:inherit; font-size: inherit;}
  .menu.topmenu > li > a, .menu.topmenu > li > a { color:var(--white); padding:7px; text-transform: uppercase;}
  .menu { width: 280px; display: block; margin-top:0; background-color: transparent;}
  .menu ul, .menu > li li:hover > ul, .menu > li:hover > ul {display:none; visibility: visible; opacity: 1; width: inherit; padding-right:40px; position:relative; left:inherit; top:inherit; right: inherit;  -webkit-box-shadow:none;  -moz-box-shadow:none;  box-shadow:none; border:none; padding-left: 15px; margin-top:0px; animation:inherit;}

  .menu > li, .topmenu.menu > li{display:block; border-bottom:1px solid #6084cc; padding:0;}
  .menu li ul li {padding:0; border-bottom: 0;}
  .menu li ul li a { color: var(--white); border-bottom: none; padding: 4px 0px 4px 10px; line-height: inherit; font-size: .9em;}
  .menu > li:nth-last-child(-n+2) > ul li:hover > ul {left:inherit; right:inherit;}
  .menu ul > li.open > a{background-color:#f4f4f4;}
  .home .menu > li > a { color:#fff;}
  .home .menu > li.active > a, .home .menu > li:hover > a { color: var(--cream); }
  .menu li a, .topmenu.menu li a {position:relative;display:block;line-height:20px; margin-right:40px; padding:10px 10px 10px 20px; color:#fff; text-transform: capitalize; font-size: 1.1em;}
  .menu li .arrow {position: absolute; top:0; right:-40px; width:40px; height:100%; background-color:#6f8fd0; cursor:pointer;}
  .menu li .arrow:after, .menu li .arrow:before {left:50%; top:50%; content: " "; height:2px; width:12px; position: absolute; background-color:var(--cream); pointer-events: none; -webkit-transition: 0.3s all; -moz-transition: 0.3s all; transition: 0.3s all;}
  .menu li .arrow:after {width:2px; height:12px; margin-top:-5px;}
  .menu li .arrow:before {margin-left:-5px;}
  .menu > li.open > a >.arrow:after, .menu > li.open li.open > a >.arrow:after { display:none;}
  #nav-topmenu .newsletter__logo {
    display: none;
  }
  #nav-topmenu li:first-of-type {
    order: 1;
  }
}

@media screen and (max-width:479px) {
  .wraper {width: 90%;}
  .feature-wrap .row > div { width: 100%;}
  .feature-wrap .row > div:nth-child(-n+3) { margin-bottom:20px;}
  .members > div { width:49%;}
  .members > div:nth-child(-n+4){margin-bottom:20px;}
  .staff-in > div {width:50%;}
  .footer .wraper > div { width: 100%; padding: 10px 0;}
}
.gslide-media {max-width: 500px !important;}
/* Popup */
.popup {    
  text-align: center;
  /*background-color: var(--red);*/
  color: var(--blue);
}

.popup .heading {
  font-size: calc(1rem + 1vw);
  margin: 0.5em 0;
}

.popup .text {
  font-size: calc(1rem + 0.5vw);
}