﻿/* Fuentes usadas
Google Fonts
    Lato 400 800
    Playball 400
    Vidaloka 400

    font-family: 'Lato', sans-serif;
    font-family: 'Playball', cursive;
    font-family: 'Vidaloka', serif;
 */


body {
    font-family: 'Lato', sans-serif !important;
    font-weight: 400 !important;
    color: #414141 !important;
    line-height: 1.6 !important;
    font-size: 100% !important;
}

h1, h2, h3, h4, h5 {
    font-weight: 800 !important;
    line-height: 1.2 !important;
    color: #414141;
}

h1 {
    font-size: 250% !important;
    font-weight: 300 !important;
}


h2 {
    font-size: 200% !important;
}


h3 {
    font-size: 150% !important;
}


h4 {
    font-size: 120% !important;
}

h5 {
    font-size: 100% !important;
}

.lead {
    font-size: 120%;
}

.lead .bold {
    font-weight: 800;
}

a {
    color: #112747;
    text-decoration: none;
}

    a:hover {
        color: #112747;
        text-decoration: underline;
    }


@media only screen and (max-width: 1200px) {
}


@media only screen and (max-width: 991px) {

    h1 {
        font-size: 180% !important;
    }
    h2 {
        font-size: 150% !important;
    }
    h3 {
        font-size: 120% !important;
    }
    h4 {
        font-size: 100% !important;
    }

}


/* <FRANJA NEGRA> */
#fFranjaNegra {
    background-color: #000000;
}

    #fFranjaNegra p {
        padding-bottom: .1rem;
        margin-bottom: 0rem;
        color: #fff;
        font-weight: 800;
        font-size: 75%;
        letter-spacing: 5px;
    }


.news {
    width: 300px;
    background: #EF168E;
}

.news-scroll {
    text-decoration: none;
        color: #fff;
}

.dot {
    height: 6px;
    width: 6px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 2px !important;
    background-color: rgb(239,22,142);
    border-radius: 50%;
    display: inline-block
}



@media only screen and (max-width: 991px) {

}
/* </FRANJA NEGRA> */


/* <BANNER> */
#fBanner {
    border-radius: 1rem;
    margin-left: 2rem;
    margin-right: 2rem;
    background: url(/pub/images/layerslider/banner-ppal-fondo.jpg);
    background-color: #FCE5F1;

    background-repeat: no-repeat;
    background-position: right;

    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

@media only screen and (max-width: 991px) {

    #fBanner {
        border-radius: 1rem;
        margin-left: 1rem;
        margin-right: 1rem;
        background: url(/pub/images/layerslider/banner-ppal-fondo-movil.jpg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    }

}

/* <CARRUSEL> */
#Banner {
    padding-left: 2rem;
    padding-right: 2rem;
}

.carousel-indicators li {
    height: 5px;
    width: 50px;
    background-color: #fff;
    opacity: .5;
    padding-bottom: 0px;
    padding-top: 0px;
}

#Banner .carousel .item {
    width: 100%; /*slider width*/
}

    #Banner .carousel .item img {
        width: 100%; /*img width*/
    }

@media only screen and (max-width: 991px) {

    #fBanner {
        margin-top: 1rem;
        padding-left: 0rem !important;
        padding-right: 0rem !important;
    }

    #Banner {
        padding-top: 45px;
        padding-left: 1rem;
        padding-right: 1rem;
    }


}
/* </CARRUSEL> */
/* </BANNER> */

/* <BUSCADOR> */
.btnBuscador {
    color: #FF1797;
    border-color: #FF1797;
    background-color: #fff;
}
    .btnBuscador:hover {
        color: #fff;
        border-color: #FF1797;
        background-color: #FF1797;
    }
/* <BUSCADOR> */


