@charset "utf-8";

/************************************ CSS Document ************************************/
*{
    margin: 0;
	border: 0;
	padding: 0;
}
html, body{
   	height: 100%;
	min-height: 100%;
	font-family: "Open Sans", Arial;
	color: #333;
	background: #f1f1f1;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	font-size: 16px;
}
small {
	font-size: 80%;
}
#container{
	min-height: 100%;
   	position: relative;
}
header, #body, footer{ width: 100%; }
header{
	min-height: 100px;
	background: rgba(255,255,255,1);
}
#body{
	height: 100%;
   	padding-bottom: 70px;   /* Height of the footer */
}
footer{
	background: #dde4e9;
	z-index: 10;
	position: absolute;
	bottom: 0;
   	height: 70px;   /* Height of the footer */
}
.content{
	position: relative;
	max-width: 1200px;
	height: 100%;
	margin: 0 auto;
}
.clear{ clear: both; }
.clearfix:before, .clearfix:after {
	content: " ";  
	display: table;
}  
.clearfix:after { clear: both; }  
.clearfix { *zoom: 1; }
a{ text-decoration: none; color: #333; }
a:hover{ color: #5682c0; }
.row{
	width: 100%;
	position: relative;
	min-height: 1px;
	float: left;
}
.row:before,
.row:after {
  display: table;
  content: " ";
}
.row:after {
  clear: both;
}
h1, h2, h3, h4{
	color: #bd5f23;
	font-weight: 400;
	padding: 40px 20px;
}
h1{
	font-size: 1.5em;
	color: #000;
}
h2{
	font-size: 1.4em;
	color: #000;
}
h3{
	font-size: 1.3em;
	color: #000;
}
h4{
	font-size: 1.2em;
	color: #000;
}
h4{
	text-align: center;
	font-size: 1.1em;
	font-weight: bold;
	letter-spacing: 1px;
	padding: 100px 0 15px 0;
	color: #5682c0;
}
.interna{
	padding-bottom: 70px;
}
.interna  p{
	text-align: center;
	font-size: .8em;
	letter-spacing: 1px;
	padding: 0 0 40px 0;
}
.importante{
	color: #900;
}
.separator{
	width: 97%;
	height: 1px;
	background: rgba(51,51,51,.1);
	margin: 0 20px;
	position: relative;
	z-index: 9999;
}
img{
	max-width: 100%;
}
.grey-bg{
	background: #eaeaea;
}
.white-bg{
	background: #fff;
}
.padding{
	padding: 0 20px;
}
.space{ width: 100%; min-height: 1px; padding: 20px 0; }


/************************************ Columnas ************************************/
.col-1-4, .col-2-4, .col-3-4, .col-1-2, .col-1-3, .col-2-3, .col-1, .col-1-5, .col-2-5, .col-3-5, .col-4-5, .col-1-6, .col-2-6, .col-3-6, .col-4-6, .col-5-6, .col-1-7, .col-2-7, .col-3-7, .col-4-7, .col-5-7, .col-6-7, .col-1-8, .col-2-8, .col-3-8, .col-4-8, .col-5-8, .col-6-8, .col-7-8, .col-1-9, .col-2-9, .col-3-9, .col-4-9, .col-5-9, .col-6-9, .col-7-9, .col-8-9, .col-1-10, .col-2-10, .col-3-10, .col-4-10, .col-5-10, .col-6-10, .col-7-10, .col-8-10, .col-9-10{
	position: relative;
	min-height: 1px;
	float: left;
	margin: 0;
}
.col-1{ width: 100%; }
.col-1-4{ width: 25%; }
.col-2-4{ width: 50%; }
.col-3-4{ width: 75%; }
.col-1-2{ width: 50%; }
.col-1-3{ width: 33.333333%; }
.col-2-3{ width: 66.666666%; }
.col-1-5{ width: 20%; }
.col-2-5{ width: 40%; }
.col-3-5{ width: 60%; }
.col-4-5{ width: 80%; }
.col-1-6{ width: 16.666666%; }
.col-2-6{ width: 33.333333%; }
.col-3-6{ width: 50% }
.col-4-6{ width: 66.666666%; }
.col-5-6{ width: 83.333333%; }
.col-1-7{ width: 14.2857142%; }
.col-2-7{ width: 28.5714285%; }
.col-3-7{ width: 42.8571428%; }
.col-4-7{ width: 57.1428571%; }
.col-5-7{ width: 71.4285714%; }
.col-6-7{ width: 85.7142857%; }
.col-1-8{ width: 12.5%; }
.col-2-8{ width: 25%; }
.col-3-8{ width: 37.5%; }
.col-4-8{ width: 50%; }
.col-5-8{ width: 62.5%; }
.col-6-8{ width: 75%; }
.col-7-8{ width: 87.5%; }
.col-1-9{ width: 11.1111111%; }
.col-2-9{ width: 22.2222222%; }
.col-3-9{ width: 33.3333333%; }
.col-4-9{ width: 44.4444444%; }
.col-5-9{ width: 55.5555555%; }
.col-6-9{ width: 66.6666666%; }
.col-7-9{ width: 77.7777777%; }
.col-8-9{ width: 88.8888888%; }
.col-1-10{ width: 10%; }
.col-2-10{ width: 20%; }
.col-3-10{ width: 30%; }
.col-4-10{ width: 40%; }
.col-5-10{ width: 50%; }
.col-6-10{ width: 60%; }
.col-7-10{ width: 70%; }
.col-8-10{ width: 80%; }
.col-9-10{ width: 90%; }


/************************************ Header ************************************/
.tel-header, .email-header{
	position: relative;
	float: left;
	margin-left: 20px;
	padding: 13px 10px 13px 0;
	font-size: .7em;
	letter-spacing: 1px;
}
.redes-header{
	position: relative;
	right: 20px;
}
.facebook-header, .twitter-header{
	position: relative;
	float: right;
	margin: 14px 0 10px 5px;
	cursor: pointer;
}
.facebook-header{
	width: 14px;
	height: 14px;
	background: none;
}
.twitter-header{
	width: 17px;
	height: 14px;
	background: none;
}
.facebook-header:hover, .twitter-header:hover{
	color: #333;
}


.logo img{
	padding: 30px 20px;
	position: relative;
	float: left;
	max-width: 70%;
}


/************ Nav ************/
nav{
	position: relative;
	float: right;
	right: 5px;
	margin-top: 60px;
	font-size: .8em;
	font-weight: 400;
	letter-spacing: 1px;
}
nav ul{
	list-style: none;
}
nav ul li{
	display: inline-block;
	cursor: pointer;
}
nav ul li p{
	padding: 0 15px 65px 15px;
}
nav ul li p:hover{
	color: #5682c0;
}
.icono-menu-responsivo-container{
    position: relative;
    width: 70px;
    height: 120px;
    margin: auto 0;
	float: right;
}
.icono-menu-responsivo{
	width: 30px;
	height: 26px;
	background: url(../imgs/icon-responsive-menu.png) center center no-repeat;
	padding: 0 20px;
	position: absolute;
	cursor: pointer;
	display: none;
    left:0;
    right:0;
    top:0;
    bottom:0;
    margin: auto;
}
.icono-menu-responsivo-small-devices{
	display: none;
	width: 30px;
	height: 26px;
	background: url(../imgs/icon-responsive-menu.png) center center no-repeat rgba(255,255,255,.9);
	cursor: pointer;
    margin: auto;
	position: fixed;
	top: 20px;
	right: 20px;
	padding: 10px;
	z-index: 1050;
}
.menu-responsivo{
	width: 100%;
	height: 100%;
}
.menu-responsivo ul{
	list-style: none;
	text-align: center;
	display: none;
	height: auto;
}
.menu-responsivo ul li{
	width: 100%;
	display: inline-block;
	font-size: .9em;
	letter-spacing: 1px;
	font-weight: 100;
	border-top: 1px solid rgba(68,114,176,.10);
}
.menu-responsivo ul li p{
	color: #656565;
	cursor: pointer;
	padding: 40px ;
	font-weight: 400;
}
.menu-responsivo ul li p:hover{
	color: #5682c0;
}
p.activo{
	border-bottom: 1px solid #5682c0;
	color: #5682c0;
}
.menu-responsivo ul li p.activo{
	color: #5682c0;
}
.menu-responsivo-small-devices{
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,1);
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 9999;
	display: none;
	text-align: center;
	overflow: scroll;
}
.menu-responsivo-small-devices li{
	border-bottom: 1px solid rgba(68,114,176,.10);
	letter-spacing: 1px;
}
.menu-responsivo-small-devices p{
	font-size: 1.2em;
	padding: 30px 0;
	cursor: pointer;
}
.menu-responsivo-small-devices p:hover{
	font-size: 1.2em;
	padding: 30px 0;
	cursor: pointer;
	color: #5682c0;
}


.secondary-nav{
	max-width: 100%;
	position: fixed;
	top: 0;
	z-index: 9999;
	background: rgba(255,255,255,.95);
}
.secondary-nav .logo img{
	padding: 20px 20px;
}
.secondary-nav nav{
	margin-top: 55px;
}
.secondary-nav nav ul li p{
	padding: 0 15px 43px 15px;
}


/************************************ Body ************************************/
.img-top{
	background: url(../imgs/bg-img-top.jpg) center 0 no-repeat rgba(87,138,194,1);
}
.pattern-img-top{
	background: url(../imgs/pattern-img-top.png) 0 0 repeat transparent;
}
.img-top h1{
	font-family: 'Open Sans Condensed', arial;
	font-size: 1.7em;
	color: #fff;
	text-shadow: 0 1px 2px solid rgba(0,0,0,.32);
	padding: 140px 20px;
	letter-spacing: .5px;
	line-height: 36px;
	text-shadow: 0 1px 2px rgba(0,0,0,.32);
}
.img-top h1 span{
	font-size: 1.8em;
	font-weight: 300;
}
.img-top img{
	margin-top: -40px;
}

.block{
	background: #FFF;
}
.block h2{
	font-family: 'Open Sans Condensed', arial;
	font-size: 1.7em;
	font-weight: 100;
	font-style: italic;
	text-align: center;
	padding: 150px 20px;
	color: #666;
	letter-spacing: 1.1px;
	line-height: 32px;
}

.mision-vision{
	background: url(../imgs/bg-mision-vision.jpg) center 0 no-repeat transparent;
}
.mision, .vision{
	background: rgba(255,255,255,.9);
	margin: 90px 20px 0 20px;
	box-shadow: 0 0 5px rgba(0,0,0,.22);
	min-height: 251px;
}
.mision p, .vision p{
	padding: 20px;
}
.mision h3, .vision h3{
	font-size: 1.6em;
	color: #5682c0;
	padding: 50px 20px 20px 20px;
}
.vision h3{
	padding: 50px 20px 20px 10px;
}
.responsive-vision-title{ 
	display: none;
}
.mision p, .vision p{
	font-size: .85em;
	font-weight: 100;
	letter-spacing: .7px;
	line-height: 22px;
	text-align:justify;
}
.col-mision, .col-vision{
	margin: -50px 0 5px 0;
	min-height: 160px;
}
.bottom-mision,.bottom-vision{
	width: 100%;
	height: 30px;
	position: relative;
	background: #3B7ABF;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	border: 1px solid #fff;
}
.bottom-mision, .bottom-vision{
	float: left;
}
.icono-mision{
	width: 150px;
	height: 150px;
	border-radius: 100px;
	background: url(../imgs/mision-icon.png) 54% 46% no-repeat rgba(255,255,255,.9);
	position: relative;
	top: -75px;
	left: 20px;
	box-shadow: 0 0 3px rgba(0,0,0,.13);
}
.icono-vision{
	width: 150px;
	height: 150px;
	border-radius: 100px;
	background: url(../imgs/vision-icon.png) center center no-repeat rgba(255,255,255,.9);
	position: relative;
	float: right;
	margin-right: 20px;
	top: -75px;
	box-shadow: 0 0 3px rgba(0,0,0,.13);
}
.responsive-mision, .responsive-vision{
	margin: 70px 0;
}


.horario h2{
	text-align: justify;
	padding: 140px 20px 120px 20px;
}
.img-horario{
	margin: 130px 0 130px 20px;
	float: right;
}
,img-horario img{
	max-width: 100%;
}


.clientes{
	border-top: 1px solid rgba(255,255,255,.5);
}
.separador-horizontal{
	width: 50%;
	height: 1px;
	margin: 0 auto 40px auto;
	position: relative;
	background: rgba(51,51,51,.2);
	box-shadow: 0 1px 2px rgba(255,255,255,.2);
}
.light{
	background: #f3f3f3;
}
.dark{
	background: #e5e5e5;
}
.dark, .light{
	margin: 0;
}
.client-block{
	text-align: center;
	padding: 15px 15px;
}
.client-block img{
	max-width: 100%;
}


.productos{
	border-top: 1px solid rgba(255,255,255,.5);
	background: #f5f7f8;
}
h2.title{
	font-size: 2em;
	color: #5481C2;
	font-weight: 400;
	padding: 40px 20px 40px 60px;
}
h3.subtitle{
	font-size: 1.2em;
	padding: 0 20px 40px 60px;
	text-align: justify;
}
.bx-wrapper img{
	padding: 40px 10px;
}
#bx-pager{
	text-align: center;
}
#bx-pager a{
	padding: 0 7px;
}


