@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100&display=swap');
*{
	margin: 0;
	padding: 0;
	font-family: 'Poppins', sans-serif;
}




/*text*/
h1 , h2 , h3 , h4 , span , a , p{
	color: white;
}

h1 , h2 , h3 , h4{
	font-weight: 600;
	color: #333333;
}

.color-parrafo{
	color: #7e7e7e !important;
	font-size: 15px;
}
.text-rojo{
	color: #fd1514;
}
.bg-rojo{
	background: #fd1514;
}
.bg-dark{
	background: #000000 !important;
}

.h2-text{
	font-size: 25px;
	font-weight: 600;
}

.bg-text{
	color: #7e7e7e !important;
}

/*  imagenes  */
.logo , .logo>img{
	height: 80px;

}

.carga-all div{
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 9999;
	background: rgba(0,0,0,0.98);
}
.carga-all div img{
	
	-webkit-animation-direction: reverse;
     animation-direction: reverse;
	 animation:3s rotate linear infinite;
}

@keyframes rotate {from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}}
@-webkit-keyframes rotate {from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}}


/*carousel*/

.avansador{
	width: 15px !important;
	height: 15px !important;
	border-radius: 50% !important;
	opacity: 1 !important;
}

.avansador.active{
	background-color:#255993;
}

/*  header  */
.cabezera{
	position: absolute;
	width: 100%;
	z-index: 999;
}

/* head-p  */
.head-p{
	background: transparent;
	display: flex;
}
.position-abs{
	position: absolute;
	background: rgba(0,0,0,0.8);
	z-index: 99;
}

/*  textos de head-p  */
.map-text-a>span , .tel-text-a>span{
	font-size: 12px;
	color: white;
}
.text-detail{
	height: 70px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.text-detail ul br{
	display: none;
}
.detail-modal ul br{
	display: none;
}
.view-trailer iframe{
	width: 100% !important;
	height: 450px !important;
}
.modal-trailer {
	opacity:  1 !important;
}
.fondo-bg{
	background: rgba(0,0,0,0.7);
}



.h-p-i-text{
	display: flex;
}

/*  iconos  */
.i-map , .i-tel , .i-msg{
	color: white !important;
	font-size: 20px;
}

.i-tel{
	font-size: 25px !important;
}
.img-caja{
	height: 247px;
    overflow: hidden;
}
/*  redes  */
.redes-info>span{
	padding-left: 20px;
	padding-right: 5px;
	font-size: 22px;
	font-weight: 700;
}

.redes-info>span>a{
	color: white;
	font-size: 30px;
}

.cot-a{
	text-align: center;
	margin: 8px 0;
}

/*  barra de navegacion*/
.nav-h>span>a{
	font-size: 14px;
	color: #fff;
	transition: 1s;
}

.nav.active{
	padding-left: 25px !important;
	padding-right: 25px !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	margin-top: 0 !important;
	-webkit-box-shadow: 0px 20px 48px -40px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 20px 48px -40px rgba(0,0,0,0.75);
	box-shadow: 0px 20px 48px -40px rgba(0,0,0,0.75);
	transition: .5s;
}

.nav-log-emp{
	text-align: center !important;
}

.sub-text-logo{
	font-size: 13px !important;
	text-transform: none !important;
}

.nav-h>span>a:hover{
	color: #CB3142;
	transition: .3s;
}

.logo>div>span{
	color: #131212;
	font-size: 20px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

/*  contenido de header  */
.cont-header{
	position: absolute;
	z-index: 9;
	top: 0;
	left: 0;
	max-height: 120vh;
	min-height: 120vh;
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.8916608879880077) 21%, rgba(0,0,0,0.7852183109571954) 55%);
	width: 100%;
}
.body1{
	background: fixed;
	background-image: url('../img/fondo1.png');
	background-repeat: no-repeat;
	background-size: contain;
}
.text-nosotros {
	font-size: 35px;
}
.slick-prev:before, .slick-next:before {
font-size: 40px !important;
color: #f2f2f2 !important;
}

.carro2 .slick-prev:before, .carro2 .slick-next:before {
	font-size: 40px !important;
	color: #CB3142 !important;
	}
.top-negativ{
	position: relative;
	margin-top: -130px;
	z-index: 9;
}
.carro2 .slick-next{
	right: 0 !important;
}


.cont-header h1{
	font-size: 45px;
	color: #fff;
	font-weight: 800;
	text-transform: uppercase;
}
.element-cr:hover{
	transform: scale(1.05);
	transition: .5s;
}

.a-he-te{
	
	width: 70%;
	padding: 25px 30px;
}
.logo-text h4{
	font-size: 40px;
	
}
.logo-text span{
	font-size: 15px !important;
	color: white !important;
}

