body {
    font-family: 'Roboto', sans-serif;
    background-image: url("../img/bg.jpg");
    background-repeat: repeat;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Yantramanav', sans-serif;
}

.header {
    height:70vh;
    width: 100%;
    background-color:#002616;
    background-image: url('../img/capa_mobile.jpg');
    background-size: cover;
    background-position: center;
}

.inforounded {
    border-radius: 12px;
}

.bg-dark {
    background-color: black !important;
}

.seta {
    position: absolute;
    right:0;
    bottom: 0;
    border-radius: 0 0 10px 0;
    width:80px;
    cursor: pointer;
    backface-visibility: hidden;
}

.setab {
    position: absolute;
    left:0;
    bottom: 0;
    border-radius: 0 0 10px 0;
    width:80px;
    cursor: pointer;
    backface-visibility: hidden;
    transform: scaleX(-1);
}

.titulo {
    left: 30px;
    width: 200px;
    position: absolute;
    top: 0;
}

.btn-check:focus+.btn-outline-dark, .btn-outline-dark:focus, .btn-outline-dark:hover {
    color: #fff;
    background-color: #F78D2B;
    border-color: #F78D2B;
    box-shadow: none;
}

#section1 {
    min-height:300px;
}

#section1 .card1 {
    width: 100%;
    height: 238px;
    position: relative;
    transition: transform 1s;
    transform-style: preserve-3d;
}

#section1 .card1 .front {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #FDCE32;
}

#section1 .card1 .back {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #FDCE32;
    transform: rotateY(-180deg);
}

#section1 .card1.is-flipped {
    transform: rotateY(-180deg);
}

#section3 {
    height:400px;
}
#section3 img {
    width:100%;
    height:400px;
    object-fit:cover; 
}

#section4 {
    background-image: url('../img/ondas.png');
    background-position: center center;
    background-size:cover;
}

#section5 {
    min-height:400px;
}
#section5 video {
    width:100%;
    height:400px;
    object-fit:cover; 
}

#section6 .card2 {
    width: 100%;
    height: 290px;
    position: relative;
    transition: transform 1s;
    transform-style: preserve-3d;
}

#section6 .card2 .front {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
}

#section6 .card2 .back {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    transform: rotateY(-180deg);
}

#section6 .card2.is-flipped {
    transform: rotateY(-180deg);
}

#section8 {
    background-image: url('../img/ondas.png');
    background-position: center center;
    background-size:cover;
}

#section10 .tarde {
    height: 300px;
}

#section13 .card3 {
    width: 100%;
    position: relative;
    transition: transform 1s;
    transform-style: preserve-3d;
}

#section13 .card3 .front {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #00A1C6;
}

#section13 .card3 .back {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #00A1C6;
    transform: rotateY(-180deg);
}

#section13 .card3.is-flipped {
    transform: rotateY(-180deg);
}

#section13 .card4 {
    width: 100%;
    position: relative;
    transition: transform 1s;
    transform-style: preserve-3d;
}

#section13 .card4 .front {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #00A1C6;
}

#section13 .card4 .back {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #00A1C6;
    transform: rotateY(-180deg);
}

#section13 .card4.is-flipped {
    transform: rotateY(-180deg);
}

#section13 .card5 {
    width: 100%;
    position: relative;
    transition: transform 1s;
    transform-style: preserve-3d;
}

#section13 .card5 .front {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #00A1C6;
}

#section13 .card5 .back {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #00A1C6;
    transform: rotateY(-180deg);
}

#section13 .card5.is-flipped {
    transform: rotateY(-180deg);
}

#section13 .card6 {
    width: 100%;
    position: relative;
    transition: transform 1s;
    transform-style: preserve-3d;
}

#section13 .card6 .front {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #00A1C6;
}

#section13 .card6 .back {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
    background-color: #00A1C6;
    transform: rotateY(-180deg);
}

#section13 .card6.is-flipped {
    transform: rotateY(-180deg);
}

#section14 {
    height:400px;
}
#section14 img {
    width:100%;
    height:400px;
    object-fit:cover; 
}

#section17 {
    min-height:400px;
}
#section17 video {
    width:100%;
    height:400px;
    object-fit:cover; 
}

.card3, .card4, .card5, .card6 {
    display: flex;
    height: 574px;
}

#section13 .front {
    display: flex;
    align-items: center;
    justify-content: center;
}



/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    #section1 {
        min-height:500px;
    }

    .card3, .card4, .card5, .card6 {
        height: 516px;
    }

}


/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .header {
        background-image: url('../img/capa.jpg');
    }

    #section1 {
        min-height:500px;
    }

    #section6 .card2 {
        height: 200px;
    }

    .card3, .card4, .card5, .card6 {
        height: 690px;
    }

}


/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .header p {
        width: 50vw;
    }

    .titulo {
        left: 50px;
        width: 300px;
    }

    #section1 {
        min-height:500px;
    }
    
    #section3 {
        height:600px;
    }
    #section3 img {
        height:600px;
    }
    
    #section5 {
        min-height:600px;
    }
    #section5 video {
        width:100%;
        height:600px;
        object-fit:cover; 
    }

    #section6 .card2 {
        height: 352px;
    }

    #section10 .tarde {
        height: 500px;
    }

    #section14 {
        height:600px;
    }
    #section14 img {
        height:600px;
    }
    
    #section17 {
        min-height:600px;
    }
    #section17 video {
        width:100%;
        height:600px;
        object-fit:cover; 
    }

    .card3, .card4, .card5, .card6 {
        height: 520px;
    }
}


/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    #section1 {
        min-height:500px;
    }
    
    #section3 {
        height:700px;
    }
    #section3 img {
        height:700px;
    }

    #section6 .card2 {
        height: 490px;
    }

    #section10 .tarde {
        height: 600px;
    }
    
    #section14 {
        height:700px;
    }
    #section14 img {
        height:700px;
    }

    .card3, .card4, .card5, .card6 {
        height: 860px;
    }

}

@media (min-width: 1400px) {

    .card3, .card4, .card5, .card6 {
        height: 750px;
    }

}
