@charset "utf-8";
/* CSS Document */


@font-face {font-family:century;
src: url("../fonts/century.ttf") format("truetype");
}

@font-face {font-family:samsungb;
src: url("../fonts/samsung-b.otf") format("truetype");
}

@font-face {
font-family:century;
src: url("../fonts/century.otf") format("opentype");
}


/*--------*/

* {outline:0; padding:0; margin:0; box-sizing: border-box;}
html {font-size: 62.5%;}

body { font-family:century; overflow-x:hidden !important;  color:#cdcdcc; font-size:1.5rem; background:#f2f2f2; }
a {color:#66b6e1; text-decoration:none;} a:hover {color: #000;}
strong {color:#2a3640; }
b { color:#66b6e1;  }
i { color:#66b6e1;} 
p { padding:.5em 0; line-height:2rem; width:100%; font-size:1.5rem;} p i {margin-left:-.5em;} 

.boton {padding:1em; color:#fff; background:#66b6e1; border-radius:1em; font-family:samsungb; text-transform:uppercase; }
.boton i {color:#fff; } .boton:hover {background-color:#42596e; color:#fff; border:1px solid #fff; }

.centrado {text-align: center;}


#arriba { display:none; position:fixed; bottom:2em; right:30px; z-index:3000; background:#66b6e1; color:#fff; cursor: pointer; padding:13px  8px 10px 8px; border-radius:50px; border:0; box-shadow:0 3px 3px 0 rgba(0,0,0,0.5); line-height:18px; font-size:1.5rem;}
#arriba:hover {  color:#2a3640;}


main { width:100%; clear:both;  color:#5a5a5a; }
main ul { padding:.5em 0; } main ul li {list-style: none; padding:.25em 0; padding-left:27px; font-size:1.7rem;  } main ul li i {margin-left:-27px;}
 

h1 {font-size:3.5rem; line-height:4rem;  color:#66b6e1; text-align:center; padding:.5em 0 .5em 0; width:100%; font-family:samsungb; } 
h2 {font-size:2.5rem; line-height:3rem;  color:#2a3640; text-align:center; padding:.5em 0 .5em 0; width:100%;} 
h3 {font-size:2rem; line-height:2.5rem;  color:#fff; padding:.5em 0; width:100%;} 
h4 { font-size:4em; max-height:600px;  color:#fff;  text-align:center; padding:.5em 0; font-family:samsungb;} 
h5 { font-size:2.2em;  color:#468dcf; text-align:center; padding:.5em 0; font-family:samsungb; width:100%;}


.columna-2, .columna-3, .columna-4, .columna-5, .columna-6 {min-height:50px;  padding:1em 0; }


/*-------------------------Widget---------------*/


.widget  { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-evenly; padding:1em 0;  }

.widget .columna-3 {border-radius:.5em; width:350px; min-height:150px; background:#fff; box-shadow:2px 2px 2px #ccc; padding:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-start; text-align:center; 
margin:1em 0; }

.widget .columna-3icon {border-radius:.5em; width:330px; min-height:150px; background:#fff; box-shadow:2px 2px 2px #ccc; padding:0 .5em; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; text-align:center; 
margin:1em 0; }

.widget .columna-2 { width:500px; min-height:150px; padding:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-around; text-align:center; margin:1em 0; }

.widget .columna-2icon { border-radius:.5em; background:#fff; box-shadow:2px 2px 2px #ccc; width:500px; min-height:150px; padding:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; text-align:center; margin:1em 0; }

.widget .columna-3 img { max-height:150px; border-top-left-radius:.5em; border-bottom-left-radius:.5em; margin-right:1em;  }
.widget .columna-2 img { max-height:150px; margin-right:1em;  }

.widget span {padding:1em .5em;  }




/*-------------------------Slider---------------*/

.slider { text-align:center; background:#fff; }

.btn-floating1, .btn-floating2 {color:#CBCBCB; padding:0; font-size:2.5rem; z-index:11; cursor:pointer; position:absolute; bottom:.5em; }
.btn-floating1:hover, .btn-floating2:hover {color:#fff; cursor:pointer;} .btn-floating1 {margin-left:-35px; margin-right:35px;  }

.slider p { color:#5a5a5a; z-index:10;}
.slider p b { color:#66b6e1;}
.slider p a {padding:.8em 1em; color:#0D71B9; font-size:.8em; text-shadow:none; border:solid 1px rgba(255,255,255,0); box-shadow:0 0 12px #fff;  }
.slider p a:hover {color:#5a5a5a; }
.nota { color:#fff; font-size:1.1em; }


/*------------------Social Menu--------*/

.social { position:fixed; right:0; top:170px; z-index:10;  }
.social ul {list-style:none; text-align:right; padding:0; margin:0; }
.social ul li a {display:inline-block; color:#fff; background:#66b6e1; padding:12px 9px; text-decoration: none; border:solid 1px #FFF; font-size:1.5rem; border-right:0; margin-top:-1px; 
animation-direction: normal; -bkit-transition:400ms ease;-o-transition:400ms ease; transition:400ms ease;}
.social ul li a:hover {background:#0D71B9; padding:14px 11px; color:#fff;}



/*--------------------- slider logos -----*/

.columna-cliente { width:100%; min-height:50px; overflow:hidden;  margin-top:-1px; padding:1em 0 0 0; background:#fff; box-shadow:0px 6px 6px #acacac;}
.cliente { width:180px;  margin-left:-.3em; }


/*--------------------- extras -----*/

.icono { font-size:6rem; }
.icono2 { font-size:8rem; }
.foto { width:100%; margin-bottom:-3px; min-height:100px; border-radius:.3em;   }
.foto2 { width:100%; margin-bottom:-3px;  padding:2em 0 1em 0;}

main table {text-align: center; border-right: solid 1px #999; border-top: solid 1px #999;  background-color:rgba(0,0,0,.7); font-size:1.3rem; color:#fff; width:100%; } 
main table td {border-left: solid 1px #999; border-bottom: solid 1px #999; padding:.6em; }
.tit1 { background-color:#0069B4; color: #fff; font-ight: bold;  }


.rosa {background:#66b6e1; color:#fff; padding-top:1em; margin-top:-200px; }
.rosa h1::after, .rosa h1::before {color:#fff;}

.azul {background:#2a3640; color:#fff; padding-top:3em; display:flex; justify-content:space-evenly; flex-wrap:wrap; align-items:center;  }
.azul h1  {color:#66b6e1;} .azul h2, .azul h3 {color:#fff;}

.gris {background:#ccc; color:#000; padding-top:3em; display:flex; justify-content:space-evenly; flex-wrap:wrap; align-items:center;  }
.gris h1  {color:#66b6e1;} .gris h2, .gris h3 {color:#fff;}


.pdf { font-size: 3rem; color:#fff !important;}

.separador {width:100%; height:50px;}
.marcas { width:150px; height:150px; }

.blanco {color:#fff;}

.carta {background:#fff; padding:2em 1em; box-shadow:0 0 3px rgba(0,0,0,.3); border-radius:.5em; }


/*-------------------------------------- WEB--*/
	

@media screen and (min-width:1020px){
	
main { }
	
		
header { width:100%; height:200px; background:url("../images/top_inicio.svg") no-repeat bottom; display:flex;  flex-wrap:wrap; align-items:center; justify-content:center;  } 
	
.top { color:#fff; width:50%; text-align:right; margin-right:3em;  display:flex; flex-wrap:wrap; margin-top:-2em;} .top i {margin-left:-.5em !important;}
		
.logo {width:20%; text-align:center; } 	
.logo img {width:180px;}
.slogan {width:auto; text-align:left; background:#66b6e1; padding:0 1em; border-top-right-radius:1em; border-bottom-right-radius:1em; }	

	
	
.menu_movil {top:1.5em; left:1em; padding:0; margin:0; display:block; cursor:pointer; text-align:center; z-index:11; position:absolute;}
.btn_menu { display:block; padding:10px; color:#66b6e1; text-decoration:none; font-ight:normal; font-size:4rem;  }
	
nav {position:absolute; z-index:10; width:100%;  }		
nav ul { width:460px; left:-100%;  border:none; position:fixed; padding:10em 5em 5em 5em; top:0; background:#66b6e1; color:#fff; font-family:samsungb; box-shadow:6px 6px 3px rgba(0,0,0,.3);  } 
nav li {display:block; float:none; text-align:left;  width:100%; padding:0 !important ; border-right:none; }
nav a { font-size:2rem; padding:.5em 0; color:#fff; width:100%; display:inline-block; border-bottom:1px solid #ffbcb2;} nav a i {color:#2a3640; font-size:1.3rem;  }
nav a:hover {color:#2a3640;}	
nav span { color:#66b6e1; display:none; } 
nav .last {border:none;}	
.active {color:#2a3640;}	
	
.dropdown-content {display:block; padding:0; }	
.dropdown-content a {width:100%; display:inline-block; padding:.2em 0; padding-left:1em; }
.dropdown-content span { margin-left:1em; }	
	
	
.menu-fixed {position:fixed; z-index:1000; width:100%; top:0; }	
	
	
.columna   {max-width:1020px; margin:0 auto; display:flex; justify-content:space-evenly; flex-wrap:wrap; align-items:center; }
.columna-2 {width:485px;} 
.columna-3 {width:318px;}
.columna-4 {width:234px;}
.columna-5 {width:184px;}
.columna-6 {width:151px;}
.columna-40 {width:40%;}
.columna-60 {width:60%;} 
	
.izquierda {text-align:left;}	
	

}


/*-------------------------------------- movil--*/ 

@media screen and (max-width:429px){
	
main { padding-top:0px;  }	
	
	
header {width:100%; z-index:9; position:relative; background:url("../images/top_inicio.svg") no-repeat bottom; background-size:cover; height:340px; }
.logo {padding:0 !important; width:45%; max-width:250px;  margin-left:27%;  } 
.slogan {width:80%; text-align:center; background:#66b6e1; padding:0 1em; border-radius:.5em; margin:0 auto;}	
		
h1, h4 {font-size:3rem;}	
	
.menu_movil {top:0; width:100%; position:fixed; z-index:3000; padding:0; margin:0; display:block; cursor:pointer;  }
.btn_menu { display:block; padding:10px; color:#66b6e1;  text-decoration:none; font-ight:normal; font-size:4rem; width:70px; } 
	
nav {position:absolute; z-index:200; width:100%;  }		
nav ul { width:100%; left:-100%;  border:none; position:fixed; padding:6em 2em 3em 2em; top:0; background:#66b6e1; color:#fff; font-family:samsungb;  } 
nav li {display:block; float:none; text-align:left;  padding:0 !important ; border-right:none; }
nav a { font-size:1.6rem; padding:.5em 0; color:#fff; width:100%; display:inline-block; border-bottom:1px solid #ffbcb2; width:100%; }
nav span { color:#66b6e1; display:none; } nav i { margin-left:1.5em; font-size:1.1rem; color:#fff;}
nav .last {border:none;}	
.active {color:#2a3640;}	
	
.dropdown-content {display:block; padding:0; }	
.dropdown-content a {width:100%; display:inline-block; padding:.2em 0; padding-left:1em; }
.dropdown-content span { margin-left:1em; }
	
#banner {width:100%; height:100%; background:rgba(0,0,0,.8); position:fixed; z-index:20;} 	
.bannerIn {width:85%; margin-left:7.5%; height:auto; position:absolute; z-index:21; top:80px; } .bannerIn img { width:100%; border:2px solid #fff;}
.close { position:absolute; z-index:22; font-size:1.5rem; right:0;  background:#fff; padding:.3em 0; margin-top:-26px;  } .close a i {padding: .3em;} .close a:hover  i {color:#000;}
	
.slider {margin-top:0px; width:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-evenly; }
.slider img {width:100%; height:auto; }		
.slider p {padding:1em 0; font-size:1.5rem; text-align:center; width:100%; background:#fff; }
.slider p b { font-size:2rem; }
.btn-floating1, .btn-floating2  { left:50% !important; bottom:.3em; display:none; }
	
	
.columna { width:100%; margin-left:0; display:flex; flex-wrap:wrap; justify-content:space-evenly; padding:0 1em; }	
.columna-2, .columna-3, .columna-4, .columna-5, .columna-6, .columna-40, .columna-60 {width:100%;}
	
.foto { width:100%; padding:0 !important; border-radius:1em; }
.foto2 {display:none;}	
	
main table { font-size:1rem;}	
	
.orden1 { order:1;} .orden2 { order:2;} .orden3 { order:3;} .orden4 { order:4;} .orden5 { order:5;} .orden6 { order:6;}	
.centrado2 {text-align: center;}	
	
.rosa {margin-top:-50px; }	
}


/*-------------------------------------- medio--*/ 

@media screen and (min-width:430px) and (max-width:1019px){
	
main {background:#fff; padding-top:200px;}	
	
		
header { width:100%; height:200px; background:url("../images/top_inicio.svg") no-repeat bottom; background-size:cover; display:flex;  flex-wrap:wrap; align-items:center; justify-content:space-between;  position:absolute; z-index:50;  } 
	
.top { color:#0D71B9; width:40%; text-align:right; } 
		
.logo {width:30%; text-align:right; } 	
.logo img {width:150px;}
.slogan {width:auto; text-align:left; background:#66b6e1; padding:0 1em; border-top-right-radius:1em; border-bottom-right-radius:1em; }	
	
.menu_movil {top:1.5em; left:1em; padding:0; margin:0; display:block; cursor:pointer; text-align:center; z-index:11; position:absolute;}
.btn_menu { display:block; padding:10px; color:#66b6e1; text-decoration:none; font-ight:normal; font-size:4rem;  } .btn_menu:hover {color:#fff;}  
	
nav {position:absolute; z-index:10; width:100%;  }		
nav ul { width:460px; left:-100%;  border:none; position:fixed; padding:10em 5em 5em 5em; top:0; background:#f28777; color:#fff; font-family:samsungb; box-shadow:6px 6px 3px rgba(0,0,0,.3);  } 
nav li {display:block; float:none; text-align:left;  width:100%; padding:0 !important ; border-right:none; }
nav a { font-size:2rem; padding:.5em 0; color:#fff; width:100%; display:inline-block; border-bottom:1px solid #ffbcb2;} nav a i {color:#fff; font-size:1.3rem;  }
nav a:hover {color:#2a3640;}	
nav span { color:#66b6e1; display:none; } 
nav .last {border:none;}	
.active {color:#2a3640;}	
	
.dropdown-content {display:block; padding:0; }	
.dropdown-content a {width:100%; display:inline-block; padding:.2em 0; padding-left:1em; }
.dropdown-content span { margin-left:1em; }	
	
#banner {width:100%; height:100%; background:rgba(0,0,0,.8); position:fixed; z-index:20; padding:2em; } 		
.bannerIn {max-width:463px; max-height:600px; position:absolute; z-index:21;  background:#000; top:50%; margin-top:-300px; left:50%; margin-left:-232px; } .bannerIn img { width:100%; border:2px solid #fff;}
.close { position:absolute; z-index:22; font-size:2rem; right:0; background:#fff; padding:.3em 0;  } .close a i {padding: .3em;} .close a:hover  i {color:#000;}	
	
	
.slider {margin-top:0px; width:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-evenly; }
.slider img {width:100%; height:auto; }		
.slider p {padding:1em 0; font-size:1.5rem; text-align:center; width:100%; background:#fff; }
.slider p b { font-size:2rem; }
.btn-floating1, .btn-floating2  { left:50% !important; bottom:.3em; display:none; }
	
	
.promo1, .promo2, .promo3, .promo4 {width:100%; height:300px;}	
.promo1 { background:url("../../spanish/promos/promo1-m.jpg") top center no-repeat;  }
.promo2 { background:url("../../spanish/promos/promo2-m.jpg") top center no-repeat;  }	
.promo3 { background:url("../../spanish/promos/promo3-m.jpg") top center no-repeat;  }		
	
	
.columna { width:90%; display:flex; flex-wrap:wrap; justify-content:space-evenly; align-items:center; margin:0 auto;}	
.columna-2, .columna-3, .columna-4, .columna-5, .columna-6, .columna-60, .columna-40 {width:48%;}

.foto { width:100%; padding:0 !important; }
	
.izquierda {text-align:left;}	
.rosa {margin-top:-100px; }		
	
}

/*---------------------contacto-----------*/


.text-form { width:100%; padding:1em 0; font-size:1em;  border:solid #ccc 1px; padding-left:.5em; margin-top:10px; font-family:century; border-radius: 1em; }
.text-form2 { width:50%; padding:1em 0; font-size:1em;  border:solid #ccc 1px; padding-left:.5em; margin-top:10px; font-family:century; border-radius: 1em;}

.caja {	border:solid #ccc 1px;  height:19px;  overflow:hidden; width:50%; padding:.5em .5em; background:#fff;  margin-top:-1px;}
select { border: none; font-size:16px; width:100%; color:#9E9E9E; background:rgba(0,0,0,0); height:19px;}
select:focus{ outline:none; color:#000;}
.caja::after{content:"\025be"; display:table-cell; text-align:center; width:35px; height:30px; background-color:#fff; position:absolute; top:0; right:0px;	pointer-events:none; cursor: pointer; padding-top:.5em; color:#000;}

.enviar { padding:1em 2em; cursor:pointer; color:#fff; font-size:1em;  text-align:center;  background:#66b6e1; margin:1em 0; border-radius:1em; border:0;  }
.enviar:hover {background-color:#42596e; color:#fff; border:1px solid #fff; }

.verifica { font-size:.9em; color:#22A44B; }



/*---------------------footer-----------*/



footer { width:100%; min-height:100px; clear:both; text-align:center; font-size:1.4rem; padding-bottom:1em; background:#cdcdcc; }
footer .columna {align-items:center;}
footer p {color:#fff;  } 
footer a {color:#fff;}
footer a:hover {color:#66b6e1; }
footer i {color:#66b6e1;} 



/* ---------Social Footer -----*/

.icon-button {background-color:#66b6e1; border-radius:3em; cursor: pointer; display:inline-block; font-size:1.8rem; width:3em; height:3em; line-height:3em; margin:0 10px; position:relative;  }

/* Circle */

.icon-button span {border-radius:0; display: block; height:0; left:50%; margin:0; position:absolute; top:50%; background-color:#ccc;
-bkit-transition: all 0.3s; -moz-transition: all 0.3s;  -o-transition: all 0.3s; transition: all 0.3s; width:0; z-index:5;}
.icon-button:hover span { width:3em; height:3em; border-radius:3em; margin:-1.5em; background:#fff; }

/* Icons */
.icon-button i { background:none; color:#fff; left:-.1em; position:absolute; top:0; left:43%;  z-index:8; }
.icon-button:hover i { color:#2a3640;}



/* --------------*/


@media (max-width:429px){.hide-small{display:none!important}}
@media (min-width:430px) and (max-width:1019px){.hide-medium{display:none!important}}
@media (min-width:1020px){.hide-large{display:none!important}}

@media (max-height:600px) {.hide-tall{display:none!important}}


.animate-fading{-bkit-animation:fading 4s infinite;animation:fading 4s infinite}
@-bkit-keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.animate-opacity{-bkit-animation:opac 1.5s;animation:opac 1.5s}
@-bkit-keyframes opac{from{opacity:0} to{opacity:1}}
@keyframes opac{from{opacity:0} to{opacity:1}}

.animate-top{position:relative;-bkit-animation:animatetop 0.4s;animation:animatetop 0.4s}
@-bkit-keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.animate-left{position:relative;-bkit-animation:animateleft 0.4s; animation:animateleft 0.4s}
@-bkit-keyframes animateleft{from{left:-1000px;opacity:0} to{left:0;opacity:1}}
@keyframes animateleft{from{left:-1000px;opacity:0} to{left:0;opacity:1}}

.animate-right{position:relative;-bkit-animation:animateright 0.4s;animation:animateright 0.4s}
@-bkit-keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.animate-bottom{position:relative;-bkit-animation:animatebottom 0.4s;animation:animatebottom 0.4s}
@-bkit-keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0px;opacity:1}}
@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.animate-zoom {-bkit-animation:animatezoom 0.6s;animation:animatezoom 0.6s}
@-bkit-keyframes animatezoom{from{-bkit-transform:scale(0)} to{-bkit-transform:scale(1)}}
@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.animate-input{-bkit-transition:width 0.4s ease-in-out;transition:width 0.4s ease-in-out}.animate-input:focus{width:100%!important}

