/* Design & Code: www.felixlobelius.com */

/* General */

@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }

body,div,
h1,h2,p,
ol,ul,li {
	margin: 0;
	padding: 0;
	border: 0;
}


body,div {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;     
}


h1,h3,h4,h5, h6, p,ol,ul,li, .section s1 {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;     
}


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

body {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
	background: #fff;
	-webkit-font-smoothing: antialiased;
}

::-moz-selection {
	background:#e3e3e3;
    color:#000;
}

::selection {
	background:#e3e3e3;
    color:#000;
}


.column-wrapper {
	margin: 0 -20px;
}
  

.column-25, .column-33, .column-50, .column-75, .column-100 {
	padding: 0 20px 0;
	margin: 0 0 30px 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
}

/* Structure */


* {margin: 0; padding: 0; outline: 0;}


body {
	font-family: Helvetica, Arial, Verdana, sans-serif;
	color: #999;
	font-size: 12px;
	background:#fff;

	
}



h2 {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  500;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #001A44;
    text-align: left;
    font-size: 22px;
    line-height: 1.3;
    padding: 0 0 30px;
}


p {
	padding: 0 0 15px 0;
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  400;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #001A44;
    text-align: left;
    font-size: 16px;
    line-height: 1.4;
}


p strong {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  500;
 	font-style:   normal;
 	font-stretch: normal;
}



h5, h5 a {
	padding: 0 0 15px 0;
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  400;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #fff;
    text-align: left;
    font-size: 16px;
    line-height: 1.4;
    text-decoration: none;
}


h5 strong {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  500;
 	font-style:   normal;
 	font-stretch: normal;
}



h6, h6 a {
	padding: 3px 0 0 0;
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  400;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #001A44;
 	display: inline-block;
    text-align: right;
    float: right;
    font-size: 16px;
    line-height: 1.4;
    text-decoration: none;
}



a:hover h6 {
 	color: #fff;
    text-decoration: none;
}




.menuBtn {

	background: center center no-repeat transparent;
	background: #000;
	display: block;
	position: absolute;
	top: 0;
	left: 10px;

}

.active {
	
}



a {
    -webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-ms-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;
}


a:hover {
    color: #7ea5f9;
}

img {
	max-width: 100%;
	height: auto;
	border: 0;
	image-rendering: optimizeQuality;
}



#logo {
	width: 300px;
	height: auto;
	display: block;
	margin: 0;
	padding: 45px 0 0 0;
}


.clear {
	clear: both;
}

.wrap {
	width: 100%;
	z-index: 10;
	position: relative;
	margin: 0 auto;
	padding: 0;
}


.section {
	width: 100%;
	z-index: 10;
	position: relative;
	margin: 0 auto;
	padding: 0;
}

.intro {
	width: 100%;
	background-color: #DAF1FC;
	padding: 0;
}


.inner {
	min-height: 50px;
	position: relative;
	max-width: 1100px;
	margin: 0 auto;
	overflow: hidden;
	padding: 25px 5% 25px 5%;	
}


/* This is the selector i used for my menu, it needs to be set as position:absolute; */

.subMenu {
	position: absolute;
	top: 0px;
	height: 60px;
	z-index: 1000;
	width: 100%;
	background: #fff;
	opacity: .9;
}

.subMenu .inner {
	padding: 30px 5% 30px 5%;	
}


.subNavBtn {
	display: block;
	float: left;
	margin: 0px 0px 0 0;
	text-decoration: none;
	font-size: 16px;
	padding: 0 25px 0 0;
	text-align: center;
	color: #343434;
	font-family: 'Atlas Grotesk Web';
	font-weight:  400;
	font-style:   normal;
	font-stretch: normal;
}


.subNavBtn-mobile {
	display: none;
	float: left;
	margin: 0px 0px 0 0;
	text-decoration: none;
	font-size: 14px;
	padding: 0 20px 0 0;
	text-align: center;
	color: #343434;
	font-family: 'Atlas Grotesk Web';
	font-weight:  400;
	font-style:   normal;
	font-stretch: normal;
}







