@charset "UTF-8";

/*=============================================================*/

* {
    padding:0;
	margin:0;
} 

body{
	width: 100%;
    margin: 0px;
    padding: 0px;
	min-width:944px;
	background-color: rgba(255,255,255,1);
}  

header{
	position: absolute;
	display:inline-block;
	top:0px;
	width: 100%;
	min-width:944px;
	margin: 0px auto;
	padding: 0px;
	align: center;
	height: 50px;
	background-color: #003E73;
	overflow: hidden;
	z-index: 5000;
}

.headerInnerWrapper{
	position: relative;
	display: block;
	width: 100%;
	margin: 0px auto;
	align:center;
	height:100%;
}

.headerInnerLeft{
	position: relative;
	display: inline-block;
	float:left;
	align:left;
	width: 40%;
	height:100%;
	/*border:1px solid white;*/
}

.headerInnerMiddle{
	position: relative;
	display: inline-block;
	align:center;
	margin:0px auto;
	text-align:center;
	width:18%;
	height:100%;
	/*border:1px solid white;*/
}

.headerInnerRight{
	position: relative;
	display: inline-block;
	float:right;
	align:right;
	text-align:right;
	width: 40%;
	height:100%;
}

.emailTop{
	position: relative;
	display: inline-block;
	float:left;
	margin:7px 0px 0px 30px;
}

.phoneTop{
	position: relative;
	display: inline-block;
	float:right;
	margin:7px 30px 0px 0px;
}


.container{
	position: relative;
	display: inline-block;
	clear:both;
	margin:0px auto;
	padding: 0px;
	align:center;
	min-width:944px;
	min-height:850px;
	width:100%; 
	background-image: url("../images/global/waves.png");
	background-size: contain;
}

#logo{
	position: relative;
	display: block;
	align: center;
	top:0px;
	margin: 0px auto;
	text-align:center;
	width: 700px;
	height:200px;
	
}

#logoWrapper{
	position: relative;
	display: inline-block;
	width: 100%;
	height: 100%;
	margin-top: 150px;
}

.outerMiddle{
	position: relative;
	display: inline-block;
	width:100%;
	min-height:400px;
	margin:70px auto;
	float:left;
}

.innerMiddle{
	position: relative;
	display: block;
	align:center;
	clear:both;
	margin:0px auto;
	text-align:center;
	max-width:1104px;
	min-width:720px;
	padding:20px;
}

.outerMiddlePics{
	position: relative;
	display: inline-block;
	width:100%;
	height:500px;
	margin:0px auto;
	float:left;
	border-top:4px solid #003E73;
}

.innerMiddlePics{
	position: relative;
	display: block;
	align:center;
	clear:both;
	margin:0px auto;
	text-align:center;
	width:100%;
	min-width:720px;
}

.outerMiddleMap{
	position: relative;
	display: inline-block;
	width:100%;
	min-height:300px;
	margin:0px auto;
	float:left;
	border-top:30px solid #003E73;
}

.innerMiddleMap{
	position: relative;
	display: block;
	align:center;
	clear:both;
	margin:0px auto;
	text-align:center;
	width:100%;
	min-width:720px;
}




/*=======================================Footer=====================================*/

footer{
	position: relative;
	display: inline-block;
	float:left;
	width: 100%;
	min-width:944px;
	margin: 0 auto;
	padding: 0px;
	height: 400px;
	background-color: #003E73;
	border-top:2px solid #fff;
	z-index: 5000;
}

.footerInnerWrapper{
	position: relative;
	display: block;
	width: 100%;
	margin: 0px auto;
	align:center;
	height:100%;
}


.footerInnerLeft{
	position: relative;
	display: inline-block;
	float:left;
	align:left;
	width: 14%;
	height:200px;
	/*border:1px solid white;*/
}

.footerInnerMiddle{
	position: relative;
	display: inline-block;
	align:center;
	margin:0px auto;
	text-align:center;
	width:70%;
	height:100px;
	/*border:1px solid white;*/
}

.footerInnerRight{
	position: relative;
	display: inline-block;
	float:right;
	align:right;
	text-align:right;
	width: 14%;
	height:100px;
	/*border:1px solid white;*/
}

.address{
	margin-top:30px;
	height:40px;}

/*========================CONTENT======================*/

#locationMap{
position:relative;
	display:block;
	margin:0 auto;
	align:center;
	width:100%;
	height:400px;
}

.mapOuterWrapper{
	position: relative;
	display:block;
	margin:0px auto;
	align:center;
	width:100%;
	padding:0px;
	min-height:100px;
}


ul {
    width: 100%;
    scroll-behavior: smooth;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    text-align: center;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

    ul::-webkit-scrollbar {
    display: none;
  }

  li {
    list-style: none;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    width: 20%;
    margin-left: 1%;
    margin-right: 1%;
      transition: 0.2s;
  }

li, img {
  width: auto;
}



/*==========================TEXT==========================*/

h1,h2,h3,h4,h5,p,a,li,ul,td,.footer,.address,.phone,.email,#title,.copyright,.emailTop,.phoneTop,.address{
	font-family: 'Titillium Web', sans-serif;
}

#title{
	font-size: 50px;
	color: #ffffff;
	font-weight: 300;
	line-height: 40px;
	letter-spacing: 0.07em;
	text-shadow: 2px 2px 3px rgba(0,0,0,0.70);
}

h2{
	font-size:50px;
	color:#3E73A3;
}

p{
font-size:24px;
}

td{
	/*vertical-align: text-top;*/
	font-size:26px;
	line-height:26px;
	color:#3E73A3;
}

.phoneTop{
	font-size:18px;
	font-weight:600;
	line-height:40px;
	color:#ccc;
	letter-spacing: 0.02em;
}

.emailTop{
	font-size:18px;
	font-weight:600;
	line-height:40px;
	color:#ccc;
	letter-spacing: 0.02em;
}

.phone{
	margin-top:50px;
	font-size:46px;
	color:#ffffff;
	font-weight:600;
	line-height:40px;
}

.address{
	font-size:22px;
	font-weight:200;
	line-height:24px;
	color:#ffffff;}

.email{
	font-size:28px;
	font-weight:200;
	line-height:50px;
	color:#ffffff;
}

.copyright{
	margin-top:15px;
	font-size:18px;
	color:#ffffff;
	font-weight:200;
	line-height:40px;
}

a:link{
	color: #fff;
	text-decoration: none;
	cursor: default;
}

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

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

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


/*==========================================DEVICES==========================================*/

/* Smartphones (portrait and landscape) ----------- */
@media screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
	
#logoWrapper{margin-top: 200px;}
	
header{height: 80px;}
	
.emailTop{font-size:30px;}
	
.phoneTop{font-size:30px;}

.phone{font-size:60px;}


}

/* iPads (portrait and landscape) ----------- */
@media screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
	
#logoWrapper{margin-top: 200px;}
	
header{height: 80px;}
	
.emailTop{font-size:30px;}

.phoneTop{font-size:30px;}

.phone{font-size:60px;}

}

/* ----------- Non-Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) { 
  

}