.mapa{
	padding: 0 20px 40px 20px;
}
.tel-contacto p, .mail-contacto p, .adr-contacto p{
	padding: 15px 0 15px 30px;
	text-align: left;
}
.tel-contacto{
	margin: 0 0 0 60px;
}
.mail-contacto{
	margin: 0 0 0 20px;
}
.info-contacto-responsive span{
	width: 15px;
	text-align: center;
}
.fa{
	color: #5481C2;
	padding-right: 5px;
}
.form-contacto{
	margin: 40px 0;
}
.form{
	padding: 0 20px;
}
.form-contacto input, .form-contacto textarea{
	background: none;
	padding: 5px;
	line-height: 20px;
	font-size: .9em;
	width: 100%;
	font-family: "Lato",arial;
	font-weight: 100;
	letter-spacing: 1px;
	color: #B6C0C0;
	font-style: italic;
}
.form-contacto textarea{
	resize: none;
	font-size: inherit;
}
.input, .textarea{
	background: #fcfcfc;
	max-width: 100%;
	position: relative;
	margin: 0 auto 20px auto;
	padding: 10px 10px 10px 10px;
	border: 1px solid #efefef;
}
.btn-enviar{
	background: #fcfcfc;
	max-width: 50%;
	padding: 20px;
    font-size: 1em;
	letter-spacing: .5px;
	position: relative;
	margin: 0 auto;
	border: 1px solid #efefef;
	cursor: pointer;
}
.btn-enviar:hover{
	border: 1px solid rgba(51,153,255,.32);
	color: #5682c0;
}
.btn-enviar p{
	padding: 0px;
}
.campos-obligatorios{
	padding: 20px 0 0 0;
	font-size: .9em;
	color: #5682c0;
}
.contacto span{
	color: #5682c0;
}

