*{box-sizing: border-box;padding: 0;margin: 0;-webkit-box-sizing: border-box;
    -moz-box-sizing:border-box;box-sizing: border-box;font-family: 'Fira Sans Bold';}
.texto-negocio, .texto-contactar, .footer{
    display: flex;align-items: center;justify-content: space-around;}
.logo{width: 200px;}
#menu {position: sticky;overflow: hidden;display: flex;align-items: center;justify-content: space-around;
    top: 0;z-index: 10;border-bottom: 20px solid #a1200e;background: #FFFFFF;}
#menu a {font-weight: bold;color: #972B12;text-align: center;padding: 14px 16px;text-decoration: none;font-size: 17px;}
#menu a:hover {background-color: #ddd;color: #FFAC12;}
#menu a.active {background-color: #FFAC12;color: white;}
.introduccion {position: relative;overflow: hidden;height: 50em;}
.efecto-introduccion {position: relative;width: 150vmax;height: 150vmax;left: calc(50% - 75vmax);
    top: calc(50% - 75vmax);pointer-events: none;z-index: 2;animation: rotateFrame 16s linear infinite, rotateHue infinite 32s linear;}
@keyframes rotateFrame {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(180deg);}}
.efecto-introduccion:before, .efecto-introduccion:after {content: "";position: absolute;height: 100%;width: 100%;
    left: 50%;transform: translate3d(-50%, 0, 0);background-color: #b3401a;pointer-events: auto;}
.efecto-introduccion:before {bottom: 50%;animation: openTop 8s infinite;}
@keyframes openTop {
    0% {transform: translate3d(-50%, 0, 0);
        animation-timing-function: cubic-bezier(0.8, 0, 0.1, 1);}
    40% {transform: translate3d(-50%, -65vmax, 0);
        animation-timing-functon: cubic-bezier(0.6, 0.04, 0.98, 0.335);}
    70% {transform: translate3d(-50%, -65vmax, 0);
        animation-timing-functon: cubic-bezier(0.6, 0.04, 0.98, 0.335);}
    100% {transform: translate3d(-50%, 0, 0);
        animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.335);}}
.efecto-introduccion:after {top: 50%;animation: openBottom 8s infinite;}
@keyframes openBottom {
    0% {transform: translate3d(-50%, 0, 0);
        animation-timing-function: cubic-bezier(0.8, 0, 0.1, 1);}
    40% {transform: translate3d(-50%, 65vmax, 0);
        animation-timing-functon: cubic-bezier(0.6, 0.04, 0.98, 0.335);}
    70% {transform: translate3d(-50%, 65vmax, 0);
        animation-timing-functon: cubic-bezier(0.6, 0.04, 0.98, 0.335);}
    100% {transform: translate3d(-50%, 0, 0);
        animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.335);}}
.contenedor-introduccion {position: absolute;height: 100%;width: 100%;top: 0;left: 0;background-color: #fff;}
.imagen-introduccion {position: absolute;height: 100%;width: 100%;opacity: 0;animation: showHideSlide infinite 32s steps(1);}
.contenido-introduccion h2{font-size: 35px; background-color: rgba(0, 0, 0, 0.35); word-spacing: 1vw}
.contenido-introduccion h3{font-size: 25px; background-color: rgba(0, 0, 0, 0.35)}
@keyframes showHideSlide {
    0% {opacity: 1;
        pointer-events: auto;
        z-index: 1;}
    25% {opacity: 0;
        pointer-events: none;
        z-index: -1;}}
.imagen-introduccion:nth-child(1) {animation-delay: 0s;}
.imagen-introduccion:nth-child(1) .animacion-introduccion {background-image: url(../img/2.body/oficina1800w.webp);}
.imagen-introduccion:nth-child(2) {animation-delay: 8s;}
.imagen-introduccion:nth-child(2) .animacion-introduccion {background-image: url(../img/2.body/nave1800w.webp);}
.imagen-introduccion:nth-child(3) {animation-delay: 16s;}
.imagen-introduccion:nth-child(3) .animacion-introduccion {background-image: url(../img/2.body/robots1800w.webp);}
.imagen-introduccion:nth-child(4) {animation-delay: 24s;}
.imagen-introduccion:nth-child(4) .animacion-introduccion {background-image: url(../img/2.body/naveV1800.webp);}
.animacion-introduccion {position: relative;height: 100%;width: 100%;top: 0;left: 0;background-size: cover;
    background-position: center;opacity: 1;z-index: -1;animation: bgInOut 8s infinite;}
@keyframes bgInOut {
    0% {transform: scale3d(0.5, 0.5, 0.5);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);}
    33% {transform: scale3d(1, 1, 1);}
    50% {transform: scale3d(1, 1, 1);}
    66% {transform: scale3d(1, 1, 1);
        animation-timing-function: cubic-bezier(0.895, 0.03, 0.685, 0.22);}
    100% {transform: scale3d(0.5, 0.5, 0.5);}}
