﻿body {
    padding-bottom: 20px;
    font-family: Averta;
    background: #f6f6f6;
    color:#333;
}

input{
    background:#fff;
    color:#333;
}

.greyBody{

}

/* Set padding to keep content from hitting the edges */
.body-content {
    min-height: 350px;
    padding-bottom: 2%;
    position: relative;
}

.deactivationIcon {
    color: red;
    font-size: 28px !important;
    position: absolute;
    left: 26%;
    bottom: 6%;
    cursor: pointer;
}

.lowStockSign {
    background: #FFB61E !important;
}

.preOrderStockSign {
    background: #00aeef !important;
}

.NoStockSign {
    background: #fd4f57 !important;
}

.stockSignCircle {
    position: absolute;
    height: 12px;
    width: 12px;
    background: #32aa3a;
    border-radius: 50px;
    top: 10px;
    right: 78px;
}
/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.countryInfoButton {
    width: 35px;
    position: absolute;
    right: 21.1%;
    top: -16px;
    cursor: pointer;
}

.ChooseCountryContainerTitle {
    font-size: 22px;
    width: 100%;
    text-align: center;
    height: 60px;
    line-height: 60px;
}

.CountryListContainer {
    width: 90%;
    margin-left: 5%;
    height: 70%;
    overflow-y: scroll;
}

.selectCountryRow img {
    width: 20px;
}

.countryNameRow {
}

.selectCountryRow i {
    font-size: 32px;
    position: absolute;
    top: -2px;
    right: 60px;
    -webkit-text-stroke: 4px #eee;
}

.countriesContainerSearch {
    position: absolute;
    right: 6%;
    bottom: 16px;
    height: 35px;
    width: 51%;
    border: solid 2px;
    border-radius: 0px;
    padding-left: 2%;
    background: #fff;
}

    .countriesContainerSearch:focus {
        border: solid 2px !important;
    }

.selectCountryRow {
    height: 30px;
    line-height: 30px;
    padding-left: 10px;
    position: relative;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.selectedCountryRow {
    background: #eee;
}

.SelectCountryButton {
    position: absolute;
    width: 38%;
    left: 4%;
    height: 35px;
    line-height: 35px;
    text-align: center;
    color: #fff;
    text-transform: capitalize;
    border-radius: 0px;
    bottom: 16px;
    background: #254a91;
    cursor: pointer;
}

    .SelectCountryButton:hover {
        opacity: 0.9;
        background: #337bed;
        transition: 0.3s;
        box-shadow: 0 1px 2px 0 rgba(26,115,232,0.451), 0 1px 3px 1px rgba(26,115,232,0.302);
        border-radius: 2px;
    }


.selectCountryRow:hover {
    background: #eee;
    cursor: pointer;
    transition: 0.2s;
}

.CountryListContainer::-webkit-scrollbar-track {
    background-color: #f6f6f6;
    width: 1px;
}

.CountryListContainer::-webkit-scrollbar {
    width: 4px;
    background-color: #333;
}

.CountryListContainer::-webkit-scrollbar-thumb {
    background-color: #333;
    border-radius: 20px;
}

.countryInfoButton img {
    height: 100%;
    width: 100%;
    border-radius: 2px;
    max-height:25px;
}

.ChooseCountryContainer {
    width: 30%;
    height: 400px;
    position: fixed;
    background: #fff;
    z-index: 2500;
    left: 35%;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
}


/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
}

.minBody {
    min-height: 200px !important;
}

.displayNone {
    display: none !important;
}

.overlay {
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    z-index: -1;
    display: block;
    overflow: hidden;
}

.productRegisterClickEvent {
    opacity: 0.6;
}

.fontPageBigTitle {
    width: 40%;
    text-align: center;
    margin-left: 30%;
    margin-top: 3%;
    margin-bottom: 3%;
    font-size: 17px;
    font-weight: bold;
}

.suggestionParagraph {
    font-size: 13px !important;
    color: #333 !important;
    padding-left: 33px !important;
    text-transform: lowercase;
    letter-spacing: -0.5px !important;
}

    .suggestionParagraph i {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
        font-size: 18px;
        margin-right: 5px;
        color: #aaa;
    }

    .suggestionParagraph:hover i {
        -webkit-text-stroke: 0px #eee !important;
    }

.frontPageLittleTitle {
    text-align: center;
    margin-top: 2%;
    font-size: 30px;
    color: #254a91;
    margin-bottom: 2%;
    text-transform: capitalize;
}



footer {
    color: #fff;
    width: 100%;
}

.subscribePageTextBox {
    width: 60%;
    height: 40px;
    margin-left: 20%;
    margin-top: 5%;
    padding-left: 5%;
    color: #333;
    font-family: Averta;
    font-size: 18px;
    background-color: #fff;
    opacity: 1 !important;
    border-radius: 0px !important;
    border: solid 1px #ddd !important;
}

.LoginPageTextBoxes {
    width: 60%;
    height: 40px;
    margin-left: 20%;
    margin-top: 5%;
    padding-left: 5%;
    color: #333;
    font-family: Averta;
    font-size: 18px;
    background-color: #fff;
    opacity: 1 !important;
    border-radius: 3px !important;
    border: solid 1px #aaa !important;
}

.blockScrollOnBody {
    overflow: hidden;
    height: 100%;
}

input:focus {
}

.searchTextBoxPC {
    position: absolute;
    top: 7%;
    left: 28%;
    width: 50%;
    border-radius: 3px;
    border: 0;
    height: 35px;
    padding-left: 1%;
}

.searchTextBoxPCSign {
    color: #232f3e !important;
    font-size: 30px !important;
    position: absolute;
    left: 75.5%;
    top: 7%;
    -webkit-text-stroke: 2px #fff;
}

.LoginCheckBoxTextSpan {
    position: absolute;
    bottom: 25%;
    left: 14%;
}

.frontPageBigImage {
    max-width: 100%;
    width: auto;
    height: auto;
    display: block;
    margin: auto;
}


#header-carousel .carousel-inner .item {
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 400px;
    -webkit-transition: 0.3s ease-in-out left;
    -moz-transition: 0.3s ease-in-out left;
    -o-transition: 0.3s ease-in-out left;
    transition: 0.3s ease-in-out left;
}

.carousel-control i {
    margin-top: 170px;
}

.slide {
    background: #fff;
    width: 83.7%;
    height: 400px;
    margin-left: 0.5%;
    float: left;
    margin-top: 0.5%;
}

.title {
    font-size: 50px;
    text-align: center;
    opacity: 0;
    position: absolute;
    width: 100%;
    top: 0;
    color: #fff;
}

.more {
    background: #e2393e;
    font-weight: bold;
    width: 200px;
    text-align: center;
    line-height: 4;
    -webkit-box-shadow: 0px 3px 0px 0px #932427;
    -moz-box-shadow: 0px 3px 0px 0px #932427;
    box-shadow: 0px 3px 0px 0px #932427;
    position: absolute;
    bottom: 0;
    left: calc(50% - 100px);
    opacity: 0;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}

    .more:hover {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        margin-bottom: -3px;
    }

.text {
    text-align: center;
    color: #fff;
    font-family: averta;
    font-size: 25px;
    width: 70%;
    margin-left: 15%;
}

.slide, .title, .text {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.topBanner {
    background-color: #fff;
    height: 100%;
    width: 100%;
    z-index: 2;
    position: relative;
}

.cartTopIcon {
    color: #fff !important;
    float: right !important;
    right: 7.5%;
    width: 90px;
    top: -32px;
    font-size: 25px !important;
    cursor: pointer;
    position: absolute !important;
    height: 50px;
    border: solid 1px transparent;
    border-radius: 3px;
}

#header-carousel {
    -webkit-animation-duration: 0.33s;
    -webkit-animation-delay: 0s;
}

#megaMenuID2 {
    -webkit-animation-duration: 0.33s;
    -webkit-animation-delay: 0s;
}

#megaMenuID1 {
    -webkit-animation-duration: 0.33s;
    -webkit-animation-delay: 0s;
}

.frontPageTopLeftContainer h2 {
    font-size: 18px;
    font-weight: bold;
    color: #000;
    text-align: left;
    width: 100%;
    padding-left: 5%;
    margin-bottom: 10px;
    margin-top: 10px;
}

.frontPageTopLeftContainer p {
    width: 90%;
    padding-left: 1%;
    margin-left: 5%;
    border-bottom: solid 1px #ccc;
    height: 35px;
    padding-top: 10px;
    text-transform: capitalize;
    position: relative;
    font-size: 15.5px;
}

    .frontPageTopLeftContainer p:hover {
        cursor: pointer;
        font-weight: bold;
        font-size: 16.5px;
        padding-top: 9px;
        color: #337bed;
    }

.noBorder {
    border: 0 !important;
}

.searchLeftSign {
    position: absolute;
    left: 6%;
    margin-top: 8px;
    font-size: 20px !important;
    -webkit-text-stroke: 1px #fff;
    color: #000;
}

.topProductsTitle {
    height: 50px;
    width: 70%;
    float: right;
    margin-right: 14.5%;
    text-align: center;
    margin-top: 5%;
    font-size: 20px;
    font-weight: bold;
    color: #232f3e;
    text-transform: capitalize;
}

.footerSubscribeTextBox {
    padding-left: 5%;
    width: 90%;
    height: 35px;
    border-radius: 0px;
    border: solid 1px #ddd;
}


    .footerSubscribeTextBox:focus {
        border: solid 1px #254a91 !important;
    }

.footerSubscribeParagraph {
    text-transform: capitalize;
}


.registerSubscriberSuccessPopUp p {
    text-align: center;
    text-transform: uppercase;
}

.registerSubscriberSuccessButton {
    background: #254a91;
    border: none;
    color: #fff;
    height: 40px;
    width: 30%;
    margin-left: 35%;
    margin-top: 10%;
    border-radius: 3px;
    cursor: pointer;
    text-align: center;
    padding-top: 9.5px;
    position: relative;
}

    .registerSubscriberSuccessButton i {
        font-size: 35px;
        position: absolute;
        left: 18%;
        top: 7%;
        -webkit-text-stroke: 5px #254a91;
    }


.md-checkbox {
    position: relative;
    margin: 16px 0;
}

    .md-checkbox label {
        cursor: pointer;
    }

        .md-checkbox label:before, .md-checkbox label:after {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
        }

        .md-checkbox label:before {
            width: 20px;
            height: 20px;
            background: #fff;
            border: 2px solid rgba(0, 0, 0, 0.54);
            border-radius: 2px;
            cursor: pointer;
            transition: background .3s;
        }

    .md-checkbox input[type="checkbox"] {
        outline: 0;
        margin-right: 10px;
    }

        .md-checkbox input[type="checkbox"]:checked + label:before {
            background: #232f3e;
            border: none;
        }

        .md-checkbox input[type="checkbox"]:checked + label:after {
            transform: rotate(-45deg);
            top: 5px;
            left: 4px;
            width: 12px;
            height: 6px;
            border: 2px solid #fff;
            border-top-style: none;
            border-right-style: none;
        }


.filerSpan {
    text-transform: capitalize;
    font-weight: normal;
    letter-spacing: 0.5px;
}

.subcontainer-filters-title {
    height: 30px !important;
    background: #254a91 !important;
    line-height: 30px !important;
    text-align: center !important;
    color: #fff !important;
    margin-top: 0px;
    width: 100% !important;
    margin-left: -1%;
    margin-bottom: 0px;
    border-radius: 0px;
    position: relative;
    cursor: pointer;
}

    .subcontainer-filters-title:hover {
        background: #232f3e !important;
        transition: 0.3s;
    }

.resetFiltersButton-TopBanner {
    position: absolute;
    height: 60%;
    width: 15%;
    padding-top: 10px;
    font-size: 12px;
    text-transform: uppercase;
    left: 50%;
    color: #fff;
    background: #232f3e;
    text-align: center;
    top: 20%;
    border-radius: 3px;
    cursor: pointer;
}

    .resetFiltersButton-TopBanner:hover {
        opacity: 0.9;
    }

.rateAFlavourTitle {
    padding-left: 10%;
    text-align: left;
    font-size: 15px;
}

.containerUpperFooter {
    height: 300px;
    background: #fff;
    border-top: solid 1px #ddd;
    padding-top: 50px;
    padding-left: 15%;
}

.footerColumn {
    width: 20%;
    float: left;
    padding-left: 0.5%;
    padding-top: 15px;
    color: #fff;
}

.footerRow {
    cursor: pointer;
    text-transform: capitalize;
    color: #aaa;
    margin-top: 2%;
    font-weight: normal;
}

    .footerRow:hover {
        color: #254a91;
    }

.footerColumnTitle {
    font-size: 15px;
    margin-bottom: 2.5%;
    font-weight: bold;
    color: #000;
    text-transform: uppercase;
}

.socialMediaImageFooter {
    height: 100%;
    max-width: 35px;
    max-height: 35px;
    cursor: pointer;
}

.lowerFooterInfo {
    color: #aaa;
    width: 50%;
    text-align: center;
    margin-left: 25%;
    margin-top: 15%;
}

#myBtn {
    display: none;
    position: fixed;
    bottom: 40px;
    font-size: 11px;
    right: 2%;
    z-index: 1;
    border: none;
    outline: none;
    background-color: #232f3e;
    color: white;
    cursor: pointer;
    border-radius: 32px;
    height: 45px;
    width: 45px;
    text-align: center;
    padding-top: 20px;
}

    #myBtn i {
        position: absolute;
        top: -5%;
        left: 30%;
        font-size: 30px;
        text-align: center;
        -webkit-text-stroke: 1px #254a91;
    }