/************************************ Footer ************************************/
.footer{
	background: #4F7DBF;
}
.logo-footer{
	font-weight: 100;
}
.logo-footer img{
	max-width: 36%;
	padding: 15px 10px 15px 20px;
}
footer a{
	color: #2B448B;
}
footer a:hover{
	color: #fff;
}
.derechos{
	text-align: center;
}
.derechos p{
	color: #fff;
	font-size: .8em;
	padding: 40px 0;
	letter-spacing:.5px;
}

.redes-footer{
	position: relative;
	padding: 40px 20px 40px 0;
}
.facebook-footer, .twitter-footer{
	position: relative;
	float: right;
	margin: 6px 0 0 5px;
	cursor: pointer;
	color: #fff;
}
.facebook-footer{
	width: 14px;
	height: 14px;
}
.twitter-footer{
	width: 17px;
	height: 14px;
}
.facebook-footer:hover, .twitter-footer:hover{
	color: #2b448b;
}


.construccion{
	max-width: 100%;
	height: 100%;
	background: url(../imgs/en-construccion.jpg) center 0 no-repeat transparent;
	padding-top: 100px;
	text-align: center;
}
.construccion p, .construccion small{
	font-size: 3em;
	font-weight: 400;
	color: #fff;
	text-shadow: 0 2px 2px rgba(0,0,0,.65);
	padding: 30px 20px;
}
.construccion small{
	font-size: 1.5em;
	padding: 30px 20px;
	line-height: 130px;
}


