/* CSS Crítico para Página de Detalle - Cheibo Underwear */

/* Tablas de talles */
.Table_ { display: table; }
.Title_ { display: table-caption; text-align: center; font-weight: bold; font-size: larger; }
.Heading_ { display: table-row; font-weight: bold; text-align: center; }
.Row_ { display: table-row; }
.Cell_ { display: table-cell; border: solid; border-width: thin; padding-left: 5px; padding-right: 5px; }

/* Carousel optimizado */
@media (min-width: 300px) {
    .carousel-inner .active,
    .carousel-inner .active + .carousel-item { display: block; }
}

@media (min-width: 768px) {
    .carousel-inner .active,
    .carousel-inner .active + .carousel-item,
    .carousel-inner .active + .carousel-item + .carousel-item,
    .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item { display: block; }
}

.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item,
.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
    transition: none;
}

.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    position: relative;
    transform: translate3d(0, 0, 0);
}

.carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: absolute;
    top: 0;
    right: -25%;
    z-index: -1;
    display: block;
    visibility: visible;
}

.active.carousel-item-left + .carousel-item-next.carousel-item-left,
.carousel-item-next.carousel-item-left + .carousel-item,
.carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
.carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item,
.carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
}

.carousel-inner .carousel-item-next.carousel-item-left {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    visibility: visible;
}

.carousel-inner .carousel-item-prev.carousel-item-right {
    position: absolute;
    top: 0;
    left: -25%;
    z-index: -1;
    display: block;
    visibility: visible;
}

.active.carousel-item-right + .carousel-item-prev.carousel-item-right,
.carousel-item-prev.carousel-item-right + .carousel-item,
.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item,
.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    display: block;
    visibility: visible;
}

/* Grid de 5 columnas */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-360 {
    width: 80px;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}

/* Botones y tags */
.button-container {
    display: inline-block;
    position: relative;
}

.tag2 {
    width: 140px;
    height: 50px;
    position: absolute;
    bottom: 40px;
    right: 5px;
}

/* Popup y close button */
.close_ {
    position: relative;
}

.close_ .closeButton2 {
    background: url(../img/showroom/cancel.png) no-repeat;
    width: 26px;
    height: 26px;
    top: -9px;
    right: -9px;
    position: absolute;
    cursor: pointer;
}

.spopup {
    -webkit-border-radius: 9px;
    padding: 12px 14px;
    width: 300px;
    position: fixed;
    bottom: 450px;
    display: none;
    z-index: 90;
    cursor: pointer;
}

.spopup .closeButton2 {
    background: url(../img/showroom/cancel.png) no-repeat;
    width: 26px;
    height: 26px;
    top: -9px;
    right: -9px;
    position: absolute;
    cursor: pointer;
}

/* Optimización para lazy loading */
img.lazyload {
    opacity: 0;
}

img.lazyloaded {
    opacity: 1;
    transition: opacity 300ms;
}