.sub-text-cont{
	color: #255993;
}

.sub-subtext-cont>span{
	font-size: 14px;
	font-weight: 600;
}

.bar-cont{
	height: 2px;
	background: transparent;
}

.progress-bar-blanco{
	background-color: #255993;
}

.btn-cont-head-1{
	background-color: #255993;
	border: 2px solid #255993;
	color: white !important;
	border-radius: 0px;
	font-size: 15px;
	padding: 13px 40px;
	transition: 1s;
}


.btn-cont-head-1:hover{
	border: 2px solid #255993;
	background-color: white;
	color: #255993 !important;
	transition: .6s;
}
/*  sobre la empresa  */
.sb-hed-ind{
	padding: 120px 0px !important;
}

.sb-ind-cont{
	width: 50%;
}

.sb-hed-ind{
	margin: 0 5%;
	padding: 0 15px;
}

.sb-ind , .sb-ind-cont{
	color: black;
	padding: 0px 20px;
}

.sb-ind>h1{
	font-size: 45px;
	color: black;
}

.sb-ind>span{
	padding: 20px 0px;
}

.sb-ind>span , .sb-ind>span>a{
	color: black;
}
.position-box{
	background: rgb(0,0,0);
background: linear-gradient(360deg, rgba(0,0,0,1) 14%, rgba(0,0,0,0.6812850140056023) 34%, rgba(0,0,0,0) 100%);
	top: 0;
	left: 0;
}
.position-box a{
	color: #F58919;
}
.text-naranja{
	color: #F58919;
}

.sb-ind>span>a{
	font-size: 14px;
	font-weight: 500;
	color: white;
	background-color: #F58919;
	border-radius: 0;
	padding: 10px 40px;
	transition: .6s;
	border: 2px solid #F58919;

}

.sb-ind>span>a:hover{
	border: 2px solid #255993;
	background-color: transparent;
	transition: .6s;
	color: #255993;
}

.sb-cont>h3{
	font-size: 18px;
	color: black;
}


.img-nosotros{
	
}

/*  servicios #1, #2 y #3  */
.serv{
	background: rgba(0,0,0,0.85);
	padding: 100px 0;
}

.proc{
	background-color: #f8f8f8;
}

.serv>div>h4{
	color: #f2f2f2;
	font-size: 18px;
	text-align: center;
	margin-bottom: 20px;
}

.serv>div>h1{
	
	text-align: center;
	color: white;
	margin-bottom: 60px;
}

.text-title{
	font-size: 60px;
}


.serv-cont>div{

	width: 23% !important;
	max-width: 23% !important;
	flex: auto !important;
	background-color: white;
	transition: .5s;
	overflow: hidden;
	-webkit-box-shadow: 10px 10px 29px -29px rgba(0,0,0,0.75);
	-moz-box-shadow: 10px 10px 29px -29px rgba(0,0,0,0.75);
	box-shadow: 10px 10px 29px -29px rgba(0,0,0,0.75);
}
.caja-foo h2{
	color: white;
	font-size: 18px;
}
.caja-foo a{
	display: block;
	margin-left: 0;
	padding: 0;
	padding: 4px 0;
	font-size: 14px;
}
.caja-foo p{
	font-size: 14px;
}
.red a svg{
	font-size: 20px;
}

.serv-cont>div:hover{
	
	transition: .5s;
	transform: scale(1.02);
}

.serv-cont>div:hover .position-box{
	background: rgba(0,0,0,0.95);
	
}

.proc-cont{

}

.serv.srv-h .serv-cont>div{

	max-width: 31% !important;
	flex: auto !important;
	overflow: hidden;
	cursor: pointer;
}


@keyframes mueve{
	0% {transform: scale(1);}
  100%{transform: scale(1.02);}
}

