/*css*/
@import "../css/reset.css";
@import "../css/skeleton.css";
@import "../fonts/font-awesome.css";
@import url(//fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900);
@import url(//fonts.googleapis.com/css?family=Roboto+Slab:300,400,700);

	html, body {
		background: #062e5f;
		font: 13px/18px Arial, sans-serif;
		font-family: 'Roboto', serif;
		color: #41628b;
		min-width:300px;
	}

	* { -webkit-text-size-adjust: none;}
	
	
	.w2 { width: 20%;}

	a { color: inherit; text-decoration: none; transition: all .4s ease;}
	a:hover { text-decoration: none; transition: all 0.4s ease;}
	a[href^="tel:"] {color: inherit;text-decoration:none;}
	.a-hov { transition: all 0.4s ease;}
	.a-hov:hover,
	h3 a:hover,
	.text-6 a:hover { color: #b04041;}

	ul li a { transition: all 0.4s ease;}

	h1, h2, h3, h4, h5, h6 {  font-family: 'Roboto Slab', serif;}
	h1 {font-size: 30px;}
	h2 { font-size: 30px; line-height: 36px; color: #fff; font-weight: bold; padding-top: 51px; letter-spacing: 1px; padding-bottom: 23px;}
	h3 { font-size: 20px; line-height: 24px; color: #fff; font-weight: 300; padding-bottom: 16px;}
	h4 { }
	h5 { }


	.title-1 {
		font-family: 'Roboto Slab', serif;
		font-weight: bold;
		font-size: 60px;
		line-height: 68px;
		color: #fff;
		letter-spacing: 1px;
		text-shadow: 1px 3px #05244a;
	}
	.title-2 {
		font-family: 'Roboto Slab', serif;
		font-weight: bold;
		font-size: 30px;
		line-height: 34px;
		color: #b04041;
	} 
	.text-1 { color: #fff;}
	.text-2 {
		font-size: 14px;
		line-height: 16px;
		color: #fff;
		text-transform: uppercase;
		font-weight: bold;
		font-family: 'Roboto Slab', serif;
		letter-spacing: 2px;
	}
	.text-3 {
		font-size: 30px;
		line-height: 34px;
		color: #fff;
		font-family: 'Roboto Slab', serif;
		letter-spacing: 3px;
	}
	.text-4 {
		font-size: 20px;
		line-height: 24px;
		color: #3b6599;
		text-transform: uppercase;
		font-family: 'Roboto Slab', serif;
	}
	.text-5 {
		font-size: 13px;
		line-height: 18px;
		color: #41628b;
		text-transform: none;
		letter-spacing: 0px;
	}
	.text-6 {
		font-size: 20px;
		line-height: 24px;
		color: #fff;
		font-family: 'Roboto Slab', serif;
		font-weight: lighter;
		letter-spacing: 1px;
	}
	p.text-6 { padding-bottom: 10px;}

	.text-2 + .text-3 { padding-top: 4px;}
	img + .text-6 { padding-top: 26px;}
	ul.list + h3  {
		margin-top: 20px;
	}


	.btn {
		display: inline-block;
		text-align: center;
		vertical-align: middle;
		transition: all 0.4s ease;
	}
	.btn:hover { }

	.link {
		display: inline-block;
		text-align: center;
		vertical-align: middle;
		transition: all 0.4s ease;
		font-family: 'Roboto Slab', serif;
		font-size: 14px;
		line-height: 16px;
		color: #fff;
		border-bottom: 1px solid #fff;
	
		letter-spacing: 1px;
		margin-top: 16px;
	}
	.link:hover { color: #41628b; border-bottom: 1px solid #41628b;}

	.link-1 {
		display: inline-block;
		font-size: 13px;
		line-height: 18px;
		color: #b04041;
		font-weight: bold;
	
		margin-top: 5px;
}
	.link-1:hover { text-decoration: underline;}

	.list li {
		font-family: 'Roboto Slab', serif;
		line-height: 24px;
		font-size: 14px;
	}
	.list li + li { margin-top: 0px;}
	.list li a { 
		color: #3b6599; 
		position: relative;
		display: inline-block;
		padding-left: 17px;
	}
	.list li a:before {
		position: absolute;
		content: "";
		width: 0;
		height: 0;
		border: 3px solid;
		left: 0;
		top: 11px;
		border-color: transparent transparent transparent #3b6599;
		transition: all .4s ease;
	}
	.list li a:hover { color: #fff;}
	.list li a:hover:before { border-color: transparent transparent transparent #fff;}

	.list-1 li {
		display: inline;
		font-family: 'Roboto Slab', serif;
		color: #fff;
		font-size: 30px;
		line-height: 36px;
		position: relative;
		padding-right: 5px;
		font-weight: 300;
		letter-spacing: 1px;
	}
	.list-1 li + li:before {
		position: relative;
		content: "+";
		padding-right: 5px;
	}
	.list-1 li + li { margin-top: 0px;}
	.list-1 li a { }
	.list-1 li a:hover { color: #3b6599;}

	.list-2 li {
		font-family: 'Roboto Slab', serif;
		font-size: 20px;
		line-height: 24px;
		text-transform: uppercase;
		margin-top: 10px;
		letter-spacing: 2px;
	}
	.list-2 li + li { 
		margin-top: 15px;
		padding-top: 15px;
		border-top: 1px solid #042956;
	}
	.list-2 li a { color: #3b6599;}
	.list-2 li span + span {
		display: block;
		overflow: hidden;
	}
	.list-2 li a:hover { color: #fff;}
	.list-2 .pag {
		display: inline-block;
		font-weight: bold;
		font-size: 30px;
		color: #fff;
		line-height: 20px;
		float: left;
		display: block;
		padding-right: 4px;
	}
	.list-2 .text-5 { display: block; padding-top: 7px;}
	.list-2.v1 li + li { border: none;}

	h2 + .list-2 li { margin-top: 5px;}


	/*auxiliary*/

	.img-ind {float: left; margin-right: 20px; margin-top: 5px;}
	.wrapper {width: 100%; position: relative;}
	.extra-wrap {overflow:hidden;}
	.grid_inside { margin: 0 -10px;}
	.aligncenter {text-align: center !important;}
	.alignleft { text-align: left !important; }
	.it {font-style:italic; display: inline-block;}
	.fleft {float: left;}
	.fright {float: right;}
	.h-underline:hover { text-decoration: underline;}
	.underline {text-decoration: underline;}
	.upp {text-transform: uppercase;}
	.transition {transition: all 0.4s ease;}

	.clearfix { *zoom: 1;}
	.clearfix:before,.clearfix:after {display: table; content: "";line-height: 0;}
	.clearfix:after { clear: both;}

	.pad-left { padding-left: 10px;}

	p {
	padding-bottom:	18px;
	color:#fff;
	font-size:16px;
	}

	.bg-1 {
		background: url(../images/fondo.jpg) center top no-repeat;
		background-size: 100% auto;
	}
	.bg-2 {
		background: #042956;
		margin-top: 55px;
		padding-bottom: 48px;
	}
	.bg-2 h2 { padding-top: 46px; padding-bottom: 21px;}
	.bg-3 {
		background: #042956;
		margin-top: 60px;
	}

	.img-ind + div > h3 { padding-top: 0px;}

/************Header************/

header {
	background: #fff;
	padding-bottom: 44px;
}
.page-1 header { padding-bottom: 0;}
h1 { float: left;}

/************Content***********/
.content { background: #001f44;}
.pad-bot { padding-bottom: 50px;}
.page-1 .pad-bot { padding-bottom: 48px;}

.block-1 {
	margin-top: 150px;
	width: 100%;
}

.box-1 .img-circle {
	display: block;
	width: 58px;
	height: 58px;
	border: 1px solid #fff;
	background-color: #fff !important;
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	-ms-border-radius: 500px;
	-o-border-radius: 500px;
	border-radius: 500px;
	margin-top: 55px;
	transition: all 0s ease;
}
.box-1 .img-circle.v1 {
	background: url(../images/page-1_img-6.png) center 0 no-repeat;
}
.box-1 .img-circle.v2 {
	background: url(../images/page-1_img-1.png) center 0 no-repeat;
}
.box-1 .img-circle.v3 {
	background: url(../images/page-1_img-2.png) center 0 no-repeat;
}
.box-1 .img-circle.v4 {
	background: url(../images/page-1_img-3.png) center 0 no-repeat;
}
.box-1 .img-circle.v5 {
	background: url(../images/page-1_img-4.png) center 0 no-repeat;
}
.box-1 .img-circle.v6 {
	background: url(../images/page-1_img-5.png) center 0 no-repeat;
}
.img-circle + h3 { padding-top: 22px; padding-right: 10px; padding-bottom: 15px;}

.box-1:hover .img-circle {
	background-position: center bottom;
	background-color: #001f44 !important;
	border-color: #34537b;
}
.box-1 h3 { transition: all .4s ease;}
.box-1:hover h3 { color: #34537b;}

.block-3 > div {     margin-top: 54px; } 
.banner {     background: #fff url(../images/bg-3.jpg) 0 0 no-repeat;      padding-bottom: 34px;} 
.banner .inside { 
	float: right; 
	width: 48%; 
	margin-right: 39px; 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
} 
.banner .inside .title-2 {     padding-top: 28px;     padding-bottom: 19px; } 
.banner .link {     color: #b04041; font-weight: bold;}
.banner .link:hover { color: #042956; }

.banner-1 {
	position: relative;
	background: #042956;
	overflow: hidden;
}
.banner-1 .inside {
	padding: 26px 40px 31px 32px;
	color: #3b6599;
	font-family: 'Roboto Slab', serif;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 30px;
	line-height: 32px;
	letter-spacing: 2.5px;
}
.banner-1 .abs {
	position: absolute;
	/*top: 0;*/
	bottom: 19px;
	right: -280px;
	left: 0;
	background: #3b6599;
	text-align: center;
	padding: 19px 0px 15px;
	font-family: 'Roboto Slab', serif;
	color: #fff;
	font-size: 14px;
	line-height: 18px;
	text-transform: uppercase;
	letter-spacing: 1px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
}
.banner-1 .abs:hover { background: #b04041;}

.banner-2 {
	background: #b04041;
	margin-top: 19px;
}
.banner-2 .inside {
	padding: 23px 77px;
	background: url(../images/icon-1.png) 32px 22px no-repeat;
}

.block-4 > div {
	margin-top: 46px;
}

.testimonials {
	background: #042956;
	margin-top: 59px;
	position: relative;
}
.testimonials h2 {
	color: #3b6599;
	text-transform: uppercase;
	padding-top: 0px;
}
.testimonials .inside {
	padding: 27px 34px 33px;
}
.testimonials .text {
	position: relative;
	padding: 19px 10px 21px;
}
.testimonials .text:before {
	position: absolute;
	content: "“";
	color: #fff;
	left: 0px;
	top: 0px;
	font-size: 36px;
	line-height: 36px;
	font-family: 'Roboto Slab', serif;
	font-weight: normal;
}
.testimonials .link-1 { margin-left: 11px;}
.testimonials .abs {
	position: absolute;
	width: 59px;
	height: 59px;
	background: url(../images/corner.png) 0 0 no-repeat;
	bottom: 0;
	right: 0;
}
.testimonials .abs:hover {
	opacity: .5;
}
.testimonials .text-6 { padding-left: 10px;}

.dropcap {
	
}
.dropcap_item + .dropcap_item {
	margin-top: 54px;
}
.dropcap .numb {
	width: 68px;
	text-align: center;
	padding: 15px 0px 20px;
	font-family: 'Roboto Slab', serif;
	color: #fff;
	font-weight: bold;
	font-size: 36px;
	line-height: 36px;
	background: #009bdb;
	float: left;
	margin-right: 26px;
	margin-top: 5px;
}

.products {
	margin-top: -6px;
}
.products > div {
	margin-top: 11px;
}



/************Footer************/

footer {
	color: #3b6599;
	font-family: 'Roboto Slab', serif;
	font-size: 14px;
	line-height: 16px;
	font-weight: bold;	
	padding-top: 45px;
	padding-bottom: 30px;
}
.f-logo {
	display: block;
	font-size: 30px;
	line-height: 32px;
	float: left;
	letter-spacing: 0.6px;
	margin-right: 7px;
}
.f-logo span {
	display: block;
	text-transform: uppercase;
}
.copyright {
	margin-top: 46px;
	letter-spacing: 1px;
}


	/*toTop*/

		#toTop {
		display:none;
		text-decoration:none;
		position:fixed;
		cursor:pointer;
		overflow:hidden;
		width: 53px;
		height: 27px;
		border:none;
		z-index:20;
		margin-right: -670px !important;
		right: 50%;
		bottom: 20px;
		background: url(../images/ui.totop.png) 0 0 no-repeat;
		transition: all 0s ease;
	}
	#toTop:hover {
		background-position: 0 bottom;
	}


		#toTop:active, #toTop:focus {outline:none;}



	/*touch-touch*/ 
	.magnifier {
		position:relative;
		display:block;
		background: url(../images/magnifier.png) center center no-repeat #fff;
		margin-bottom: 27px;
		border-radius: 50%;
	}
	.magnifier img {
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
		width: 100%;
		border-radius: 50%;
	}

	.magnifier:hover img {
		opacity: 0.4;
	}




/*contacts*/
	
	.address {margin-top: 7px; }
	.address a { text-decoration: none; color: #b04041; display: inline-block; margin-left: 12px;}
	.address a:hover { text-decoration: underline;}
	.address span {	display: inline-block;	width: 73px;} 
		.address span.e-mail {width:auto;}

	.map_wrapper {display: block;}
		.map_wrapper h3 { padding-top: 0; }

		dl.address dd span { text-align: left;}

	#map_canvas {
		width: 100%;
		height: 450px; 
		margin-top: 6px;
		margin-bottom: 28px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-ms-box-sizing: border-box;
		-o-box-sizing: border-box;
		box-sizing: border-box;
	}
	.map_wrapper .img-bord { margin-bottom: 22px;margin-top: 4px;}

.address dt { margin-bottom: 0px; color: #c9c8c3;}




	#contact-form {	position: relative; margin-top: 5px;}
	
	#contact-form label {
		display: inline-block;
		position: relative;
		min-height: 50px;
		width: 100%;
	}
	
	#contact-form label input,
	#contact-form label textarea {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-ms-box-sizing: border-box;
		-o-box-sizing: border-box;
		box-sizing: border-box;
		position: relative;
		float: left;
		outline: none;
		border-radius: 0;
		outline: none;
		box-shadow: none;
		width: 100%;
		font: 13px/18px Trebuchet MS, sans-serif;
		font-family: 'Roboto', serif;
		color: #41628b;
		background: #001936;
		border: 1px solid #0e294c;
		-webkit-appearance: none;
	}
	
	#contact-form label input {
		height: 40px;
		box-shadow: none !important;
		padding: 10px 7px 10px 20px;
		outline: none;
	}
	#contact-form label textarea {
		height: 494px;
		overflow: auto;
		width: 100%;
		padding: 10px 7px 10px 13px;
		margin: 0px;
		resize: none;
	}

	.form_buttons {
		text-align: right;
	}
	.form_buttons a {
		margin-top: 20px;
	}



#contact-form span {
	display: block;
}
#contact-form ._placeholder {
	position: absolute;
	/*!*/
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	cursor: text;
	width: 100% !important;
	padding: 10px 7px 10px 13px;
	opacity: .99;
	display: block;
	font: 13px/18px Trebuchet MS, sans-serif;
		font-family: 'Roboto', serif;
		color: #41628b;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-ms-box-sizing: border-box;
		-o-box-sizing: border-box;
		box-sizing: border-box;
}
#contact-form ._placeholder.focused {
	opacity: .4;

}
#contact-form ._placeholder.hidden {
	display: none;
}

#contact-form .message {
	width: 100%;
}	
#contact-form .error-message,
#contact-form .empty-message {
	height: 0;
	overflow: hidden;
	font: 10px/20px Arial;
	-webkit-transition: 0.3s ease-in height;
	-moz-transition: 0.3s ease-in height;
	-o-transition: 0.3s ease-in height;
	transition: 0.3s ease-in height;
	position: absolute;
	right: 3px;
	top: 0;
}
#contact-form .invalid .error-message,
#contact-form .empty .empty-message {
	height: 20px;
}
#contact-form .success-message {
	position: absolute;
	overflow: hidden;
	height: 0;
	left: 0;
	top: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	z-index: 10;
	width: 100%;
	text-align: center;
	-webkit-transition: all 0.7s linear;
	-moz-transition: all 0.7s linear;
	-o-transition: all 0.7s linear;
	transition: all 0.7s linear;
	padding: 0px 0;
	width: 100%;
		font: 13px/18px Trebuchet MS, sans-serif;
		font-family: 'Roboto Slab', serif;
		color: #41628b;
		background: #001936;
		-webkit-appearance: none;
		
}
#contact-form.success .success-message {
  	padding: 72px 0;
	border: 1px solid #0e294c;
	-webkit-transition: all 0.7s linear;
	-moz-transition: all 0.7s linear;
	-o-transition: all 0.7s linear;
	transition: all 0.7s linear;
}

/*--- contact_form end------*/

@media only screen and (max-width: 995px) {
	
	#contact-form label {display: block; width: 100%;}
	#contact-form label input {	width: 100%;}
	#contact-form label textarea {	width: 100%;}
	#contact-form fieldset.fleft { width: 100%; }
	#contact-form fieldset.fright { width: 100%; }

	#map_canvas { width: 100%;}
	.address { width: 50%;}
	.address span { width: 83px;}
}
@media only screen and (max-width: 767px) {
	#contact-form .success { left: 0; right: 0;}
	#map_canvas { height: 300px; }
	#contact-form label textarea { height: 250px;}
	.address { width: 100%;}
	.address + .address { margin-top: 30px;}
}
@media only screen and (max-width: 479px) {
	.address { width: 100%; float: none;}
	#map_canvas { height: 200px;}
}
@media only screen and (max-width: 320px) {

}


/*==================================RESPONSIVE LAYOUTS===============================================*/


@media only screen and (max-width: 1024px) {
	.block-1 { margin-top: 300px;}

}
@media only screen and (max-width: 995px) {
	.bg-1 { background-size: auto auto;}
	.block-1 { margin-top: 237px;}
	.banner .inside { background: url(../images/opac-1.png) 0 0 repeat; width: 100%; margin-right: 0; padding: 0 20px;}
	.banner-1 .inside { font-size: 20px; line-height: 22px;}
	.banner-1 .abs {
		bottom: 19px;
		right: -205px;
	}
	.img-ind { margin-bottom: 20px;}
	.w1 { width: 40%;}
	
	.w2 { width: 20%;}
}
@media only screen and (max-width: 767px) {
	.box-1 { width: 46% !important; margin-left: 2%; margin-right: 2%; margin-bottom: 50px;}
	.banner-1 .abs {
		bottom: 10px;
		right: -336px;
	}
	.list-1 li { font-size: 25px; line-height: 27px;}
	.team img { width: 40%; margin-right: 20px; float: left;}
	.team img + .text-6 { padding-top: 0;}
	.team > div + div { margin-top: 30px;}
	.products > div { width: 46% !important; margin-left: 2%; margin-right: 2%;}
	.products > div { margin-top: 30px;}
	header { padding-bottom: 0;}
}
@media only screen and (max-width: 479px) {
	.box-1 { width: 100% !important; margin-left: 0; margin-right: 0; }
	.block-1 { margin-top: 232px;}
	.title-1 { font-size: 30px; line-height: 40px;}
	.banner-1 .abs {
		position: relative;
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		bottom: auto;
		right: 0;
		display: block;
	
	}
	.products > div { width: 100% !important; margin-left: 0; margin-right: 0;}
	.f-logo { float: none;}
}
@media only screen and (max-width: 320px) {

}