.reviewName {
    width: 80%;
    margin-bottom: 0%;
    height: 40px;
    border: solid 1.5px #ddd;
    padding-left: 3%;
    background: #eee;
}

    .reviewName:focus {
        border: solid 1.5px #337bed !important;
        border-radius: 2px;
        transition: 0.3s;
    }

.ratingSmallContainer i {
    font-size: 22px;
    width: 4%;
    text-align: left;
    margin-top: 15px;
    color: #000;
}

.ratingName {
    font-weight: bold;
    font-size: 15px;
    width: 100%;
    text-transform: capitalize;
    padding-left: 5%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.AddFactsButton {
    background: #33b1ef;
    width: 25%;
    color: #fff;
    text-align: center;
    margin-bottom: 10%;
    height: 35px;
    border-radius: 2px;
    padding-top: 7px;
    margin-left: 37.5%;
    text-transform: uppercase;
    cursor: pointer;
}

.icon-cart {
    width: 48px;
    height: 48px;
    position: relative;
    overflow: hidden;
    margin-left: 5px;
    margin-bottom: 25px;
    border: solid 1px transparent;
    border-radius: 3px;
}

    .icon-cart .cart-line-1 {
        width: 15%;
        height: 7%;
        position: absolute;
        left: 8%;
        top: 25%;
        -webkit-transform: rotate(5deg);
        -moz-transform: rotate(5deg);
        -ms-transform: rotate(5deg);
        transform: rotate(5deg);
        background-color: #000;
        border-bottom-left-radius: 35%;
    }

    .icon-cart .cart-line-2 {
        width: 35%;
        height: 7%;
        position: absolute;
        left: 6%;
        top: 40%;
        -webkit-transform: rotate(80deg);
        -moz-transform: rotate(80deg);
        -ms-transform: rotate(80deg);
        transform: rotate(80deg);
        background-color: #000;
    }

        .icon-cart .cart-line-2:before {
            content: "";
            width: 120%;
            height: 100%;
            position: absolute;
            left: 45%;
            top: -280%;
            -webkit-transform: rotate(-80deg);
            -moz-transform: rotate(-80deg);
            -ms-transform: rotate(-80deg);
            transform: rotate(-80deg);
            background-color: inherit;
        }

        .icon-cart .cart-line-2:after {
            content: "";
            width: 70%;
            height: 100%;
            position: absolute;
            left: 59%;
            top: -670%;
            background-color: inherit;
            -webkit-transform: rotate(40deg);
            -moz-transform: rotate(40deg);
            -ms-transform: rotate(40deg);
            transform: rotate(40deg);
            border-top-left-radius: 50%;
            border-bottom-left-radius: 25%;
        }

    .icon-cart .cart-line-3 {
        width: 30%;
        height: 7%;
        position: absolute;
        left: 33%;
        top: 45%;
        background-color: #000;
    }

        .icon-cart .cart-line-3:after {
            content: "";
            width: 124%;
            height: 100%;
            position: absolute;
            top: -150%;
            left: -5%;
            background-color: inherit;
        }

    .icon-cart .cart-wheel {
        width: 12%;
        height: 12%;
        background-color: #000;
        border-radius: 100%;
        position: absolute;
        left: 28%;
        bottom: 20%;
    }

        .icon-cart .cart-wheel:after {
            content: "";
            width: 100%;
            height: 100%;
            background-color: inherit;
            border-radius: 100%;
            position: absolute;
            left: 200%;
            bottom: 0;
        }

.cartItemsCounter {
    position: absolute;
    left: 30%;
    font-size: 11px;
    top: 13%;
    font-weight: bold;
    background: #ff0000;
    height: 18px;
    width: 18px;
    text-align: center;
    color: #fff;
    border-radius: 9px;
    line-height: 18px;
}

.userIconLayout {
    color: #fff;
    font-size: 24px !important;
    position: absolute;
    right: 170px;
    top: 22%;
    cursor: pointer;
    -webkit-text-stroke: 0.25px #232f3e;
}

.globeContainer {
    height: 40px;
    width: 40px;
    position: relative;
    left: 1px;
    top: 4px;
    font-size: 30px;
    color: #254a91;
    text-align: center;
    z-index: 3;
    border: solid 1px transparent;
    border-radius: 3px;
    margin-right: 0;
}

.globeContainer-wholesale {
    height: 40px;
    width: 40px;
    position: absolute;
    right: 17%;
    top: -28px;
    font-size: 30px;
    color: #fff;
    text-align: center;
    z-index: 3;
    border: solid 1px transparent;
    border-radius: 3px;
    margin-right: 0;
    cursor:pointer;
}

    .globeContainer:hover {
        cursor: pointer;
    }

    .globeContainer i {
        position: absolute;
        top: 13%;
        left: 15%;
    }

.currencyChooseContainer {
    height: 40px;
    width: 40px;
    position: absolute;
    right: 3.5%;
    top: -27px;
    font-size: 30px;
    color: #fff;
    text-align: center;
    z-index: 3;
    border: solid 1px transparent;
    border-radius: 3px;
}

    .currencyChooseContainer:hover {
        cursor: pointer;
    }

    .currencyChooseContainer i {
        position: absolute;
        top: 13%;
        left: 29%;
        -webkit-text-stroke: 2px #254a91;
    }

.currencyParagraph {
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    margin-top: 2px;
    color: #000;
    width: 98%;
    position: relative;
    margin-left: 1%;
}

    .currencyParagraph i {
        position: absolute;
        top: 3px;
        left: 25px;
        font-size: 22px;
        -webkit-text-stroke: 3px #fff;
    }

    .currencyParagraph:hover {
        cursor: pointer;
        background: #eee;
    }

        .currencyParagraph:hover i {
            -webkit-text-stroke: 3px #eee;
        }

.highlightedCurrency {
    background: #eee;
}


.languageContainer {
    width: 300px;
    height: 295px;
    position: absolute;
    left: -130px;
    background: #fff;
    bottom: -305px;
    color: #232f3e;
    font-size: 16px;
    text-transform: capitalize;
    border-radius: 3px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
}

.currencyClickContainer {
    width: 130px;
    height: 138px;
    position: absolute;
    left: -90px;
    background: #fff;
    bottom: -146px;
    color: #232f3e;
    font-size: 16px;
    text-transform: capitalize;
    border-radius: 3px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
}

.UserHoverContainer {
    width: 300px;
    height: 110px;
    position: absolute;
    left: -60px;
    background: #fff;
    bottom: -120px;
    color: #232f3e;
    font-size: 16px;
    text-transform: capitalize;
    border-radius: 3px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
}

.CartHoverContainer {
    width: 275px;
    height: 310px;
    position: absolute;
    left: -43px;
    background: #fff;
    bottom: -315px;
    color: #254a91;
    font-size: 16px;
    text-transform: capitalize;
    border-radius: 3px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    z-index: 9999;
}

.languageContainer p {
    text-align: left;
    padding-left: 10%;
    font-size: 13px;
    height: 30px;
    padding-top: 6.5px;
    cursor: pointer;
    color: #000;
    -webkit-text-stroke: aqua;
}

    .languageContainer p:hover {
        background: #eee;
        color: #000;
    }

.languageContainerTriangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: -10px;
    left: 135px;
}

.currencyContainerTriangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: -10px;
    left: 94px;
}

.UserHoverContainerTriangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: -12px;
    left: 135px;
}

.CartHoverContainerTriangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: -10px;
    left: 120px;
}

.UserHoverLoginButton {
    width: 40%;
    text-align: center;
    height: 30px;
    background: #232f3e;
    color: #fff;
    margin-left: 10%;
    float: left;
    margin-top: 12px;
    padding-top: 0px;
    border-radius: 2px;
    font-size: 14px;
    line-height: 30px;
}

.UserHoverRegisterButton {
    font-size: 12px;
    text-decoration: underline;
    float: left;
    text-align: center;
    width: 50%;
    height: 50px;
    padding-top: 16px;
    text-transform: uppercase;
    color: #232f3e;
}

.cartText {
    position: absolute;
    left: 50%;
    bottom: 14%;
    font-size: 13px;
    text-transform: capitalize;
}

.cartTopIcon:hover {
    /*border:solid 1px #aaa;*/
}

#addedToCartCheckIconID {
    -webkit-animation-duration: 0.2s;
    -webkit-animation-delay: 0s;
}

.isRecentlyAddedToCartSuccess {
    background: #32aa3a !important;
}

    .isRecentlyAddedToCartSuccess i {
        -webkit-text-stroke: 4.5px #32aa3a;
    }

.lowOrNoStockFlavour {
    color: #FFB61E !important;
}

.addedToCartCheckIcon {
    font-size: 30px !important;
    position: absolute;
    top: 0px;
    left: 24px;
}

.inStockFlavour {
    color: #079c3a;
}

.afterScrollNavbar {
    width: 100%;
    height: 52px;
    position: fixed;
    top: 0%;
    background: #254a91;
    z-index: 2;
    padding-top: 24px;
    box-shadow: 0 2px 3px rgba(0,0,0,.3);
}

.afterScrollNavbarDisplay {
    display: block !important;
}

.afterScrollNavbarLogo {
    height: 48px;
    position: absolute;
    top: -28px;
    left: 4%;
    cursor: pointer;
}

.UserIconContainer {
    color: #fff;
    font-size: 24px !important;
    position: absolute;
    right: 14%;
    top: -22px;
    cursor: pointer;
    height: 40px;
    width: 40px;
    text-align: center;
    z-index: 3;
}

.UserIconContainerTop {
    height: 50px;
    width: 100%;
    border-bottom: solid 1px #ddd;
}

.UserIconContainerBottom {
    height: 100%;
    width: 100%;
    color: #254a91;
}

.UserIconContainerTop p {
    font-size: 11px;
    color: #000;
    width: 70%;
    padding-right: 5%;
    float: right;
    height: 100%;
    padding-top: 12px;
    text-align: left;
}

.UserIconContainerTop i {
    font-size: 25px;
    color: #000;
    height: 100%;
    width: 30%;
    padding-top: 12px;
    text-align: center;
}

.UserHoverLoginButton span {
    -webkit-text-stroke: aliceblue;
}

.CartHoverContainerTitle {
    text-transform: initial;
    width: 100%;
    text-align: left;
    padding-left: 5%;
    height: 35px;
    font-size: 12px;
    padding-top: 10px;
    border-bottom: solid 1px #ddd;
}

.CartHoverContainerBottomContainer {
    height: 70px;
    width: 100%;
    border-top: solid 1px #ddd;
    position: absolute;
    bottom: 0%;
}

.CartHoverContainerBottomContainerTitle {
    height: 20px;
    width: 100%;
    border-bottom: solid 1px #ddd;
}

    .CartHoverContainerBottomContainerTitle p {
        text-transform: uppercase;
        width: 100%;
        font-size: 13px;
        padding-top: 2px;
        padding-left: 5%;
        color: #333;
    }

.CartHoverContainerBottomContainerButtonContainer {
    height: 40px;
    width: 100%;
}


.CartHoverContainerMiddleInfoContainer {
    height: 205px;
    width: 100%;
    position: relative;
    box-shadow: inset 0 -10px 10px -5px #ddd;
    overflow-y: scroll;
}


    .CartHoverContainerMiddleInfoContainer::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        background-color: #F5F5F5;
    }

    .CartHoverContainerMiddleInfoContainer::-webkit-scrollbar {
        width: 0px;
        background-color: #F5F5F5;
    }

    .CartHoverContainerMiddleInfoContainer::-webkit-scrollbar-thumb {
        background-color: #254a91;
    }

.cartHoverProductContainer {
    width: 100%;
    height: 60px;
    padding-top: 5px;
    border-bottom: solid 1px #ddd;
    position: relative;
}

    .cartHoverProductContainer:hover {
        background: #f9f9f9;
    }

.cartHoverProductContainerImageContainer {
    width: 25%;
    height: 100%;
    float: left;
    cursor: pointer;
}

.cartHoverProductContainer img {
    height: auto;
    max-height: 40px;
    margin-top: 10px;
    display: block;
    margin: auto;
    margin-top: 5px;
    max-width: 90%;
}

.CartHoverViewCartButton {
    width: 90%;
    margin-left: 5%;
    height: 35px;
    margin-top: 7px;
    background: #254a91;
    color: #fff;
    text-align: center;
    line-height: 35px;
    border-radius: 3px;
    font-size: 12px;
    cursor:pointer;
}

    .CartHoverViewCartButton:hover {
        background: #337bed;
        transition: 0.3s;
    }

.cartHoverProductDeleteContainer {
    position: absolute;
    right: 10px;
    text-align: center;
    height: 30px;
    width: 30px;
    background: #fff;
    display: block;
    padding-top: 2px;
    bottom: 5px;
    z-index: 1;
}

    .cartHoverProductDeleteContainer:hover i {
        color: #254a91;
        -webkit-text-stroke: 3px #fff;
    }

    .cartHoverProductDeleteContainer i {
        font-size: 25px !important;
        color: #333;
        -webkit-text-stroke: 4px #fff;
        position: relative;
        top: 0px;
        right: 0px;
    }

.cartHoverProductInfo {
    width: 40%;
    margin-left: 25%;
    font-size: 10px;
    height: 100%;
    display: block;
    text-align: left;
    padding-left: 0%;
    padding-top: 4px;
    color: #333;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.cartHoverProductQty {
    position: absolute;
    font-size: 13px;
    text-transform: lowercase;
    height: 100%;
    padding-top: 5.5px;
    right: 75px;
    top: 0%;
    color: #333;
}

.cartHoverProductPrice {
    position: absolute;
    top: 0%;
    font-size: 10px;
    font-weight: bold;
    right: 10px;
    text-align: center;
    height: 100%;
    padding-top: 8px;
    text-transform: uppercase;
}