.contenido-introduccion {position: absolute;width: 100%;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);
    color: white;text-align: center;text-transform: uppercase;letter-spacing: -0.025em;z-index: 2;opacity: 1;}
.contenido-introduccion h3{text-transform: none;}      
.negocio{padding: 2%;}
        .texto-negocio h2{margin: 5px;float: left;}   
    .boton-negocio{display: flex;}
        .boton-negocio a{color: white !important;letter-spacing: 2px;background-color: #a1200e !important;
            padding: 12.5px 20px 12.5px 20px;line-height: 40px;font-size: 15px;transition: all 1s ease;text-decoration: none;margin: 0 auto;}
        .boton-negocio a:hover{background-color: #FFAC12 !important;}
    .imagen-negocio{-webkit-column-count: 2;-moz-column-count: 2;column-count: 2;padding: 1%;}
    .contenido-negocio{padding: 10px 15px;}
        .contenido-a-negocio{overflow: hidden; display: flex; gap: 20px;}
            .contenido-a-negocio img{height: 330px;}
            .contenido-a-negocio .parrafo{display: block;margin: 0 auto;}
            .contenido-a-negocio h4{font-size: 20px;color: #a1200e;}
                .contenido-a-negocio h4:hover{color: #FFAC12;transition: all 1s ease;}
            .contenido-a-negocio p{color: #fff;}
        figure.efectosn {position: relative;color: #ffffff;text-align: center;font-size: 16px;background-color: #000; flex: 1; height: 30vw; overflow: hidden;}
        figure.efectosn *,
        figure.efectosn *:before,
        figure.efectosn *:after {-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-transition: all 0.55s ease;transition: all 0.55s ease;}
            figure.efectosn img {backface-visibility: hidden;vertical-align: top;opacity: 0.9;height: 100%; width: 100%; object-fit: cover;}
            figure.efectosn .title {position: absolute;top: 58%;left: 25px;padding: 5px 10px 10px;}
            figure.efectosn .title:before,
            figure.efectosn .title:after {height: 2px;width: 720px;position: absolute;content: "";background-color: #ffffff;}
            figure.efectosn .title:before {top: 0;left: 10px;-webkit-transform: translateX(100%);transform: translateX(100%);}
            figure.efectosn .title:after {bottom: 0;right: 10px;-webkit-transform: translateX(-100%);transform: translateX(-100%);}
                figure.efectosn .title div:before,
                figure.efectosn .title div:after {width: 2px;height: 500px;position: absolute;content: "";background-color: #ffffff;}
                figure.efectosn .title div:before {top: 10px;right: 0;-webkit-transform: translateY(100%);transform: translateY(100%);}
                figure.efectosn .title div:after {bottom: 10px;left: 0;-webkit-transform: translateY(-100%);transform: translateY(-100%);}
            figure.efectosn h2,
            figure.efectosn h3 {margin: 0;text-transform: uppercase;}
            figure.efectosn h2 {font-weight: 400;}
            figure.efectosn h3 {font-weight: 700;background-color: #ffffff;padding: 5px 10px;color: #000000;}
        figure.efectosn figcaption {position: absolute;bottom: 42%;left: 25px;text-align: left;opacity: 0;padding: 0 0 0 5px;
            font-size: 0.8em;font-weight: 500;letter-spacing: 1.5px;}
        figure.efectosn figcaption p {margin: 0.4vw; font-size: 1.2vw}
        figure.efectosn:hover img,
        figure.efectosn.hover img {zoom: 1;filter: alpha(opacity=35);-webkit-opacity: 0.35;opacity: 0.35;}
        figure.efectosn:hover .title:before,
        figure.efectosn.hover .title:before,
        figure.efectosn:hover .title:after,
        figure.efectosn.hover .title:after,
        figure.efectosn:hover .title div:before,
        figure.efectosn.hover .title div:before,
        figure.efectosn:hover .title div:after,
        figure.efectosn.hover .title div:after {-webkit-transform: translate(0, 0);transform: translate(0, 0);}
        figure.efectosn:hover .title:before,
        figure.efectosn.hover .title:before,
        figure.efectosn:hover .title:after,
        figure.efectosn.hover .title:after {-webkit-transition-delay: 0.15s;transition-delay: 0.15s;}
        figure.efectosn:hover figcaption,
        figure.efectosn.hover figcaption {opacity: 1;-webkit-transition-delay: 0.2s;transition-delay: 0.2s;}
.texto-equipo{text-align: center;margin: 2%;}
.contenido-equipo{margin: 0;display: flex;align-items: center;justify-content: space-between;}
    .contenido-equipo p{text-align: center;font-size: 25px;max-width: 300px;margin: 10% auto;}
    .contenido-equipo img{width: 50%;margin: auto;}
    .cultura {overflow: hidden;display: grid;grid-template-columns: auto auto auto;padding: 2% 0;margin: 2%;}
        .cultura div{display: flex;align-items: center;justify-content: center;}
        .cultura p {text-align: center;margin: 10px 0;float: left;}
    .circulo {width: 100px;height: 100px;-moz-border-radius: 50%;-webkit-border-radius: 50%;border-radius: 50%;background: #A1200E;
        margin-left: auto;margin-right: auto;font-size: 42px;font-family: impact;color: white;}
    .icono {margin: 0 auto;width: 80px;height: 80px;}
    .texto-clientes{text-align: center;} 
.texto-contactar{width: 70%;float: left;}
        .texto-contactar h2{font-size: 40px;font-weight: 800;text-align: center;}
    .boton-contactar{padding: 10px;}
        .boton-contactar a{color: white !important;letter-spacing: 2px;background-color: #a1200e !important;padding: 12.5px 20px 12.5px 20px;
        line-height: 40px;font-size: 15px;transition: all 1s ease;text-decoration: none;margin-top: 20px;}
        .mapa-contactar{margin: 2%}
        #mapa {width: 100%;height: 500px;}
    .info-contactar{-webkit-column-count: 3;-moz-column-count: 3;column-count: 3;padding: 10px;}
        .info-contactar div a{text-decoration: none;}
            .icono{display: block;margin: 0 auto;padding: 10px;}
            .info-contactar div a h2{text-align: center;font-size: 25px;color: #000;}
            .info-contactar div a p{text-align: center;font-size: 15px;color: #000;}
@-webkit-keyframes scroll {
    0% {-webkit-transform: translateX(0);
        transform: translateX(0);}
    100% {-webkit-transform: translateX(calc(-250px * 5.5));
        transform: translateX(calc(-250px * 5.5));}}
@keyframes scroll {
    0% {-webkit-transform: translateX(0);
        transform: translateX(0);}
    100% {-webkit-transform: translateX(calc(-250px * 11));
        transform: translateX(calc(-250px * 11));}}
    .slider {background: #fff;width: 100%;overflow: hidden;position: relative;}
        .slider::before, .slider::after {background: linear-gradient(to right, #fff 0%, rgba(255, 255, 255, 0) 100%);content: "";
            height: 250px;position: absolute;width: 200px;z-index: 2;}
        .slider::after {right: 0;top: 0;-webkit-transform: rotateZ(180deg);transform: rotateZ(180deg);}
        .slider::before {left: 0;top: 0;}
        .slider .slide-track {-webkit-animation: scroll 40s linear infinite;animation: scroll 40s linear infinite;display: flex; width: calc(250px * 22);}
        .slider .slide {margin: auto; flex: 1; height: auto;}
            .imagen-clientes {object-fit: cover; padding: 5%;}
        .texto-contactar h2{font-size: 45px;}
        .boton-contactar a{color: white !important;letter-spacing: 2px;background-color: #a1200e !important;padding: 12.5px 20px 12.5px 20px;
            line-height: 40px;font-size: 15px;transition: all 1s ease;text-decoration: none;margin: 0 auto;}
        .boton-contactar a:hover{background-color: #FFAC12 !important;}
.contenedor-footer{z-index: 10;border-top: 20px solid #a1200e;background: #FFFFFF;}
    .texto-footer{width: 70%;text-align: center;}
@media only screen and (max-width: 1050px) {
    .contenedor{max-width: 1050px;}
    .introduccion{height: 600px;}
    .texto-negocio{flex-direction: column;}
    .imagen-negocio{column-count: auto;}
    figure.efectosn {height: 50vw;}
    .cultura{display: flex;}
    .contenido-equipo img{width: 90%;margin: auto;}}
@media only screen and (max-width: 1024px){
    #menu a{padding: 1%;}}
@media only screen and (max-width: 425px) {
    #menu a{font-size: 10px;padding: 0;}
    .introduccion{height: 300px;}
    .negocio{flex-direction: column;}
    figure.efectosn figcaption p{font-size: 2.5vw;}
    .contenido-equipo{flex-direction: column;}
    .cultura div{flex-direction: column;}
    .circulo, .icono{width: 50px;height: 50px;font-size: 15px;}
    .texto-contactar{width: 100%;}
    .contactar .boton-contactar{text-align: center;}
    .info-contactar{column-count: 1;}
    .contenedor-footer{margin: 1% 0;}
    .logo{width: 80px;}
    .contenedor-introduccion h2, .contenedor-introduccion h3,
    .texto-contactar h2, .contenido-equipo p,
    .cultura p,
    .texto-contactar h2,
    h1, h2, h3, p{font-size: 15px;margin: auto;}}