.end {
	margin: 0;
}


/* SECTIONS */
.sTop {
	background:#fff;
	color:#3d3d3d;
	width: 100%;
}

.s1 {
	background: #B1D5E6;
	width: 100%;
}


.s2 {
	background: #72B4D4;
}


.s3 {
	background: #00425A;
	min-height: 500px;
}


.s4 {
	min-height: 500px;
	background: #6e87a1;
	color: white;
}

.s5 {
	min-height: 500px;
	background: #293b4d;
	color: white;
}



/* Typography */


/*
        This font software is the property of Commercial Type.

        You may not modify the font software, use it on another website, or install it on a computer.

        License information is available at http://commercialtype.com/eula
        For more information please visit Commercial Type at http://commercialtype.com or email us at info[at]commercialtype.com

        Copyright (C) 2013 Schwartzco Inc.
        License: 1310-GGFOWT     
*/


@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('../fonts/AtlasGrotesk-Light-Web.eot');
  src: url('../fonts/AtlasGrotesk-Light-Web.eot?#iefix') format('embedded-opentype'),
     url('../fonts/AtlasGrotesk-Light-Web.woff') format('woff'),
     url('../fonts/AtlasGrotesk-Light-Web.ttf') format('truetype'),
     url('../fonts/AtlasGrotesk-Light-Web.svg#Atlas Grotesk Web') format('svg');
  font-weight:  300;
  font-style:   normal;
  font-stretch: normal;
}

.AtlasGrotesk-Light-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  300;
  font-style:   normal;
  font-stretch: normal;
}


@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('../fonts/AtlasGrotesk-Regular-Web.eot');
  src: url('../fonts/AtlasGrotesk-Regular-Web.eot?#iefix') format('embedded-opentype'),
     url('../fonts/AtlasGrotesk-Regular-Web.woff') format('woff'),
     url('../fonts/AtlasGrotesk-Regular-Web.ttf') format('truetype'),
     url('../fonts/AtlasGrotesk-Regular-Web.svg#Atlas Grotesk Web') format('svg');
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}

.AtlasGrotesk-Regular-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}


@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('../fonts/AtlasGrotesk-Medium-Web.eot');
  src: url('../fonts/AtlasGrotesk-Medium-Web.eot?#iefix') format('embedded-opentype'),
     url('../fonts/AtlasGrotesk-Medium-Web.woff') format('woff'),
     url('../fonts/AtlasGrotesk-Medium-Web.ttf') format('truetype'),
     url('../fonts/AtlasGrotesk-Medium-Web.svg#Atlas Grotesk Web') format('svg');
  font-weight:  500;
  font-style:   normal;
  font-stretch: normal;
}

.AtlasGrotesk-Medium-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  500;
  font-style:   normal;
  font-stretch: normal;
}


h1 {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  300;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #001A44;
    text-align: left;
    font-size: 24px;
    line-height: 1.3;
    width: 50%;
    padding: 0;
}

h1 strong {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  500;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #001A44;
    text-align: left;
    font-size: 24px;
    line-height: 1.3;
}


h3 {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  500;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #001A44;
    text-align: left;
    font-size: 24px;
    line-height: 1.25;
    width: 50%;
    padding: 0 0 15px;
    display: inline-block;
}


h4, h4 a {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  300;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #fff;
    text-align: left;
    font-size: 24px;
    line-height: 1.25;
    width: 47%;
    padding: 0 0 10px;
    text-decoration: none;
}

h4 a {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  500;
 	font-style:   normal;
 	font-stretch: normal;
    text-decoration: none;
}

h4 strong {
 	font-family: 'Atlas Grotesk Web';
 	font-weight:  500;
 	font-style:   normal;
 	font-stretch: normal;
 	color: #fff;
    text-align: left;
    font-size: 24px;
    line-height: 1.25;
}



.spacer {
	height: 15px;
}



/* Royal Slider */