.cartHoverProductViewButton {
    font-size: 10px;
    position: absolute;
    left: 59%;
    bottom: 11px;
    background: #232f3e;
    color: #fff;
    width: 25%;
    text-align: center;
    height: 15px;
    padding-top: 1px;
    border-radius: 3px;
}

.CartHoverContainerTotalValueSpan {
    position: absolute;
    right: 5%;
    top: 0px;
    font-size: 14px;
    color: #333;
    text-transform: uppercase;
}

.UserHoverContainerLoggedIn {
    width: 200px;
    height: 250px;
    position: absolute;
    left: -15px;
    background: #fff;
    bottom: -255px;
    color: #232f3e;
    font-size: 16px;
    text-transform: capitalize;
    border-radius: 3px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
}

.UserHoverContainerTriangleLoggedIn {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: -10px;
    left: 86.5px;
}

.UserHoverContainerLoggedInBottomContainer {
    height: 50px;
    width: 100%;
    border-top: solid 1px #ddd;
    position: absolute;
    bottom: 0;
}

.UserHoverContainerLoggedInTopContainer {
    height: 40px;
    width: 100%;
    border-bottom: solid 1px #ddd;
}

.LogOutButton {
    height: 30px;
    width: 100%;
    margin-top: 9px;
    position: relative;
    text-align: left;
    padding-left: 10%;
    color: #000;
    text-transform: initial;
    font-size: 14px;
    padding-top: 4px;
    -webkit-text-stroke: aqua;
}

    .LogOutButton:hover {
        background-color: #eee;
    }

.LoggedInNameContainer {
    font-size: 11px;
    height: 100%;
    color: #000;
    font-weight: bold;
    -webkit-text-stroke: aqua;
    padding-top: 14px;
    text-align: left;
    padding-left: 10%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.UserHoverContainerLoggedInMiddleContainer {
    height: 210px;
    width: 100%;
    padding-top: 10px;
}

.UserHoverContainerLoggedInMiddleContainerButton {
    -webkit-text-stroke: aqua;
    color: #000;
    font-size: 14px;
    width: 100%;
    height: 35px;
    text-align: left;
    padding-left: 10%;
    padding-top: 7px;
    text-transform: initial;
    position: relative;
}

    .UserHoverContainerLoggedInMiddleContainerButton:hover {
        background: #eee;
    }

.LoggedInMenuButtonNewFlag {
    position: absolute;
    right: 35%;
    top: 7px;
    height: 21.5px;
    background: #337bed;
    color: #fff;
    text-align: center;
    width: 40px;
    border-radius: 3px;
    padding-top: 0px;
}

.relateQuantity {
    border: solid 1px #ddd;
    position: absolute;
    right: 5%;
    bottom: 5%;
    height: 30px;
    width: 40%;
    padding-left: 10px;
}

    .relateQuantity:focus {
        border: solid 1px #ddd !important;
    }



.highlightSearchOption {
    background-color: #ddd;
}

    .highlightSearchOption i {
        -webkit-text-stroke: 1px #ddd;
    }

.searchProductImageContainer {
    width: 35%;
    height: 100%;
    float: left;
    cursor: pointer;
}

.liveChatButton {
    height: 30px;
    width: 100px;
    color: #fff;
    position: absolute;
    right: 290px;
    top: 63%;
    text-align: left;
    text-transform: capitalize;
    padding-top: 5px;
    background: #0063b3;
    font-weight: bold;
    padding-left: 10px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    z-index: 3;
}

    .liveChatButton:hover {
        cursor: pointer;
        opacity: 0.9;
    }

    .liveChatButton i {
        font-size: 18px !important;
        position: absolute;
        top: 1px;
        right: 5px;
    }

.QuotationPopup {
    background: #fff;
    height: 600px;
    width: 90%;
    z-index: 3;
    position: fixed;
    left: 5%;
    top: 10%;
    border-radius: 5px;
    box-shadow: 0 0 20px rgba(0,0,0,.3);
    max-width: 2000px;
}

.countrySearchContainer {
    width: 50%;
    padding-left: 10%;
    text-align: left;
    float: left;
    position: relative;
    height: 80%;
}

.countrySearchInput {
    width: 80%;
    height: 35px;
    padding-left: 5%;
    color: #333;
    border-radius: 3px;
    border: solid 1px #aaa;
    text-transform: capitalize;
    position: relative;
}

    .countrySearchInput:focus {
        border: solid 1px #254a91 !important;
    }

.countryResultsContainer {
    max-height: 60%;
    overflow-y: scroll;
    width: 80%;
    border: solid 1px #ddd;
}

    .countryResultsContainer p {
        width: 100%;
        padding-left: 5%;
        height: 30px;
        padding-top: 4px;
        cursor: pointer;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

        .countryResultsContainer p:hover {
            color: #fff;
            background: #254a91;
        }

.countrySelectEraseIcon {
    position: absolute;
    font-size: 30px !important;
    right: 20%;
    z-index: 1;
    top: 41.5px;
    -webkit-text-stroke: 5px #fff;
    color: #254a91;
    cursor: pointer;
}

.halfColumn {
    width: 32%;
    padding-left: 4%;
    text-align: left;
    float: left;
    position: relative;
    height: 80%;
    padding-top: 15px;
}

.quotationInfoTextBox {
    width: 80%;
    height: 35px;
    padding-left: 5%;
    color: #333;
    border-radius: 3px;
    border: solid 1px #aaa;
    text-transform: capitalize;
    position: relative;
    margin-bottom: 10px;
}

    .quotationInfoTextBox:focus {
        border: solid 1px #254a91 !important;
    }

.RequestQuotationButton {
    background: #254a91;
    width: 70%;
    text-align: center;
    height: 35px;
    padding-top: 7px;
    color: #fff;
    text-transform: uppercase;
    border-radius: 3px;
    cursor: pointer;
    margin-top: 25px;
}

    .RequestQuotationButton:hover {
    }

.halfColumn h3 {
    text-align: left;
    font-size: 18px;
    padding-left: 2%;
    margin-bottom: 25px;
}

.QuotationPopup h2 {
    font-size: 25px;
    width: 100%;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    margin-top: 2.5%;
    margin-bottom: 2%;
    padding-left: 0%;
}

.halfRightColumn {
    width: 68%;
    text-align: left;
    float: left;
    position: relative;
    height: 80%;
    padding-top: 15px;
}

    .halfRightColumn h3 {
        text-align: left;
        font-size: 18px;
        padding-left: 2%;
        margin-bottom: 25px;
    }

.quotationItemContainer {
    height: 90%;
    width: 100%;
    overflow-y: scroll;
    border-top: solid 1px #ddd;
}

.quotationItem {
    width: 100%;
    height: 35px;
    border-bottom: solid 1px #ddd;
}

    .quotationItem p {
        font-size: 13px;
        text-transform: uppercase;
        height: 30px;
        padding-top: 7px;
        width: 70%;
        float: left;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        padding-left: 15px;
    }

.quotationItemQty {
    width: 28%;
    float: left;
    height: 26px;
    margin-top: 4px;
    border: solid 1px #ddd;
    text-align: center;
}

    .quotationItemQty:focus {
        border: solid 1px #ddd !important;
    }

.quotationItemContainer::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #eee;
}

.quotationItemContainer::-webkit-scrollbar {
    width: 4px;
    background-color: #aaa;
    border-radius: 4px;
}

.quotationItemContainer::-webkit-scrollbar-thumb {
    background-color: #254a91;
}

.quotationErrorSuccessPopUp {
    height: 220px;
    width: 30%;
    position: fixed;
    z-index: 3;
    background: #fff;
    left: 35%;
    top: 25%;
    border-radius: 5px;
}

.quotationPopUpInfo {
    width: 90%;
    margin-left: 5%;
    text-align: center;
    font-size: 15px;
}

.quotationPopUpSubInfo {
    position: absolute;
    bottom: 10%;
    width: 90%;
    text-align: center;
    left: 5%;
    font-size: 10.5px;
    color: #aaa;
}

.QuotationPopupTitle {
    width: 100%;
    text-align: center;
    font-size: 24px;
    text-transform: capitalize;
    height: 65px;
    line-height: 60px;
    font-weight: bold;
}


.adminMainContainer {
    float: left;
    padding-top: 50px;
}

.adminTextBox {
    width: 50%;
    margin-top: 3%;
    height: 35px;
    padding-left: 10px;
    border: solid 1px #aaa;
    border-radius: 3px;
}

    .adminTextBox:focus {
        border: solid 1px #254a91 !important;
    }

.adminMainContainerTitle {
    font-size: 20px;
    width: 100%;
    text-align: left;
}

.halfConainerTitle {
    font-size: 24px;
    text-transform: uppercase;
    font-weight: bold;
    height: 50px;
    text-align: left;
    line-height: 50px;
    padding-left: 5%;
}

.halfConainerSubTitle {
    text-transform: capitalize;
    text-align: left;
    padding-left: 14%;
}

.halfContainerSubContainer {
    width: 100%;
    margin-top: 5%;
    text-align: left;
}

.frontPageSubscribeTextBox {
    width: 70%;
    margin-left: 14%;
    border: solid 1px #ddd;
    border-radius: 3px;
    height: 35px;
    padding-left: 10px;
    margin-bottom: 5px;
}

    .frontPageSubscribeTextBox:focus {
        border: solid 1px #ddd !important;
    }

.subscribeCommericalPhoto {
    height: 98%;
    margin-top: 0.5%;
    display: block;
    margin-left: 10%;
}

.outOfStockImage {
    opacity: 0.7;
}

.banner-container {
    width: 150px;
    height: 150px;
    overflow: hidden;
    position: absolute;
    top: -2px;
    left: -2px;
}

.banner-containerStore {
    width: 150px;
    height: 150px;
    overflow: hidden;
    position: absolute;
    top: 16px;
    left: unset;
}


&:after {
    content: "";
    display: block;
    width: 10px;
    height: 5px;
    background-color: #254a91;
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}

&:before {
    content: "";
    display: block;
    height: 10px;
    width: 5px;
    background-color: #254a91;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
}


.banner {
    width: 200px;
    background-color: #fd4f57;
    color: #fff;
    text-align: center;
    transform: rotate(-45deg) translate(-28%, -35%);
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
    text-transform: lowercase;
    text-shadow: 0 2px 2px rgba(0,0,0,0.4);
    font-size: 10px;
    padding: 2px;
    height: 17px;
}

.bannerStore {
    width: 250px;
    background-color: #fd4f57;
    color: #fff;
    text-align: center;
    transform: rotate(-45deg) translate(-28%, -35%);
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
    text-transform: lowercase;
    text-shadow: 0 2px 2px rgba(0,0,0,0.4);
    font-size: 10px;
    padding: 2px;
    height: 30px;
    line-height: 30px;
    padding: 0;
}

.bannerSalePC {
    width: 200px;
    background-color: #32aa3a;
    color: #fff;
    text-align: center;
    transform: rotate(-45deg) translate(-28%, -35%);
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
    text-transform: uppercase;
    text-shadow: 0 2px 2px rgba(0,0,0,0.4);
    font-size: 10px;
    height: 25px;
    line-height: 25px;
}

.notificationCountContainer {
    color: #fff;
    position: absolute;
    top: 0%;
    right: 0%;
    font-size: 12px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #ff0000;
    line-height: 15px;
}

.notificationRow {
    font-size: 12px;
    text-align: left;
    padding-left: 5%;
    height: 75px;
    line-height: 55px;
    color: #333;
    background: #fff;
    margin-top: 1px;
    position: relative;
    border-bottom: solid 1px#eee;
}

.notificationContainerTitle {
    height: 45px;
    line-height: 45px;
    color: #333;
    text-align: left;
    padding-left: 0%;
    text-transform: uppercase;
    border-bottom: solid 1px #ddd;
    background: #fff;
    position: relative;
}

.notificationCloseSign {
    position: absolute;
    top: 0px;
    right: 0%;
    height: 45px;
    width: 14%;
    float:left;
}

    .notificationCloseSign i {
        color: #333;
        font-size: 30px;
        position: absolute;
        top: 12%;
        -webkit-text-stroke: 4px #fff;
        left: 23%;
    }

.notificationContainer {
    height: auto;
    padding-top: 0px;
    overflow-y: scroll;
    max-height: 250px;
    padding-bottom: 1px;
    padding-left: 1px;
    padding-right: 1px;
}

.notificationRow:hover {
    background: #f6f6f6;
}


.notificationContainer::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}

.notificationContainer::-webkit-scrollbar {
    width: 3px;
    background-color: #F5F5F5;
}

.notificationContainer::-webkit-scrollbar-thumb {
    background-color: #254a91;
}

.notificationProductImageContainer {
    width: 15%;
    height: 100%;
    float: left;
    cursor: pointer;
    padding-top: 2px;
}

.notificationProductImage {
    height: auto;
    display: block;
    margin: auto;
    max-width: 100%;
    margin-top: 10%;
    max-height: 90%;
}

.notificationRow p {
    background: transparent !important;
    width: 85% !important;
    height: 15px;
    margin-right: 0%;
    padding: 0;
    font-size: 10px;
    text-align: left;
    padding-left: 60px;
    line-height: normal;
    padding-top: 5px;
    font-weight: bold;
}

.notificationProductPrice {
    color: red !important;
}

.notificationTimeStamp {
    position: absolute;
    top: 0%;
    right: 5px;
    font-size: 9px;
    line-height: 20px;
    font-weight: bold;
    color: #254a91;
}

.notificationNewInfo {
    text-transform: uppercase;
    position: absolute;
    right: 5px;
    bottom: 5px;
    font-size: 9px;
    background: #32aa3a;
    color: #fff;
    border-radius: 3px;
    height: 15px;
    width: 35px;
    line-height: 15px;
    text-align: center;
}

