@import url('https://fonts.cdnfonts.com/css/dk-lemon-yellow-sun');
@import url('https://fonts.cdnfonts.com/css/familjen-grotesk');


/* external css: flickity.css */

* {
    box-sizing: border-box;
}

.carousel {
    background: #fafafa;
}

.carousel-cell {
    width: 315px;
    height: 560px;
    margin-right: 10px;
    background: #8C8;
    border-radius: 5px;
    counter-increment: carousel-cell;
}

.carousel-cell-menu-op {
    width: auto;
    height: 25px;
    margin-right: 10px;
    background: #8C8;
    border-radius: 5px;
    counter-increment: carousel-cell;
}

.carousel-cell-menu-prov {
    min-width: 180px;
    max-width: 300px;
    margin: 5px;
    border-radius: 5px;
    counter-increment: carousel-cell;
}

/* gallery focus */
.flickity-enabled:focus .flickity-viewport {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
}

/* external css: flickity.css */ 


body { padding: 0px; border: 0px; margin: 0px; font-family: sans-serif;
}


nav {
    /* border-bottom: 0px solid black; */
}

.crumbs ol {
    list-style-type: none;
    padding-left: 0;
}

.crumb {
    display: inline-block;
}

    .crumb a {
        display: inline-block;
        color: #fd3f92;
        font-size: 80%;
        font-weight: bold;
        padding: 0 3px;
        font-size: 1em;
        text-decoration: none;
    }


    .crumb a::after {
        display: inline-block;
        color: #000;
        content: '>';
        font-size: 80%;
        font-weight: bold;
        padding: 0 3px;
        font-size: 1em;
        text-decoration: none;
    }

.menu_sup_img { padding: 0px; margin: 0px; border: 0px; width: 150px; height: 150px;
}


/* POSTEOS */

.PostTitulo {
    font-family: 'DK Lemon Yellow Sun', sans-serif;
    font-weight: 800;
    font-style: normal;
    font-size: 2.5em;
}

.PostTexto {
    font-family: 'Familjen Grotesk', sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
    font-size: 1.4em;
}

.PostPortada {
    font-family: 'Familjen Grotesk', sans-serif;
    font-optical-sizing: auto;
    font-weight: 200;
    font-style: normal;
    font-size: 1.5em;
} 

.GaleriaCatalogo {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    background-color: #f5f5f5;
    padding: 50px 0 10px 150px;
}

.GaleriaFotos {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    overflow: hidden;
    overflow-x: scroll;
    background-color: #f5f5f5;
    padding: 10px;
}

    .GaleriaFotos li {
        width: 100%; border: 0px; margin: 0px; padding: 0px; height: auto; min-width: 580px; max-width: 750px; margin-right: 20px;
    }

    .GaleriaFotos li img {
        width: 100%; border: 0px; margin: 0px; padding: 0px; height: auto;
    }

.divGICont {
    width: 100%;
    height: auto;
    padding: 0px;
    margin: 0px;
}

.GaleriaImagenes {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    overflow: hidden;
    overflow-x: scroll;
    background-color: #f5f5f5;
    padding: 20px 50px 50px 50px;
}
.GaleriaImagenes li {margin-right: 20px;  }
    .GaleriaImagenes li div img {
        width: 100%; min-width: 450px; border: 0px; margin: 0px; padding: 0px; height: auto;
    }

.Mifooter {
    margin-top: 25px;
    width: 100%;
    border: 0px;
    margin: 0px;
    padding: 0px;
    padding-top: 50px;
    padding-bottom: 150px;
    background-color: #fff;
    border-top: 1px solid #d3d3d3;
    text-align: center;
}


 /* colores */
.GaleriaColores {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    overflow: hidden;
    overflow-x: scroll;
    background-color: #f5f5f5;
    padding: 50px;
}

.GaleriaColores div{
    width: 50px;
    height: 50px;
    padding: 25px;
    margin: 10px;
}


/* icono redes arriba abajo */
.RedesArriba {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    max-width: 960px;
}

    .RedesArriba ol {
        list-style-type: none;
        padding-left: 0;
        display: inline-block;
    }

    .RedesArriba li {
        display: inline-block;
        color: #fd3f92;
        font-size: 80%;
        font-weight: bold;
        padding: 0 3px;
        font-size: 1em;
        text-decoration: none;
        width: 36px;
        margin: 5px;
    }

    .RedesArriba li img{
        width: 36px;
    }

#TextoYCarrito {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    border: 0px;
    padding: 0px;
    margin: 0px;
    overflow: hidden;
    overflow-x: scroll;
    background-color: #fff;
}

#TextoYCarritoColTexto {
    width: 70%;
}

#TextoYCarritoColPrecio {
    width: 30%;
}

#UlPrecioYEnvio {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    overflow: hidden;
    border: 0px;
    padding: 0px;
    margin: 0px;
}

    #UlPrecioYEnvio li {
        width: 100%; padding: 10px;
    }


/* espacio difusion */
.DivDifusionCont {width: 100%; height: auto;}
.ulDifusion {width: 100%; height: auto; padding: 0px; border: 0px; margin: 0px; list-style: none;}
.ulDifusion li img {border: 0px; margin: 0px; padding: 0px; width: 100%;}
.PostDifusion {padding:3%;}


@media only screen and (max-width: 1366px) {
    /* For mobile phones: */
    .carousel-cell-menu-prov {
        min-width: 75px;
        max-width: 120px;
    }

    #TextoYCarrito {
        flex-wrap: nowrap;
        flex-direction: column-reverse;
    }

    #TextoYCarritoColTexto, #TextoYCarritoColPrecio {
        width: 100%;
    }

    #UlPrecioYEnvio {
        width: 100%;
        height: auto;
        display: flex;
        flex-wrap: nowrap;
        list-style: none;
        overflow: hidden;
        overflow-x: scroll;
     }

        #UlPrecioYEnvio li {
            min-width: 250px;
            padding: 10px;
        }
}    


@media only screen and (max-width: 768px) {
            /* For mobile phones: */
            .carousel-cell-menu-prov {
        min-width: 50px;
        max-width: 100px;
    }

    #TextoYCarrito {
        flex-wrap: nowrap;
        flex-direction: column-reverse;
    }
    #TextoYCarritoColTexto, #TextoYCarritoColPrecio {
        width: 100%;
    }

    #UlPrecioYEnvio {
        width: 100%;
        height: auto;
        display: flex;
        flex-wrap: nowrap;
        list-style: none;
        overflow: hidden;
        overflow-x: scroll;
        background-color: #f5f5f5;

    }
}