@font-face{font-family:"Jost Light";src:url("../fonts/Jost-Light.ttf")}
@font-face{font-family:"Jost Bold";src:url("../fonts/Jost-Black.ttf")}
@font-face{font-family:"Jost Bold Italic";src:url("../fonts/Jost-ExtraBoldItalic.ttf")}
@font-face{font-family:"Jost Black";src:url("../fonts/Jost-Black.ttf")}
body{font-family:"Jost Light"}
html{scroll-behavior:smooth}
h1,h2,h3{font-family:"Jost Light";font-weight:600}
h1{font-family:"Jost Bold";letter-spacing:10px;font-size:30px}
.fG{background:#232323}
.fN{background:#000}
.fV{background:#07453d}
.tV{color:#30877c}
.tB{color:#fff}
.fVC{background:#56867e}
.tVC{color:#56867e}
#s1{background:url(../img/header/header.jpg);background-size:cover;background-position:center}
#s1{height:1100px}
#s1 .redes{position:absolute;top:3%;right:3%}
#logo-central{position:absolute;transform:translate(-50%,-50%);top:80%;left:50%;max-width:300px}
.redes img{width:14%;padding-right:15px}
.redes img:nth-child(1){width:10%}
.redes img:hover{cursor:pointer;opacity:.5;|}
#logo{max-width:150px;position:absolute;top:5%;left:5%}
#menu-btn img:hover{transition:all .2s ease-in;transform:rotate(45deg);cursor:pointer}
.padd-40{
	padding: 40px 0;
}
#menu-btn{position:absolute;top:3%;right:5%;width:40px}
#letras-header{position:absolute;transform:translate(-50%,-50%);right:3%;width:20px;top:40%}
.rowCompleto{max-width:100%}
.rowCompletoFooter{max-width:85%;position:relative}
#fondos2-1{background:url(../img/somos/somos_1.png);background-size:cover;background-repeat:no-repeat;background-position:center;height:500px}
#fondos2-3{background:url(../img/somos/somos_2.png);background-size:cover;background-repeat:no-repeat;background-position:center;height:500px}
.fondoVT{background:#07453d;-webkit-transform:skew(-10deg);-moz-transform:skew(-10deg);-ms-transform:skew(-10deg);-o-transform:skew(-10deg);transform:skew(-10deg);max-width:400px;margin:0 auto}
.fondoVT h2{-webkit-transform:skew(10deg);-moz-transform:skew(10deg);-ms-transform:skew(10deg);-o-transform:skew(10deg);transform:skew(10deg);color:#fff;font-size:17px;letter-spacing:12px;line-height:21px;padding:8px 0;margin-bottom:30px}
.fondoVT h2 b{display:block}
#s2 p{max-width:400px;margin:0 auto;white-space:pre-line;line-height:15px;font-size:15px}
#nuestros-servicios{padding:120px 0}
.lineaTitulo:before{content:"___________________________";position:absolute;transform:translate(-50%,-50%);bottom:13px;left:50%;letter-spacing:0;font-family:"Jost Light"}
.lineaTitulo b{display:block;color:#000}
.lineaTitulo{font-size:30px;position:relative}
#nuestros-servicios2 .row{position:relative;top:-80px}
#nuestros-servicios3{height:150px}
#clientes img{width:100px}
#clientes{padding:50px 0}
#clientes img:hover{transition:all .2s ease-in;opacity:.5;cursor:pointer}
#bloqueMad{position:relative;padding:200px 0}
#lineasBloque{position:absolute;right:20%;bottom:1%;width:300px}
#form-contacto{width:80%}
#form-contacto label{width:45%;float:left;color:#fff;font-size:18px;position:relative;bottom:-5px;letter-spacing:10px}
#form-contacto input[type=text]{width:55%;border:0;border-radius:0}
textarea{border:0;border-radius:0}
.btn:hover{background:#49736c}
.btn{font-size:20px;padding:5px 15px;border-radius:0;cursor:pointer;margin-left:10px}
#contacto{padding:120px 0}
#contacto h1{font-family:"Jost Light"}
footer li{list-style:none;padding:10px}
footer .text-left img{width:50px;padding-right:30px}
a:focus,a:hover{color:#56867e}
footer .redes{position:absolute;bottom:70px;right:0}
.rowCompletoFooter h3{font-family:"Jost Light";letter-spacing:10px;font-size:20px}
#caps{position:absolute;bottom:50px;transform:translate(-50%,-50%);left:50%}
#caps .capsB{float:left;bottom:0;width:25px;padding:5px}
.smallDown{position:relative;top:60px}
.modal{display:none;position:fixed;z-index:1;padding-top:100px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0 0 0 / 90%)}
.modal-content{position:relative;background-color:rgb(158 161 160 / 50%);margin:auto;padding:50px;width:90%;max-width:1200px}
.close{color:white;position:absolute;top:50px;right:50px;font-size:30px;font-weight:bold;background:#235f58;padding:8px 20px 8px 18px;z-index:2}
.close:hover,.close:focus{background-color:rgb(50 136 125 / .7)}
.mySlides{display:none}
.cursor{cursor:pointer}
.prev,.next{cursor:pointer;position:absolute;top:50%;width:auto;padding:8px 20px 8px 18px;margin-top:-50px;color:#fff!important;font-weight:bold;font-size:30px;transition:.6s ease;user-select:none;-webkit-user-select:none;background:#32887d}
.next{right:50px}
.prev:hover,.next:hover{background-color:rgb(50 136 125 / .7)}
.numbertext{color:#f2f2f2;font-size:12px;padding:8px 12px;position:absolute;top:0}
img{margin-bottom:-4px}
.caption-container{text-align:center;background-color:rgb(35 95 88 / 50%);padding:2px 16px;color:#000;position:absolute;bottom:170px;max-width:1100px;width:100%}
.demo{opacity:.6}
.active,.demo:hover{opacity:1}
img.hover-shadow{transition:.3s}
.hover-shadow:hover{box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)}
.caption-container #caption{color:#fff}
#nuestro-trabajo{padding:100px 0;padding-bottom:150px}
.flip-card{width:100%;height:100%;perspective:1000px}
.flip-card-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .6s;transform-style:preserve-3d;box-shadow:0 4px 8px 0 rgba(0,0,0,0.2)}
.flip-card:hover .flip-card-inner{transform:rotateY(180deg)}
.flip-card-back{position:absolute;top:0;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.flip-card-back{transform:rotateY(180deg)}
#trabajoFlip1,#trabajoFlip2,#trabajoFlip3,#trabajoFlip4,#trabajoFlip5,#trabajoFlip6{position:relative}
#trabajoFlip1:before{content:"_ ADIDAS RUNNERS";position:absolute;left:-140px;top:110px;font-size:12px;color:#fff;transform:rotate(-90deg);letter-spacing:10px}
#trabajoFlip2:before{content:"OZWEEGO INVICTUS";position:absolute;right:-145px;top:110px;font-size:12px;color:#fff;transform:rotate(-90deg);letter-spacing:10px}
#trabajoFlip3:before{content:"_ ADIDAS MAZATLÁN";position:absolute;left:-150px;top:110px;font-size:12px;color:#fff;transform:rotate(-90deg);letter-spacing:10px}
#trabajoFlip4:before{content:"_ REEBOK MAZATLÁN";position:absolute;right:-150px;top:110px;font-size:12px;color:#fff;transform:rotate(-90deg);letter-spacing:10px}
#trabajoFlip5:before{content:"GIGI HADID";position:absolute;left:-90px;top:50px;font-size:12px;color:#fff;transform:rotate(-90deg);letter-spacing:10px}
#trabajoFlip6:before{content:"_ ANDREA STARA";position:absolute;right:-125px;top:85px;font-size:12px;color:#fff;transform:rotate(-90deg);letter-spacing:10px}
/*#trabajoFlip7:before{content:"ABIERTO MEXICANO DE TENIS 2022";position:absolute;left:-224px;top:164px;font-size:8px;color:#fff;transform:rotate(-90deg);letter-spacing:10px}*/
#caption{text-align:left;font-size:18px}
#captionTitle{text-align:left;font-family:"Jost Bold Italic";color:#fff}
#bola-trabajo{width:200px;position:absolute;transform:translate(-50%,-50%);right:-100px;top:58%}
#treslineas-trabajo{width:160px;position:absolute;transform:translate(-50%,-50%);left:58px;top:90%}
#lineas-trabajo{width:30px;position:absolute;transform:translate(-50%,-50%);left:15px;top:23%}
#logo-trabajo{position:relative;width:90px;top:100px}
#nuestro-trabajo .row{position:relative}
.menu{display:none}
.contenedorMenu{position:fixed;top:0;left:0;width:100%;height:100%;background:rgb(230 230 230 / .9);z-index:2;display:flex}
.menu ul{margin:0 auto}
.menu li{font-family:"Jost Black";font-size:50px;list-style:square;position:relative;transition:all .1s ease-in}
.menu li:hover:before{content:"X";position:absolute;left:-120px;top:-15px;font-size:70px;color:#56867e}
.menu li:hover,.menu li a:hover{color:#56867e}
.menu li a{color:#232323}
#cerrar-btn{position:absolute;top:0;right:0;background:#56867e;color:#fff;font-size:34px;font-family:"Jost Bold";padding:0 15px 6px 16px}
#cerrar-btn{cursor:pointer}
.cajita {
	position: relative;
}
.cajita b {
	position: absolute;
	transform: translate(-50%, -50%);
	bottom: 0;
	left: 50%;
	text-align: center;
	color: #fff;
	letter-spacing: 10px;
	width: 100%;
}
.cajitaDos b b {
	bottom: -30px;
	font-size: 11px;
}
.cajitaDos b {
	bottom: 35px;
}

@media screen and (max-width:39.9375em){
	.tituloCentral{
		font-size: 30px !important;
	}
	.cajitaDos b {
		bottom: 5px;
		line-height: 10px;
	}
	.cajitaDos b b {
		bottom: -22px;
		font-size: 7px;
		line-height: 7px;
	}
	.cajita b{bottom: -5px;letter-spacing: 5px;font-size: 9px}
	.menu li:hover:before{left:-70px;top:-5px;font-size:35px}
	.menu li{font-size:25px}
	#lineas-trabajo{width:10px;left:6px;top:28%}
	#bola-trabajo{width:100px;right:-55px;top:70%}
	#treslineas-trabajo{width:30px;left:15px;top:92%}
	#logo-trabajo{position:relative;width:60px;top:90px}
	#nuestro-trabajo{padding:10px;padding-bottom:100px}
	#nuestros-servicios{padding:90px 0;padding-top:40px}
	.lineaTitulo{font-size:20px}
	.lineaTitulo:before{content:"___________________________";bottom:9px}
	#trabajoFlip1:before{left:-60px;top:43px;font-size:9px;letter-spacing:2px}
	#trabajoFlip3:before{left:-65px;top:43px;font-size:9px;letter-spacing:2px}
	#trabajoFlip5:before{left:-40px;top:20px;font-size:9px;letter-spacing:2px}
	#trabajoFlip2:before{right:-70px;top:40px;font-size:10px;letter-spacing:2px}
	#trabajoFlip4:before{right:-71px;top:50px;font-size:10px;letter-spacing:2px}
	#trabajoFlip6:before{right:-58px;top:40px;font-size:10px;letter-spacing:2px}
	.rowCompletoFooter h3{font-size:16px}
	#contacto{padding:20px 0}
	#fondos2-1,#fondos2-3{height:250px}
	#s1{height:620px}
	#logo{max-width:80px;top:2%;left:2%}
	#s1 .redes{position:absolute;max-width:120px;top:3%;right:20%}
	.redes img{width:35px;padding-right:13px}
	.redes img:nth-child(1){width:25px}
	#menu-btn{width:30px}
	#letras-header{width:15px;top:30%}
	#logo-central{top:65%;left:50%;max-width:200px}
	.fondoVT{max-width:300px}
	.fondoVT h2{font-size:13px;letter-spacing:9px}
	#s2 p{max-width:310px;font-size:14px;line-height:13px}
	.textoBloque{padding:20px 0}
	#bloqueMad{position:relative;padding:50px 20px}
	#lineasBloque{position:absolute;right:10%;bottom:5%;width:150px}
	#bloqueMad .fondoVT{margin-top:30px}
	#clientes img{width:100px;padding:10px}
	#nuestros-servicios2 .row{width:90%}
	#nuestros-servicios2{height:540px}
	#nuestros-servicios3{height:100px}
	#form-contacto{width:90%;margin:0 auto}
	#form-contacto label{font-size:13px;letter-spacing:5px}
	.modal-content{padding:10px;width:95%}
	.prev,.next{padding:6px 12px 6px 10px;font-size:10px;margin-top:-20px}
	.next{right:10px}
	.close{top:10px;right:10px;padding:0 10px 0 10px;font-size:20px}
	.caption-container{bottom:17px;right:9px;max-width:450px;width:95%}
	.caption-container #caption{color:#fff;font-size:11px}
	#caps{bottom:-50px}
	}@media screen and (min-width:64em){#nuestros-servicios2{height:1850px}
	.masPeque{max-width:40%;margin:0 auto}
}