.contactHalfContainer {
    width: 50%;
    float: left;
    margin-top: 5%;
    padding-left: 0%;
    border-bottom: solid 1px #333;
    min-height: 175px;
}

.contactHalfContainerTitle {
    font-size: 20px;
    font-weight: bold;
}

.contactHalfContainerRow {
    font-size: 16px;
    color: #555;
    width: 100%;
}

.contactMAsterContainer {
    width: 70%;
    margin-left: 15%;
}

.contactTextBox {
    width: 100%;
    height: 35px;
    border: none;
    background: #eee;
    padding-left: 2%;
    color: #333;
    margin-bottom: 2%;
}

.contactTextArea {
    background: #eee;
    border: none;
    width: 100%;
    min-height: 150px;
    padding-top: 2%;
    padding-left: 2%;
    max-height: 150px;
    min-width: 100%;
    max-width: 100%;
    margin-bottom: 2%;
}

.contactSendButton {
    width: 30%;
    background: #254a91;
    color: #fff;
    text-align: center;
    height: 40px;
    line-height: 40px;
    font-size: 18px;
    text-transform: uppercase;
    margin-left: 70%;
    cursor: pointer;
}

    .contactSendButton:hover {
        opacity: 0.9;
        transition: 0.33s;
    }

.contactChoice {
    width: 70% !important;
    margin-top: 4%;
    margin-left: 0% !important;
}

.contactEmailSendSuccess {
    background: #32aa3a !important;
}

.contactSendButton i {
    font-size: 35px;
    -webkit-text-stroke: 6px #32aa3a;
    margin-left: 5%;
    margin-top: 1%;
    -webkit-animation-duration: 0.33s;
    -webkit-animation-delay: 0s;
}

.incompleteErrorPopup {
    width: 20%;
    height: 100px;
    position: absolute;
    text-align: center;
    color: #fd4f57;
    font-weight: bold;
    line-height: 40px;
}

.deliveryPageMainP {
    font-weight: bold;
    width: 80%;
    margin-left: 10%;
    text-align: center;
    line-height: 30px;
    letter-spacing: 1px;
    margin-top: 3%;
}

.topCategoriesContainerFirstPage {
    background: #fff;
    width: 100%;
    height: 95px;
    margin-left: 0;
    float: unset;
    margin-top: 2%;
}

.TopValuesBanner {
    background: #fff;
    width: 83.6%;
    height: 65px;
    margin-left: 0.6%;
    float: left;
    margin-top: 0.5%;
    min-height: 65px;
}

.FrontPageBannerMasterContainer {
    width: 84%;
    min-height: 100px;
    float: left;
    margin-top: 1.5%;
    margin-left: 0.2%;
}

.FrontPageBannerTopContainer {
    width: 100%;
    height: 110px;
}

.FrontPageBannerTopContainerShadow {
    width: 100%;
    height: 110px;
    position: absolute;
    top: 35px;
    cursor: pointer;
}

    .FrontPageBannerTopContainerShadow:hover {
        background: #fff;
        opacity: 0.35;
        transition: 0.4s;
    }

.FrontPageBannerTopContainer img {
    width: 100%;
    height: 100%;
    margin-left: auto;
}

