﻿body {
    margin: 0;
}

p {
    font-family: 'Poppins';
}

h1 {
    font-family: 'Poppins';
}

h2 {
    font-family: 'Poppins';
}

h3 {
    font-family: 'Poppins';
}

h4 {
    font-family: 'Poppins';
}

h5 {
    font-family: 'Poppins';
}

.wpp {
    position: fixed;
    width: 51px;
    right: 26px;
    bottom: 60px;
    line-height: 55px;
    filter: drop-shadow(2px 2px 7px black);
    z-index: 999;
}

/*Menú de navegación*/
.stl-nav {
    width: 100% !important;
    /*background-color: #00000030;
    color: #000;
    box-shadow: 0px 0px 10px 0px #ad663c;*/
    position: absolute !important;
}

.ttl-nav {
    font-size: 3vh !important;
    font-weight: 600 !important;
    text-shadow: 3px 1px #0e0e0e80;
}

.sttl-nav {
    color: #fff !important;
    font-size: 2vh !important;
}

.stl-ul-nav {
    justify-content: space-evenly !important;
}

/*Sección inicio*/
#secInicio {
    margin: 0;
    padding: 0;
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(205, 200, 199, 0.1)), url(../Img/fondo-inicio.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    height: 100vh;
    min-height: 100%;
    box-shadow: 0px 0px 10px 0px #cf7322;
}

.stl-inicio-gral-1 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 10% !important;
    height: 1vw;
}

.stl-inicio-gral-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.stl-p-1 {
    font-weight: 800;
    color: #fff;
    font-size: 4vw;
}

.typed-cursor {
    color: #fff;
    font-size: 4vw;
}

.stl-p-2 {
    font-size: 1.1vw;
    color: #ffffff;
    font-weight: 300;
    margin-bottom: 2px;
    font-family: 'Poppins';
}

@media (max-width:1400px) {
    .stl-p-2 {
        font-size: 1.5vw;        
    }

    .stl-inicio-gral-1 {
        margin-top: 15% !important;
    }
}

.stl-btn-cont {
    border: none;
    background-color: #ffffff;
    font-size: 1vw;
    font-weight: 500;
    color: #000;
    padding: 1vw;
    box-shadow: 4px 4px 0px 0px #000;
    border-radius: 2px;
}

.stl-btn-cont:hover {
    background-color: #00000040;
    color: #ffffff;
    box-shadow: 4px 4px 0px 0px #000;
    transition-duration: 0.5s;
}

@media (max-width:992px) {
    .stl-nav {
        background-color: #00000090;
        box-shadow: 0px 0px 10px 0px #1c1717;
    }

    .stl-inicio-gral-1 {
        margin-top: 30% !important;
        display: flex;
        justify-content: space-evenly;
    }

    .stl-inicio-gral-2 {
        grid-template-columns: 1fr;
    }

    .stl-div-none {
        display: none;
    }

    .stl-p-1 {
        font-size: 5vh;
    }

    .stl-p-2 {
        font-size: 4vw;
    }

    .sttl-nav {
        font-size: 3vh !important;
        font-weight: 600 !important;
        text-shadow: 2px 2px #000;
    }

    .typed-cursor {
        font-size: 5vh;
    }

    .stl-btn-cont {
        font-size: 5vw;
        padding: 3vw;
        margin: 0 auto;
        display: flex;
        justify-content: center;
    }
 }

/*Sección superficies*/
#secSuperficies {
    margin: 0;
    padding: 0;
}

.stl-div-sup-1 {
    padding-inline: 30vw !important;
    margin-top: 5% !important;
}

.stl-div-sup-2 {
    background-color: #1757CF;
    box-shadow: 7px 7px 0px 0px #00000040;
}

.stl-div-sup-8 {
    background-color: #c36b38;
    box-shadow: 7px 7px 0px 0px #00000040;
}

.stl-ttl-sup {
    font-size: 3vw;
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    text-shadow: 3px 3px #000;
    color: #ffffff;
}

.stl-div-sup-3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    margin-top: 2% !important;
}

.img-sup {
    width: 100%;
    box-shadow: 7px 7px 0px 0px #00000040;
    transition: 0.5s;
    object-fit: cover;
}

.img-sup:hover {
    transform: scale(1.2);
}

.stl-div-int-1 {
    padding: 2%;
}

.stl-div-int-2 {
    padding: 5%;
    box-shadow: 3px 3px 0px 0px #e9803940;
    min-height: 100%;
}