/* Galería */

.img-top-galeria{
	background: url(../imgs/bg-titulo-galeria.jpg) center 0 no-repeat transparent;
}
.title-galeria h1{
	color: #fff;
	font-weight: 300;
}
.title-section h2{
	padding: 80px 0 40px 0;
	color: #5682c0;
}
.desc-section p{
	padding: 0 0 30px 0;
}
.producto-img{
	padding: 30px;
}
.gallery-separator{
	width: 100%;
	height: 1px;
	background: rgba(86,130,192,.32);
	margin: 40px 0 20px;
	position: relative;
	z-index: 700;
	box-shadow: 0 1px 2px #FFF;
}
.galeria-productos{
	margin-bottom: 100px;
}
.responsive-btn-go-top, .responsive-btn-return{
	width: 16px;
	height: 16px;
	background: rgba(255,255,255,.95);
	padding: 10px;
	position: fixed;
	cursor: pointer;
	display: none;
    margin: auto;
	text-align: center;
	top: 20px;
	z-index: 99999;
}
.responsive-btn-go-top:hover, .responsive-btn-return:hover{
	color: #333;
}
.responsive-btn-go-top{
	right: 20px;
}
.responsive-btn-return{
	right: 60px;
}
.responsive-btn-go-top span.fa, .responsive-btn-return span.fa{ padding-right: 0; }