.FrontPageBannerContainerRowLow {
    width: 100%;
    height: 35px;
    background: #2c4a82;
    cursor: pointer;
    line-height: 35px;
    color: #fff;
    text-align: left;
    padding-left: 5%;
    text-transform: uppercase;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.FrontPageBannerContainerRowHigh {
    width: 100%;
    height: 35px;
    background: #213971;
    cursor: pointer;
    line-height: 35px;
    color: #fff;
    text-align: left;
    padding-left: 5%;
    text-transform: uppercase;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

    .FrontPageBannerContainerRowHigh:hover {
        opacity: 0.8;
        transition: 0.4s;
    }

.FrontPageBannerContainerRowLow:hover {
    opacity: 0.8;
    transition: 0.4s;
}

.FrontPageBannerContainer {
    width: 24%;
    min-height: 300px;
    height: auto;
    float: left;
    background: #f6f6f6;
    margin-left: 0.5%;
    position: relative;
}

.FrontPageBannerContainerTitle {
    width: 100%;
    height: 35px;
    line-height: 35px;
    color: #fff;
    padding-left: 5%;
    font-size: 14px;
    text-transform: uppercase;
    background: #333;
    font-weight: bold;
}

.TopValuesBannerContainer {
    width: 24%;
    float: left;
    height: 100%;
    position: relative;
    padding-top: 12.5px;
}

    .TopValuesBannerContainer:hover {
        background: #eee;
        transition: 0.3s;
        cursor: pointer;
    }

        .TopValuesBannerContainer:hover i {
            -webkit-text-stroke: 3px #eee;
            transition: 0.3s;
            cursor: pointer;
        }

.CategoryCircleContainer {
    height: 200px;
    background: #fff;
    width: 15.5%;
    margin-right: 1%;
    float: left;
    margin-bottom: 1%;
    text-align: center;
    padding-top: 1%;
}

    .CategoryCircleContainer img {
        max-height: 60%;
        width: auto;
    }

.CategoryCircleContainerTitle {
    text-transform: capitalize;
    width: 100%;
    margin-top: 5%;
    font-size: 17px;
}

.CategoryCircleContainer:hover {
    cursor: pointer;
}

    .CategoryCircleContainer:hover p {
        color: #00aeef;
        text-decoration: underline;
        transition: 0.2s;
    }

.topCategoriesContainerFirstPageTitile {
    width: 100%;
    font-size: 20px;
    margin-bottom: 2%;
    padding-left: 4%;
    text-transform: capitalize;
    margin-top: 2%;
}

.topProductsFirstPage {
    text-align: left;
    font-size: 18px;
    text-transform: capitalize;
    padding-left: 3%;
}

.userDashboardCompanyTitle {
    width: 100%;
    text-align: center;
    margin-top: 1.5%;
    font-size: 24px;
}

.userDashboardTopMenuContainer {
    width: 100%;
    height: 53px;
    margin-top: 2.5%;
    text-align: center;
    padding-left: 30%;
    border-bottom: solid 1px #ddd;
}

.userDashboardTopMenuItem {
    float: left;
    margin-left: 1%;
    width: 18%;
    font-size: 18px;
    text-transform: capitalize;
    cursor: pointer;
}

    .userDashboardTopMenuItem:hover {
        border-bottom: solid 3px #254a91;
        color: #254a91;
        transition: 0.15s;
    }

    .userDashboardTopMenuItem p {
        line-height: 50px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        font-size: 16px;
    }

.selectedUserDashboardMenuItem {
    border-bottom: solid 3px #254a91;
    color: #254a91;
}

.AccountHomeLeftInfoContainer {
    width: 25%;
    border: solid 1px #ddd;
    min-height: 400px;
    margin-left: 10%;
    margin-top: 5%;
    position: relative;
    border-radius: 3px;
    float: left;
}

.AccountHomeLeftInfoContainerTitle {
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: left;
    background: #eee;
    font-size: 18px;
    padding-left: 5%;
    position: relative;
}

.AccountHomeLeftInfoContainerEditButton {
    position: absolute;
    top: 2px;
    right: 2px;
    font-size: 16px;
    height: 46px;
    line-height: 46px;
    cursor: pointer;
    background: #254a91;
    width: 25%;
    text-align: center;
    color: #fff;
    border-radius: 3px;
}

    .AccountHomeLeftInfoContainerEditButton:hover {
        opacity: 0.9;
        transition: 0.33s;
    }

.AccountHomeLeftInfoContainerInfoTitle {
    width: 100%;
    font-size: 14px;
    padding-left: 5%;
    height: 25px;
    line-height: 25px;
    margin-top: 2.5%;
    position: relative;
}

.AccountHomeLeftInfoContainerInfo {
    width: 100%;
    font-size: 14px;
    padding-left: 5%;
    height: 25px;
    line-height: 25px;
    position: relative;
}

.AccountHomeLeftInfoContainerAddresses {
    width: 50%;
    border: solid 1px #ddd;
    min-height: 400px;
    margin-left: 5%;
    margin-top: 5%;
    position: relative;
    border-radius: 3px;
    float: left;
}

.AccountHomeLeftInfoContainerAddressesSubContainer {
    width: 50%;
    float: left;
    height: 100%;
}

.changePassShortCutButton {
    position: absolute;
    right: 10px;
    height: 30px;
    line-height: 30px;
    background: #254a91;
    color: #fff;
    width: 20%;
    text-align: center;
    border-radius: 3px;
    text-transform: capitalize;
    top: 4px;
    cursor: pointer;
}

    .changePassShortCutButton:hover {
        opacity: 0.9;
        transition: 0.33s;
    }

.dashboardMySettingsHalfContainer {
    min-height: 400px;
    width: 35%;
    margin-left: 20%;
    margin-top: 2%;
    float: left;
}

.MyDetailsMainContainer {
    width: 70%;
    margin-left: 15%;
    margin-top: 3%;
}

.changePassTitle {
    width: 100%;
    height: 25px;
    line-height: 25px;
    padding-left: 5%;
    text-transform: capitalize;
    margin-top: 2%;
}

.changePassTextBox {
    width: 90%;
    margin-left: 5%;
    height: 35px;
    border: none;
    background: #eee;
    padding-left: 2%;
    border: solid 1.5px #eee;
}

    .changePassTextBox:focus {
        border: solid 1.5px #337bed !important;
        border-radius: 2px;
        transition: 0.3s;
    }

.changePasswordButton {
    width: 90%;
    margin-top: 5%;
    text-align: center;
    background: #254a91;
    color: #fff;
    height: 35px;
    line-height: 35px;
    text-transform: uppercase;
    cursor: pointer;
    margin-left: 5%;
}

.changePasswordPageTitle {
    text-align: center;
    font-size: 22px;
    margin-top: 3%;
    text-transform: capitalize;
}

.changePasswordButton i {
    font-size: 30px;
    margin-top: 1px;
    -webkit-text-stroke: 5px #32aa3a;
    -webkit-animation-duration: 0.33s;
}

.userDashboardErrorCloseContainer {
    height: 35px;
    width: 35px;
    text-align: center;
    line-height: 35px;
    font-size: 30px;
    cursor: pointer;
    z-index: 3;
    position: absolute;
    left: 30%;
    top: 7px;
}

.userDashboardError {
    height: 50px;
    width: 100%;
    position: fixed;
    bottom: 0%;
    z-index: 3;
    background: #fd4f57;
    -webkit-animation-duration: 0.33s;
    padding-left: 32%;
    padding-right: 32%;
}

.userDashboardErrorCloseContainer i {
    color: #fff;
    -webkit-text-stroke: 4px #fd4f57;
}

.userDashboardErrorMessage {
    color: #fff;
    position: absolute;
    top: 30%;
    left: 30%;
    text-align: center;
    width: 40%;
}

.dashboardMySettingsHalfContainerRight {
    float: left;
    width: 35%;
    min-height: 400px;
    margin-top: 2%;
}

.userDashboardRightAccountSettingsSwitchMasterContainer {
    width: 30%;
    margin-left: 40%;
    margin-top: 3%;
}

.userOrderContainer {
    width: 80%;
    margin-left: 10%;
    height: 50px;
    margin-top: 0%;
    padding-top: 7.5px;
    border-bottom: solid 1px #ddd;
}

.userOrdersMasterContainer {
    width: 100%;
    min-height: 200px;
    padding-top: 4%;
    position: relative;
    float: left;
}

.orderTitleContainerColumn {
    width: 16.6666%;
    float: left;
    text-align: center;
    height: 35px;
    line-height: 35px;
    text-transform: capitalize;
}

.orderTitleContainer {
    width: 80%;
    margin-left: 10%;
    background: #eee;
    height: 35px;
}

.userOrderDetailsButton {
    width: 50%;
    margin-left: 25%;
    height: 100%;
    background: #254a91;
    color: #fff;
    border-radius: 1px;
    cursor: pointer;
}

    .userOrderDetailsButton:hover {
        transition: 0.33s;
        background: #232f3e;
    }

.userOrderID {
    color: #254a91;
    text-decoration: underline;
    font-weight: bold;
    background-image: linear-gradient(to left, blue, darkblue, red, pink);
    -webkit-background-clip: text;
    color: transparent;
}

.userInvoiceDetailsButton {
    width: 80%;
    height: 100%;
    margin-left: 10%;
    background: #00aeef;
    color: #fff;
    cursor: pointer;
    position: relative;
}

    .userInvoiceDetailsButton i {
        position: absolute;
        top: 9px;
        right: 20px;
        font-size: 16px;
    }

.individualOrderMasterContainer {
    width: 100%;
    min-height: 300px;
    overflow: hidden;
}

.individualOrderContainerLeft {
    min-height: 100px;
    width: 50%;
    margin-left: 5%;
    border: solid 1px #ddd;
    float: left;
    border-radius: 2px;
    margin-bottom: 5%;
}

.individualOrderContainerRight {
    min-height: 200px;
    width: 30%;
    margin-left: 5%;
    border: solid 1px #ddd;
    float: left;
    border-radius: 2px;
    padding-bottom: 17.5px;
}

.individualOrderContainerRightTitle {
    text-transform: uppercase;
    font-weight: bold;
    height: 35px;
    line-height: 35px;
    padding-left: 2.5%;
}

.individualOrderContainerRightP {
    width: 100%;
    padding-left: 2.5%;
}

.userOrderProductContainer {
    width: 100%;
    height: 100px;
    border-bottom: solid 1px #ddd;
}

.individualOrderProductsPreTitle {
    height: 50px;
    line-height: 50px;
    background: #f6f6f6;
    text-transform: uppercase;
    font-size: 20px;
    letter-spacing: 1px;
    padding-left: 5%;
}

.userOrderProductInfo {
    float: left;
    width: 65%;
    height: 100%;
    padding-top: 20px;
}

.userOrderProductInfoTitle {
    font-size: 14px;
    color: #254a91;
}

.userOrderProductInfoParagraph {
    font-weight: bold;
    font-size: 14px;
}

.userOrderProductTotalContainer {
    width: 20%;
    float: left;
    height: 100%;
    text-align: center;
    padding-top: 19px;
}

.orderProductSummaryBottomContainer {
    height: 140px;
}

    .orderProductSummaryBottomContainer p {
        width: 100%;
        padding-left: 5%;
        font-size: 16px;
        height: 30px;
        line-height: 30px;
    }

.totalPOrderSummary {
    font-size: 20px !important;
    font-weight: bold;
}

.seeAllOrdersBack {
    width: 100vw;
    position: absolute;
    bottom: 0%;
    text-align: center;
    height: 45px;
    line-height: 45px;
    background: #254a91;
    color: #fff;
    text-transform: uppercase;
    cursor: pointer;
    left: 49.4%;
    margin-left: -50vw;
}

.individualOrderInvoiceButton {
    height: 35px;
    text-align: center;
    line-height: 35px;
    text-transform: uppercase;
    margin-top: 2%;
    margin-left: 0%;
    width: 90%;
}

.ordersSubContainerDash {
}

.nextPageButton {
    width: 10%;
    height: 100%;
    float: left;
    line-height: 65px;
    font-size: 16px;
    font-weight: bold;
    text-transform: capitalize;
    cursor: pointer;
    color: #254a91;
    position: relative;
}

.previousPageButton {
    width: 10%;
    height: 100%;
    float: left;
    line-height: 65px;
    font-size: 16px;
    font-weight: bold;
    text-transform: capitalize;
    cursor: pointer;
    color: #254a91;
    position: relative;
    margin-left: 35%;
}

    .previousPageButton:hover {
    }

    .previousPageButton i {
        font-size: 35px;
        position: absolute;
        top: 13px;
        left: -15px;
    }

    .previousPageButton:hover span {
        text-decoration: underline;
    }

.currenctPageMasterContainer {
    width: 10%;
    float: left;
    height: 100%;
}

.nextPageButton:hover {
}

.nextPageButton i {
    font-size: 35px;
    position: absolute;
    top: 13px;
    right: 2px;
}

.nextPageButton:hover span {
    text-decoration: underline;
}

.saerchResultsPageTitle {
    margin-top: 5%;
    font-size: 18px;
    height: 30px;
    line-height: 30px;
    border-bottom: solid 1px #ccc;
}

.searchResultsPageSubTitle {
    font-size: 22px;
    margin-top: 3%;
    margin-bottom: 2%;
}

.searchResultsProductContainer {
    width: 60%;
    height: 220px;
    padding-top: 20px;
    border-bottom: solid 1px #ddd;
    position: relative;
}

.searchResultProductImageContainer {
    width: 20%;
    height: 100%;
    float: left;
    cursor: pointer;
}

.searchResultProductImage {
    max-height: 115px;
    height: auto;
    margin-top: 10px;
    display: block;
    margin: auto;
    margin-top: 10px;
    max-width: 90%;
}

.searchResultProductButtonContainer {
    float: left;
    width: 20%;
    height: 100%;
    position: relative;
}

.searchResultProductButton {
    text-align: center;
    height: 40px;
    background: #254a91;
    line-height: 40px;
    color: #fff;
    margin-top: 70px;
    text-transform: uppercase;
    cursor: pointer;
    border-radius: 2px;
    border: solid 1px #254a91;
}

    .searchResultProductButton:hover {
        transition: 0.33s;
        color: #ffd200;
    }

.searchResultsProductInfo {
    float: left;
    width: 60%;
    height: 100%;
    padding-top: 8px;
}

.pushLowerLogo {
    left: 5%;
}

.userOrderProductInfoTitleTop {
    color: #62bd19;
}

.userOrderProductInfoTitleBrand {
    font-size: 11px;
    color: #5a5a5a;
    margin-top: 2px;
    margin-bottom: 2px;
}

.userOrderProductInfoTitleDesc {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    font-size: 14px;
    margin-bottom: 6px;
    margin-top: 4px;
    width: 90%;
    color: #5a5a5a;
}

.FreeShippingLowerBannerContainer {
    float: left;
    width: 100%;
    height: 75px;
    position: relative;
}

.FreeShippingLowerBannerContainer {
    width: 100%;
    display: block;
    margin-top: 17px;
    font-weight: bold;
}

.SearchPageRatingContainer {
    height: 30px;
    width: 45px;
    border: solid 1px #5a5a5a;
    border-radius: 6px;
    position: absolute;
    top: 28px;
    right: 10px;
    text-align: center;
    line-height: 30px;
    color: #333;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 10px;
}

.topValuesTitle {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    height: 20px;
    line-height: 20px;
    padding-left: 30%;
}

.topValuesSubTitle {
    font-size: 12px;
    text-transform: capitalize;
    height: 20px;
    line-height: 20px;
    padding-left: 30%;
}

.topValuesSign {
    position: absolute;
    left: 17%;
    font-size: 34px !important;
    top: 21%;
    -webkit-text-stroke: 3px #fff;
    color: #aaa;
}

.mainBodyContainerPC {
    width: 100%;
    margin: auto;
    position: relative;
}

@media only screen and (min-width : 1700px) {

    .mainBodyContainerPC {
        width: 1600px;
        margin: auto;
    }

    .containerUpperFooterRetail{
        padding-left:0%!important;
    }
}

.TopValuesPopUp1 {
    width: 35%;
    height: 300px;
    position: fixed;
    top: 20%;
    left: 32.5%;
    background: #fff;
    padding: 20px;
    font-size: 15px;
    -webkit-animation-duration: 0.4s;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    background-color: white;
    z-index: 3;
    font-weight: bold;
    color: #000;
}


.TopValuesCloseButton {
    position: absolute;
    top: 10px;
    right: 20px;
    height: 40px;
    width: 40px;
    font-size: 40px;
    text-align: center;
    line-height: 40px;
    -webkit-text-stroke: 6px #fff;
    cursor: pointer;
}

.TopValuesTitle {
    width: 100%;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
}

.TopValuesDesc {
    height: 190px;
    overflow-y: scroll;
    margin-top: 20px;
    padding: 10px;
}

.TopValuesPopUp2 {
    width: 35%;
    height: 300px;
    position: fixed;
    top: 20%;
    left: 32.5%;
    background: #fff;
    padding: 20px;
    font-size: 15px;
    -webkit-animation-duration: 0.4s;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    background-color: white;
    z-index: 3;
    font-weight: bold;
    color: #000;
}

.TopValuesPopUp3 {
    width: 35%;
    height: 300px;
    position: fixed;
    top: 20%;
    left: 32.5%;
    background: #fff;
    padding: 20px;
    font-size: 15px;
    -webkit-animation-duration: 0.4s;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    background-color: white;
    z-index: 3;
    font-weight: bold;
    color: #000;
}

.TopValuesDesc::-webkit-scrollbar-track {
    background-color: #f6f6f6;
    width: 1px;
}

.TopValuesDesc::-webkit-scrollbar {
    width: 4px;
    background-color: #333;
}

.TopValuesDesc::-webkit-scrollbar-thumb {
    background-color: #333;
    border-radius: 20px;
}

.pcChatButton {
    position: absolute;
    right: 190px;
    color: #fff;
    background: #0063b3;
    width: 120px;
    text-align: right;
    border-radius: 2px;
    text-transform: capitalize;
    height: 25px;
    line-height: 25px;
    cursor: pointer;
    padding-right: 15px;
    position: absolute;
    top: -2px;
}

    .pcChatButton:hover {
        color: #fff !important;
    }

    .pcChatButton:focus:active {
        color: #fff !important;
    }

    .pcChatButton img {
        top: 3px;
        left: 10px;
        position: absolute;
        height: 18px;
    }

.bigSearchNoImages {
    width: 100% !important;
    background: #fff !important;
}

    .bigSearchNoImages p {
        font-weight: bold;
        padding-left: 1% !important;
        font-size: 15px !important;
        text-transform: lowercase !important;
    }

    .bigSearchNoImages i {
        font-size: 20px !important;
    }

.errorSearch {
    color: #fd4f57 !important;
}

.QVRelatedNextRelatedProductsBanner {
    float: left;
    width: 99% !important;
    margin-left: 0.5% !important;
}

.QVRelatedProductContainer {
    float: left;
    margin-top: 5%;
    width: 100%;
}

.CartHoverViewCartButtonIconContainer {
    height: 100%;
    width: 20%;
    background: #f01919;
    color: #fff;
    float: left;
    border-top-right-radius: 0 0 !important;
    border-bottom-right-radius: 37% 100% !important;
    text-align: left;
    line-height: 35px;
    padding-left: 15px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    font-size: 30px;
}

.CartHoverViewCartButtonTitleContainer {
    float: left;
    width: 80%;
    height: 100%;
    text-align: left;
    color: #fff !important;
    padding-left: 40px;
}

.NotifyWhenBackAvailableButton {
    width: 21%;
    float: left;
    font-size: 11px;
    background: #fff;
    height: 31px;
    margin-left: -2%;
    line-height: 30px;
    cursor: pointer;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    text-align: center;
    margin-top: 5px;
    color: #254a91;
    border: solid 1.5px #254a91;
    border-radius: 1px;
    text-transform: lowercase;
    margin-right: 2%;
    padding-left: 5px;
    padding-right: 5px;
}

    .NotifyWhenBackAvailableButton:hover {
        transition: 0.35s;
        color: #fff;
        background: #254a91;
    }

.stockLightSignalContainer {
    height: 15px;
    width: 15px;
    border-radius: 50%;
    background: #32aa3a;
    margin-top: 12.5px;
    margin-left: 20%;
}

.youllbeNotifiedColos {
    background: #32aa3a;
    color: #fff;
    border: solid 1.5px #32aa3a;
}

    .youllbeNotifiedColos:hover {
        background: green;
        color: #fff;
        border: solid 1.5px green;
        transition: 0.35s;
    }

.favoritesIconContainer {
    position: absolute;
    top: 15px;
    right: 0;
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: 35px;
}

    .favoritesIconContainer i {
        font-size: 22px;
        color: #aaa;
    }

    .favoritesIconContainer:hover i {
        color: #f01919;
        transition: 0.35s;
    }

.favoritesIconContainerInfo {
    width: 150px;
    height: 30px;
    position: absolute;
    left: -155px;
    background: #00aeef;
    bottom: 8px;
    color: #232f3e;
    font-size: 16px;
    text-transform: capitalize;
    border-radius: 3px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    display: none;
}

.favoritesIconContainerInfoTriangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #00aeef transparent;
    position: absolute;
    top: 8px;
    right: -16px;
    transform: rotate(90deg);
}

.favoritesIconContainer:hover #favoritesIconContainerInfoID {
    display: block !important;
}

.favoritesIconContainerInfo p {
    height: 100%;
    color: #fff;
    width: 100%;
    line-height: 30px;
    font-size: 14px;
}

#favoritesIconContainerInfoID {
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.35s;
}

.favoritesStoreButtonContainer {
    width: 40%;
    height: 40px;
    margin-top: 2%;
    border: solid 1.5px;
    border-radius: 3px;
    color: #254a91;
}

    .favoritesStoreButtonContainer:hover {
        cursor: pointer;
        background: #ebf5ff;
        transition: 0.35s;
    }

.favoritesStoreButtonContainerIconContainer {
    width: 25%;
    float: left;
    height: 100%;
    text-align: center;
    font-size: 28px;
    line-height: 38px;
}

.favoritesStoreButtonContainerInfoText {
    width: 75%;
    float: left;
    line-height: 37px;
    text-transform: capitalize;
}

.heartTopIconContainer {
    position: absolute;
    right: 4%;
    top: -34%;
    height: 50px;
    width: 50px;
    text-align: center;
}

    .heartTopIconContainer:hover {
        cursor: pointer;
    }

.heartTopIconSign {
    height: 100%;
    width: 100%;
    color: #fff;
    font-size: 26px;
    line-height: 55px;
}

.heartTopIconCounter {
    position: absolute;
    top: 5px;
    height: 17px;
    line-height: 17px;
    width: 17px;
    text-align: center;
    color: #fff;
    right: 2px;
    background: #f01919;
    border-radius: 50%;
    font-size: 10px;
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.2s;
}

.fullFavoriteHeart {
    color: #f01919 !important;
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.2s;
}

.HeartHoverContainer {
    width: 250px;
    height: 310px;
    position: absolute;
    left: -176px;
    background: #fff;
    bottom: -315px;
    color: #254a91;
    font-size: 16px;
    text-transform: capitalize;
    border-radius: 3px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    z-index: 9999;
}

.HeartHoverContainerTriangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: -10px;
    right: 34px;
}

.HeartHoverContainerBottomContainer {
    height: 55px;
    width: 100%;
    border-top: solid 1px #ddd;
    position: absolute;
    bottom: 0%;
}

.HeartHoverViewCartButtonIconContainer {
    height: 100%;
    width: 20%;
    background: #f01919;
    color: #fff;
    float: left;
    border-top-right-radius: 0 0 !important;
    border-bottom-right-radius: 37% 100% !important;
    text-align: left;
    line-height: 35px;
    padding-left: 15px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    font-size: 22px;
}

