html{color:#222;font-size:1em;line-height:1.4}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}.browserupgrade{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}
/* ==========================================================================
Author's custom styles
========================================================================== */
html{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-family: 'Hind', sans-serif; margin: 0;}
*,*:before,*:after{ box-sizing: inherit; }
body{background-color: #fff; ; margin: 0; padding: 0;}
a{ text-decoration: none; ; cursor: pointer}
/* == HERO == */
section.hero{height: auto; width: 100%;;overflow: hidden; z-index: 1; margin-top: 60px; background-color: rgba(0,0,0,0); position: relative;}
section.hero h2{color: #202020; font-size: 24px; text-align: center; margin: 10px auto 10px ; font-weight: 300;width: 250px; }
section.hero h1{color: #202020; font-size: 30px; text-align: center; width: 200px; margin: 100px auto 0; ; font-weight: 500; line-height: 1.2em}
div.infoU{ width: 100%;}
div.infoU div.cont{width: 90%; margin: 10px auto 50px}
div.infoU div.cont div.estD{width: 100%; font-size: 16px; text-align: center; margin: 30px auto;}
div.infoU div.cont div.estD figure{width: 100%; margin: 0 auto}
div.infoU div.cont div.estD figure img{width: 70px; margin: 0 auto; text-align: center}
div.infoU div.cont div.estD figure figcaption{font-size: 20px; margin: 10px auto; font-weight: 500}
div.infoU div.cont div.estD ul{text-align: left; width: 250px; margin: 20px auto; padding: 0;}
div.infoU div.cont div.estD .mon{list-style: none; text-align: center; margin: 10px 0;}
.BannC{width: 100%; height: 320px; background: url("../img/imagen_proyectos_salsas_castillo.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannP{width: 100%; height: 320px; background: url("../img/imagen_proyectos_playtex.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannM{width: 100%; height: 320px; background: url("../img/imagen_proyectos_maidenform.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannMI{width: 100%; height: 320px; background: url("../img/imagen_proyectos_mide.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannGP{width: 100%; height: 320px; background: url("../img/imagen_proyectos_grupo_palacio.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannAS{width: 100%; height: 320px; background: url("../img/imagen_proyectos_asus.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannU{width: 100%; height: 320px; background: url("../img/imagen_proyectos_utility.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannH{width: 100%; height: 320px; background: url("../img/imagen_proyectos_henkel.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannR{width: 100%; height: 320px; background: url("../img/imagen_proyectos_rinbros.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
.BannUIC{width: 100%; height: 320px; background: url("../img/imagen_proyectos_uic.jpg"); background-size: 200%; background-repeat: no-repeat; background-position: center center; margin-top: 25px}
@media only screen and (min-width:768px){
section.hero{height: auto; width: 100%;overflow: hidden; z-index: 1; margin-top: 60px; position: relative}
section.hero h2{font-size: 24px; margin: 10px auto 0; width: 500px }
section.hero h1{font-size: 34px; width: 500px; margin-top: 30px}
.BannC{width: 100%; height: 320px;background-size: 100%; }
.BannP{width: 100%; height: 320px;background-size: 100%; }
.BannM{width: 100%; height: 320px;background-size: 100%; }
.BannMI{width: 100%; height: 320px;background-size: 100%; }
.BannGP{width: 100%; height: 320px;background-size: 100%; }
.BannAS{width: 100%; height: 320px;background-size: 100%; }
.BannU{width: 100%; height: 320px;background-size: 100%; }
.BannH{width: 100%; height: 320px;background-size: 100%; }
.BannR{width: 100%; height: 320px;background-size: 100%; }
.BannUIC{width: 100%; height: 320px;background-size: 100%; }
div.infoU div.cont{width: 650px; margin: 0px auto 0}
div.infoU div.cont div.estD{width: 48%; float: left; height: auto; text-align: left;margin-left: 2%; margin-bottom: 0; padding-left: 15%}
div.infoU div.cont div.estD figure{width: 50px; margin: 0 auto 0 0px; padding: 0;}
div.infoU div.cont div.estD figure img{width: 30px; margin: 0; text-align: center; float: left;}
div.infoU div.cont div.estD figure figcaption{font-size: 14px; margin: 10px 0 10px 0; font-weight: 500; padding: 0px 0 0 40px}
div.infoU div.cont div.estD ul{text-align: left; width: 140px; margin: 20px 0 0 20px; padding: 0 0 0 0;font-size: 10px;}
div.infoU div.cont div.estD .mon{list-style: none; text-align: left; margin: 10px 0 0 0;width: 130px}
}
@media only screen and (min-width:1024px){
.BannC{width: 100%; height: 450px;background-size: 100%; }
.BannP{width: 100%; height: 450px;background-size: 100%; }
.BannM{width: 100%; height: 450px;background-size: 100%; }
.BannMI{width: 100%; height: 450px;background-size: 100%; }
.BannGP{width: 100%; height: 450px;background-size: 100%; }
.BannAS{width: 100%; height: 450px;background-size: 100%; }
.BannU{width: 100%; height: 450px;background-size: 100%; }
.BannH{width: 100%; height: 450px;background-size: 100%; }
.BannR{width: 100%; height: 450px;background-size: 100%; }
.BannUIC{width: 100%; height: 450px;background-size: 100%; }
div.infoU{width: 90%!important; margin: 0 auto}
div.infoU div.cont{width: 900px!important; margin: 20px auto 0 }
div.infoU div.cont div.estD{width: 50%; margin: 30px 0px; height: 150px!important; float: left}
div.infoU div.cont div.estD figure{width: 300px; margin: 0 auto 0 0px; padding: 0;}
div.infoU div.cont div.estD figure img{width: 30px; margin: 0; text-align: left; float: left;}
div.infoU div.cont div.estD figure figcaption{font-size: 14px; margin: 10px 0 10px 0; font-weight: 500; padding: 8px 0 0 40px}
div.infoU div.cont div.estD ul{text-align: left; width: 200px; margin: 30px 0 0 0; padding: 0 0 0 20px; font-size: 12px;}
div.infoU div.cont div.estD .mon{width: 200px}
}
@media only screen and (min-width:1280px){
div.infoU{width: 1100px!important; margin: 0 auto}
div.infoU div.cont{width: 1000px!important; margin: 0 auto}
div.infoU div.cont div.estD{width:48%; margin:30px 0px; height:auto!important; float:left; padding-left: 18%}
div.infoU div.cont div.estD figure figcaption{font-size: 16px; margin: 10px 0 10px 0; font-weight: 500; padding: 8px 0 0 40px}
div.infoU div.cont div.estD ul{text-align: left; width: 220px; margin: 30px 0 0 0; padding: 0 0 0 20px; font-size: 14px;}
div.infoU div.cont div.estD .mon{width: 220px}
}
@media only screen and (min-width:1600px){
div.infoU{width: 1400px!important; margin: 0 auto}
div.infoU div.cont div.estD{height:auto!important;}
}
/* == NUMEROS =*/
#numbers{width: 100%; background: #1d1d1d; margin: 50px 0}
#numbers div.cont{width: 90%; margin: 0 auto; height: auto; padding: 25px 0;}
#numbers div.cont .boxN{width: 100%; padding: 20px 0; color: #fff;}
#numbers div.cont .boxN p.num{text-align: center; font-size: 50px; font-weight: 100; margin: 0; padding: 0}
#numbers div.cont .boxN p.txt{text-align: center; font-size: 20px; margin: 0 auto; padding: 0;font-weight: 100; width: 80%;}
@media only screen and (min-width:768px){
#numbers{width: 100%; background: #1d1d1d}
#numbers div.cont{width: 700px; margin: 0 auto; height: auto; padding: 25px 0; }
#numbers div.cont .boxN{width: 33.33%; padding: 20px 0 30px; color: #fff;float: left;}
#numbers div.cont .boxN p.txt{text-align: center; font-size: 16px; margin: 0 auto; padding: 0; width: 200px}
}
@media only screen and (min-width:1024px){
#numbers div.cont{width: 900px!important; margin: 0 auto; height: auto; padding: 25px 0; }
}
@media only screen and (min-width:1280px){
#numbers div.cont{width: 1100px!important; margin: 0 auto; height: auto; padding: 25px 0; }
}
@media only screen and (min-width:1600px){
#numbers div.cont{width: 1400px!important;-webkit-width: 1400px;-moz-width: 1400px;-o-width: 1400px; margin: 0 auto; height: auto; padding: 25px 0; }
}
/* == INFO TIP =*/
section.informacion{width: 100%;}
section.informacion div.cont{width: 90%; margin: 0 auto;}
section.informacion div.cont p.hc{font-size: 30px; font-weight: 500; text-align: center}
section.informacion div.cont p.ctn{font-size: 16px; font-weight: 400; text-align: justify}
@media only screen and (min-width:768px){
section.informacion div.cont{width: 700px; margin: 0 auto;}
section.informacion div.cont p.hc{font-size: 30px; font-weight: 500; width: 500px; margin: 0 auto}
}
@media only screen and (min-width:1024px){
section.informacion div.cont{width: 800px; margin: 0 auto;}
}
@media only screen and (min-width:1280px){
section.informacion div.cont{width: 1000px; margin: 0 auto;}
}
@media only screen and (min-width:1600px){
section.informacion div.cont{width: 1100px; margin: 0 auto;}
}
/* == NUMEROS 2 =*/
#numbersT{width: 100%; background: #1d1d1d; margin: 50px 0 0}
#numbersT div.cont{width: 90%; margin: 0 auto; height: auto; padding: 25px 0;}
#numbersT div.cont h4{color: #fff; font-weight: 100; text-align: center; font-size: 30px; margin: 0}
#numbersT div.cont .boxN2{width: 100%; padding: 20px 0; color: #fff;}
#numbersT div.cont .boxN2 p.num{text-align: center; font-size: 45px; font-weight: 100; margin: 0; padding: 0}
#numbersT div.cont .boxN2 p.txt{text-align: justify; font-size: 16px; margin: 0 auto; padding: 0;font-weight: 100; width: 80%; font-style: italic}
#anylu{margin: 20px auto 0!important;font-style: normal; font-weight: bold!important; text-align: center!important; width: 100%!important}
#anyluP{text-align: center!important}
@media only screen and (min-width:768px){
#numbersT{width: 100%; background: #1d1d1d}
#numbersT div.cont{width: 700px; margin: 0 auto ; height: 250px; padding: 25px 0; }
#numbersT div.cont h4{color: #fff; font-weight: lighter; text-align: center; font-size: 30px; margin: 15px 0 20px 0}
#numbersT div.cont .boxN2{width: 100%; padding: 20px 0 10px; color: #fff;float: left;}
#numbersT div.cont .boxN2 p.txt{text-align: center; font-size: 16px; margin: 0 auto; padding: 0; width: 100%;}
#anylu{margin: 20px auto 0!important;font-style: normal; font-weight: bold!important; text-align: center!important; width: 70%!important}
}
@media only screen and (min-width:1024px){
#numbersT div.cont{width: 900px!important; margin: 0 auto; height: auto; padding: 25px 0; }
#numbersT div.cont{width: 700px; margin: 0 auto ; height: 250px; padding: 25px 0; }
}
@media only screen and (min-width:1280px){
#numbersT div.cont{width: 1100px!important; margin: 0 auto; height: auto; padding: 25px 0; }
#numbersT div.cont{width: 700px; margin: 0 auto ; height: 250px; padding: 25px 0; }
}
@media only screen and (min-width:1600px){
#numbersT div.cont{width: 1400px!important; margin: 0 auto; height: auto; padding: 25px 0; }
#numbersT div.cont{width: 700px; margin: 0 auto ; height: 250px; padding: 25px 0; }
}
/* == IMGS==*/
section.imgs{width: 100%;margin: 0 0 40px 0; padding: 0}
section.imgs div.cont{width: 90%; margin: 0 auto}
section.imgs div.cont h4{font-size: 30px; margin: 50px 0 0 0; font-weight: 100; text-align: center;}
section.imgs div.cont .iframe{height: 200px; width: 300px; margin: 15px auto 0;padding: 0; text-align: center; font-weight: 100;}
section.imgs div.cont iframe{width: 100%; height: 70%;}
section.imgs div.cont .iframe p{margin: 10px auto; font-size: 16px;}
@media only screen and (min-width:768px){
section.imgs{width: 100%;margin: 0px 0 50px 0; padding: 0}
section.imgs div.cont h4{font-size: 28px; margin: 50px 0 10px 0; font-weight: 100; text-align: center;}
section.imgs div.cont{width: 750px; margin: 20px auto}
section.imgs div.cont .iframe{height: 200px; width: 33.33%; margin: 15px auto; float: left; padding: 5px}
section.imgs div.cont .iframe p{margin: 10px auto; font-size: 14px;}
}
@media only screen and (min-width:1024px){
section.imgs div.cont{width: 900px; margin: 0 auto}
section.imgs div.cont .iframe{height: 300px; width: 33.33%; margin: 15px auto; float: left; padding: 5px}
section.imgs div.cont .iframe p{margin: 10px auto; font-size: 16px;}
}
@media only screen and (min-width:1280px){
section.imgs div.cont{width: 1100px; margin: 0 auto}
section.imgs div.cont .iframe{height: 400px; width: 33.33%; margin: 15px auto; float: left; padding: 5px}
section.imgs div.cont .iframe p{margin: 10px auto; font-size: 18px;}
}
@media only screen and (min-width:1600px){
section.imgs div.cont{width: 1400px; margin: 0 auto}
}
/* == SIGUENTE =*/
section.cnz{width: 100%; background: #1d1d1d; margin: 0 auto 50px; height: auto;overflow: hidden; padding: 20px 0 0 0}
section.cnz div.cont{width: 90%; height: auto; margin: 0 auto 0; color: #fff;; }
section.cnz div.cont p.O{font-size: 18px; font-weight: 100; margin: 30px auto 0; text-align: center}
section.cnz div.cont p.D{font-size: 30px; font-weight: 100; ; margin: 0 auto; text-align: center}
@media only screen and (min-width:768px){
section.cnz{width: 100%; background: #1d1d1d; margin: 0 auto 50px; height: auto;overflow: hidden;}
section.cnz div.cont{width: 700px; height: auto; margin: 0 auto 0; color: #fff;}
section.cnz div.cont p.O{font-size: 18px; font-weight: 100; margin: 0px auto 0; }
section.cnz div.cont p.D{font-size: 30px; font-weight: 100; ; margin: 0 auto}
}
@media only screen and (min-width:1024px){
section.cnz div.cont{width: 900px; height: auto; margin: 0 auto 0; color: #fff;; }
}
@media only screen and (min-width:1280px){
section.cnz div.cont{width: 1100px; height: auto; margin: 0 auto 0; color: #fff;; }
section.cnz div.cont p.O{font-size: 28px; font-weight: 100; margin: 0px auto 0; }
}
@media only screen and (min-width:1600px){
section.cnz div.cont{width: 1400px; height: auto; margin: 0 auto 0; color: #fff;; }
section.cnz div.cont p.O{font-size: 28px; font-weight: 100; margin: 0px auto 0; }
}
/* == form =*/
form{width: 90%; margin: 0 auto; font-size: 16px; padding: 0;}
form .inputs{width: 100%; margin: 0 auto}
form .inputs input{width: 100%; border-radius: 5px; margin: 10px 0;border:1px #cdcdcd solid; padding: 8px 15px}
form .inputs input:focus{outline: none;}
form .inputs2{width: 100%; margin: 0 auto}
form .inputs2 input{width: 100%;border-radius: 5px;margin: 10px 0;border:1px #cdcdcd solid; padding: 8px 15px}
form .inputs2 .contservicio{width: 100%; background: #fff;border-radius: 5px;margin: 10px 0 10px}
form .inputs2 select:focus, input:focus, textarea:focus{outline: none;}
form .inputs2 select{background:none;border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;-o-appearance:none; width: 90%; padding: 2px;}
form .textareas textarea{width: 100%; margin: 10px auto;border-radius: 5px;border:1px #cdcdcd solid; padding: 8px 15px}
form div.check{color: #fff; width: 90%; margin: 0 auto}
form div.check input{ margin: 0 0;margin-right: 10px;}
div.msgenviado{border: 2px #fff solid; text-align: center; color: #fff; display: none;}
div.msgenviado span{font-size: 30px; font-weight: bold;}
div.btns{width: 50%; margin: 0 auto}
div.btns input{width: 100%; border-radius: 50px; border:none; background: #fff;-webkit-transition: ease-in-out .2s;-moz-transition: ease-in-out .2s;-o-transition: ease-in-out .2s;transition: ease-in-out .2s; }
form select:focus, input:focus, textarea:focus{outline: none; font-weight: 300;}
form select{ -webkit-appearance: none!important; -moz-appearance: none!important; -o-appearance: none!important; appearance: none!important;padding: 0px; -webkit-border:0px #cdcdcd solid; -webkit-background-color: #fff!important; -moz-border:0px #cdcdcd solid; -moz-background-color: #fff!important; -o-border:0px #cdcdcd solid; -o-background-color: #fff!important; border:0px #cdcdcd solid; background-color: #fff; border-radius: 5px; width: 100%;font-weight: 300;}
div.inputs2 div.contservicio{border:1px #cdcdcd solid;width: 100%; background-color: #fff;padding: 5px; border-radius: 5px; color: #9B9B9B;margin: 5px 0; display: block; padding: 8px 15px}
#enviar{border: none; background: #6E6E6E; color: #fff; font-weight: bold; cursor: pointer; padding: 10px; border-radius: 50px}
div.btns:hover > #enviar{background: #bfbfbf; color: #fff; font-weight: bold;border-radius: 50px;-webkit-transition: ease-in-out .2s;-moz-transition: ease-in-out .2s;-o-transition: ease-in-out .2s;transition: ease-in-out .2s; }
div.btns:hover{background: #bfbfbf; color: #fff; font-weight: bold;border-radius: 50px;-webkit-transition: ease-in-out .2s;-moz-transition: ease-in-out .2s;-o-transition: ease-in-out .2s;transition: ease-in-out .2s;}
#error{width: 100%; border: 1px #fff solid;padding: 0px 35px; color: #fff; text-align: center; margin-bottom: 20px; display: none}
#enviar:hover{background: #bfbfbf}
@media only screen and (min-width:768px){
form{width: 750px; margin: 0 auto; font-size: 16px; padding: 0;}
}
@media only screen and (min-width:1024px){
form{width: 900px; margin: 0 auto; font-size: 16px; padding: 0;}
form .inputs input.nombre{width: 48%; border-radius: 5px; margin: 10px 0;border:1px #cdcdcd solid; padding: 8px 15px; float: left;}
form .inputs input.email{width: 48%; border-radius: 5px; margin: 10px 0;border:1px #cdcdcd solid; padding: 8px 15px; float: right;}
form .contservicio{width: 48%!important; float:right; padding: 6px 15px!important; }
form .inputs2 input.tel{width: 48%; border-radius: 5px; margin: 5px 0;border:1px #cdcdcd solid; padding: 8px 15px; float: left;}
form div.check{color: #fff; width: 100%; margin: 0 auto}
}
@media only screen and (min-width:1280px){
form{width: 1100px}
}
@media only screen and (min-width:1600px){
form{width: 1200px}
}
/* == SIGUENTE =*/
div.as a{text-decoration: none; color: inherit}
p.ant{text-align: center; font-size: 30px; width: 300px; margin: 0px auto 50px; color: #1D1D1D; font-weight: 400; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -o-transition: .5s; cursor: pointer; float: inherit}
p.sig{text-align: center; font-size: 30px; width: 300px; margin: 0px auto 50px; color: #1D1D1D; font-weight: 400; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -o-transition: .5s; cursor: pointer; float: inherit}
#arrow{font-size: 25px!important; padding: 0 20px;font-weight: 100}
p.sig:hover{color: #D1D1D1; transition: .3s; -webkit-transition: .3s; -moz-transition: .3s; -o-transition: .3s}
p.sig:hover + #arrow{;transition: .3s; -webkit-transition: .3s; -moz-transition: .3s; -o-transition: .3s;}
p.ant:hover{color: #D1D1D1; transition: .3s; -webkit-transition: .3s; -moz-transition: .3s; -o-transition: .3s}
p.ant:hover + #arrow{;transition: .3s; -webkit-transition: .3s; -moz-transition: .3s; -o-transition: .3s;}
@media only screen and (min-width:768px){
p.ant{text-align: center; font-size: 30px; width: 300px; margin: 0px auto 50px; color: #1D1D1D; font-weight: 400; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -o-transition: .5s; cursor: pointer; float: left}
p.sig{text-align: center; font-size: 30px; width: 300px; margin: 0px auto 50px; color: #1D1D1D; font-weight: 400; transition: .5s; -webkit-transition: .5s; -moz-transition: .5s; -o-transition: .5s; cursor: pointer; float: right}
}
@media only screen and (min-width:1024px){}
@media only screen and (min-width:1280px){}
@media only screen and (min-width:1600px){}
/* == Terminos y Aviso == */
#terminos{display: none; transition: .5s left ease-in-out; }
.modal{background: rgba(0,0,0,.5); width: 100%; height: 100vh; margin: 0; padding: 180px 0 0 0; position: fixed; z-index: 2}
div.fond{width: 300px; margin: 0 auto; text-align: justify; background: #1D1D1D; padding: 10px; height: 60%; overflow-y: scroll}
p.terminisC{text-align: center; font-weight: bold; background: #000; width: 300px; margin: 0 auto; padding: 15px 40px; font-size: 18px; color: #fff;}
.modal p.terminosP{font-size: 14px; padding: 0 10px; color: #fff!important;}
#close{position: absolute; width: 35px; margin: -110px 0 0 -25px; cursor: pointer}
#avisos{display: none; transition: .5s left ease-in-out; }
.modal{background: rgba(0,0,0,.5); width: 100%; height: 100vh; margin: 0; padding: 180px 0 0 0; position: fixed; z-index: 2}
div.fond{width: 300px; margin: 0 auto; text-align: justify; background: #1D1D1D; padding: 10px; height: 60%; overflow-y: scroll}
p.avisoC{text-align: center; font-weight: bold; background: #000; width: 300px; margin: 0 auto; padding: 15px 40px; font-size: 18px; color: #fff;}
.modal p.avisoP{font-size: 14px; padding: 0 10px; color: #fff!important;}
#closeA{position: absolute; width: 35px; margin: -110px 0 0 -25px; cursor: pointer}
@media only screen and (min-width:768px){
div.fond{width: 500px; height: 60%; }
p.terminisC{width: 500px; font-size: 20px; color: #fff;}
.modal p.terminosP{font-size: 16px; padding: 0 10px; color: #fff!important;}
#close{position: absolute; width: 35px; margin: -85px 0 0 -30px; cursor: pointer}
div.fond{width: 500px; height: 60%; }
p.avisoC{width: 500px; font-size: 20px; color: #fff;}
.modal p.avisoP{font-size: 16px; padding: 0 10px; color: #fff!important;}
#closeA{position: absolute; width: 35px; margin: -85px 0 0 -30px; cursor: pointer}
}
@media only screen and (min-width:1024px){
div.fond{width: 700px; height: 60%; }
p.terminisC{width: 700px; font-size: 20px; color: #fff;}
.modal p.terminosP{font-size: 16px; padding: 0 10px; color: #fff!important;}
#close{position: absolute; width: 35px; margin: -85px 0 0 -30px; cursor: pointer}
div.fond{width: 700px; height: 60%; }
p.avisoC{width: 700px; font-size: 20px; color: #fff;}
.modal p.avisoP{font-size: 16px; padding: 0 10px; color: #fff!important;}
#close{position: absolute; width: 35px; margin: -85px 0 0 -30px; cursor: pointer}
}
@media only screen and (min-width:1280px){}
@media only screen and (min-width:1600px){}
/* == Footer ==*/
footer.footer{text-align: center;; padding: 0px 0 20px; width: 250px; margin: 0 auto}
footer.footer p{font-size: 16px; width: 250px; margin: 10px auto; color: #1D1D1D;}
div.redes_bottom a{color: #1D1D1D; margin: 10px }
div.redes_bottom a:hover{color: #6E6E6E; margin: 10px }
footer.footer p.derechos{font-size: 13px; width: 90%; margin: 10px auto 0; color: #1D1D1D;}
footer.footer p.derechos a{cursor: pointer; color: #000;}
footer.footer p.derechos a:hover{text-decoration: underline; }
#whats{position: fixed; bottom: 0; right: 1%; font-size: 50px; cursor: pointer; color: #1D1D1D; z-index: 10}
#whats a{color: #1D1D1D}
#whats a:hover{color: #6E6E6E}
#whats:hover{color: #6E6E6E}
@media only screen and (min-width:768px){
/* == Footer ==*/
footer.footer{text-align: center;; padding: 0px 0 20px; width: 100%; }
footer.footer p{font-size: 16px; width: 600px; margin: 20px auto; color: #1D1D1D;}
div.redes_bottom a{color: #1D1D1D; margin: 10px; font-size: 20px}
div.redes_bottom a:hover{color: #6E6E6E; margin: 10px }
footer.footer p.derechos{font-size: 13px; width: 90%; margin: 10px auto 0; color: #1D1D1D;}
}
/* ==========================================================================
Helper classes
========================================================================== */
.hidden{display:none!important}.visuallyhidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;-webkit-clip-path:none;clip-path:none;height:auto;margin:0;overflow:visible;position:static;width:auto;white-space:inherit}.invisible{visibility:hidden}.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}@media print{*,:before,:after{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre{white-space:pre-wrap!important}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}