@charset "utf-8";
/*Fuentes*/
@font-face {
    font-family: 'Roboto-Regular';
    src: url('../fonts/Roboto-Regular-webfont.eot');
    src: url('../fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('../fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Regular-webfont.svg#exo_2.0black') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Roboto-Bold';
    src: url('../fonts/Roboto-Bold-webfont.eot');
    src: url('../fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Bold-webfont.woff') format('woff'),
         url('../fonts/Roboto-Bold-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Bold-webfont.svg#exo_2.0black') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
/*Navegacion*/
.mp{margin: 0px!important; padding: 0px!important;}
.btn-desabilitado{color: currentColor; cursor: not-allowed; opacity: 0.5; text-decoration: none; }
.fondogris{background: #414143;}
.botonesfgris{cursor: pointer; padding:80px; background: #414143;}
.botonesfgris:hover{background: #2C2C2D; transition:all .5s ease-in-out;}
.botonesfgris h4{font-size: 21px; color: #fff;}
.botonesfgrisa{text-decoration: none!important;}
.menu{background: #000!important; border-bottom: none!important; margin-bottom: 0!important;}
.botones{font-family:'Roboto-Bold'; font-size: 18px; text-align: center!important;}
.botones a{color: #fff!important;}
.botones a:hover{background: #414143; color: #fff;}
.botones ul li a{padding-top: 40px; padding-bottom: 40px; background: #000;}
.sombrabtn{-webkit-box-shadow: 0 5px 6px -6px #777; -moz-box-shadow: 0 10px 6px -6px #777; box-shadow: 0 5px 6px -6px #777;}
.boton1{background: none; color: #232322; font-family: 'Roboto-Regular'; text-align: center; border: 2px solid #746c75!important; padding: 5px 10px 5px 10px;}
.boton1:hover{text-decoration: none; background: #746c75; color: #fff; transition: 0.3s;}
/*Flechas Carrusel*/
.flechaslideres {opacity: 1!important; width: 5%; }
.controlcarruselblanco {color: #056f78; }
/*Fuentes*/
.piecomentario{font: 14px/18px 'Roboto-Regular'; color: #646464;}
h1{font-family:'Roboto-Bold'; font-size:60px; color: #1f140f;}
p{font-family: 'Roboto-Regular'; text-align:justify; color:#232322; font-size:16px;}
.tituloscampanas{font-family: 'Heebo', sans-serif; font-size: 60px; color: #494949;}
.superiorinicio{margin-top: 150px;}
.SupBannerIndex{margin-top: 100px;}
.margizqder{margin: 0px 20px 0px 20px;}
.espaciodescrip{background-color: #f7f7f7; padding: 10px 10px 30px 10px;}
/*Footer*/
.finpag {background-color: #000; width: 100%; height: 150px; padding-top: 50px;}
.finpag p{font-family: 'Roboto-Regular'; text-align:center; color:#fff; font-size:16px;}
.finpag a{font-family: 'Roboto-Regular'; text-align:center; color:#fff; text-decoration: underline; font-size:16px;}
/*Transicion-Imagenes*/
.imagen:hover {cursor: pointer; filter: grayscale(80%); transition:all .5s ease-in-out;}
/*Inicio-Pestaña-Pag-Web*/
.conteweb1{position: relative; top: 200px; z-index: 150;}
.recuadroweb1{background-color: #000; height: 30vh; width: 100%;}
/*Fin-Pestaña-Pag-Web*/
/*Inicio Animaciones*/
.animated {animation-duration: 1s; animation-fill-mode: both;}
.timeanime1{-webkit-animation-duration: 2s; -webkit-animation-delay: 0.5s; -webkit-animation-iteration-count: 1;}
.timeanime2{-webkit-animation-duration: 2s; -webkit-animation-delay: 1s; -webkit-animation-iteration-count: 1;}
.timeanime3{-webkit-animation-duration: 2s; -webkit-animation-delay: 1.5s; -webkit-animation-iteration-count: 1;}
.timeanime4{-webkit-animation-duration: 2s; -webkit-animation-delay: 3s; -webkit-animation-iteration-count: 1;}
.timeanime5{-webkit-animation-duration: 2s; -webkit-animation-delay: 3.5s; -webkit-animation-iteration-count: 1;}
.timeanime6{-webkit-animation-duration: 2s; -webkit-animation-delay: 4s; -webkit-animation-iteration-count: 1;}
.timeanime7{-webkit-animation-duration: 2s; -webkit-animation-delay: 6s; -webkit-animation-iteration-count: 1;}
.timeanime8{-webkit-animation-duration: 2s; -webkit-animation-delay: 6.5s; -webkit-animation-iteration-count: 1;}
.timeanime9{-webkit-animation-duration: 2s; -webkit-animation-delay: 7s; -webkit-animation-iteration-count: 1;}
.timeanime10{-webkit-animation-duration: 2s; -webkit-animation-delay: 7.5s; -webkit-animation-iteration-count: 1;}
.timeanime10{-webkit-animation-duration: 2s; -webkit-animation-delay: 8s; -webkit-animation-iteration-count: 1;}
.timeanime11{-webkit-animation-duration: 2s; -webkit-animation-delay: 8.5s; -webkit-animation-iteration-count: 1;}
.fadeInLeft{animation-name: fadeInLeft;}
@keyframes fadeInLeft{from {opacity: 0; transform: translate3d(-20%, 0, 0);}to {opacity: 1; transform: none;}}
.fadeInUp {animation-name: fadeInUp;}
@keyframes fadeInUp {from {opacity: 0; transform: translate3d(0, 20%, 0);} to { opacity: 1; transform: none;}}
.fadeIn {animation-name: fadeIn;}
@keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}
/*Fin Animaciones*/
/*Formulario*/
.modal_wrap{width: 100%; height: 100vh; background: rgba(0,0,0,0.7); position: fixed; top: 0; left: 0; z-index: 3; display: flex; justify-content: center; align-items: center; }
textarea {resize: none;}
.form-icon {position: absolute; pointer-events: none; color: #5B5A5A; margin: 15px 10px;}
.space-icon{ padding-left: 35px!important; padding: 10px;}
.btn-enviar{border-style: 1px solid; border-color: #1A2D3E; border-width: 1px; background-color: #2C2C2D; color: #fff; border-radius: none; padding: 10px 25px; cursor: pointer;}
.btn-enviar:hover{background-color: #414143;}
.colorerror{color: #CC3333;}
/*Ventana Errores Formulario*/
.mensaje_modal{background: #fff; box-shadow: 0px 0px 15px rgba(0,0,0,0.5); width: 400px; padding: 30px 20px 15px; }
/*.mensaje_modal h3{text-align: center; font-family: 'Ubuntu'; font-size: 20px; font-weight: 400; }*/
.mensaje_modal h3:after{content: ''; display: block; width: 100%; height: 1px; background: #C5C5C5; margin: 10px 0px 15px; }
.mensaje_modal p{font-size: 16px; color: #606060; }
.btn-cerrar{border-style: 1px solid; border-color: #7E0B2B; border-width: 1px; background-color: #7E0B2B; color: #fff; border-radius: none; padding: 5px 15px; cursor: pointer;}
.btn-cerrar:hover{background-color: #600921;}
/*.mensaje_modal p:before{content: "\f00d"; font-family: FontAwesome; display: inline-block; color: #E25151; margin-right: 8px; }*/
/*#btnClose{display: inline-block; padding: 3px 10px; margin-top: 10px; background: #E25151; color: #fff; border: 2px solid #B14141; cursor: pointer; float: right; }*/
/*Formulario*/
/*Responsive*/
/* md */
@media (min-width: 992px) and (max-width: 1199px) {
	.botonesfgris{padding:40px;}
	.botonesfgris h4{font-size: 20px;}	
	/*Pestaña-Pag-Web*/
	.conteweb1{position: relative; top: 150px; z-index: 150;}
	/*Pestaña-Pag-Web*/
}
/*sm*/
@media (min-width: 768px) and (max-width: 991px) {
	.botonesfgris{padding:40px;}
	.botonesfgris h4{font-size: 18px!important;}	
	/*Pestaña-Pag-Web*/
	.conteweb1{position: relative; top: 150px; z-index: 150;}
	/*Pestaña-Pag-Web*/
}
/*xs*/
@media (min-width: 480px) and (max-width: 767px) {	
	h1{font-size:30px;}	
	.botones ul li a{padding-top: 10px!important; padding-bottom: 10px!important;}
	.superiorinicio{margin-top: 80px;}
	/*Menu Dispositivos*/
	.btnburger{background: #000; margin-right: 30px;}
	.iconoMovil{height: 30px!important;}	
	.logojuan{padding-left: 40px; width: 35%!important;}
	.SupBannerIndex{margin-top: 60px;}
	.botonesfgris{padding:20px;background: #414143;}
	.botonesfgris h4{font-size: 20px;}	
	.iconosini{width: 50%;}	
	/*Pestaña-Pag-Web*/
	.conteweb1{position: relative; top: 120px; z-index: 150;}
	.recuadroweb1{background-color: #000; height: 25vh;}
	/*Pestaña-Pag-Web*/
}
/*XS-Portrait*/
@media (max-width: 479px) {
	.SupBannerIndex{margin-top: 50px;}	
	h1{font-size:30px;}
	.botones ul li a{padding-top: 10px!important; padding-bottom: 10px!important;}
	.superiorinicio{margin-top: 80px;}		
	/*Inicio-Menú-Dispositivos*/
	.btnburger{background: #000; margin-right: 30px;}
	.iconoMovil{height: 25px!important;}
	/*Fin-Menú-Dispositivos*/	
	.logojuan{padding-left: 20px; width: 40%;}	
	.botonesfgris{padding:10px;background: #414143;}
	.botonesfgris h4{font-size: 16px;}	
	.iconosini{width: 50%;}	
	/*Pestaña Pag. Web*/
	.conteweb1{position: relative; top: 100px; z-index: 150;}
	.recuadroweb1{background-color: #000; height: 20vh;}
	/*Pestaña-Pag-Web*/
}