/* <DESTACADOS> */
#fDestacados {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

    #fDestacados .columna1 {
        padding: 1rem;
        border: solid 10px #fff;
        border-radius: 2rem;
        background-image: linear-gradient(to top, #0ad9eb, #5ee0ee, #85e7f2, #a5eef6, #c2f5fa);
    }

    #fDestacados .columna2 {
        padding: 1rem;
        border: solid 10px #fff;
        border-radius: 2rem;
        background-image: linear-gradient(to right top, #febbe4, #ffc8e9, #ffd5ee, #ffe1f3, #ffeef8);
    }

    #fDestacados .columna3 {
        padding: 1rem;
        border: solid 10px #fff;
        border-radius: 2rem;
        background-image: linear-gradient(to top, #b680cd, #c294d5, #cfa8dd, #dabde5, #e6d1ed);
    }

    #fDestacados .columna1 .miRecuadro, #fDestacados .columna2 .miRecuadro, #fDestacados .columna3 .miRecuadro {
        border-radius: .8rem;
        border: solid 2px #fff;
        padding: 1rem;
        padding-bottom: 1.5rem;
    }

        #fDestacados .miRecuadro .miLabel {
            color: #fff;
            position: absolute;
            top: 30px;
            left: 0px;
            padding: .2rem 1.2rem .2rem 1.2rem;
            border-top-right-radius: 1rem;
            border-bottom-right-radius: 1rem;
            font-weight: 800;
            font-size: 90%;
        }

    #fDestacados .miRecuadro .tit {
        font-weight: 800;
        font-size: 200%;
        line-height: 1.4;
    }

    #fDestacados .miRecuadro .subTit {
        font-weight: 800;
        font-size: 75%;
        letter-spacing: 5px;
        line-height: 1.4;
    }

            #fDestacados .columna1 .miRecuadro .miLabel {
                background-color: #096CAD;
            }

            #fDestacados .columna2 .miRecuadro .miLabel {
                background-color: #EF168E;
            }

    #fDestacados .columna3 .miRecuadro .miLabel {
        background-color: #6D009B;
    }


    #fDestacados .columna1 .miRecuadro .tit, #fDestacados .columna1 .miRecuadro .subTit {
        color: #096CAD;
    }

    #fDestacados .columna2 .miRecuadro .tit, #fDestacados .columna2 .miRecuadro .subTit {
        color: #EF168E;
    }

    #fDestacados .columna3 .miRecuadro .subTit3 {
        color: #6D009B;
        font-size: 125%;
        letter-spacing: 2px;
        font-weight: 800;
        padding-left: .5rem;
        line-height: 1.2;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }


@media only screen and (max-width: 991px) {

    #fDestacados {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

}

/* </DESTACADOS> */


/* <PRODUCTOS> */
#fProductos {
    padding-top: 0rem;
    padding-bottom: 4rem;
}

    #fProductos h1 {
        font-family: 'Vidaloka', serif;
        font-size: 550% !important;
        z-index: 99 !important;
    }
    #fProductos h4 {
        font-family: 'Playball', cursive;
        font-size: 650% !important;
        color: #FEDDF2;
        letter-spacing: 5px;
        margin-bottom: -3.5rem;
        font-weight: 400 !important;
    }
    #fProductos .lead {
        padding-top: 1rem;
        padding-bottom: 3rem;
    }

.hoverProducto  {
    margin-bottom: 3rem;
}

    .hoverProducto figure {
        background: #FEBBE4;
        border: none;
        border-radius: 1rem;
    }

        .hoverProducto figure img {
            opacity: 1;
            -webkit-transition: .3s ease-in-out;
            transition: .3s ease-in-out;
            border-radius: 1rem;
            width: 100%;
        }

        .hoverProducto figure:hover img {
            opacity: .7;
            border-radius: 1rem;
            width: 100%;
        }

        .hoverProducto h5 {
            margin-bottom: 0rem;
        }


@media only screen and (max-width: 991px) {

    #fProductos {
        padding-top: 1rem;
        padding-bottom: 0rem;
    }

        #fProductos h1 {
            font-size: 300% !important;
        }

        #fProductos h4 {
            font-size: 300% !important;
            margin-bottom: -1.8rem;
        }
        #fProductos .lead {
            padding-bottom: 2rem;
        }
    .hoverProducto {
        margin-bottom: 2rem;
    }

}
/* </PRODUCTOS> */


