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}

section.hero{height: 700px; width: 100%; background-color: #f5f5f5;overflow: hidden; z-index: 1; margin-top: 60px }
#hola{width: 100%; text-align: justify; margin: -150px 0 0 0; font-size: 14px;}
@media only screen and (min-width:768px){

	section.hero{height: 750px!important; width: 100%;overflow: hidden; z-index: 1; margin-top: 60px }
#hola{width: 100%; text-align: justify; margin: -50px auto 0 auto; font-size: 14px;}

}
@media only screen and (min-width:1024px){
	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}
#hola{width: 100%; text-align: justify; margin: -50px auto 0 auto; font-size: 16px;}

}
@media only screen and (min-width:1280px){}
@media only screen and (min-width:1600px){}


/* == FORMULARIO== */
section.bolsa{width: 100%;}
section.bolsa div.cont{width: 90%; margin: 190px auto 0; font-size: 14px;}
section.bolsa div.cont h2{font-size: 30px; font-weight: 600; text-transform: uppercase; text-align: center; margin: 0 }
section.bolsa div.cont h3{font-size: 20px; font-weight: 100; text-align: center; margin: 0 }
form.form{margin: 20px auto; width: 100%;}
form input{ width: 100%;padding: 8px 15px; border:1px #cdcdcd solid;margin: 0px auto; background-color: #fff; border-radius: 5px;	font-weight: 300;}
form div.contarea{width: 100%;padding: 5px 15px; border:1px #cdcdcd solid;margin: 0px auto; background-color: #fff; border-radius: 5px; 	font-weight: 300;}
select{ -webkit-appearance: none!important; -moz-appearance: none!important; -o-appearance: none!important; appearance: none!important; width: 100%; 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;-webkit-outline: none;-moz-outline: none;-o-outline: none;outline: none;}
textarea{width: 100%; padding: 8px 15px; border:1px #cdcdcd solid;margin: 0px auto; background-color: #fff; border-radius: 5px; font-weight: 300;}
.msj{}
div.check{width: 90%; margin: 20px auto ; position: relative; text-align: center; font-weight: 400;}
div.check p{margin: -18px 0 0 0}
div.check label input{margin-right: 10px; width: 5%;}
div.check label a{color: #000; text-decoration: underline;}
div.check label a:hover{color: #D00F13}

#msgenviado{font-size:18px; font-weight: 400;text-align:center; border:2px #40df62 solid; padding:5px 0 0 0; margin:10px auto 0; ; width: 100%; line-height: 1.3em; display: none}
#msgenviado span{font-size: 28px; font-weight: 500; line-height: 1.5em}
div.btns{width: 200px; padding: 10px 30px; border: none; border-radius: 50px; background: #191919; color: #fff;margin: 20px auto 0; text-align: center;cursor: pointer}
#enviar{border: none; background: #191919; color: #fff; font-weight: bold; cursor: pointer;-webkit-outline: none;-moz-outline: none;-o-outline: none;outline: none;-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 > #enviar{background: #000; color: #fff; font-weight: bold; -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: #000; color: #fff; font-weight: bold; transform: scale(1.05);-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}

@media only screen and (min-width:768px){
	section.bolsa div.cont{width: 700px; margin: 90px auto 0; font-size: 16px;}
}
@media only screen and (min-width:1024px){
	section.bolsa div.cont{width: 900px; margin: 90px auto 0; font-size: 16px;}
	form input{ width: 100%;padding: 8px 15px; border:1px #cdcdcd solid;margin: 0px auto; background-color: #fff; border-radius: 5px;	font-weight: 300;}
	div.cajaU{width: 100%; margin: 0 auto}
	#nom{width: 48%; float: left; margin-right: 4%}
	#ape{width: 48%; float: left}
	div.cajaD{width: 100%; margin: 10px auto 0}
	#ema{width: 48%; float: left; margin-right: 4%}
	#pho{width: 48%; float: left}
	div.cajaT{width: 100%; margin: 10px auto 0}
	#por{width: 48%; float: left; margin-right: 4%}
	#are{width: 48%; float: left}
	.msj{margin: 20px 0 0 0}
	textarea{margin: 20px 0 0 0}

	div.check{width: 300px; margin: 20px auto;}
	div.check p{margin: -20px 0 0 0}
}
@media only screen and (min-width:1280px){
	section.bolsa div.cont{width: 1100px; margin: 90px auto 0; font-size: 16px;}

}
@media only screen and (min-width:1600px){
		section.bolsa div.cont{width: 1400px; margin: 90px auto 0; font-size: 16px;}
}



/* == 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}
#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;}
}

/* == Barra de Navegación == */
#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){}


/* ==========================================================================
   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}}