body {
   
    overflow-x: hidden;
}


.menuitems li {
    background: #fffefe;
    padding: 5px 12px;
    border-bottom: 1px solid #ebebeb;
}

.site-header .site-nav, .site-header .site-logo {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}


.white-bg-box {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
    background-color: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
}
.btn-custom {
    color: #fff;
    background-color: #EA3c53 !important;
    border-color: #EA3c53 !important;
}
.btn-success, .btn-green {
    color: #fff;
    background-color: #EA3c53 !important;
    border-color: #EA3c53 !important;
}
.btn-addon-icon {
    background-color: #332731 !important;
    border-color: #332731 !important;
    color:#fff;
}
.btn-green.btn-icon i {
    background-color: #332731 !important;
}
.title-tag-bg {
    background-color: #EA3C53;
    color: #fff;
    padding: 5px 10px;
    margin-bottom: 7px;
    border-radius: 5px;
    text-align: center;
}
    /*.title-tag-bg h3{
        color: #fff;
    }*/

    .table > tbody > tr > td {
        vertical-align: middle;
    }

.cart-text {
    font-size: 16px;
}
/* Defines the width of the carousel and centers it on the page */
.slick-carousel {
    margin: 0 auto 10px;
    width: 100%;
    background-color: #fff;
}

/* The width of each slide */
.slick-slide {
    width: fit-content;
}

/* Color of the arrows */
.slick-next::before, .slick-prev::before {
    color: blue;
}

#affix1.affix {
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999 !important;
    background-color: #fff;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2);
}

    #affix1.affix > .slick-carousel {
        width: 1000px;
    }

    #affix1.affix > .white-bg-box {
        box-shadow: none;
        background-color: transparent;
    }

    #affix1.affix + .container-fluid {
        padding-top: 70px;
    }
#affix2.affix {
    top: 10px;
    
    width: 32vw;
    z-index: 999 !important;
    
}

    #affix2.affix + .container-fluid {
        padding-top: 70px;
    }
#affix3.affix {
    top: 10px;
    width: 10.6vw;
    z-index: 999 !important;
}

    #affix3.affix + .container-fluid {
        padding-top: 70px;
    }
.category-section {
    padding-top: 50px;
}
/* width */
.desktop-category ::-webkit-scrollbar {
    width: 10px;
}

/* Track */
.desktop-category ::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
.desktop-category ::-webkit-scrollbar-thumb {
    background: #888;
}

    /* Handle on hover */
    .desktop-category ::-webkit-scrollbar-thumb:hover {
        background: #555;
    }
.desktop-category{
    display:block
}
.mobile-category{
    display:none;
}
/*.slick-prev:before {
            content: "<";
            color: #333;
            font-size: 30px;
            position: absolute;
            top: 18px;
            left: -30px;
            cursor:pointer;
        }

        .slick-next:before {
            content: ">";
            color: #333;
            font-size: 30px;
            position: absolute;
            top: 18px;
            right: -30px;
            cursor: pointer;
        }*/
.slick-next::before {
    content: url('/Content/dist/frontend/assets/images/iconfinder_ChevronRight_1031536.png');
    /*content: "";*/
    display: block;
    height: 15px;
    width: 15px;
    position: absolute;
    top: 7px;
    right: -15px;
    cursor: pointer;
}

.slick-prev::before {
    content: url('/Content/dist/frontend/assets/images/iconfinder_ChevronLeft_1031537.png');
    /*content: "";*/
    display: block;
    height: 15px;
    width: 15px;
    position: absolute;
    top: 7px;
    left: -50px;
    cursor: pointer;
}

.category-title {
    cursor: pointer;
    padding: 15px;
    border-bottom: 2px solid transparent;
    width: fit-content;
    font-weight: 500;
}

    .category-title:hover {
        border-bottom: 2px solid #333;
    }