/* <VENTAJAS> */
#fVentajas {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 2rem;
    padding-right: 2rem;
}

    #fVentajas .recuadro {
        padding: 1rem;
        background: url(/pub/images/fondo-ventajas-01.jpg) bottom left no-repeat, url(/pub/images/fondo-ventajas-02.jpg) top right no-repeat;
        background-color: #FCE5F1;
        border-radius: 1.5rem;
    }

        #fVentajas .recuadro .linea {
            border-radius: .8rem;
            border: solid 2px #fff;
            padding: 1rem 1rem 3rem 1rem;
        }

            #fVentajas .recuadro .linea .columna {
                padding: 2rem 2rem 0rem 2rem;
                margin-bottom: 0rem;
            }

                #fVentajas .recuadro .linea .columna h3 {
                    font-family: 'Vidaloka', serif;
                    font-size: 200% !important;
                    font-weight: normal !important;
                }

                #fVentajas .recuadro .linea .columna .lead {
                    font-size: 120%;
                    line-height: 1.4;
                }


@media only screen and (max-width: 991px) {
    #fVentajas {
        padding-top: 1rem;
        padding-bottom: 1rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    #fVentajas .recuadro .linea .columna {
        margin-bottom: 1rem;
    }

}
/* </VENTAJAS> */


/* <CATEGORIAS> */
#fCategorias {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

    #fCategorias .columna {
        padding: 2rem 2rem 0rem 1rem;
        margin-bottom: 0rem;
    }


@media only screen and (max-width: 991px) {

    #fCategorias {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
    #fCategorias .columna {
        margin-bottom: 0rem;
        text-align: center;
    }
        #fCategorias .columna h3 {
            padding-top: 1rem;
        }

}
/* </CATEGORIAS> */


/* <PRODUCTO DESTACADO> */
#fProductoDestacado {
    padding-top: 2rem;
    padding-bottom: 2rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

    #fProductoDestacado .columna1 {
        left: 1rem;
    }

    #fProductoDestacado .columna2 {
        padding: 8rem 15rem 22rem 4rem;
        top: 2rem;
        left: -2rem;
        background: url(/pub/images/fondo-detalle-producto.jpg) bottom right no-repeat;
        background-color: #F4F3F9;
    }

        #fProductoDestacado .columna2 h1 {
            font-family: 'Vidaloka', serif;
            font-size: 350% !important;
            z-index: 99 !important;
        }

        #fProductoDestacado .columna2 h4 {
            font-family: 'Playball', cursive;
            font-size: 200% !important;
            color: #FE1796;
            letter-spacing: 1px;
            margin-bottom: -0.2rem;
            font-weight: 400 !important;
        }


@media only screen and (max-width: 991px) {

    #fProductoDestacado {
        padding-top: 1rem;
        padding-bottom: 1rem;
        padding-left: 0rem;
        padding-right: 0rem;
    }

        #fProductoDestacado .columna1 {
            left: 0rem;
        }
        #fProductoDestacado .columna2 {
            padding: 3rem 2rem 24rem 2rem;
            top: 0rem;
            left: 0rem;
        }
            #fProductoDestacado .columna2 h1 {
                font-size: 250% !important;
            }

}
/* </PRODUCTO DESTACADO> */


/* <TESTIMONIALES> */
.testimonial {
    padding-top: 2rem;
}

.testimonial .heading h1 {
    font-family: 'Vidaloka', serif;
    line-height: .8 !important;
    font-size: 340% !important;
    z-index: 99 !important;
}