.HeartHoverProductName {
    font-size: 10px;
    position: absolute;
    top: 25px;
    left: 25%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.FavoritesPageTitle {
    margin-top: 5%;
    font-size: 18px;
    height: 30px;
    line-height: 30px;
    border-bottom: solid 1px #ccc;
    background: #fff;
    line-height: 70px;
    padding-left: 2%;
    width: 70%;
}

.retailLogo {
    left: 115px;
    top: -30px;
    height: 50px;
    position: absolute;
}

.navbarHelpHeader {
    color: #fff;
    float: right;
}

h1 {
    text-align: center;
}

.loginSmallContainerWithFbook {
    bottom: -155px;
    height: 150px;
}

.facebookLoginButton {
    width: 80%;
    margin-left: 10%;
    height: 35px;
    float: left;
    background: #254a91;
    border-radius: 2px;
    color: #fff;
    line-height: 35px;
    position: relative;
    text-align: center;
}

    .facebookLoginButton p {
        font-size: 14px;
        text-transform: lowercase;
    }

        .facebookLoginButton p i {
        }

.facebookAccountImage {
    height: 35px;
    width: auto;
    border-radius: 20px;
    margin-top: -5px;
}

.facebookLoadingSpinner {
    border: 3px solid #fff;
    border-right-color: transparent;
    border-top-color: transparent;
    height: 20px;
    width: 20px;
    margin-top: 5px;
    position: absolute;
    left: 48%;
}

#footerIDRetail {
    width: 100%;
    background: #fff;
    color: #fff;
}

.containerUpperFooterRetail {
    height: 250px;
    border-top: solid 1px #ddd;
    padding-top: 25px;
    padding-left: 15%;
    color: #fff;
}

.footerColumnTitleRetail {
    font-size: 14px;
    margin-bottom: 2.5%;
    font-weight: bold;
    color: #333;
    text-transform: capitalize;
    font-family:ProxyRegular;
}

.footerRowRetail {
    cursor: pointer;
    text-transform: capitalize;
    color: #838383;
    margin-top: 2%;
    font-weight: normal;
    font-size: 13px;
    font-family: ProxyRegular;
}

.pcSocialImage {
    height: auto;
    width: auto;
    max-height: 35px;
    margin-right: 5px;
}

.footerSubscribeButtonRetail {
    width: 90%;
    height: 35px;
    line-height: 35px;
    margin-top: 5px;
    background: #232f3e;
    text-align: center;
    font-weight: normal;
    text-transform: uppercase;
    cursor: pointer;
    border-radius: 2px;
}

.lowrFooterContainerUnderContainer{
    max-width:1600px;
    margin:auto;
}

.footerRetailUpperContainer {
    width: 100%;
    height: 150px;
    background: #fff;
    border-top: solid 1px #eee;
    max-width: 1600px;
    margin: auto;
}

.footerRetailUpperContainerTitle {
    width: 40%;
    height: 100%;
    float: left;
    position: relative;
    line-height: 160px;
    padding-left: 10%;
}

    .footerRetailUpperContainerTitle p {
        font-size: 22px;
        color: #254a91;
        float: left;
        text-transform: uppercase;
        width: auto;
        max-width: 40%;
        font-family:ProxyRegular;
    }

    .footerRetailUpperContainerTitle img {
        width: auto;
        max-height: 55px;
        float: left;
        height: auto;
        margin-top: 57px;
        max-width: 20%;
    }

.footerRetailUpperValueContainer {
    width: 15%;
    height: 96%;
    float: left;
    border-right: solid 1px #eee;
    margin-top: 3px;
    position: relative;
}

    .footerRetailUpperValueContainer i {
        color: #254a91;
        font-size: 35px;
        -webkit-text-stroke: 0.25px #fff;
    }

    .footerRetailUpperValueContainer:hover{
        background:#f6f6f6;
        transition:0.2s ease-in;
    }

    .footerRetailUpperValueTitle {
        color: #254a91;
        width: 100%;
        text-align: center;
        height: 35px;
        line-height: 35px;
        font-size: 14px;
        font-weight: bold;
        font-family: ProxyRegular;
    }

.footerRetailUpperValueSubTitle {
    font-size: 12px;
    color: #aaa;
    text-align: center;
    width: 80%;
    margin-left: 10%;
    font-family: ProxyRegular;
}

.footerRetailUpperValueImageContainer {
    text-align: center;
    margin-top: 10px;
}

.strechMenuTop {
    padding-left: 20%;
}

.MyPointsTopBanner {
    width: 100%;
    height: 100%;
    text-align: center;
    padding-left: 30%;
    padding-top:10px;
    overflow-y:hidden;
}

    .MyPointsTopBanner p {
        font-size: 20px;
        color: #254a91;
        font-weight: bold;
        float: left;
        height: 100%;
        line-height: 200px;
        width:20%;
    }

    .MyPointsTopBanner img {
        height: auto;
        float: left;
        width:20%;
    }

.MyPointsSecondTopBanner {
    height: 60px;
    width: 16%;
    text-align: center;
    margin-left: 43%;
    padding-left: 0;
    background: #254a91;
    color: #fff;
    font-size: 16px;
    text-transform: uppercase;
    margin-top: 20px;
    line-height: 60px;
    cursor: pointer;
}

.GiftsCatalogueContainer {
    width: 50%;
    margin-top: 40px;
    margin-left: 25%;
    height: auto;
    overflow-y:hidden;
    position:relative;
}

    .GiftsCatalogueContainer p {
        width: 50%;
        font-size: 20px;
        color: #254a91;
        height: 100%;
        margin-top: 10%;
        float: left;
        position:relative;
    }

    .GiftsCatalogueContainer img {
        width: 50%;
        height: auto;
        float: left;
        position: relative;
    }

.seeCatalogueButton {
    height: 40px;
    position: absolute;
    bottom: 10%;
    width: 30%;
    background: #fff;
    color: #fff;
    text-align: center;
    line-height: 39px;
    color: #254a91;
    border: solid 2px;
    font-weight: bold;
    cursor: pointer;
    text-transform: uppercase;
    min-width: 200px;
}

    .seeCatalogueButton:hover {
        background: #254a91;
        color: #fff;
        transition: 0.2s;
        border: solid 2px #254a91;
    }

.PointsTable {
    width: 50%;
    height: auto;
    max-height: 250px;
    min-height: 250px;
    margin-left: 25%;
    margin-top: 2%;
    position: relative;
    border: solid 1px #ddd;

}

.PointsTableTopHeader {
    width: 100%;
    height: 50px;
    position: relative;
    overflow-y: hidden;
    border-bottom:solid 1px #ddd;
}

.PointsTopHeadderButton {
    height: 100%;
    line-height: 50px;
    float: left;
    width: 20%;
    text-align: center;
    border: solid 1px #ddd;
    border-bottom: solid 1px #fff;
    border-top: solid 1px #fff;
    border-left: solid 1px #fff;
    font-size: 13px;
    cursor: pointer;
}

.PointsTopHeadderButton:hover{
    color:#254a91;
    transition:0.3s;
}

.selectedPointHeadder {
    border-top: solid 3px #254a91;
    color: #254a91;
    font-weight: bold;
    border-bottom: none !important;
}

.PointsTableBody{
    height:200px;
    overflow-y:scroll;
    width:100%;
    position:relative;
}

    .PointsTableBody::-webkit-scrollbar-track {
        background-color: #f6f6f6;
        width: 1px;
    }

    .PointsTableBody::-webkit-scrollbar {
        width: 4px;
        background-color: #254a91;
    }

    .PointsTableBody::-webkit-scrollbar-thumb {
        background-color: #254a91;
        border-radius: 20px;
    }

.PointsTableBodyRow {
    height: 50px;
    width: 98%;
    border-bottom: solid 1px #ddd;
    margin-left: 1%;
    margin-top: 10px;
}

.PointsTableBodyRowColumn {
    width: 25%;
    height: 50px;
    line-height: 50px;
    float: left;
    TEXT-ALIGN: left;
    padding-left: 30px;
}

    .PointsTableBodyRowColumn p {
        height: 25px;
        line-height: 15px;
        font-size: 12px;
    }

.lowrFooterContainer {
    min-height: 140px;
    width: 100%;
    background: #f6f6f6;
    height: auto;
    padding-bottom: 20px;
}

.lowrFooterContainerTitle {
    width: 100%;
    height: 20px;
    line-height: 20px;
    padding-left: 15%;
    color: #254a91!important;
}
.lowerFooterImagesContainer {
    height: 80px;
    width: 60%;
    padding-left: 15%;
    padding-right: 15%;
    margin-left:20%;
}

.lowerFooterImagesSUBContainer {
    width: 14.2%;
    height: 100%;
    float: left;
    position: relative;
    line-height: 80px;
    text-align:center;
}

    .lowerFooterImagesSUBContainer img {
        width: auto;
        height: auto;
        max-height: 80px;
        max-width: 90%;
    }

.FooterInfoImageContainer {
    position: absolute;
    bottom: 0;
    right: 0;
}

    .FooterInfoImageContainer img {
        max-width: 75%;
        height: auto;
        margin: auto;
        display: block;
    }

.FooterInfoBottomMotivationContainer {
    width: 50%;
    position: absolute;
    bottom: 30px;
    font-size: 20px;
    color: #254a91;
    font-weight: bold;
}

.FooterInfoBottomMotivationContainer p{

}

.termsParagraph {
    width: 60%;
    margin: auto;
    text-align: left;
    font-size: 16px;
}

.termsTitle {
    width: 60%;
    margin: auto;
    text-align: left;
    margin-top: 40px;
    margin-bottom: 20px;
}

.rewardsBody {
    width: 70%;
    margin: auto;
    height: 100%;
    min-height: 300px;
}

.rewardContainer {
    width: 23.75%;
    height: 270px;
    margin-left: 1.25%;
    float: left;
    background: #fff;
    margin-top: 15px;
    position:relative;
}

.lightGreyBody {
    background: #f9f9f9;
}

.rewardsTitle {
    width: 100%;
    text-align: center;
    margin-top: 40px;
    margin-bottom: 40px;
    font-size: 25px;
    color: #254a91;
}

.rewardImageContainer {
    width: 100%;
    height: 50%;
    cursor: pointer;
    padding-top: 15px;
}

.rewardImage {
    max-height: 100%;
    height: auto;
    width: auto;
    margin-top: 10px;
    display: block;
    margin: auto;
    margin-top: 0px;
    max-width: 90%;
}

.rewardProductTitle {
    font-size: 12px;
    width: 100%;
    height: 20px;
    line-height: 20px;
    text-align: center;
    text-transform: lowercase;
}

.rewardContainerLowerBody {
    width: 100%;
    height: 50%;
    padding-top: 10px;
}

.rewardPriceTitleSale {
    width: 100%;
    height: 20px;
    line-height: 20px;
    text-align: center;
    color: #254a91;
    font-weight: bold;
}

.rewardViewButton {
    width: 40%;
    text-align: center;
    margin-top: 15px;
    margin-left: 30%;
    background: #254a91;
    height: 30px;
    line-height: 30px;
    color: #fff;
    border-radius: 3px;
}

#rewardContainerID{
    -webkit-animation-duration:0.25s;
    -webkit-animation-delay:0s;
}

.HtepTopBanner {
    width: 100%;
    height: auto;
    padding-top:20px;
}

.HtepTopBannerImage {
    height: auto;
    width: auto;
    max-width: 100%;
}

.htepTopHeadder {
    height: 30px;
    width: 100%;
    border-bottom: solid 2px #254a91;
    line-height: 30px;
    text-align: center;
    font-size: 12.5px;
    color: #254a91;
    background: #fff;
    position: relative;
    z-index: 1;
}

    .htepTopHeadder i {
        font-size: 15px;  
        color:#fff;
    }

.HtepBannerSpan {
    color: #254a91;
}


.couponSignal {
    border: solid 1.5px #fd4f57;
    padding: 2.5px;
    font-size: 12px;
    font-weight: bold;
    padding-left: 5px;
    letter-spacing: 1px;
    padding-right: 5px;
    background: #fd4f57;
    color: #fff;
    text-transform: uppercase;
    cursor:pointer;
}

.htepMiddleContainer {
    width: 100%;
    min-height: 300px;
    padding-top: 25px;
    height: auto;
    position: relative;
}

.htepMiddleSubContainer {
    width: 50%;
    height: auto;
    float: left;
    min-height: 200px;
    position: relative;
}

.htepMiddleSubContainerTitle {
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding-left: 5%;
    font-size: 20px;
    font-style: italic;
    color: #254a91;
    text-decoration: underline;
    font-weight: bold;
}

.htepMiddleSignContainer {
    padding-left: 5%;
    height: 60px;
    line-height: 60px;
    color: #254a91;
    margin-top: 10px;
}

    .htepMiddleSignContainer p {
        width: 80%;
        float: left;
        height: 100%;
        line-height: 60px;
        font-size: 20px;
        text-transform: capitalize;
        padding-left: 10px;
    }

.htepMiddleSignContainerImageContainer i {
    height: 100%;
    width: 100%;
    font-size: 30px;
    margin-top: 15px;
}

.htepMiddleSignContainerImageContainer {
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    background: #254a91;
    color: #fff;
    border-radius: 30px;
    max-width: 20%;
    float: left;
}

.htepMiddleSubContainerImageContainer {
    width: 100%;
    height: 100%;
}

    .htepMiddleSubContainerImageContainer img {
        width: 100%;
        height: auto;
    }

.htepMiddleContainerTitle {
    width: 100%;
    text-align: center;
    font-size: 35px;
     font-weight: bold; 
    color: #254a91;
    height: 50px;
    line-height: 50px;
    margin-top: 30px;
}

.htepSemiContainer {
    width: 22%;
    height: 320px;
    float: left;
    margin-top: 30px;
    margin-left: 3%;
}

    .htepSemiContainer img {
        height: auto;
        width: auto;
        max-width: 100%;
        max-height: 220px;
        display: block;
        margin: auto;
    }

    .htepSemiContainer p {
        width: 100%;
        text-align: center;
        font-size: 20px;
        text-transform: uppercase;
        color: #254a91;
        height: 50px;
        line-height: 25px;
    }