.cart-mobile-block {
    display: none;
}
.mailchimp-form {
    overflow: auto;
    position: absolute;
    z-index: 1;
    width: 30%;
    top: 17%;
    right: 15%;
}
.mobile-home{
    display: none;
}
.desktop-home{
    display:block;
}
#preloader > img {
    position: absolute;
    top: 40vh;
    right: 0;
    left: 35vw !important;
    bottom: 0;
}
.desktop-v{
    display:block;
}
.mobile-v{
    display: none;
}
.slider-container {
    background: #332731 no-repeat center center !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    margin-bottom: 40px;
}
@media screen and (min-width:1281px) and (max-width: 1370px) {
    #affix3.affix {
        top: 10px;
        width: 12.5vw;
        z-index: 999 !important;
    }

    .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
        height: 100% !important;
    }
}
@media screen and (min-width:1371px) and (max-width: 1450px){
    #affix3.affix {
        top: 10px;
        width: 12.5vw;
        z-index: 999 !important;
    }
    .slider-text {
        top: 24%;
    }

    .mailchimp-form {
        top: 21%;
    }
}
@media screen and (min-width:1451px) and (max-width: 1601px) {
    #affix3.affix {
        top: 10px;
        width: 10.6vw;
        z-index: 999 !important;
    }
    .slider-text {
        top: 45%;
    }
    .mailchimp-form {
        
        top: 38%;
        
    }
}
@media screen and (min-width:1602px) and (max-width: 1681px) {
    #affix3.affix {
        top: 10px;
        width: 10.1vw;
        z-index: 999 !important;
    }
    .slider-text {
        top: 45%;
    }

    .mailchimp-form {
        top: 38%;
    }
}
@media screen and (min-width:1682px) and (max-width: 1930px) {
    #affix3.affix {
        top: 10px;
        width: 9vw;
        z-index: 999 !important;
    }
    .slider-text {
        top: 45%;
    }

    .mailchimp-form {
        top: 38%;
    }
}
@media screen and (min-width: 1024px) and (max-width: 1280px) {
    #affix2.affix {
        width: 39vw;
    }
    .mailchimp-form{
        width:34%;
        top:30%;
        right:8%;
    }
    .slider-text {
        top: 33%;
    }
    #affix3.affix {
        top: 10px;
        width: 13.3vw;
        z-index: 999 !important;
    }
    .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
        height: 100% !important;
    }

}
@media screen and (min-width: 768px) and (max-width: 1023px) {
    #affix2.affix {
        
        width: 39vw;
    }
    .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
        height: 100% !important;
    }
    .cart-block {
        display: none;
    }

    .cart-mobile-block {
        display: block;
        position: fixed;
        width: 100%;
        margin: 0px;
        left: 0px;
        bottom: 0;
        z-index: 1000;
    }
    #preloader > img {
        position: absolute;
        top: 50vw;
        right: 0;
        left: 25vw !important;
        bottom: 0;
    }
    .cart-block-bg {
        background-color: #EA3C53;
        color: #fff;
        padding: 10px 10px;
        text-align: center;
    }
    .mailchimp-form {
        width: 45%;
        right: 4%;
        top:25%;
    }
    .slider-text{
        top: 28%;
    }
    .category-section {
        padding-top: 0px;
    }
    .desktop-category {
        display: none;
    }

    .mobile-category {
        display: block;
    }
    
}
@media screen and (max-width: 767px) {
    .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
        height: 100% !important;
    }
    .cart-block {
        display: none;
    }

    .cart-mobile-block {
        display: block;
        position: fixed;
        width: 100%;
        margin: 0px;
        left: 0px;
        bottom: 0;
        z-index: 1000;
    }

    .cart-block-bg {
        background-color: #EA3C53;
        color: #fff;
        padding: 10px 10px;
        text-align: center;
    }
    .custom-topbar .social-networks {
        text-align:center !important;
        padding-top:10px;

    }
    .custom-topbar{
        text-align:center;
    }
    .menu-page{
        padding-top:30px;
    }
    .nav-tabs.nav-justified > li > a {
        width: 50% !important;
        float: left !important;
    }
    #preloader > img {
        position: absolute;
        top: 50vw;
        right: 0;
        left: 25vw !important;
        bottom: 0;
    }
    .mailchimp-form {
        display:none;
    }
    .mailchimp-form-mobile {
        display: block !important;
        overflow: auto !important;
        position: relative !important;
        z-index: 1 !important;
        width: 90% !important;
        top: 0 !important;
        left: 5% !important;
    }
    .desktop-category {
        display: none;
    }
    .category-section {
        padding-top: 0px;
    }
    .mobile-category {
        display: block;
    }
    .mobile-home {
        display: block;
    }

    .desktop-home {
        display: none;
    }
    .desktop-v {
        display: none;
    }

    .mobile-v {
        display: block;
    }
    .maintenance-content {
        overflow: auto;
        position: absolute;
        z-index: 1;
        width: 90% !important;
        top: 30vh !important;
        left: 5% !important;
        text-align:center;
    }

        .maintenance-content h1 {
            font-size: 40px !important;
        }

        .maintenance-content p {
            font-size: 20px !important;
        }
}
@media screen and (min-width: 380px) and (max-width: 450px) {
    #preloader > img {
        position: absolute;
        top: 75vw;
        right: 0;
        left: 0vw !important;
        bottom: 0;
    }
}
@media screen and (min-width: 500px) and (max-width: 600px) {
    #preloader > img {
        position: absolute;
        top: 50vw;
        right: 0;
        left: 10vw !important;
        bottom: 0;
    }
}
@media screen and (min-width: 200px) and (max-width: 300px) {
    #preloader > img {
        position: absolute;
        top: 50vw;
        right: 0;
        left: -25vw !important;
        bottom: 0;
    }
}
    @media screen and (max-width: 375px) {
        .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
            height: 100vh !important;
        }
        #preloader > img {
            position: absolute;
            top: 50vw;
            right: 0;
            left: 0vw !important;
            bottom: 0;
        }
    }

    @media screen and (min-width: 400px) and (max-width: 415px) {
        .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
            height: 100vh !important;
        }
    }

    @media screen and (min-width: 370px) and (max-width: 380px) {
        .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
            height: 100vh !important;
        }
    }

    @media screen and (min-width: 270px) and (max-width: 300px) {
        .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
            height: 100vh !important;
        }
    }