/* RESET */

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, font, 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{background: transparent; border: 0; margin: 0; padding: 0;} ol, ul{list-style: none;} img{max-width: 100%; height: auto; image-rendering: -webkit-optimize-contrast;}

/* FRAMEWORK */

html, body{font-family: 'Roboto Condensed', sans-serif; font-size: 14px; -webkit-text-size-adjust: none; overflow-x: hidden;}
::-moz-selection{background: #058BD2; color: #fff; text-shadow: none} ::selection{background: #058BD2; color: #fff; text-shadow: none}

.main{padding: 50px 0;}
.sitecontainer{max-width: 1200px; margin: 0 auto; padding: 0 20px;}

.main .body-links{display:flex;}
.main .body-links a{display: block; position: relative; flex: 1; background: rgb(5,139,210); background: linear-gradient(180deg, rgba(5,139,210,1) 0%, rgba(0,92,140,1) 100%); margin: 5px; padding: 15px 20px; font-size: 20px; font-weight: 700; text-transform: uppercase; color: #fff;}
.main .body-links .fas {margin:0 8px 0 0;}
.main .body-links a strong{display: block; font-size: 32px}
.main .body-links a:hover{background: linear-gradient(180deg, rgba(5,139,210,1) 0%, rgba(5,139,210,1) 100%);}
.main .body-links a:after{position: absolute; top: 40%; right: 10px; font-family: FontAwesome; content: '\f054'; color: #fff;}

.column12, .column11, .column10, .column9, .column8, .column7, .column6, .column5, .column4, .column3, .column2, .column1{float: left; padding: 0 25px 0 0;} .column12{width: 100%;} .column11{width: 91.6666%;} .column10{width: 83.3333%;} .column9{width: 75%;} .column8{width: 66.6666%;} .column7{width: 58.3333%;} .column6{width: 50%;} .column5{width: 41.6666%;} .column4{width: 33.3333%;} .column3{width: 25%;} .column2{width: 16.6666%;} .column1{width: 8.3333%;} .last{padding: 0;} .cf{zoom: 1;} .cf:before, .cf:after{content: ""; display: table;} .cf:after{clear: both;} .clear{clear: both;} *{box-sizing: border-box;}

/* TYPOGRAPHY */

h1{font-size: 32px; text-transform: uppercase; color: #058BD2;}
p{font-size: 16px; line-height: 24px;}
a{text-decoration: none; color: inherit; transition: all .2s ease-in-out;} a:hover{color: inherit;}

/* HEADER */

.header{display: flex; flex-wrap: wrap; align-items: flex-end; position: relative; z-index: 999;}
.header .header-left{width: 400px; background: #fff; text-align: center;}


.header .header-right{width:80%; text-align: right;}
.header .header-right .contact{padding:25px; font-size: 18px; font-weight: 700; color:#047CBD;}
.header .header-right .contact span{padding: 0 5px;}
.header .header-right .contact img{vertical-align: middle; max-height: 30px;}

/* NAVIGATION */

#cssmenu{background: #222; position: relative; font-size: 0; text-align: right; transform: skew(-21deg); padding: 0 15px; right: -25px;}
#cssmenu ul{display: inline-block; position: relative; transform: skew(21deg); padding: 0 25px;}
#cssmenu ul li{display: inline-block; position: relative;}
#cssmenu ul li a{display: block; font-size: 16px; font-weight: 700; text-transform: uppercase; color: #fff; padding: 25px 15px;}
#cssmenu ul li:hover > a{color: #058BD2;}
#cssmenu ul li:hover > ul{left: auto;}
#cssmenu ul li.has-sub > a{padding-right: 30px;}
#cssmenu ul li.has-sub > a::after{position: absolute; top: 30px; right: 14px; font-family: FontAwesome; font-size: 8px; content: '\f078';}
#cssmenu ul ul{display: block; position: absolute; left: -9999px; transform: none; padding: 0;}
#cssmenu ul ul li{border: 1px #ccc solid; border-top: none;}
#cssmenu ul ul li a{background: #222; width: 250px; font-size: 12px; text-align: left; text-decoration: none; color: #ddd; padding: 15px 20px;}
#cssmenu ul ul li a:hover, #cssmenu ul ul li:hover > a{background: #555; color: #fff;}
#cssmenu ul ul li.has-sub a::after{position: absolute; top: 18px; right: 8px; font-family: FontAwesome; font-size: 8px; content: '\f054';}
#cssmenu ul ul ul{margin-left: 100%; top: -1px;}
#cssmenu #menu-button{display: none;}

/* BODY */

.privacy-link {
  font-size: 14px;
  margin-top: 20px;
  text-align: left;
}

.privacy-link a {
  color: white;
	text-decoration: underline
}

.privacy-link a:hover {
  color: #666;
}

.ep-header, .ep-iFrameContainer, .ep-overlay { margin-top: 60px;}

.hero{background: src; background:#111 url("../siteart/hero-bg.jpg") center center; background-size: cover; padding: 25px 0;}
.hero .hero-image{display: block; position: relative;}
.hero .hero-image .hero-text{position: absolute; top: 25px; left: 25px; font-size: 36px; line-height: 44px; font-weight: 700; text-transform: uppercase; text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5); color: #fff;}
.hero .hero-image .hero-text strong{font-size: 52px;}

.hero .hero-image .hero-inv a{position: absolute; top: 130px; left: 25px; padding:15px; font-size:26px; line-height:26px; font-weight: 5800; text-transform: uppercase;  color: #fff; border:2px #fff solid; background: rgb(5,139,210);}


.hero .hero-links{display:flex;}
.hero .hero-links a{display: block; position: relative; flex: 1; background: rgb(5,139,210); background: linear-gradient(180deg, rgba(5,139,210,1) 0%, rgba(0,92,140,1) 100%); margin: 5px; padding: 15px 20px; font-size: 20px; font-weight: 700; text-transform: uppercase; color: #fff;}
.hero .hero-links .fas {margin:0 8px 0 0;}
.hero .hero-links a strong{display: block; font-size: 32px}
.hero .hero-links a:hover{background: linear-gradient(180deg, rgba(5,139,210,1) 0%, rgba(5,139,210,1) 100%);}
.hero .hero-links a:after{position: absolute; top: 40%; right: 10px; font-family: FontAwesome; content: '\f054'; color: #fff;}

.sq-links .fas {width:100%; margin:0 0 12px 0 !important; font-size:55px; text-align: center; color:rgba(0,51,82,1) !important;}
.sq-links a {padding:4.5% 20px !important; font-size: 26px !important; text-align: center; color:rgb(5,139,210) !important; background: #fff !important;}
.sq-links a:after{display: none;}


.cycle-slideshow{margin-bottom: 25px;}
.cycle-slideshow img{display: block; border: 2px #058BD2 solid;}

.map iframe{display: block; width: 100%; height: 450px;}

/* FORM */

#form{background: #fafafa; margin: 10px 0; padding: 25px; border: 1px #ddd solid;}
#form .form-row{display: block; margin: 0 0 5px;}
#form .form-row .label-left{float: left; width: 300px; padding-right: 25px;}
#form .form-row .input-right{float: left; width: calc(100% - 300px);}
#form .form-row .input-right label{margin-right: 15px; cursor: pointer;}
#form input[type="text"], #form input[type="email"], #form select, #form textarea{width: 100%; margin: 5px 0 20px; padding: 10px 5px; border: 1px solid #ccc;}
#form input[type="checkbox"], #form input[type="radio"]{margin: 0 10px 25px 0;}
#form input[type="submit"]{display: block; width: 100%; max-width: 250px; background: #058BD2; margin: 5px auto; padding: 10px 0; font-family: 'Roboto Condensed', sans-serif; font-size: 14px; color: #000; border: none; transition: all .2s ease-in-out; cursor: pointer;} #form input[type="submit"]:hover{background: #333;}
#form textarea{height: 90px;}

.CaptchaPanel{margin: 0 !important; padding: 0 !important; line-height: normal !important;}
.CaptchaAnswerPanel input{width: 250px; max-width: 100%; padding: 5px; margin: 5px 0;}
.CaptchaMessagePanel{padding: 0 !important; margin: 0 !important; font-weight: normal !important; font-size: 12px; line-height: 14px;}
.CaptchaAnswerPanel{margin: 0; padding: 2px 0px 2px 0px !important;}
.CaptchaWhatsThisPanel{line-height: 0; margin: 0; padding: 8px 0 8px 0 !important;}
.CaptchaWhatsThisPanel a{font-size: 12px; color: #000;} .CaptchaWhatsThisPanel a:hover{text-decoration: none;}

/* FOOTER */

.footer{background: #222; padding: 50px 0 25px; color: #fff;}
.footer h3{font-size: 20px; text-transform: uppercase; color: #058BD2;}
.footer .bottom-footer{padding: 25px 0; margin-top: 25px; border-top: 5px #aaa solid;}
.footer .bottom-footer .divfooter{font-size: 12px; line-height: 20px; color: #aaa;}
.footer .bottom-footer .divfooter a{color: #aaa;}

/* RESPONSIVE */

@media screen and (max-width: 1500px){
	.header .header-left{width: 250px;}
	.header .header-right{width: 100%;}
}
@media screen and (max-width: 1300px){
	#cssmenu ul li a{font-size: 14px; padding: 25px 10px;}
}

@media screen and (max-width: 1150px){
	.header .header-left{width: 200px;}
	.header .header-right{width:80%;}
	
	#cssmenu ul li a{font-size: 14px; padding: 25px 5px;}
}
@media screen and (max-width: 1024px){
	.header .header-left{width: 100%;}
	.header .header-right{width: 100%; text-align: center;}
	.header .header-right .contact{font-size: 14px; padding: 10px 20px;}
	.main{padding: 35px 0;}
	
	.sq-links a {padding:2.5% 20px !important;}
	
	#cssmenu{width: 100%; transform: none; right: 0; padding: 0; text-align: left;}
	#cssmenu ul{width: 100%; display: none; transform: none; padding: 0;}
	#cssmenu ul li{width: 100%; border-top: 1px solid #ccc;}
	#cssmenu ul li a{font-size: 12px; padding: 20px; width: 100%;}
	#cssmenu ul ul{display: none; position: relative; left: 0; right: auto; width: 100%; margin: 0;}
	#cssmenu ul ul li{width: 100%; border: none; border-top: 1px solid #ccc;}
	#cssmenu ul ul li a{background: #333; font-size: 12px; color: #fff; padding: 20px; width: 100%;}
	#cssmenu ul ul ul{display: none; position: relative; top: 0; left: 0; right: auto; width: 100%; margin: 0;}
	#cssmenu ul ul ul li a{padding: 20px 40px; background: #555;}
	#cssmenu > ul > li.has-sub > a::after, #cssmenu ul ul li.has-sub > a::after{display: none;}
	#cssmenu #menu-button{display: block; padding: 20px; color: #fff; cursor: pointer; font-size: 12px; font-weight: 700; text-transform: uppercase;}
	#cssmenu #menu-button::after{position: absolute; top: 19px; right: 20px; font-family: FontAwesome; font-size: 16px; content: '\f0c9';}
	#cssmenu .submenu-button{position: absolute; z-index: 10; right: 0; top: 0; display: block; height: 55px; width: 100%; cursor: pointer;}
	#cssmenu .submenu-button::after{position: absolute; top: 19px; right: 20px; font-family: FontAwesome; font-size: 16px; content: '\f067'; color: #fff;}
	#cssmenu .submenu-button.submenu-opened:after{content: '\f068';}
}

@media screen and (max-width: 880px){
	.sq-links .fas {width:100%; margin:0 0 8px 0 !important; font-size:35px; }
	.hero .sq-links a strong{font-size:26px}
	.sq-links a { font-size: 22px !important; text-align: center; color:rgb(5,139,210) !important; background: #fff !important;}
}
	
@media screen and (max-width: 800px){
	.hero .hero-links{display: block;}
	.hero .hero-links a{flex: none;}
}

@media screen and (max-width: 768px){
	.column8, .column4{float: none; width: 100%; padding: 0; margin-bottom: 10px;}
	
	.header .header-right .contact img{margin: 5px 0;}
	.hero .hero-image .hero-text{font-size: 24px; line-height: 32px;}
	.hero .hero-image .hero-text strong{font-size: 36px;}
	.map iframe{height: 250px;}
	
    #form .form-row .label-left, #form .form-row .input-right{float: none; width: 100%; padding: 0;}
    #form input[type="text"], #form input[type="email"], #form select, #form textarea{margin: 5px 0 10px;}
	
	.footer .column3{display: none;}
	.footer .column3:first-child{display: block; float: none; width: 100%; padding: 0; text-align: center;}
	.footer .bottom-footer{text-align: center;}
}