.royalSlider .rsPreloader {
    position: absolute;
    width: 32px;
    height: 32px;
    left: 50%;
    top: 50%;
    margin-left: -16px;
    margin-top: -16px;
    z-index: 0;
    background: url('../img/preload.gif') no-repeat center center;
}


.bContainer {
    position: absolute;
    width: 40%;
    left: 3%;
    top: 4.5%;
    z-index: 9;
}

.royalSlider .rsArrow {
    width: 20px;
    height: 18px;
    text-indent: -9999px;
    overflow: hidden;
    display: inline-block;
}


.royalSlider .rsArrowLeft {
	padding: 1.5%;
    background: transparent url('../img/prev.png') no-repeat center center;
}

.royalSlider .rsArrowRight {
	padding: 1.5%;
    background: transparent url('../img/next.png') no-repeat center center;
}


.slideshow .slideshow-arrows {
    text-align: right;
}


#slideshow {
    width: 100%;
    background-color: #fff;
    margin-bottom: 30px;
}

.image #slideshow {
    width: 100%;
    margin-bottom: 0;
}

#slideshow .rsOverflow {
    overflow: hidden;
}

#slideshow .rsArrow {
    position: absolute;
    top: 44%;
    z-index: 10;
}

#slideshow .rsArrowLeft {
    left: 0;
}

#slideshow .rsArrowRight {
    right: 0;
}

#simple-slider {
	width: 1000px;
    height: 807px;
    margin: 0 auto;
}

/* Responsive Styles */




@media screen and (min-width:960px) {
  

.column-25 {
	float: left;
    width: 25%;
}

.column-33 {
	float: left;
    width: 33.3333%;
}
  
.column-50 {
    float: left;
    width: 50%;
}
  
.column-75 {
    float: left;
    width: 75%;
}  
  
.column-100 {
    float: left;
    width: 100%;
}
  
.image {
    float: left;
    width: 66.6666%;
}
  
.sidebar {
    float: left;
    width: 33.3333%;
}  

}


@media screen and (min-width:200px) and (max-width: 500px) {
  
.column-33 {
	float: left;
    width: 100%;
}


.subMenu {
	height: 40px;
}


.subMenu .inner {
	padding: 15px 5% 15px 5%;	
}

.section {
	padding: 0;
}


.sTop {
	min-height: 0;
}


h6, h6 a {
 	display: none;

}

.subNavBtn {
	display: none;
}

.subNavBtn-mobile {
	display: block;
}

#slideshow {
    width: 100%;
    background-color: #fff;
    margin-bottom: 15px;
}


h1, h1 strong, h3, h4, h4 a, h4 strong {
    font-size: 20px;
    width: 100%;
    padding: 0 0 10px;
}


.column-25, .column-33, .column-50, .column-75, .column-100 {
	padding: 0 20px 0;
	margin: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
}

.clock {
	display: none;
}

#logo {
    width: 260px;
	padding: 25px 0 0 0;
}


.inner {
	min-height: 50px;
	position: relative;
	max-width: 1100px;
	margin: 0 auto;
	overflow: hidden;
	padding: 20px 5% 20px 5%;	
	
}



p, h5, h5 a {
    font-size: 14px;
}






}


@media screen and (min-width:501px) and (max-width: 700px) {
  
.column-33 {
	float: left;
    width: 100%;
}

#logo {
    width: 260px;
}


h6, h6 a {
 	display: none;

}


.column-25, .column-33, .column-50, .column-75, .column-100 {
	padding: 0 20px 0;
	margin: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
}



.subNavBtn {
	display: none;
}

.subNavBtn-mobile {
	display: block;
}

#slideshow {
    width: 100%;
    background-color: #fff;
    margin-bottom: 30px;
}



h1, h1 strong, h3, h4, h4 a, h4 strong {
    font-size: 22px;
    width: 100%;
    padding: 0 0 10px;
}

.clock {
	display: none;
}



}

@media screen and (min-width:701px) and (max-width: 959px) {
  
.column-33 {
	float: left;
    width: 50%;
}

.clock {
	display: none;
}


h1, h1 strong, h4, h4 strong {
    width: 80%;
}



}
