@import url('http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,300,300italic,200italic,200,700italic,700,600italic,900,900italic');
/* default */
* { margin:0; padding:0;}
h1,h2,h3,h4,h5,h6{ padding:0; margin:0; font-weight:normal;}
a { text-decoration:none;}
a img { border:0;}
ul,ol { list-style:none;}
.hidden{ text-indent:-999em; overflow:hidden;}
hr.hide-line{ padding:0; margin:0; display:none;}
.clear{ clear:both;}
.clearfix:after {content:"."; display:block; height:0; clear:both;visibility:hidden;}
.clearfix {display:inline-block;}

/* Hide from IE Mac \*/
.clearfix {display:block;}/* End hide from IE Mac */


/*nojavascript*/
.nojavascript{ position:absolute; z-index:1; color:red; background:#fff; font:bold 12px 'Trebuchet MS',Arial,georgia, San-serif; border:2px red dashed; width:1200px; top:0; left:50%; margin-left:-495px; }


/* Body */
body{ font: 100% 'Source Sans Pro', sans-serif; background:url(../images/common/banner-bg.jpg) no-repeat center top 145px  #FFF; margin:0; padding:0; text-align: center; color:#000;}



/* header */
header  {width: 100%; /*max-width: 1440px;*/ margin: 0 auto; padding: 0; background:url(../images/common/header-bg.png) repeat-x center top; position: fixed; left: 0; right: 0; z-index: 1000;}
#header {width: 100%; max-width: 1200px; min-height:150px; margin:0 auto; padding:0; text-align: left; }
#header .logo {float: left; margin: 45px auto 0; display: block; width: 100%; max-width: 400px}
#header .info {float: right; color: #5B9A85; font-size: 11px; font-weight: 700; line-height: 35px}
#header .info a img {display: inline-block; vertical-align: middle; padding: 1px}


/*navigation*/
nav { margin: 0 auto; padding: 35px 0 0 0; float: right;}
nav.mobile {display: none;}
nav a#pull {display: none;}
nav ul { margin:0 auto; padding:0;}
nav ul li { float:left; margin:0; padding:0;}
nav ul li a { display:block; text-align:center; margin:0 17px; padding:10px 20px; color:#5B9A85; font-size: 18px; border: 1px solid rgba(0, 0, 0, 0)}
nav ul li a:hover, nav ul li a.active {color: #fff; border:1px solid #5C9B85;}		


/* banner */
#banner-wrapper {width: 100%; /*max-width: 1440px;*/ margin: 0 auto; padding: 0;position: relative;}


/* main */
#main { width: 100%; /*max-width:1440px;*/ position:relative; margin:0 auto; padding:0;  height:100%; text-align:left;}
#main p {color: #538D7A; font-size: 18px; text-align: left; margin: 30px 0;}
#main h2 {color: #81B4A2; font-size: 44px; font-weight: 200; padding: 0}
#main a.btn {display:none;width: 140px;height: 45px;line-height: 45px; text-align: center; margin: 100px 0 0 0;border: 1px solid #5C9B85; color: #fff; font-size: 12px; font-weight: 700}
#main a.btn:hover {color: #4F90FF; border: 1px solid #4F90FF}
#main img.arrow {position: absolute; bottom: 15px; left: 0; right: 0; margin: 0 auto}


/* content about*/
#content-about-wrapper {width: 100%; /*max-width: 1440px;*/ margin: 0 auto;padding: 0; background:url(../images/content/about.jpg) no-repeat center left #182E33; position: relative;}
#content-about {width:100%; max-width: 1200px; margin:0 auto; padding:0; min-height:694px;}	
#content-about div {float: right; width:100%; max-width: 605px; text-align: left;}
#content-about h2 {padding: 80px 0 0 0}


/* content risk*/
#content-risk-wrapper {width: 100%; /*max-width: 1440px;*/ margin: 0 auto;padding: 0; background: url(../images/content/risk.jpg) no-repeat center right #fff; position: relative;}
#content-risk {width:100%; max-width: 1200px; margin:0 auto; padding:0; min-height:697px;    overflow: hidden;}	
#content-risk div {width:100%; max-width: 590px;}
#content-risk h2 {padding:30px 0 0 0; color: #0C1D1F}
#content-risk p {color: #0C1D1F; font-size: 18px}
#content-risk a.btn {color: #5C9B85; margin: 300px 0 0 0}


/* content maps*/
#content-maps-wrapper {width: 100%; /*max-width: 1440px;*/ margin: 0 auto;padding: 0; background: url(../images/content/maps.jpg) no-repeat center left #182E33; position: relative;}
#content-maps {width:100%; max-width: 1200px; margin:0 auto; padding:0; min-height:700px;}	
#content-maps div {float: right; width:100%; max-width: 605px; text-align: left;}
#content-maps h2 {padding:30px 0 0 0;}
#content-maps div p span {color: #fff; font-size: 15px}


/* content contact*/
#content-contact-wrapper {width: 100%; /*max-width: 1440px;*/ margin: 0 auto;padding: 0; background:url(../images/content/contact.jpg) no-repeat center top; background-size: 100% 100%;}
#content-contact {width:100%; max-width: 1200px; margin:0 auto; padding:0; min-height:698px; overflow: hidden;}	
#content-contact h2 {padding:50px 0 0 0; color: #0C1D1F; font-size:48px;}
#content-contact div, #content-contact div p, #content-contact div h2 {text-align: center;}
#content-contact div p {font-size: 24px;color: #0C1D1F; margin: 50px 0}
#content-contact div p:last-child {font-size: 14px; line-height: 30px}
#content-contact div p:last-child a img {padding: 2px}
#content-contact div p a {font-weight: 700; color:#0C1D1F }
#content-contact div img.logo2 {display: block; margin: 20px auto; width: 100%; max-width: 690px}


/* content bot*/
#content-bot-wrapper {width: 100%; /*max-width: 1440px;*/ margin: 0 auto;padding:0; background:#425458}
#content-bot {width:100%; max-width: 1000px; margin:0 auto; padding:0; min-height:235px; color: #fff; overflow: hidden;}
#content-bot p b {font-size: 12px;}
#content-bot p {font-size: 11px; margin:0 0 20px 0; line-height: 160%}


/* footer */
footer {width: 100%; /*max-width: 1440px;*/ margin: 0 auto; padding: 0; background:#182E33}
#footer {width: 100%; max-width:1200px; min-height:95px; margin:0 auto; padding:0;}
#footer .navigation { margin: 0; padding: 10px 0; font-size: 18px;}
#footer .navigation a {color: #fff}
#footer .navigation a:hover, #footer .navigation a.active {color: #4F90FF}
#footer .navigation span {padding: 2px; color: #fff}
#footer h5 {padding:0; font-size:18px; line-height:190%;color: #fff}



/*************************************************************************/
/*************************************************************************/

@media screen and (max-width: 980px){
nav ul li a {padding: 5px; margin: 0 5px}
}

@media screen and (max-width: 800px){
	#content-about-wrapper, #content-risk-wrapper, #content-contact-wrapper, #content-bot-wrapper, #content-maps-wrapper {width: auto; padding: 0 15px;}
	#content-about-wrapper div, #content-risk-wrapper div, #content-contact-wrapper div, #content-bot-wrapper div, #content-maps-wrapper div {margin: 0 auto!important; float: none!important; text-align: center!important; padding: 0!important}
	#content-about, #content-risk, #content-contact, #content-bot, #content-maps {min-height: 200px; overflow: hidden;z-index: 1}
	#main p {text-align: center;}
	#main a.btn {margin: 20px auto!important}
	#main img.arrow {position: relative;display: block; margin: 20px auto}
	#header .logo {max-width: 300px}
	#content-about div {background: rgba(0,0,0,.7);}
}


/*********************************************************************************/
@media screen and (max-width: 768px) {
	header {width: auto; padding: 0 15px; background-size: auto 100%!important; position: fixed;}
	#header {height: 190px}
	#header .info {margin: 0 auto; float: none; text-align: center;background: #101F22;}
	#header .logo {margin: 20px auto; float: none;}
	#banner-wrapper {float: left; margin:190px 0 0 0;}
	#main {float: left;}
	nav {display: none;}
	nav.mobile {display: block; float: none; padding: 0;width: 100%; z-index: 9999;}
	nav.mobile a#pull {display: block; height: 45px; line-height: 45px; text-align: left; color: #fff; padding: 0 15px; background: #000}
	nav.mobile a#pull:after {content:"";background: url('../images/nav-icon.png') no-repeat;width:30px;height:30px;display:inline-block;float:right;margin:12px 0 0 0}
	nav.mobile ul {display: none; background:#000;}
	nav.mobile ul li {display: block; float: none; width: 100%; border-top: 1px solid #fff; padding: 0; margin: 0}
	nav.mobile ul li a {text-align: left; padding: 0; line-height: 45px;border: none;}
	nav.mobile ul li a:hover, nav.mobile ul li a.active {border: none;}
}



/*********************************************************************************/
@media screen and (max-width: 360px) {
	#main h2 {font-size: 35px}
	#main p,#content-maps div p span {font-size: 14px}
	#content-contact div p {font-size: 16px}
	#footer h5, #footer .navigation {font-size: 11px; line-height: normal;}
	#content-about div h2 {padding: 30px 0 0 0}
}