.testimonial .heading h4 {
    font-family: 'Playball', cursive;
    font-size: 550% !important;
    color: #FECFEC;
    letter-spacing: 5px;
    margin-bottom: -2rem;
    font-weight: 400 !important;
}

    .testimonial h5 {
        line-height: 22px;
        font-size: 18px;
        font-weight: 400;
    }

    .testimonial .font-weight-medium {
        font-weight: 500;
    }

    .testimonial .bg-light {
        background-color: #f4f8fa !important;
    }

    .testimonial .subtitle {
        color: #8d97ad;
        line-height: 24px;
    }

    .testimonial .testimoniales .image-thumb {
        background: url(/pub/images/fondo-testimoniales.jpg) no-repeat top center;
        text-align: center;
        padding: 10% 0;
    }

        .testimonial .testimoniales .image-thumb img {
            width: 360px;
        }

    .testimonial .testimoniales .owl-dots {
        display: inline-block;
        position: relative;
        top: -100px;
    }

        .testimonial .testimoniales .owl-dots .owl-dot {
            border-radius: 100%;
            width: 70px;
            height: 70px;
            background-size: cover;
            margin-right: 10px;
            opacity: 0.4;
            cursor: pointer;
        }

    .testimonial .testimoniales .owl-dots .owl-dot span {
        display: none;
    }

    .testimonial .testimoniales .owl-dots .owl-dot.active,
    .testimonial .testimoniales .owl-dots .owl-dot:hover {
        opacity: 1;
    }

@media (max-width: 767px) {
    .testimonial .testimoniales .owl-dots {
        top: 0px;
    }
}

.testimonial .btn-md {
    padding: 18px 0px;
    width: 60px;
    height: 60px;
    font-size: 20px;
}

.testimonial.btn-danger {
    background: #ff4d7e !important;
    border: 1px solid #ff4d7e !important;
}




@media only screen and (max-width: 991px) {

    .testimonial {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
        .testimonial .heading h1 {
            font-size: 250% !important;
        }

        .testimonial .heading h4 {
            font-size: 250% !important;
            margin-bottom: -1.5rem;
        }

}

/* </TESTIMONIALES> */



/* <CALL> */
#fCall {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 2rem;
    padding-right: 2rem;
}

    #fCall .recuadro {
        padding: 1rem;
        background: url(/pub/images/fondo-ventajas-01.jpg) bottom left no-repeat, url(/pub/images/fondo-ventajas-02.jpg) top right no-repeat;
        background-color: #FCE5F1;
        border-radius: 1.5rem;
    }

        #fCall .recuadro .linea {
            border-radius: .8rem;
            border: solid 2px #fff;
            padding: 1rem;
        }

            #fCall .recuadro .linea .columna {
                padding: 2rem 1rem 2rem 1rem;
                margin-bottom: 0rem;
            }


                #fCall .recuadro .linea .columna h1 {
                    font-family: 'Vidaloka', serif;
                    font-size: 550% !important;
                    z-index: 99 !important;
                }

                #fCall .recuadro .linea .columna h4 {
                    font-family: 'Playball', cursive;
                    font-size: 650% !important;
                    color: #FDBCE0;
                    letter-spacing: 5px;
                    margin-bottom: -3.5rem;
                    font-weight: 400 !important;
                }

                #fCall .recuadro .linea .columna .lead {
                    padding-top: 1rem;
                    padding-bottom: 3rem;
                }

@media only screen and (max-width: 991px) {

    #fCall {
        padding-top: 1rem;
        padding-bottom: 1rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }
        #fCall .recuadro {
            padding: 1rem;
            background: url(/pub/images/fondo-ventajas-02.jpg) top right no-repeat;
            background-color: #FCE5F1;
            border-radius: 1.5rem;
        }
        #fCall .recuadro .linea .columna h1 {
            font-size: 300% !important;
        }

            #fCall .recuadro .linea .columna h4 {
                font-size: 300% !important;
                margin-bottom: -1.8rem;
                color: #F7DAEC;
            }

}
/* </CALL> */

/* <PIE> */
#fPie {
    padding-top: 3rem;
    padding-bottom: 2rem;
}

#fPie ul li {
    padding-bottom: 1rem;
}

    #fPie a {
        text-decoration: underline;
    }
    #fPie a:hover {
    }

    #fPie .redesIcon {
        opacity: 1;
        -webkit-transition: .3s ease-in-out;
        transition: .3s ease-in-out;
    }
        #fPie .redesIcon:hover {
            opacity: .5;
        }

    #fPie .columna2 .columna1 {
        padding-top: 1rem;
    }

    #fPie .columna2 .columna2 {
        padding-top: 1rem;
    }

    #fPie .columna2 .columna3 {
        text-align: right;
    }


