body, html{
    font-family: "Open Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: regular;
    font-style: normal;
}

.animated-elements,
.btn-acrilicos{
    transition: all 0.4s ease 0s;
  -moz-transition: all 0.4s ease 0s;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
  }
  
.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* Estilos de texto */

.text-justify{ text-align: justify; }

/* Estilos de Botones */
.btn-acrilicos,.btn-solid-blue,.btn-silicones,.btn-solid-orange,.btn-poliuretanos,.btn-solid-black{ font-size: 15px;}

.btn-acrilicos{ border-radius: 50px; background: #0C5DE1; background: linear-gradient(90deg, #0C5DE1 10%, #0E2588 60%); opacity: 1; padding-left: 40px; padding-right: 40px; border: 0; }
.btn-acrilicos:hover,
.btn-acrilicos:focus,
.btn-acrilicos:active{
    opacity: 0.75;
}

.btn-solid-blue{ border-radius: 50px; background: #0C5DE1; background: linear-gradient(90deg, #0E2588 10%, #0E2588 60%); opacity: 1; padding-left: 40px; padding-right: 40px; border: 0; }
.btn-solid-blue:hover,
.btn-solid-blue:focus,
.btn-solid-blue:active{
    opacity: 0.75;
}

.btn-silicones{ border-radius: 50px; background: rgb(238,173,0); background: linear-gradient(90deg, rgba(238,173,0,1) 0%, #e65f2b 100%); opacity: 1; padding-left: 40px; padding-right: 40px; border: 0; }
.btn-silicones:hover,
.btn-silicones:focus,
.btn-silicones:active{
    opacity: 0.75;
}

.btn-solid-orange{ border-radius: 50px; background: #e65f2b; background: linear-gradient(90deg, #e65f2b 0%, #e65f2b 100%); opacity: 1; padding-left: 40px; padding-right: 40px; border: 0; }
.btn-solid-orange:hover,
.btn-solid-orange:focus,
.btn-solid-orange:active{
    opacity: 0.75;
}

.btn-poliuretanos{ border-radius: 50px; background: rgb(105,105,105); background: linear-gradient(90deg, rgba(105,105,105,1) 0%, rgba(0,0,0,1) 100%); opacity: 1; padding-left: 40px; padding-right: 40px; border: 0; }
.btn-poliuretanos:hover,
.btn-poliuretanos:focus,
.btn-poliuretanos:active{
    opacity: 0.75;
}

.btn-solid-black{ border-radius: 50px; background: rgb(105,105,105); background: linear-gradient(90deg, rgba(105,105,105,1) 0%, rgba(0,0,0,1) 100%); opacity: 1; padding-left: 40px; padding-right: 40px; border: 0; }
.btn-solid-black:hover,
.btn-solid-black:focus,
.btn-solid-black:active{
    opacity: 0.75;
}

.btn-primary.whatsapp-btn{
    background-color: #33ba44;
    border-color: #33ba44;
    opacity: .9;
}

.btn-primary.whatsapp-btn:hover, 
.btn-primary.whatsapp-btn:active, 
.btn-primary.whatsapp-btn:focus {
    background-color: #33ba44;
    opacity: 1;
    border-color: #33ba44;
}


/* Estilos de Splide */
.splide__slide{ padding: 20px; }

.splide.blue .splide__pagination,
.splide.orange .splide__pagination,
.splide.black .splide__pagination{ bottom: -1.5em; }

.splide.blue .splide__pagination li button.is-active{ background: #1f42dd; opacity: 1; }
.splide.orange .splide__pagination li button.is-active{ background: #e65f2b; opacity: 1; }
.splide.black .splide__pagination li button.is-active{ background: black; opacity: 1; }


/* estilos generales */
.background-01{ background: url(../images/body/background-01.svg) left 65% no-repeat; background-size: 53%; }
.background-acrilicos{ background: url(../images/body/background-01.svg) 62% 100% no-repeat; background-size: 34%; }
.background-double-circle{ background: url(../images/body/background-02.svg) top center no-repeat; background-size: 80%; }


.background-whatsapp{ background: url(../images/body/background-whatsapp.jpg) center center no-repeat; background-size: cover; }
html.webp .background-whatsapp{ background: url(../images/body/background-whatsapp.webp) center center no-repeat; background-size: cover; }
html.avif .background-whatsapp{ background: url(../images/body/background-whatsapp.avif) center center no-repeat; background-size: cover; }


.background-selladores{ background: url(../images/body/background-selladores.jpg) top center no-repeat; background-size: cover; }
html.webp .background-selladores{ background: url(../images/body/background-selladores.webp) top center no-repeat; background-size: cover; }
html.avif .background-selladores{ background: url(../images/body/background-selladores.avif) top center no-repeat; background-size: cover; }

.swca-footer-rrss li{ padding: 5px;}
.swca-footer-rrss li a{ background: #202947; color: white; padding: 10px; border: 0; border-radius: 50px; display: block; font-size: 28px; width: 60px; height: 60px; }
.swca-footer-rrss li a:hover,
.swca-footer-rrss li a:focus,
.swca-footer-rrss li a:active{ 
    opacity: 0.75;
}

img.swca-especialistas-en-sellado{ height: 85%; }

/* Breakpoints */

@media only screen and (min-width:1400px) { /* XXL */

    ul.acrilicos-list li .acrilicos-intro-text{ height: 140px; }
    ul.silicones-list li .acrilicos-intro-text{ height: 150px; }
    ul.poliuretanos-list li .acrilicos-intro-text{ height: 160px; }

}

@media only screen and (min-width:1200px) and (max-width: 1399px) { /* XL */

    ul.acrilicos-list li .acrilicos-intro-text{ height: 140px; }
    ul.silicones-list li .acrilicos-intro-text{ height: 170px; }
    ul.poliuretanos-list li .acrilicos-intro-text{ height: 200px; }
    

    .background-acrilicos {
        background: url(../images/body/background-01.svg) 71% 109% no-repeat;
        background-size: 58%;
    }

}

@media screen and (min-width:992px) {

    #main{ margin-top: 185px; }
    .title-silicones-desktop{ max-width: 60%; margin: 0 auto; }
    .title-poliuretanos-desktop{ max-width: 60%; margin: 0 auto; }
    
}

@media only screen and (min-width:992px) and (max-width: 1199px) { /* LG */

    ul.acrilicos-list li .acrilicos-intro-text{ height: 140px; }
    ul.silicones-list li .acrilicos-intro-text{ height: 200px; }
    ul.poliuretanos-list li .acrilicos-intro-text{ height: 220px; }

    .background-acrilicos {
        background: url(../images/body/background-01.svg) 113% 100% no-repeat;
        background-size: 67%;
    }

}

@media screen and (max-width:991px) {

    #main{ margin-top: 140px; }
    
}

@media screen and (max-width:575px) {

    #main{ min-height: 90px; }
    section.section-1{ min-height: 460px; }
    section.section-2{ min-height: 52px; }
    section.section-3{ min-height: 618px; }
    section.section-4{ min-height: 54px; }
    section.section-5{ min-height: 722px; }
    section.section-6{ min-height: 25px; }
    section.section-7{ min-height: 775px; }
    section.section-8{ min-height: 377px; }
    section.section-9{ min-height: 537px; }
    section.section-10{ min-height: 170px; }
    
    
}

@media only screen and (min-width:768px) and (max-width: 991px) { /* MD */

    ul.acrilicos-list li .acrilicos-intro-text{ height: 140px; }
    ul.silicones-list li .acrilicos-intro-text{ height: 180px; }
    ul.poliuretanos-list li .acrilicos-intro-text{ height: 180px; }

    .title-silicones-mobile{ max-width: 60%; margin: 0 auto; }
    

    .background-acrilicos {
        background: url(../images/body/background-01.svg) 80% 100% no-repeat !important;
        background-size: 65% !important;
    }

    .background-double-circle {
        background: url(../images/body/background-02.svg) top center no-repeat;
        background-size: 95%;
    }

    .titulo-acrilicos-mobile{ max-width: 60%; margin: 0 auto; }

}

@media only screen and (min-width:576px) and (max-width: 767px) { /* SM */

    .title-silicones-mobile{ max-width: 60%; margin: 0 auto; }
    
    .background-acrilicos {
        background: url(../images/body/background-01.svg) 60% 100% no-repeat;
        background-size: 99%;
    }

    .background-double-circle {
        background: url(../images/body/background-02.svg) top center no-repeat;
        background-size: 200%;
    }

    .titulo-acrilicos-mobile{ max-width: 60%; margin: 0 auto; }
}

@media (min-width: 400px) and (max-width: 575px)
{
    .titulo-acrilicos-mobile{ max-width: 60%; margin: 0 auto; }
    .title-silicones-mobile{ max-width: 60%; margin: 0 auto; }
}

@media (max-width: 399px)
{
    .titulo-acrilicos-mobile{ max-width: 75%; margin: 0 auto; }
    .title-silicones-mobile{ max-width: 75%; margin: 0 auto; }
}

@media only screen and (max-width:575px){ /* XS */


    .navbar-brand img {
        max-width: 170px;
    }
    #open-menu{ margin-top: 05px; }
    .swca-footer-rrss li a{ padding: 5px; width: 40px; height: 40px; font-size: 20px; }

    .background-acrilicos {
        background: url(../images/body/background-01.svg) 60% 37% no-repeat;
        background-size: 119%;
    }

    .background-double-circle {
        background: url(../images/body/background-02.svg) top center no-repeat;
        background-size: 200%;
    }


}