﻿.option-list {
    margin-top: 5px;
    margin-bottom: 15px;
    padding: 15px 0;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

    .option-list .option-item-inner .option-title {
        display: block;
    }

.title-above-image {
    font-size: 2.4rem;
}

.option-list .option-item-inner .option-title > span {
    text-align: center;
    font-weight: bold;
    width: 100%;
    vertical-align: middle;
    padding: 2px 0;
    flex-basis: initial;
    flex-shrink: initial;
    height: initial;
    flex-grow: 1;
    min-height: 44px;
    flex-flow: column wrap;
}

.ths-colors-tab > article > figure {
    text-align: center;
    width: 33.33333333333334%;
    max-width: 33.33333333333334%;
    float: left;
    padding: 0 5px;
    border: 5px solid transparent;
}

.option-list .option-item-inner .option-title > span {
    display: block;
}

#color-form .option-list .option-item-inner .option-title > span {
    min-height: initial;
}

#color-form .option-list .option-item-inner .option-title > span, .quantity-select {
    font-size: 2rem;
    text-align: center;
}

.ths-colors-tab > article > figure section:not(.hidden) {
    z-index: 3;
}

.ths-colors-tab > article > figure section:not(.hidden) {
    position: absolute;
    right: 0;
}
/*colors page*/ .image-with-zoom {
    position: relative;
}

.ths-colors-tab > aside ul li label {
    font-size: 2.0rem;
    margin-left: 5px;
}

.ths-colors-tab > aside ul li .filter_checkboxItem:not(:checked) + input + label:before, .ths-colors-tab > aside ul li .filter_checkboxItem:checked + input + label:before, .ths-colors-tab > aside ul li .filter_checkboxItem:not(:checked) + input + label:after, .ths-colors-tab > aside ul li .filter_checkboxItem:checked + input + label:after {
    top: 5px;
    width: 17px;
    height: 17px;
}

.ths-colors-tab > article > figure {
    text-align: center;
    width: 33.33333333333334%;
    max-width: 33.33333333333334%;
}

/* Using max-width because we utilize a desktop first approach */
@media (max-width: 640px) {
    .ths-colors-tab > article > figure {
        text-align: center;
        width: 100%;
        max-width: 100%;
    }
}

@media (min-width: 768px) {
    .ths-colors-tab > article > figure section: not(.hidden) {
        left: 240px !important;
    }
}

.ths-colors-tab > article > figure section: not(.hidden) {
    z-index: 3;
}

.ths-colors-tab > article > figure.selected {
    border-color: #ffffff !important;
    border: none !important;
}

    .ths-colors-tab > article > figure.selected .option-item-inner {
        border-width: 5px;
    }

.ths-colors-tab > article > figure {
    border: none;
}

    .ths-colors-tab > article > figure section .tab-pane > .col-md-4 > .col-xs-12 {
        margin-right: -2px;
        width: auto;
    }

#assortmentsDataId .help-block.with-errors li {
    text-align: center;
}
/*popup color*/ .slider-tab--content-image .slider-tab--thumbs {
    padding-top: 0px;
    max-height: none !important;
}

.with-image-slider .slider-tab--content-image .slider-tab--thumbs {
    padding: 0px 30px 0px 30px;
}

.tab-pane .slider-tab--content-subheader {
    margin-top: 0px;
}

.tab-pane .slider-tab--content-header {
    margin-bottom: 5px;
}

.slider-tab--content-area p:last-child {
    margin-bottom: 0px;
}

.slider-tab--thumbs .carousel-control {
    background-image: none;
}

    .slider-tab--thumbs .carousel-control.left {
        margin-left: -30px;
    }

        .slider-tab--thumbs .carousel-control.left .fa-chevron-circle-left {
            font-size: 2.0rem;
            margin-left: 0px;
        }

    .slider-tab--thumbs .carousel-control.right {
        margin-right: -30px;
    }

        .slider-tab--thumbs .carousel-control.right .fa-chevron-circle-right {
            font-size: 2.0rem;
            margin-right: 0px;
        }