.serv-cont>div>h3{
	font-size: 18px;
	text-align: center;
	color: #131212;
	
}
.h3-estilo{
	margin-bottom: 0 !important;
    height: 90px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.serv-cont>div>p{
	font-size: 15px;
	text-align: center !important;
	color: #444444;
	height: 180px;
}

.proc-cont>div>p{
	height: 100px !important;
}

.proc-cont-a>div>p{
	height: 150px !important;
}

.proc-cont-b>div>p{
	height: 90px !important;
}

.serv-a{
	padding-top: 50px;
}

.serv-a>a{
	color: white;
	font-size: 15px;
	background-color: #255993;
	border-radius: 0;
	border: 2px solid #255993;
	padding: 15px 50px;
	transition: 0.6s;
}

.serv-a>a:hover{
	background-color: white;
	border: 2px solid #255993;
	color: #255993;
	transition: 0.6s;
}

/*  productos  */
.serv.pro-cent{
	background-color: #f9f9f9;
}

.pro-cent>div>h4{
	color: #255993;
}
.pro-cent>div>h1{
	color: #444444;
}
.img-pro{
	height: 217px;
	overflow: hidden;
}

/*  Métodos  */
.metd{
	background-image: url(../imagenes/fondo-3.jpg);
	padding: 120px 0;
}

.metd>div>div>p{
	padding: 15px 0;
}

.metd>div>div>h3{
	font-size: 20px;
	padding-top: 20px;
}

.metd .redes-info{
	padding-left: 0 !important;
	padding: 15px 0;
}

.metd .redes-info>span{
	padding: 0;
	padding-right: 20px;
	font-size: 16px !important;
}

.metd .progress{
	border-radius: 0 !important;
}

.progress-bar-n{
	background-color: #FBAD1A;
}

.metd-1-pgr{
	padding-bottom: 20px;
}

.metd-pgr>h4 , .metd>span{
	font-size: 15px;
}

/*  formulario de contacto  */
.aea{
	background-color: #255993;
	padding: 100px 0;
}

.bg-fondo{
	background-color: white;
	padding: 30px;
	border-radius: 12px;
	-webkit-box-shadow: -10px 10px 45px -22px rgba(0,0,0,0.75);
	-moz-box-shadow: -10px 10px 45px -22px rgba(0,0,0,0.75);
	box-shadow: -10px 10px 45px -22px rgba(0,0,0,0.75);
	position: relative;
	z-index: 9;
	margin-left: -50px;
}

.bg-fondo-c{
	background-color: white;
	padding: 30px;
	border-radius: 12px;
	position: relative;
	z-index: 9;
}

.bg-text>h3{
	font-size: 16px;
}

.bg-text>h1{
	font-size: 25px;
}

.cto{
	padding: 80px 0;
}

.bg-text-cto{
	text-align: center;
}

.bg-text-cto>h1{
	font-size: 25px;
}

.bg-text>p{
	font-size: 12px;
	color: #7e7e7e;
	text-align: center;
}

.frm-tap{
	background: fixed 50% 50%;
}

.frm-pc{
	background: rgba(0,0,0,0.5);
	padding: 100px 0;
}

.frm-pc>div>h3{
	color: white;
	font-size: 18px;
	margin: 0 !important;
}

.frm-pc>div>h1{
	font-size: 45px;
	color: white;
}

.l-info-emp{
	padding: 50px 0;
}

.l-p-inf{
	padding-top: 10px;
}

.l-p-inf>div>h5{
	font-size: 18px;
}

.l-inf{
	padding: 10px 0;
}

.l-inf>span{
	font-size: 12px;
}

label{
	margin: 0 !important;
}

#user-nombre , #user-telefono , #user-email{
	padding: 13px 0px;
	margin-bottom: 20px;
	color: #444444;
	font-size: 15px;
	border: 0;
	border-bottom: 1px solid #666666;
}

#user-mensaje{
	padding: 13px 0px;
	height: 140px;
	color: #444444;
	font-size: 15px;
	border: 0;
	border-bottom: 1px solid #666666;
}

.form-emp{
	padding-bottom: 30px;
}


.sub-but{
	border-radius: 0;
	border: 2px solid #255993;
	background-color: #255993;
	padding: 13px 30px;
	color: white;
	transition: 0.6s;
}

.sub-but:hover{
	border: 2px solid #255993;
	background-color: white;
	padding: 13px 30px;
	color: black;
	transition: 0.6s;
}

/*contacto info*/
.form-info>div>div{
	padding: 10px;
}

.form-info i{
	font-size: 25px;
	color: #255993;
	font-weight: 700;
}

.form-info span{
	color: #444444;
	font-size: 14px;
}


/*  footer  */
footer{
	background-color: #000;
	padding: 30px 0;
}

footer span , footer a{
	font-size: 14px;
	color: white;
	margin: 0 8px;
	padding-left: 8px;
	padding-bottom: 10px;
}

footer a{
	text-decoration: none !important;
}

footer a:hover{
	color: white;
}

footer small{
	color: white;
	font-size: 13px;
}

footer i{
	color: white;
	font-size: 20px;
	padding-right: 10px;
}

footer h5{
	color: white;
	font-size: 23px;
}

.fo-log , .fo-info , .fo-menu{
	padding: 0 20px;
}

.fo-menu{
	text-align: center !important;
}

.fo-menu>span{
	padding-bottom: 15px !important;
	padding-left: 0px;
}

.fo-menu-te-a{
	padding-bottom: 15px;
}

.fo-menu-te{
	padding-bottom: 15px;
}

.fo-menu-c{
	margin: 0;
	padding: 0;
}

.fa-envelope{
	margin-left: -5px;
}