.stl-sttl-sup {
    margin-top: 5%;
    text-align: center;
    font-size: 1.7vw;
    font-weight: 700;
    color: #1757CF;
    text-shadow: 1px 1px #bbbbbb;
}

.stl-text-sup {
    font-family: Poppins;
    text-align: justify;
}

@media (max-width:992px) {
    .stl-div-sup-3 {
        grid-template-columns: 1fr;
        margin-top: initial;
    }

    .stl-div-sup-2 {
        box-shadow: 4px 4px 0px 0px #00000040;
    }

    .stl-div-sup-8 {
        box-shadow: 4px 4px 0px 0px #00000040;
    }

    .stl-div-sup-1 {
        padding-inline: 18% !important;
        margin-top: 15% !important;
    }

    .stl-ttl-sup {
        font-size: 8vw;
    }

    .img-sup {
        box-shadow: 5px 5px 0px 0px #00000040;
    }

    .stl-div-int-2 {
        box-shadow: 0px 3px 0px 0px #e9803940;
    }

    .stl-sttl-sup {
        font-size: 6vw;
    }
}

/*Sección Mantenimiento*/
#secMantenimiento {
    margin: 0;
    padding: 0;
    background-color: #c36b38;
    margin-top: 4% !important;
}

.stl-div-sup-4 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.stl-img-mant {
    width: 3vw;
    background-color: #fff;
    padding: 7px;
    border-radius: 50%;
}

.stl-div-int-3 {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 8% 0% 4% 0%;
    padding-inline: 5vw;
}

.stl-p-mant {
    color: #ffffff;
    margin-top: 1vw;
    text-align: center;
}

@media (max-width:992px) {
    #secMantenimiento {
        margin-top: 15% !important;
    }

    .stl-div-sup-4 {
        grid-template-columns: 1fr;
        margin: 6vw 0vw 6vw 0vw;
    }

    .stl-img-mant {
        width: 10vw;
    }

    .stl-div-int-3 {
        margin: 10% 0% 4% 0%;
    }
}

/*Sección Galeria*/
#secGaleria {
    margin: 0;
    padding: 0;
    padding-bottom: 5%;
}

.stl-ttl-sup-2 {
    font-size: 3vw;
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    text-shadow: 3px 3px #000;
    color: #ffffff;
    margin-bottom: 8%;
}

.stl-carousel-1 {
    padding: 0 !important;
    padding-inline: 20% !important;
}

.stl-carousel-2 {
    box-shadow: 7px 7px 0px 0px #00000040;
}

.stl-carousel-3 {
    width: 48% !important;
}

@media (max-width:992px) {
    #secGaleria {
        padding-bottom: 15%;
    }

    .stl-carousel-1 {
        padding: 0 !important;
        padding-inline: 5% !important;
    }

    .stl-carousel-2 {
        box-shadow: 5px 5px 0px 0px #00000040;
    }

    .stl-carousel-3 {
        width: 25% !important;
    }

    .stl-ttl-sup-2 {
        font-size: 8vw;
    }
}

/*Sección Sobre Nosotros*/
#secNosotros {
    margin: 0;
    padding: 0;
}

.stl-div-sup-5 {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(205, 200, 199, 0.1)), url(../Img/fondo-nosotros.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
}

.stl-ttl-nosotros {
    font-size: 3vw;
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    text-shadow: 3px 3px #000;
    color: #ffffff;
    margin-bottom: 3%;
    margin-top: 3%;
}

.stl-div-sup-6 {
    margin-inline: 15%;
    text-align: justify;
    margin-bottom: 5%;
}

.stl-p-nos {
    color: #ffffff;
    margin-top: 1vw;
    text-align: justify;
    font-weight: 500;
    font-size: 1.3vw;
    text-shadow: 2px 2px black;
}

@media (max-width:992px) {
    .stl-ttl-nosotros {
        font-size: 8vw;
        margin-top: 8%;
    }

    .stl-p-nos {
        font-size: 4vw;
    }
}


/*Sección Contacto*/
#secContacto {
    margin: 0;
    padding: 0;
}