.slider-tab--panel, .slider-tab--content-image .slider-tab--gallery {
    position: relative;
}

    .slider-tab--panel .fa-search-plus {
        position: absolute;
        right: 15px;
        bottom: 15px;
    }

.tab-content.slider-tab--content .tab-pane {
    background-color: #eee !important;
}

.slider-tab--content-image {
    margin: 15px 0;
}

    .slider-tab--content-image .slider-tab--thumbs img {
        width: calc(50% - 5px);
        margin: 0px 5px 5px 0px !important;
    }

    .slider-tab--content-image .slider-tab--panel {
        max-height: none;
    }

@media (min-width: 992px) {
    .with-image-slider .slider-tab--content-image .slider-tab--panel {
        width: calc(50% - 30px);
    }

    .with-image-slider .slider-tab--content-area {
        width: calc(33.33333333% - 30px);
    }

    .with-image-slider .slider-tab--content-image {
        width: calc(66.66666667% + 60px);
    }

    .slider-tab--content-area {
        position: absolute;
        right: 0px;
        bottom: 0px;
        padding-bottom: 50px;
        padding-left: 0px;
    }

    .with-image-slider .slider-tab--thumbs {
        position: absolute;
        right: 30px;
        bottom: 0px;
        top: 0px;
    }

        .with-image-slider .slider-tab--thumbs .carousel, .with-image-slider .slider-tab--thumbs .carousel-inner {
            height: 100%;
        }
}

.custom-gallery .gallery-gallery--item img {
    border-width: 3px;
    border-color: #eee;
}

.slider-tab--content-area {
    padding-top: 20px;
    padding-right: 30px;
    text-align: right;
}

    .slider-tab--content-area ul {
        list-style: none;
        text-align: center;
    }

        .slider-tab--content-area ul a {
            text-decoration: underline;
        }

.slider-tab--content .tab-pane {
    background-color: #f4f4f4;
}

.slider-tab--content-area .btn {
    white-space: inherit;
}

.slider-tab--content .slider-tab--content-header {
    margin-top: 0;
    text-align: left;
}

.slider-tab--content .slider-tab--content-subheader {
    text-align: left;
    font-weight: bold;
    margin-bottom: 15px;
}

.slider-tab--panel .fa.fa-search-plus {
    cursor: pointer;
}

.tab-content .tab-pane.dark {
    background-color: #585858 !important;
    color: #fff;
}

    .tab-content .tab-pane.dark .close-tab-panel .fa-times-circle, .tab-content .tab-pane.dark .slider-tab--content-header, .tab-content .tab-pane.dark a:not(.btn) {
        color: #fff;
    }

    .tab-content .tab-pane.dark .slider-tab--content-header {
        font-weight: bold;
    }
/*popup color finish*/ .option-list .option-item-inner .option-title {
    display: block;
}

.ths-colors-tab {
    position: relative;
}

aside a {
    padding: 10px 20px 10px 20px;
    text-decoration: underline;
}

@media (min-width: 1000px) {
    .ths-colors-tab > article > figure: nth-child(4n+4), .ths-colors-tab > article > figure:nth-child(5n+4) {
        clear: none;
    }
}

.product-color .option-title .price {
    font-weight: bold !important;
    font-size: 2.0rem;
}

.product-color .option-title .oldprice {
    font-weight: normal !important;
    text-decoration: line-through;
    padding-right: 5px;
}

.product-color .option-title .oldprice-strike-through {
    text-decoration: line-through;
}

.product-color section p.text-left a {
    text-decoration: underline;
}

.quantity-select {
    margin-bottom: 10px;
}

.option-item-inner > .assortmentModelImageContainer {
    position: relative;
}

.assortmentModelImageContainer .top-left {
    position: absolute;
    top: 8px;
    left: 16px;
    color: white;
    font-weight: bold;
}

.ths-colors-tab > aside .ths-collapseWrapper > .ths-collapseItem > .btn {
    display: none;
}

.user-navigation a.user-nav-link {
    margin-bottom: 0;
    padding-top: 5px;
    padding-bottom: 0;
    min-height: 35px;
}
