﻿.navbar-custom {
    background-color: transparent;
}

.div-img-phone {
    display: none;
}

.font-apple {
    font-family: -apple-system, BlinkMacSystemFont, sans-serif;
}

.nav-sticky.navbar-custom {
    background-color: #1BB99A;
}

.hero-section {
    padding: 0px 0px 0px 0px;
}

.section_1 {
    width: auto;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding: 8em 3em 7em 4em;
    background-color: #0289d8;
    background-image: url(/landing/images/software-para-salones-spa-portada-no-girl.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
}

#estadisticas-salonesgo {
    background-color: black;
    background-image: url(/landing/images/fondo-textura2.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}

.box-1, .box-3, .box-5, .box-7, .box-9 {
    background-color: #cfe9e4b3;
}

.faq-1, .faq-3, .faq-5 {
    background-color: #cfe9e4b3;
}

@media screen and (max-width: 1199px){
    .box-1, .box-4, .box-5, .box-8, .box-9 {
        background-color: #cfe9e4b3;
    }

    .box-2, .box-3, .box-6, .box-7 {
        background-color: #fff;
    }

    .parte1 img {
        height: 150px;
    }
    .parte1 h1 {
        font-size: 2em;
    }

}
        
@media screen and (max-width: 991px){
    .parte1 img {
        height: 100px;
    }
    .parte1 h1 {
        font-size: 1.5em;
    }

    .navbar-custom {
        margin-top: 0px;
        padding: 10px 0px !important;
        -webkit-box-shadow: 0 10px 33px -14px rgb(0 0 0 / 10%);
        box-shadow: none;
    }

    .section_1 {
        max-width: 100%;
        padding: 4em 2em 4em 1em;
        background-color: #216ace;
        background-position: 30% 50%;
    }

    #banner-principal {
        font-size: 16px;
    }

    #resumen-propuesta {
        font-size: 14px;
    }

    #estadisticas-salonesgo {
        font-size: 12px;
    }

    #beneficios-principales {
        font-size: 14px;
    }
}

@media screen and (max-width: 767px){
    body {
        background-color: #03abae;
    }
    .no-mostrar-div {
        height: 0px;
    }

    .no-mostrar-img {
        display: none;
    }

    .div-img-phone {
        display: block;
    }

    .section_1 {
        padding-top: 4em;
        padding-right: 2em;
        padding-left: 1.6em;
        padding-bottom: 3em;
        background-color: #000000;
        background-image: none;
        background-clip: border-box;
        -webkit-text-fill-color: inherit;
    }

    #navbar {
        background-color: #1bb99a;
    }

    #banner-principal {
        font-size: 12px;
    }

    #beneficios-principales {
        font-size: 12px;
    }
    .texto-testimonio {
        font-size: 14px;
    }

    .parte1 img {
        height: 150px;
    }
}

@media screen and (max-width: 575px){
    .box-2, .box-4, .box-6, .box-8 {
        background-color: #fff;
    }

    .box-1, .box-3, .box-5, .box-7, .box-9 {
        background-color: #cfe9e4b3;
    }

    .parte1 img {
        height: 100px;
    }
}


@media (max-width: 991px) {
    .navbar-custom {
        margin-top: 0px;
        padding: 10px 0px !important;
        background-color: #1BB99A;
        -webkit-box-shadow: 0 10px 33px -14px rgba(0, 0, 0, 0.1);
        box-shadow: 0 10px 33px -14px rgba(0, 0, 0, 0.1);
    }

        .navbar-custom .logo img {
            height: 35px;
        }

        .navbar-custom .navbar-nav .nav-item .nav-link {
            -webkit-transition: all 0.4s;
            transition: all 0.4s;
            margin: 0px;
            padding: 6px 0px;
        }

        .navbar-custom .navbar-btn {
            margin-left: 0px;
        }

    .navbar-toggler {
        font-size: 24px;
        margin-top: 0px;
        margin-bottom: 0px;
        color: #ffffff;
    }

    .hero-section {
        padding-top: 80px;
    }
}

/*@media (max-width: 991px) {


}*/