/*===============|
   BACKGROUND
=================|
*/
body, main > section, div.section, .home-sections:nth-of-type(odd){
    background-color: rgb(141 141 141 / 86%) !important;
    background-image: url('../../../images/temas-comemorativos/black-friday/background.jpg');
    background-repeat: repeat;
    background-size: cover;
    background-position: 0px 0px;
    background-blend-mode: overlay;
    animation: animatedBackground 20s linear infinite;
    border-bottom: 4px solid #ffffff;
}

.home-sections:nth-of-type(even) {
    background-color: #6f6f6fdb !important;
    background-image: url('../../../images/temas-comemorativos/black-friday/background.jpg');
    background-repeat: repeat;
    background-size: cover;
    background-position: 0px 0px;
    background-blend-mode: overlay;
    animation: animatedBackground 25s linear infinite;
    border-bottom: 4px solid #afafaf;
}

section > div.container {
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 50' style='enable-background:new 0 0 50 50%3B' xml:space='preserve'%3E%3Cstyle type='text/css'%3E.st1%7Bopacity:0.7%3Bfill:%23FFFFFF%3B%7D.st3%7Bopacity:0.1%3Bfill:%23FFFFFF%3B%7D%3C/style%3E%3Ccircle class='st3' cx='4' cy='14' r='1'/%3E%3Ccircle class='st3' cx='43' cy='3' r='1'/%3E%3Ccircle class='st3' cx='31' cy='30' r='2'/%3E%3Ccircle class='st3' cx='19' cy='23' r='1'/%3E%3Ccircle class='st3' cx='37' cy='22' r='1'/%3E%3Ccircle class='st3' cx='43' cy='16' r='1'/%3E%3Ccircle class='st3' cx='8' cy='45' r='1'/%3E%3Ccircle class='st3' cx='29' cy='39' r='1'/%3E%3Ccircle class='st3' cx='13' cy='37' r='1'/%3E%3Ccircle class='st3' cx='47' cy='32' r='1'/%3E%3Ccircle class='st3' cx='15' cy='4' r='2'/%3E%3Ccircle class='st3' cx='9' cy='27' r='1'/%3E%3Ccircle class='st3' cx='30' cy='9' r='1'/%3E%3Ccircle class='st3' cx='25' cy='15' r='1'/%3E%3Ccircle class='st3' cx='21' cy='45' r='2'/%3E%3Ccircle class='st3' cx='42' cy='45' r='1'/%3E%3C/svg%3E");
    background-position: 0px 0px;
    animation: animatedBackground 15s linear infinite;
}

@keyframes animatedBackground {
    0% {
        background-size: 100%;
        background-position: 0px 0px;
    }
    50% {
        background-size: 108%;
        background-position: -40px 0px;
    }
    100% {
        background-size: 100%;
        background-position: 0px 0px;
    }
}

/*===============|
   TEXTOS
=================|
*/
.section-title > h1, .section-title > h2, .section-title > h3, .section-title > h4,
.section-title > h5, .section-title > h6, .section-title p,
.home-product-list .list-title, .home-product-list .single-list .list-info h3 a,
.home-product-list .single-list .list-info span{
    color: #ffffff;
}
.section-title h2::before, .home-product-list .list-title::before {
    background-color: #ffffff;
}
.shipping-info .media-body span, .featured-categories .single-category ul li a,
.product-grids .product-grid-topbar, .breadcrumbs .breadcrumb-nav li a{
    color: #ffffff;
}
.breadcrumbs .breadcrumb-nav li{
    color: #ffffff;
}

/*=================================================|
   Transparencia geral de itens e cards gerais
===================================================|
*/
.shipping-info > div > ul > li, .featured-categories .single-category,
.product-grids .product-grid-topbar, .breadcrumbs,
.shopping-cart.dark .content{
    border: 3px solid #000000;
    background: rgba(242, 241, 245, 0.86);
    border-radius: 30px;
}
.product-sidebar .single-widget, .item-details .top-area, .product-details-info .single-block{
    border: 3px solid #000000;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 30px;
}
.checkout-sidebar > div{
    border: 3px solid #000000;
    background: rgba(255, 255, 255, 0.98);
    border-radius: 30px;
}

/*===============|
   CARD PRODUTO
=================|
*/
.single-product.product-theme {
    position: relative;
    z-index: 0;
    border-radius: 15px 15px 0;
    overflow: hidden;
    box-shadow: 0 0 14px #000000 !important;
}