@media only screen and (max-width: 991px) {

    #fPie .columna1 {
        text-align: center;
        padding-bottom: 1rem;
    }

    #fPie .columna2 .columna1 {
        text-align: center;
    }

    #fPie .columna2 .columna2 {
        text-align: center;
        padding-top: 0rem;
    }

    #fPie .columna2 .columna3 {
        text-align: center;
        padding-top: 2rem;
    }

}
/* </PIE> */


/* <SUBIR> */
#fSubir {
    padding-top: 1rem;
    padding-bottom: 0rem;
    text-align: center;
}

    #fSubir .redesIcon {
        font-size: 250%;
        color: #FF1797;
        opacity: 1 !important;
        -webkit-transition: .3s ease-in-out;
        transition: .3s ease-in-out;
    }
        #fSubir .redesIcon:hover {
            opacity: .5 !important;
        }

@media only screen and (max-width: 991px) {
}
/* </SUBIR> */


/* <VARIOS> */
.textoRosa {
    color: #EF168E;
}
.textoAzul {
    color: #096CAD;
}
.textoCyan {
    color: #0AD9EB;
}
.textoMorado {
    color: #8D37B1;
}
/* </VARIOS> */
/* <BOTONES> */
.btn {
    padding: 1rem 2.5rem;
    border-radius: 50px;
    border: 3px solid #FF1797;
    text-decoration: none;
    margin-top: 1rem;
    margin-bottom: 1rem;
    font-weight: 800;
    font-size: 90%;
    letter-spacing: 1px;
}

.btn-primary {
    color: #FF1797;
    background-color: transparent;
    border: 3px solid #FF1797;
    transition: all 0.4s ease 0s;
    padding: 1rem 2.5rem;
    border-radius: 50px;
    border: 3px solid #FF1797;
    text-decoration: none;
    font-weight: 800;
    font-size: 90%;
    letter-spacing: 1px;
}

    .btn-primary:hover {
        color: #C653AF;
        background-color: transparent;
        border: 3px solid #C653AF;
    }



@media only screen and (max-width: 767px) {
    .btn {
        margin-bottom: 30px;
    }
}
/* </BOTONES> */





/* <MENU> */
.wsmainfull {
}

.wsmenu > .wsmenu-list > li > a {
    color: #414141;
    font-family: 'Lato', sans-serif !important;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: 1px;
    padding: 2rem 1.4rem 2rem 1.4rem;
    background: url(/pub/images/fondo-menu.png) center no-repeat;
    opacity: 1;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    border-radius: 1rem;
}

    .wsmenu > .wsmenu-list > li > a:active {
        background: url(/pub/images/fondo-menu-on.png) center no-repeat;
        opacity: 1;
        color: #333;
    }
    .wsmenu > .wsmenu-list > li > a:hover {
        background: url(/pub/images/fondo-menu-on.png) center no-repeat;
        opacity: 1;
    }

    .wsmenu > .wsmenu-list > li > a.active {
        background: url(/pub/images/fondo-menu-on.png) center no-repeat;
        opacity: 1;
    }


    .wsmenu .iconoChico {
        width: 40px;
        padding-right: 5px;
    }

    /* <PARA EL MEGAMENU> */

.wsmenu > .wsmenu-list > li > .wsmegamenu {
    top: 140px;
    color: #111;
    text-align: left;
    padding: 1rem 1rem 2rem 1rem;
    background-color: #F4F3F9;
    border: none;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
}

    .wsmenu > .wsmenu-list > li > .wsmegamenu .myTitle {
        border-bottom: none;
        font-size: 125% !important;
        padding: 10px 10px 0px 0px;
        color: #51393F;
        margin: 0px 0px 0px 0px;
        text-align: left;
        font-family: 'Lato', sans-serif !important;
        font-weight: 800 !important;
    }

    .wsmenu > .wsmenu-list > li > .wsmegamenu .typography-text p {
        text-align: left;
        color: #51393F;
        font-family: 'Lato', sans-serif !important;
        font-weight: 400 !important;
        line-height: 1.4 !important;
    }