.CreateAnAccountBigButton {
    width: 20%;
    margin-left: 40%;
    text-align: center;
    height: 40px;
    line-height: 38px;
    background: #fff;
    float: left;
    color: #254a91;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
    border-radius: 2px;
    border:solid 2px;
}

    .CreateAnAccountBigButton:hover {
        background: #254a91;
        color: #fff;
        transition: 0.3s;
        border: solid 2px #254a91;
    }

.CartHoverContainerTopTransparentContainer {
    position: absolute;
    width: 100%;
    height: 20px;
    top: -15px;
}

.helpSmallContainerNavbar{

}

.liveChatButtonNew {
    width: auto;
    float: left;
    height: 25px;
    line-height: 25px;
    text-align: center;
    background: #232f3e;
    border-radius: 3px;
    margin-top: 12.5px;
    cursor: pointer;
    color: #fff;
    padding-left: 10px;
    padding-right: 10px;
    float: right;
}

.liveChatButtonNewWholesale {
    width: auto;
    float: left;
    height: 25px;
    line-height: 25px;
    text-align: center;
    background: #0063b3;
    border-radius: 3px;
    margin-top: 2px;
    cursor: pointer;
    color: #fff;
    padding-left: 10px;
    padding-right: 10px;
    float: left;
}

    .liveChatButtonNewWholesale img {
        height: 18px;
        margin-top: -4px;
    }

.liveChatButtonNew img {
    height: 18px;
    margin-top: -4px;
}

.TelephoneHelpButton {
    width: 45%;
    float: left;
    height: 25px;
    line-height: 25px;
    text-align: center;
    background: #0063b3;
    border-radius: 3px;
    margin-top: 2px;
    margin-left: 1%;
    cursor: pointer;
    color: #fff;
}

.TelephoneHelpButton i{

}

.footerSubscribeButtonRetail i {
    font-size: 25px;
    height: 100%;
    line-height: 33px;
    -webkit-text-stroke: 4px #32aa3a;
}

.topCategoriesContainerFirstSubContainer {
    width: 100%;
    height: 100%;
}

.topCategoriesButtonContainer:hover {
    color:#00aeef;
    background:#f9f9f9;
    transition:0.3s;
}

    .topCategoriesButtonContainer:hover topCategoriesButtonContainerText {
        color: #00aeef!important;
    }

.topCategoriesButtonContainer {
    width: 20%;
    height: 100%;
    float: left;
    color: #254a91;
    cursor: pointer;
}

.topCategoriesButtonContainerIconContainer img {
    width: auto;
    height: auto;
    max-height: 80%;
    margin: auto;
    display: block;
    margin-top: 10%;
}

.topCategoriesButtonContainerIconContainer {
    width: 20%;
    height: 55%;
    margin-left: 40%;
    text-align: center;
    line-height: 50px;
    font-size: 30px;
    border: solid 2px;
    margin-top: 5%;
}

    .topCategoriesButtonContainerText {
        height: 30%;
        line-height: 25px;
        text-align: center;
        font-size: 12px;
        color: unset;
    }

.productItemImageContainer {
    width: 100%;
    height: 52%;
    position: relative;
   
}

.promoProductContainer {
    border: solid 1.5px red !important;
}

.firstPageHowToWinPointsImage {
    height: auto;
    width: auto;
    max-height: unset;
    float: left;
    max-width: 100%;
    margin-top: 0%;
}

.notificationTitleButton {
    width: 43%;
    float: left;
    text-align: center;
    text-transform: lowercase;
    font-size: 14px;
    position:relative;
}

.selectednotificationTitleButton {
    color: #337bed;
    text-decoration: underline;
}

.seeallFavoritesContainer {
    position: absolute;
    bottom: 0;
    height: 50px;
    width: 100%;
    line-height: 40px;
    background: #fff;
    border-top: solid 1px #ddd;
}

.seeallFavoritesButton{

}

.notificationTitleButtonCounter {
    width: 15px;
    height: 15px;
    position: absolute;
    top: 10px;
    right: 20px;
    border-radius: 15px;
    background: #fd4f57;
    line-height: 15px;
    font-size: 9px;
    color: #fff;
    text-align: center;
}

.MobileNavContainerTop {
    height: 100%;
    position: fixed;
    top: 0px;
    width: 100%;
    background: #fff;
    z-index: 3;
    max-height: 100%;
    overflow-y: scroll;
    padding-top: 145px;
}

.mobileNavCloseContainer i {
    font-size: 35px;
    margin-top: 5px;
    -webkit-text-stroke: 5px #254a91;
}

.mobileNavCloseContainer {
    height: 40px;
    width: 40px;
    position: absolute;
    top: 0px;
    left: 5px;
    text-align: center;
    line-height: 40px;
    color: #fff;
}

.MobileNavContainerTopMenuItem {
    height: 50px;
    width: 95%;
    margin-left: 2.5%;
    position: relative;
    border-bottom: solid 1px #eee;
}

    .MobileNavContainerTopMenuItem p {
        height: 100%;
        line-height: 50px;
        padding-left: 3%;
        text-transform: capitalize;
        font-size: 13px;
        color: #303030;
    }

    .MobileNavContainerTopMenuItem i {
        position: absolute;
        right: 10%;
        font-size: 20px;
        top: 15px;
    }

.MobileNavContainerTopContainerTOP {
    overflow-y: scroll;
    overflow-x: hidden!important;
    width: 100%;
    -webkit-overflow-scrolling: touch !important;
}

.MobileNavContainerTopContainerBOTTOM {
    height: 122px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.MobileNavContainerTopMenuItemBOTTOM {
    height: 40px;
    width: 99%;
    margin-left: 0.5%;
    position: relative;
    border-bottom: solid 1px #fff;
    background: #f6f6f6;
}

    .MobileNavContainerTopMenuItemBOTTOM p {
        height: 100%;
        line-height: 40px;
        padding-left: 0%;
        text-transform: capitalize;
        font-size: 13px;
        color: #303030;
        width: 85%;
        float: left;
    }

.MobileNavContainerTopMenuItemBOTTOMiMAGEContainer {
    width: 15%;
    float: left;
    height: 100%;
    text-align: center;
    line-height: 40px;
    font-size: 20px;
}

    .MobileNavContainerTopMenuItemBOTTOMiMAGEContainer i {
        color: #337bed;
    }

.MobileNavContainerTopMenuItemBOTTOMiMAGE {
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    max-height: 18px;
    max-width: 100%;
    margin-top: 11px;
}

.hideMobileMenu {
    overflow: hidden !important;
    max-height: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    -webkit-transition: max-height 0.5s;
    -moz-transition: max-height 0.5s;
    -ms-transition: max-height 0.5s;
    -o-transition: max-height 0.5s;
    transition: max-height 0.5s;
}

#MobileNavContainerTopID{
    -webkit-animation-delay:0s;
    -webkit-animation-duration:0.3s;
}

.onMenuWrap {
    background: #fff;
    border-bottom: solid 1px #fff !important;
    box-shadow: none !important;
}

.onMenuInputSearch {
    border: none !important;
    box-shadow: none !important;
    background: #f6f6f6;
}

.onMenuNavbarContainer {
    box-shadow: none;
}

.onMenuSearchButton {
    background: #337bed !important;
    color: #fff !important;
}

.onMenuSearchButtonIcon {
    -webkit-text-stroke: 2px #337bed !important;
}

.mobileNotificationCount {
    position: absolute;
    height: 16px;
    width: 16px;
    top: 17px;
    text-align: center;
    line-height: 16px;
    border-radius: 50%;
    background: #fd4f57;
    color: #fff;
    right: 15%;
    font-size: 11px;
    border: none;
}

.MobileNavContainerTopMenuItemBackButton {
    height: 50px;
    width: 95%;
    margin-left: 2.5%;
    position: relative;
    border-bottom: solid 1px #eee;
}

    .MobileNavContainerTopMenuItemBackButton p {
        height: 100%;
        line-height: 50px;
        padding-left: 8%;
        text-transform: capitalize;
        font-size: 13px;
        color: #303030;
    }

    .MobileNavContainerTopMenuItemBackButton i {
        position: absolute;
        left: 3%;
        font-size: 20px;
        top: 15px;
    }

#MainMobileMenuID {
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.20s;
}

#MobileMenu1 {
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.20s;
}

#MobileMenu11 {
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.20s;
}

#MobileMenu12 {
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.20s;
}

#MobileMenu2 {
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.20s;
}

#MobileMenu3 {
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.20s;
}

#MobileMenu4 {
    -webkit-animation-delay: 0s;
    -webkit-animation-duration: 0.20s;
}

.newMobileFooterSubscribeContainer {
    width: 100%;
    height: auto;
    min-height: 100px;
    float:left;
}

.newMobileFooterSubscribeTitle {
    color: #333;
    font-weight: bold;
    text-transform: uppercase;
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding-left: 6%;
    letter-spacing: 0.5px;
    font-family: ProxyRegular;
    margin-top: 10px;
    float:left;
}

.newMobileFooterSubscribeSubTitle {
    color: #838383;
    width: 100%;
    padding-left: 6%;
    padding-right: 5%;
    font-size: 14px;
    letter-spacing: 0.5px;
    font-family: ProxyRegular;
    margin-bottom: 5px;
    float:left;
}

.newMobileFooterTextBoxContainer {
    width: 90%;
    margin-left: 5%;
    height: 50px;
    position:relative;
    float:left;
}

.newMobileFooterTextBox {
    height: 40px;
    margin-top: 5px;
    width: 100%;
    padding-left: 3%;
    background: #fff;
    border: solid 1px #ddd;
}

    .newMobileFooterTextBox:focus {
        border: solid 1px #ddd!important;
    }

.newMobileFooterTextBoxButton {
    width: 20%;
    height: 40px;
    position: absolute;
    top: 5px;
    right: 0;
    z-index: 1;
    background: #00aeef;
    text-align: center;
    line-height: 40px;
    border-radius: 0px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    cursor: pointer;
}

.newMobileFooterSubscribeContainerBottom {
    width: 100%;
    height: auto;
    min-height: 140px;
    background: #f9f9f9;
    margin-top: 10px;
    float: left;
}

.newMobileFooterInfoContainer {
    height: auto;
    width: 50%;
    min-height: 50px;
    float: left;
}

.newMobileFooterInfoContainerTitle {
    color: #333;
    width: 100%;
    padding-left: 12%;
    text-transform: uppercase;
    font-size: 14px;
    height: 45px;
    line-height: 50px;
}

.newMobileFooterInfoContainerROW {
    color: #838383;
    width: 100%;
    padding-left: 12%;
    margin-bottom: 5px;
    text-transform: capitalize;
    font-family: ProxyRegular;
    letter-spacing: 0.5px;
    font-size: 12px;
}

.newMobileFooterConnectWithUsContainer {
    width: 100%;
    float: left;
    height: auto;
    min-height: 50px;
    padding-left: 6%;
    padding-right: 5%;
}

.newMobileFooterConnectWithUsTitle {
    color: #333;
    font-weight: bold;
    text-transform: uppercase;
    height: 50px;
    line-height: 50px;
    width: 100%;
    font-family: ProxyRegular;
}

.newMobileFooterConnectWithUsContainer img {
    height: auto;
    width: auto;
    max-height: 35px;
    margin-right: 5px;
}

.newMobileFooterSubscribeCopyRightRow {
    color: #838383;
    font-family: ProxyRegular;
    width: 100%;
    min-height: 50px;
    line-height: 15px;
    padding-left: 5%;
    font-size: 11px;
    text-align: center;
    height: auto;
    padding-right: 5%;
    padding-top: 10px;
    margin-top: 15px;
}

.newMobileFooterSubscribeInfoCopyRightRow {
    color: #838383;
    font-family: ProxyRegular;
    width: 100%;
    min-height: 15px;
    line-height: 12px;
    padding-left: 5%;
    font-size: 11px;
    text-align: center;
    height: auto;
    padding-right: 5%;
    padding-top: 5px;
}

.newMobileFooterSubscribeContainerBottomImagesContainer {
    width: 100%;
    padding-left: 6%;
    padding-right: 5%;
    height: auto;
    min-height: 50px;
    line-height: 50px;
}

    .newMobileFooterSubscribeContainerBottomImagesContainer img {
        height: auto;
        width: auto;
        max-height: 50px;
        max-width: 12%;
        margin-left: 1%;
    }

.NotificationMenuMasterContainer {
    height: auto;
    min-height: 200px;
    max-height: 80%;
    overflow-y: scroll;
}

.NotificationMenuMasterContainerTitleContainer {
    width: 100%;
    height: 50px;
    line-height: 50px;
}

.NotificationMenuMasterContainerTitleContainerHalfTitle {
    float: left;
    width: 50%;
    text-align: center;
    border-bottom: solid 1px #eee;
    position:relative;
}

.NotificationMenuProductsContainer {
    width: 100%;
    height: auto;
    min-height: 200px;
    position: relative;
    overflow-y: scroll;
}

.NotificationMenuProductsButton {
    text-align: center;
    height: 30px;
    line-height: 30px;
    margin-top: 5px;
    margin-bottom: 5px;
    width: 95%;
    margin-left: 2.5%;
    border-radius: 3px;
    background: #254a91;
    color: #fff;
    font-size: 12px;
    position: absolute;
    bottom: 10px;
}

.FavoritesMobileCloseIcon {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 20px;
    right: 5%;
    font-size: 20px;
    line-height: 17px;
    text-align: center;
    background: #fd4f57;
    color: #fff;
}

.FavoritesMobileCloseIcon i{

}