.stl-div-sup-7 {
    padding-top: 5% !important;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.stl-div-cont {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.stl-txt-cont {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    line-height: 1.5;
    color: #495057;
    border: none;
    border-bottom: 1px solid #000;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
    margin-bottom: 1%;
    max-width: 50%;
}

.txt-multiline {
    height: 100px;
}

.stl-btn-enviar {
    border: none;
    background-color: #00a71a;
    font-size: 1vw;
    font-weight: 500;
    color: #fff;
    padding: 1vw;
    text-shadow: 1px 1px black;
    box-shadow: 1px 1px 6px 0px #715f5f;
    margin-top: 3%;
}

.stl-btn-enviar:hover {
    background-color: #23c13b;
    transition-duration: 0.5s;
}

.stl-ttl-contacto {
    text-align: center;
    font-weight: 600;
}

.div-cont-2 {
    display: flex;
    align-items: center;
}

.stl-p-cont-2 {
    margin: 0;
    font-size: 1.2vw;
    font-weight: 600;
}

.stl-p-cont-3 {
    margin: 0;
    font-size: 1.2vw;
    font-weight: 600;
}

.stl-img-cont {
    width: 3vw;
    background-color: #fff;
    padding: 7px;
}

.stl-div-cont-2 {
    padding-inline: 15%;
}

.stl-h1-cont {
    font-weight: 600;
}

.stl-img-sep {
    display: none;
    width: 100%;
    margin-top: 15%;
}

@media (max-width:992px) {
    .stl-div-sup-7 {
        grid-template-columns: 1fr;
    }

    .stl-txt-cont {
        max-width: 85%;
    }

    .stl-btn-enviar {
        font-size: 5vw;
        padding: 3vw;
    }

    .stl-img-cont {
        width: 10vw;
    }

    .stl-h1-cont {
        margin-top: 10%;
    }

    .stl-ttl-contacto {
        margin-top: 15%;
    }

    .stl-img-sep {
        display: initial;
    }

    .stl-p-cont-2 {
        font-size: 5vw;
    }

    .stl-p-cont-3 {
        font-size: 4vw;
    }

    .stl-div-cont-2 {
        padding-inline: 2%;
    }
}

/*Sección Últimos trabajos*/

/* Tarjetas */

.tarjeta-section {
    margin: 30px 0 0 0;
    padding: 0;
    box-sizing: border-box;
}

.wrap {
    width: 1100px;
    margin: 50px auto;
    display: flex;
    justify-content: center;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

@media screen and (max-width: 480px) {
    .wrap {
        grid-template-columns: 1fr;
        width: 100%;
    }
}

.tarjeta-wrap {
    margin: 20px;
    -webkit-perspective: 800;
    perspective: 800;
}

.tarjeta {
    width: 40vw;
    height: 30vw;
    box-shadow: 0px 10px 15px -5px rgb(0 0 0 / 65%);
    /*background: linear-gradient(rgba(0, 0, 0, 0.9), rgba(205, 200, 199, 0.1)), url(../Img/Polvo-cart.jpg);*/
    background-color: #C36B38;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 100 60'%3E%3Cg %3E%3Crect fill='%23C36B38' width='11' height='11'/%3E%3Crect fill='%23c46d3b' x='10' width='11' height='11'/%3E%3Crect fill='%23c56f3e' y='10' width='11' height='11'/%3E%3Crect fill='%23c67241' x='20' width='11' height='11'/%3E%3Crect fill='%23c87444' x='10' y='10' width='11' height='11'/%3E%3Crect fill='%23c97647' y='20' width='11' height='11'/%3E%3Crect fill='%23ca784a' x='30' width='11' height='11'/%3E%3Crect fill='%23cb7a4d' x='20' y='10' width='11' height='11'/%3E%3Crect fill='%23cc7c50' x='10' y='20' width='11' height='11'/%3E%3Crect fill='%23cd7f53' y='30' width='11' height='11'/%3E%3Crect fill='%23ce8156' x='40' width='11' height='11'/%3E%3Crect fill='%23cf8358' x='30' y='10' width='11' height='11'/%3E%3Crect fill='%23d0855b' x='20' y='20' width='11' height='11'/%3E%3Crect fill='%23d1875e' x='10' y='30' width='11' height='11'/%3E%3Crect fill='%23d28961' y='40' width='11' height='11'/%3E%3Crect fill='%23d38c64' x='50' width='11' height='11'/%3E%3Crect fill='%23d48e67' x='40' y='10' width='11' height='11'/%3E%3Crect fill='%23d5906a' x='30' y='20' width='11' height='11'/%3E%3Crect fill='%23d6926d' x='20' y='30' width='11' height='11'/%3E%3Crect fill='%23d79470' x='10' y='40' width='11' height='11'/%3E%3Crect fill='%23d89773' y='50' width='11' height='11'/%3E%3Crect fill='%23d99976' x='60' width='11' height='11'/%3E%3Crect fill='%23da9b79' x='50' y='10' width='11' height='11'/%3E%3Crect fill='%23db9d7c' x='40' y='20' width='11' height='11'/%3E%3Crect fill='%23db9f7f' x='30' y='30' width='11' height='11'/%3E%3Crect fill='%23dca282' x='20' y='40' width='11' height='11'/%3E%3Crect fill='%23dda485' x='10' y='50' width='11' height='11'/%3E%3Crect fill='%23dea688' x='70' width='11' height='11'/%3E%3Crect fill='%23dfa88b' x='60' y='10' width='11' height='11'/%3E%3Crect fill='%23dfaa8f' x='50' y='20' width='11' height='11'/%3E%3Crect fill='%23e0ad92' x='40' y='30' width='11' height='11'/%3E%3Crect fill='%23e1af95' x='30' y='40' width='11' height='11'/%3E%3Crect fill='%23e2b198' x='20' y='50' width='11' height='11'/%3E%3Crect fill='%23e2b39b' x='80' width='11' height='11'/%3E%3Crect fill='%23e3b59e' x='70' y='10' width='11' height='11'/%3E%3Crect fill='%23e4b8a1' x='60' y='20' width='11' height='11'/%3E%3Crect fill='%23e4baa4' x='50' y='30' width='11' height='11'/%3E%3Crect fill='%23e5bca7' x='40' y='40' width='11' height='11'/%3E%3Crect fill='%23e5beaa' x='30' y='50' width='11' height='11'/%3E%3Crect fill='%23e6c1ae' x='90' width='11' height='11'/%3E%3Crect fill='%23e7c3b1' x='80' y='10' width='11' height='11'/%3E%3Crect fill='%23e7c5b4' x='70' y='20' width='11' height='11'/%3E%3Crect fill='%23e8c7b7' x='60' y='30' width='11' height='11'/%3E%3Crect fill='%23e8caba' x='50' y='40' width='11' height='11'/%3E%3Crect fill='%23e9ccbd' x='40' y='50' width='11' height='11'/%3E%3Crect fill='%23e9cec1' x='90' y='10' width='11' height='11'/%3E%3Crect fill='%23ead0c4' x='80' y='20' width='11' height='11'/%3E%3Crect fill='%23ead3c7' x='70' y='30' width='11' height='11'/%3E%3Crect fill='%23ebd5ca' x='60' y='40' width='11' height='11'/%3E%3Crect fill='%23ebd7cd' x='50' y='50' width='11' height='11'/%3E%3Crect fill='%23ebd9d1' x='90' y='20' width='11' height='11'/%3E%3Crect fill='%23ecdcd4' x='80' y='30' width='11' height='11'/%3E%3Crect fill='%23ecded7' x='70' y='40' width='11' height='11'/%3E%3Crect fill='%23ece0da' x='60' y='50' width='11' height='11'/%3E%3Crect fill='%23ede3de' x='90' y='30' width='11' height='11'/%3E%3Crect fill='%23ede5e1' x='80' y='40' width='11' height='11'/%3E%3Crect fill='%23ede7e4' x='70' y='50' width='11' height='11'/%3E%3Crect fill='%23eee9e7' x='90' y='40' width='11' height='11'/%3E%3Crect fill='%23eeeceb' x='80' y='50' width='11' height='11'/%3E%3Crect fill='%23EEEEEE' x='90' y='50' width='11' height='11'/%3E%3C/g%3E%3C/svg%3E");
    /*background-attachment: fixed;*/
    background-size: cover;
    /*background-size: cover;
    background-repeat: no-repeat;
    background-position: center;*/
    position: relative;
    transform-style: preserve-3d;
    transition: .7s ease;
    border-radius: 15px;
}

@media screen and (max-width: 480px) {
    .tarjeta {
        width: 100%;
        height: 450px;
    }
}

.adelante, .atras {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.atras {
    transform: rotateY(180deg);
    padding: 15px;
    justify-content: center;
    align-items: center;
}

.tarjeta-wrap:hover .tarjeta {
    transform: rotateY(180deg);
}

.img-tarjeta {
    width: 70%;
    border-radius: 2%;
    margin-top: 10%;
    box-shadow: 7px 7px 0px 0px #00000090;
}

@media screen and (max-width: 480px) {
    .img-tarjeta {
        margin-top: 15%;
    }
}

.img-tarjeta-atras {
    width: 30%;
    margin-top: 5%;
}

.txt-tarjeta {
    color: #FFFFFF;
    font-weight: 700;
    width: 40%;
}

.txt-atras-titulo {
    color: #FFFFFF;
    font-weight: 700;
    font-size: 20px;
}

.p-atras {
    font-size: 14px;
    padding-inline: 10px;
    text-align: justify;
}

.sec-txt-atras {
    font-weight: 600;
    color: #4d4d4d;
    font-size: 1.5vw;
    margin-bottom: 6%;
    color: #FFFFFF;
    margin-top: -5px;
    text-shadow: 0px 0px 10px #000000;
    text-align: center;
}

.stl-cart-ttl {
    margin-top: 1vw;
}

.stl-cart-sttl {
    margin-top: 1vw;
}

.stl-cart-info {
    font-weight: 700;
    margin-top: 2vw;
}

.stl-txt-atras-2 {
    font-weight: 700;
    text-align: center;
}

.stl-txt-atras-3 {
    font-weight: 500;
}

.stl-txt-atras-4 {
    font-weight: 500;
}

.stl-p-atras {
    margin-bottom: 0;
    font-weight: 600;
}

@media screen and (max-width: 992px) {
    .sec-txt-atras {
        font-size: 16px;
    }

    .stl-cart-ttl {
        margin-top: 5vw;
        font-size: 5vw;
    }

    .stl-cart-sttl {
        font-size: 4vw;
    }

    .stl-cart-info {
        margin-top: 8vw;
    }

    .stl-txt-atras-2 {
        font-size: 4.5vw;
    }

    .stl-txt-atras-4 {
        font-size: 4vw;
    }

    .stl-p-atras {
        font-size: 4vw;
    }
}

.div-check {
    display: flex;
    align-items: flex-start;
}

.custom-checkbox {
    appearance: none;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 2px solid #9b9393;
    cursor: pointer;
}

.custom-checkbox:checked {
    background-color: #18eb18;
}

.stl-txt-check {
    margin-top: 4px;
    margin-left: 5px;
    font-weight: 600;
    font-size: 1.1rem;
    text-decoration: underline;
}

/*Footer*/
#secfooter {
    background-color: #000000;
}

.stl-footer {    
    padding-top: 2% !important;
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 5%;
    padding-bottom: 15px;
}

.stl-div-foot {
    padding-inline: 15%;
    border-right: 1px solid #fff;
}

.stl-opc-foot {
    color: #ffffff;
    text-shadow: 3px 3px #000;
    list-style: none;
    display: inline-flex;
}

.stl-opc-foot:hover {
    text-decoration: underline;
    cursor: pointer;
}

.stl-img-redes {
    width: 3vw;
    background-color: #fff;
    padding: 7px;
    border-radius: 100%;
    box-shadow: 3px 3px 0px 2px #e56e1996;
}

.stl-ttl-redes {
    color: #ffffff !important;
    text-shadow: 2px 2px #000;
    text-align: center;
}

.stl-div-foot-2 {
    padding-inline: 15%;
    border-left: 1px solid #fff;
}

.stl-div-int-foot {
    display: flex;
    align-items: center;
    margin-top: 3%;
}

.stl-p-foot {
    margin: 0;
    font-size: 1.3vw;
    font-weight: 600;
    max-width: 100%;
    list-style: none;
    display: inline-flex;
    color: #ffffff;
}

.stl-hr {
    width: 80%;
    margin: 0 auto;
    color: #f9d8cd;
}

.stl-footer-2 {
    text-align: center;
}

.stl-p-foot-2 {
    font-size: 0.9vw;
    margin-bottom: 3px;
    color: #ffffff;
}

.stl-hr-sep-foot {
    display: none;
}

.stl-a-red-foot {
    margin-left: 2%;
}

@media (max-width:992px) {
    .stl-footer {
        grid-template-columns: 1fr;
    }

    .stl-div-foot {
        text-align: center;
        padding-top: 5%;
        padding-bottom: 5%;
        border-right: none;
    }

    .stl-div-foot-2 {
        padding-top: 7%;
        border-left: none;
        padding-bottom: 5%;
    }

    .stl-p-foot {
        font-size: 5vw;
    }

    .stl-hr-sep-foot {
        display: initial;
        width: 60%;
        color: #ffffff;
        margin: 0 auto;
        border: 1px solid #fff;
    }

    .stl-p-foot-2 {
        font-size: 2.2vw;
    }

    .stl-img-redes {
        width: 10vw;
        padding: 3px;
    }

    .stl-a-red-foot {
        margin-left: 5%;
    }
}