.fo-t>span{
	font-size: 14px;
	color: white;
	margin: 0 8px;
	padding-left: 8px;
	padding-bottom: 10px;
}

.fo-to>span{
	font-size: 14px;
	color: white;
	padding-left: 6px !important;
	padding-bottom: 10px;
}

/*   modal  */
#img-modal{
	width: 60%;
}

.bu-mo{
	border: 0;
	background: none;
}

.fo-tp{
	width: 40%;
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.fo-tp>h3{
	text-align: center;
}

.fo-tp>p{
	text-align: justify;
}

.bu-mo>svg{
	font-size: 1.8rem;

}

@media(max-width: 756px){
	/* header */
	.cabezera{
		
	}
	.cabezera .nav{
		flex-direction: column;
    position: fixed;
    margin: 0 !important;
    width: 100%;
    padding: 0 !important;
	}
	.head-p{
		display: none !important;
	}
	.img-caja {
    height: 217px;
    overflow: hidden;
}
	.logo{
		justify-content: space-between;
		background: none;
		background: #000000;
	}
	.logo img{
		
    margin: auto 0;
	}
	.nav-h{
		flex-direction: column !important;
		position: fixed;
		top: 0;
		left: 0;
		padding: 15px;
		background: white;
		width: 80%;
		margin-left: -80%;
		height: 100vh;
		transition: .5s;
	}
	.nav-h.active{
		flex-direction: column !important;
		position: fixed;
		top: 0;
		left: 0;
		transition: .5s;
		padding: 15px;
		background: #000000;
		width: 80%;
		margin-left: 0;
		height: 100vh;
	}
    
    .nav-h span{
    	margin-bottom: 10px;
    }
    .caja-foo h2 {

      margin: 10px 0;
      font-size: 20px;
    }
	.cont-header h1 {
		font-size: 25px;

		font-weight: 700;
	}

	.slick-next {
		right: -8px !important;
	}
	.sf-1 {
		font-size: 22px !important;
	}
	.video-web{
		width: auto !important;
		height: 90vh !important;
	}
	.position-abs {
		height: 90vh;
	}

	.img-mv{
		height: 120vh;
		width: auto !important;
	}

	.cont-header {
		padding: 0;
		display: flex;
		flex-direction: column;
		justify-content: center !important;
	}

	.a-he-te {
		width: 100%;
	}

	/* sobre la empresa(nosotros) */
	.sb-hed-ind{
		padding: 40px 0 !important;
	}

	.sb-ind{
		text-align: center;
	}

	.sb-ind>h1{
		font-size: 30px;
	}

	.color-parrafo{
		font-size: 13px;
		text-align: justify;
	}

	/* servicios */
	.serv{
		padding: 5%  !important;
	}

	.serv h1{
		font-size: 30px !important;
	}

	.serv.srv-h .serv-cont>div {
		width: 100% !important;
		max-width: 100% !important;
		flex: auto !important;
	}

	.proc-cont>div{
		margin-bottom: 20px;
	}

	.proc-cont>div>p{
		height: 160px !important;
	}

	.proc-cont>div>h3{
		height: auto;
		margin: 0;
		padding: 15px 0;
	}

	.proc-cont>div>.proc-ct-te{
		height: 100px !important;
	}

	/* productos */
	.pro-cent{
		padding: 40px 24px !important;
	}

	.pro-cent-dex>div{
		width: 100% !important;
		max-width: 100% !important;
		flex: auto !important;
		margin-bottom: 20px;
	}

	.pro-cent-dex>div>h3{
		height: auto;
		margin: 0;
		padding: 15px 0;
	}

	.tet-pro>p{
		height: 100px !important;
	}

	.tet-pro-a>p{
		height: 120px !important;
	}

	.tet-pro-b>p{
		height: 130px !important;
	}

	.proc-cont-b div>h3 , .proc-cont-a div>h3{
		height: auto !important;
		margin: 0 !important;
	}

	/* formulario */
	.aea{
		padding: 50px 0;
	}

	.aea>.f-img{
		display: none;
	}

	.aea>.bg-fondo{
		width: 100%;
		margin-left: 0px;
		border-radius: 0;
	}

	.bg-text>h1{
		font-size: 20px !important;
	}

	/* footer */
	.fo-info{
		text-align: center !important;
		padding: 20px;
	}

	.fo-menu{
		padding: 20px;
	}

	/* nosotros.php */
	.not-p{
		height: 300px !important;
	}

	.car-els{
		padding-bottom: 15px;
	}

	/* modal */
	#img-modal{
		width: 100%;
	}

	.fo-tp{
		width: 100%;
	}

	.bu-mo{
		border: 0;
		background: none;
	}

	.bu-mo>svg{
		font-size: 1.8rem;
		color: white;
		
	}
}