.rewardsTitleSubTitleDesc {
    width: 20%;
    text-align: center;
    font-size: 16px;
    color: #fff;
    margin-left: 40%;
    height: 35px;
    line-height: 35px;
    background: #254a91;
    cursor: pointer;
    border-radius: 3px;
}

.subContainerRowBrands {
    font-family: ProxyRegular !important;
    font-size: 15px !important;
    letter-spacing: 0px;
    font-weight: normal !important;
}

.glide {
    position: relative;
    width: 100%;
    box-sizing: border-box;
}

    .glide * {
        box-sizing: inherit;
    }

.glide__track {
    overflow: hidden;
}

.glide__slides {
    position: relative;
    width: 100%;
    list-style: none;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    touch-action: pan-Y;
    overflow: hidden;
    padding: 0;
    white-space: nowrap;
    display: flex;
    flex-wrap: nowrap;
    will-change: transform;
}

.glide__slides--dragging {
    user-select: none;
}

.glide__slide {
    width: 100%;
    height: 100%;
    flex-shrink: 0;
    white-space: normal;
    user-select: none;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
}

    .glide__slide a {
        user-select: none;
        -webkit-user-drag: none;
        -moz-user-select: none;
        -ms-user-select: none;
    }

.glide__arrows {
    -webkit-touch-callout: none;
    user-select: none;
}

.glide__bullets {
    -webkit-touch-callout: none;
    user-select: none;
}

.glide--rtl {
    direction: rtl;
}


.glide__arrow {
    position: absolute;
    display: block;
    top: 50%;
    z-index: 2;
    color: white;
    text-transform: uppercase;
    padding: 9px 12px;
    background-color: transparent;
    border: 2px solid rgba(255, 255, 255, 0.5);
    border-radius: 4px;
    box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);
    text-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.1);
    opacity: 1;
    cursor: pointer;
    transition: opacity 150ms ease, border 300ms ease-in-out;
    transform: translateY(-50%);
    line-height: 1;
}

    .glide__arrow:focus {
        outline: none;
    }

    .glide__arrow:hover {
        border-color: white;
    }

.glide__arrow--left {
    left: 2em;
}

.glide__arrow--right {
    right: 2em;
}

.glide__arrow--disabled {
    opacity: 0.33;
}

.glide__bullets {
    position: absolute;
    z-index: 2;
    bottom: 2em;
    left: 50%;
    display: inline-flex;
    list-style: none;
    transform: translateX(-50%);
}

.glide__bullet {
    background-color: rgba(255, 255, 255, 0.5);
    width: 9px;
    height: 9px;
    padding: 0;
    border-radius: 50%;
    border: 2px solid transparent;
    transition: all 300ms ease-in-out;
    cursor: pointer;
    line-height: 0;
    box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);
    margin: 0 0.25em;
}

    .glide__bullet:focus {
        outline: none;
    }

    .glide__bullet:hover, .glide__bullet:focus {
        border: 2px solid white;
        background-color: rgba(255, 255, 255, 0.5);
    }

.glide__bullet--active {
    background-color: white;
}

.glide--swipeable {
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

.glide--dragging {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}

.glide__slide {
    display: flex;
    width: 200px;
    height: 400px;
    background: rebeccapurple;
}

    .glide__slide span {
        margin: auto auto;
        color: #fff;
        font-family: sans-serif;
        font-size: 6rem;
        pointer-events: none;
    }

.countDownTopContainer{

}

.countDownTopContainerText{

}

.countDownTopContainerTimer {
    color: #32aa3a;
    font-weight: bold;
    text-transform: capitalize;
}

.errorPageTitle {
    text-align: left;
    font-size: 30px;
}

.errorPageDesc {
    font-size: 18px;
    margin-bottom: 10px;
}

.errorPageSUBTitle {
    font-size: 20px;
    margin-bottom: 10px;
}

.errorReturnHomeButton {
    background: #00aeef;
    color: #fff;
    padding: 8px;
    margin-top: 10px;
    float: left;
    border-radius: 2px;
    font-size: 16px;
}

.errorOtherLinks {
    float: left;
    width: 100%;
    margin-top: 20px;
}

.errorPopularLink {
    float: left;
    color: #00aeef;
    margin-top: 5px;
    width: 100%;
    text-transform: capitalize;
}

.AerrorPopularLink{

}

.ErrorPageWallpaper {
    position: absolute;
    right: 0;
    top:0;
}

#brandContainerBigID{
    -webkit-animation-delay:0s;
    -webkit-animation-duration:0.3s;
}

.wlevel1Color {
    background: #4565a1;
    color: #fff;
    font-size: 14px;
}

.wlevel2Color {
    background: #00aeef;
    color: #fff;
    font-size: 14px;
}

.wlevel3Color {
    background: #337bed;
    color: #fff;
    font-size:14px;
}

#wholesaleLevelBannerID i {
    -webkit-text-stroke: 1.5px #4565a1;
}

.wholesaleBannerTextButton {
    background: #fd4f57;
    padding: 1px;
    padding-left: 5px;
    padding-right: 5px;
    text-transform: uppercase;
    border-radius: 3px;
    cursor: pointer;
    color:#fff;
}

.termsSubTitle {
    width: 60%;
    margin: auto;
    text-align: left;
    margin-top: 40px;
    margin-bottom: 20px;
    font-size: 22px;
}

.seeAllGiftsButton {
    height: 35px;
    width: 150px;
    margin-left: 20%;
    margin-top: 20px;
    line-height: 35px;
    text-align: center;
    background: #00aeef;
    color: #fff;
    border-radius: 3px;
}

.newAdminButton {
    width: 25px;
    height: 55px;
    line-height: 55px;
    font-size: 30px;
    color: #fff;
    position: absolute;
    right: -10%;
    cursor:pointer;
}

    .newAdminButton i {
        -webkit-text-stroke: 3px #232f3e;
    }

    .NavbarPreheader {
        height: 50px;
        width: 100%;
        position: relative;
        z-index: 3;
        background: #fff;
    }

.NavbarPreheaderRightContainer {
    width: 80%;
    height: 100%;
    position: relative;
    float: left;
}

.NavbarPreheaderLeftContainer {
    width: 20%;
    height: 100%;
    position: relative;
    float: left;
}

.NavbarLogoContainer {
    width: 100%;
    height: 100%;
    padding-left: 5px;
}

    .NavbarLogoContainer img {
        height: auto;
        width: auto;
        max-height: 30px;
        margin-top: 5px;
    }

.CartIconContainer {
    float: right;
    height: 100%;
    width: 15%;
    position:relative;
}

.CartIconSubContainer {
    height: 50px;
    width: 30%;
    float: right;
    position: relative;
    cursor: pointer;
}

    .CartIconSubContainer img {
        height: auto;
        width: auto;
        max-height: 25px;
        margin: auto;
        margin-top: 12.5px;
        display: block;
    }

.CartIconContainerTitle {
    width: auto;
    height: 50px;
    float: right;
    line-height: 60px;
    padding-left: 2.5px;
    max-width: 70%;
    cursor: pointer;
    font-weight: bold;
    color: #232f3e;
    font-size: 12px;
}

    .CartIconContainerTitle i {
        font-size: 20px;
        color: #254a91;
        font-weight: bold;
        cursor: pointer;
        position: relative;
    }

    .NEwCartCaounter {
        position: absolute;
        top: 5px;
        right: -5px;
        height: 16px;
        width: 16px;
        text-align: center;
        background: red;
        color: #fff;
        border-radius: 50%;
        line-height: 16px;
        font-size: 9px;
    }

.countryFlagImageNew {
    max-height: 20px !important;
    margin-top: 15px !important;
    border-radius: 1px;
}

.newNavBarRetail {
    height: 55px;
    width: 100%;
    position: relative;
    background: #232f3e;
    z-index: 2;
}

.container-pc-header {
    width: 75%;
    margin: auto;
    max-width: 1200px;
    position:relative;
}

.newNavBarRetailLeftContainer {
    float: left;
    width: auto;
    height: 55px;
    min-width: 50%;
    max-width: 50%;
}

.trackOrdertitleArrow {
    height: 100%;
    top: 0 !important;
    line-height: 55px;
    position: relative;
}

.newNavBarRetailRightContainer {
    float: left;
    width: 50%;
    height: 55px;
}

.newNavBarRetailMenuButton {
    width: auto;
    height: 55px;
    color: #fff;
    cursor: pointer;
    float: left;
    margin-right: 2.5%;
    position: relative;
    min-width: 20%;
    padding-right:15px;
}

    .newNavBarRetailMenuButton p {
        height: 55px;
        line-height: 55px;
        text-transform: uppercase;
        font-weight: bold;
        font-size: 12.5px;
        text-align: center;
        width: auto;
        float: left;
    }

    .newNavBarRetailMenuButton i {
        position: relative;
        top: 19px;
    }

.newNavBarUpAngle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #232f3e transparent;
    position: absolute;
    top: 42px;
    left: 30px;
    transform: rotate(0deg);
    z-index: 3;
}

.StoreWordButton{
    width:20%;
}

.GalleryPageFilterBrandsButton {
    width: 20%;
}

.SpecialOfferButton {
    width: 20%;
}

.TrackOrderTitleButton {
}
.newNavBarRetailLogo{

}

.searchTermClick {
    width: 210%!important;
    margin-left: -105%!important;
}

.higherZ{
    z-index:5!important;
}

.newNavbarLeftLogo {
    position: relative;
    margin-left: -10%;
    height: 55px;
    width: 10%;
    float: left;
}

    .newNavbarLeftLogo img {
        height: auto;
        width: auto;
        max-width: 100%;
        max-height: 40px;
        margin: auto;
        margin-top: 8px;
        display: block;
}

.newNavBarResultsContainer {
    width: 100%;
    height: 420px;
    float: left;
    position: absolute;
    background: #fff;
    top: 55px;
    border: solid 1px #eee;
    box-shadow: 0 .8rem 2.4rem 0 rgba(178,179,183,.4) !important;
}

#newNavBarResultsContainerID{
    -webkit-animation-delay:0s;
    -webkit-animation-duration:0.2s;
}

.navbarResultsTopAngle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #fff transparent;
    position: relative;
    top: 27px;
    left: 4px;
    transform: rotate(0deg);
}

.newNavBarRetailMenuButtonSigns {
    position: relative;
    float: left;
    width: 20%;
    height: 100%;
    text-align: center;
}

.newNavBarResultsContainerLeft {
    width: 18%;
    height: 100%;
    float: left;
    position: relative;
    padding-top: 20px;
    background: #fff;
    border-right: solid 1px #ddd;
}

    .newNavBarResultsContainerLeft::-webkit-scrollbar-track {
        background-color: #f6f6f6;
        width: 0px;
    }

    .newNavBarResultsContainerLeft::-webkit-scrollbar {
        width:0px;
        background-color: #254a91;
    }

    .newNavBarResultsContainerLeft::-webkit-scrollbar-thumb {
        background-color: #254a91;
        border-radius: 20px;
    }

.newNavBarResultsContainerRight {
    width: 64%;
    height: 100%;
    float: left;
    position: relative;
}

.newNavBarResultsContainerLeftButton {
    min-height: 30px;
    line-height: 30px;
    width: 100%;
    text-align: center;
    cursor: pointer;
    position: relative;
    height: auto;
}

.newNavBarResultsContainerLeftButtonSubMenu {
    min-height: 35px;
    line-height: 35px;
    width: 100%;
    text-align: center;
    cursor: pointer;
    position: relative;
    height: auto;
}

    .newNavBarResultsContainerLeftButtonSubMenu p {
        text-align: left;
        padding-left: 15%;
        padding-right: 20%;
        font-size:13px;
    }

    .newNavBarResultsContainerLeftButtonSubMenu i {
        position: absolute;
        top: 8px;
        right: 18px;
        font-size: 20px;
    }

    .newNavBarResultsContainerLeftButtonSubMenu:hover {
        color: #00aeef !important;
    }

    .newNavBarResultsContainerLeftButton:hover {
       
        color: #00aeef !important;
    }

.newNavHover {
    color: #00aeef !important;
}

.newNavBarResultsContainerLeftButton p {
    text-align: left;
    padding-left: 15%;
    padding-right: 20%;
    font-size: 13px;
}

    .newNavBarResultsContainerLeftButton i {
        position: absolute;
        top: 8px;
        right: 18px;
        font-size: 20px;
    }

.newNavBarResultsContainerRightInternal{
    height:100%;width:100%;
    background:#fff;
}

.newNavBarResultsContainerRightInternalImage {
    height: 50%;
    width: 50%;
    float: left;
}

    .newNavBarResultsContainerRightInternalImage img {
        display: block;
        width: auto;
        height: auto;
        max-width: 80%;
        max-height: 80%;
        margin: auto;
        margin-top: 5%;
    }

    .newNavBarResultsContainerRightInternalImage p {
        text-align: center;
        color: #00aeef;
        height: 25px;
        line-height: 25px;
        margin-top: 10px;
    }

.NavbarPreheaderDelimiter {
    float: right;
    height: 100%;
    width: 15%;
    position: relative;
}

.IntroText {
    height: auto;
    width: 100%;
    position: relative;
    min-height: 25px;
    padding-left: 5%;
    margin-top: 10px;
}

    .IntroText p {
        width: auto;
        float: left;
        height: 25px;
        line-height: 25px;
        padding-left: 5px;
    }

    .IntroText img {
        height: 25px !important;
        font-family: unset !important;
        width: auto !important;
        float: left;
        object-fit: unset !important;
    }

.IntroTextTitle {
    font-size: 18px;
    font-weight: bold;
    width: 100%;
    text-align: left;
    padding-left: 5%;
    margin-top: 10%;
}

.InfoTextTitleImage {
    height: auto !important;
    width: auto !important;
    max-width: 100%;
    max-height: 40px;
}