.single-product.product-theme:not(.offer-content)::before {
    content: '';
    position: absolute;
    z-index: -2;
    width: 300%;
    height: 150%;
    top: -100px;
    left: -200px;
    background-color: #262626;
    background-repeat: no-repeat;
    background-size: 50% 50%, 50% 50%;
    background-image: linear-gradient(356deg,#f5f9f9, #797979 50%,#ffffff);
    animation: rotate 10s linear infinite;
}
.single-product.product-theme:not(.offer-content)::after {
    content: '';
    position: absolute;
    display: block;
    z-index: 3;
    background: #4d4d4d;
    border-radius: 30px;
    top: 8px;
    left: 10px;
    right: 0;
    height: 44px;
    background: url('../../../images/temas-comemorativos/black-friday/icon.png') no-repeat 0 0;
}
@media (max-width: 992px) {
    .single-product.product-theme:not(.offer-content)::before {
        width: 350%;
        height: 180%;
        top: -150px;
        left: -220px;
    }
}
@media (max-width: 767px) {
    .single-product.product-theme:not(.offer-content)::before {
        width: 250%;
        height: 220%;
        top: -210px;
        left: -180px;
    }
}
@keyframes rotate {
    0% {
        transform: skew(0deg, 0deg);
    }
    50% {
        transform: skew(10deg, -57deg);
    }
    100% {
        transform: skew(0deg, 0deg);
    }
}
/*.single-product.product-theme > .product-info > .product-title > a,
.single-product.product-theme > .product-info > .price > span{
    color: #ffffff;
}
.single-product.product-theme > .product-info > .product-title > a:hover,
.single-product.product-theme > .product-info > .price > span:hover{
    color: #ffffff
}*/

/*============|
    BOTÕES
==============|
Botões de compra do produto
*/
.single-product.product-theme .button a, .button > .btn {
    display: inline-block;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    min-width:100px;
    padding: 22px 33px;
    font-size: 26px;
    line-height: 26px;
    text-decoration: none;
    color: #FFF;
    text-shadow: 0 1px 2px rgba(0,0,0,0.75);
    background: #000000;
    outline: none;
    border-radius: 30px;
    border: 1px solid #919191;
    box-shadow: rgb(132 68 139 / 12%) 0px -4px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
    position: relative;
    overflow: visible;
    -webkit-transition: 500ms linear;
    -moz-transition: 500ms linear;
    -o-transition: 500ms linear;
    transition: 500ms linear;
}

.single-product.product-theme .button a:hover, .button > .btn:hover {
    background: #000000;
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(0,0,0,0.75), 0 0 40px #FFF;
    box-shadow:
        inset 1px 1px 0px rgba(255, 255, 255, 0.7),
        inset 0 0 6px #919191,
        inset 0 80px 80px -40px #2a2a2a,
        1px 1px 3px rgba(0,0,0,0.75);

}
.single-product.product-theme .button a:focus, .button > .btn:focus {
    outline: none;
}
.single-product.product-theme .button a:active, .button > .btn:active {
    box-shadow:
        inset 1px 1px 0px rgba(255,255,255,0.25),
        inset 0 0 6px #939393,
        inset 0 80px 80px -40px #46403f,
        0px 1px 0px rgba(255,255,255,0.25);
    -webkit-transition: 50ms linear;
    -moz-transition: 50ms linear;
    -o-transition: 50ms linear;
    transition: 50ms linear;
}
/*===============================================
    Botões de destaque e ação
=================================================*/
.button > .btn {
    padding: 11px 9px;
    font-size: 18px;
}

/*=====================|
 Banners Individuais
======================|
*/
.single-banner{
    border-radius: 30px;
}
.featured-categories .single-category > ul > li > a{
    color: #0c0b0c;
}
.single-banner > div > div.button > a{
    color: white;
    position: relative;
    top: 22px;
    left: -3px;
    padding: 3px;
    background: #696969;
}

@media (max-width: 767px) {
    .single-banner > div > div.button > a{
        top: 46px;
        left: 9px;
        padding: 7px;
    }
}
.single-banner.right{
    border-radius: 10px;
    border: 8px solid;
    border-image: linear-gradient(#c9c8c8, #646363, #0c0b0c) 1;
}
.fix-1-singles > div.button > a, .fix-2-singles > div.button > a, .fix-3-singles > div.button > a {
    z-index: -9999;
}

/*===============|
 Marcas / Brands
=================|
*/
.brands .brands-logo-wrapper .brands-logo-carousel .brand-logo, .tns-ovh{
    border: #ffffff 1px solid;
    background: white;
}
.shipping-info .media-body > h5, .shipping-info .media-body > span{
    color: #0c0b0c;
}