.wsmenu html, .wsmenu body, .wsmenu iframe, .wsmenu h1, .wsmenu h2, .wsmenu h3, .wsmenu h4, .wsmenu h5, .wsmenu h6 {
    line-height: 1 !important;
    font-family: 'Lato', sans-serif !important;
    font-weight: 400 !important;
    color: #51393F;
}

    .wsmenu > .wsmenu-list > li > .wsmegamenu .typography-text ul li {
        padding-top: 5px;
        padding-bottom: 5px;
    }

        .wsmenu > .wsmenu-list > li > .wsmegamenu .typography-text ul li a {
            color: #51393F;
            font-family: 'Lato', sans-serif !important;
            font-weight: 400 !important;
            line-height: 1.4 !important;
            text-decoration: none;
        }

            .wsmenu > .wsmenu-list > li > .wsmegamenu .typography-text ul li a:hover {
                color: #EF2695;
            }

    /* </PARA EL MEGAMENU> */


@media only screen and (max-width: 1190px) {

    .wsmobileheader {
        height: 70px;
        background-color: #fff;
    }

    .callusbtn {
        color: #000;
        margin-top: 10px;
    }

    .wsanimated-arrow span, .wsanimated-arrow span:before, .wsanimated-arrow span:after {
        background: #000;
    }

    .wsanimated-arrow {
        margin: 15px 0 0 15px;
    }

    .wsmenu > .wsmenu-list {
        background-color: #FCE4F1 !important;
        padding-top: 1rem;
    }

        .wsmenu > .wsmenu-list > li > a {
            padding: 1rem 1rem 1rem 1rem;
            text-align: left;
            border-right: solid 0px;
            background-color: transparent;
            color: #000;
            line-height: 25px;
            border-bottom: 0px solid;
            border-bottom-color: rgba(255, 255, 255, 0) !important;
        }

            .wsmenu > .wsmenu-list > li > a:active {
                background: none;
            }

            .wsmenu > .wsmenu-list > li > a:hover {
                background: none;
            }

            .wsmenu > .wsmenu-list > li > a.active {
                background: none;
            }


        /* <PARA EL MEGAMENU> */

        .wsmenu > .wsmenu-list > li > .wsmegamenu {
            top: 0px;
            padding: 1rem 0rem 1rem 0rem;
            background-color: #FCF0F6;
            border-bottom-left-radius: 0rem;
            border-bottom-right-radius: 0rem;
        }

            .wsmenu > .wsmenu-list > li > .wsmegamenu .myTitle {
                padding: 20px 10px 0px 0px;
                margin: 0px 0px 0px 0px;
            }

        .wsmenu > .wsmenu-list > li:hover > a {
            background-color: rgba(0, 0, 0, 0);
            text-decoration: none;
        }


    .wsmenu .iconoChico {
        width: 30px;
        padding-right: 5px;
    }

        /* </PARA EL MEGAMENU> */


}
/* </MENU> */



/* <WHATSAPP> */
.float {
    position: fixed;
    width: 50px;
    height: 50px;
    bottom: 15px;
    right: 15px;
    background-color: #1CC33D;
    color: #FFF !important;
    border-radius: 50%;
    text-align: center;
    font-size: 30px;
    z-index: 100;
}

    .float:hover {
        color: #FFF;
        background-color: #12DE3B;
    }

.my-float {
    margin-top: 10px;
}


@media only screen and (max-width: 991px) {

    .float {
        right: 20px;
    }
}
/* </WHATSAPP> */


/* Move reCAPTCHA v3 badge to the left */

.grecaptcha-badge {
    width: 70px !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    left: 4px !important;
}

    .grecaptcha-badge:hover {
        width: 256px !important;
    }



#popupaviso .modal-content {
    background-color: #F9EBF7;
    border-radius: 1rem;
}