@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjx4wWw.ttf) format('truetype');
}

                        :root {
                            --color: var(--dark-color);
                            --primary-background-color: var(--primary-color) !important;
                            --secondary-background-color: var(--secondary-color);
                            --primary-button-color: var(--on-primary-color) !important;
                            --secondary-button-color: var(--on-secondary-color) !important;
                            --primary-border-color: 	var(--on-primary-color);
                            --primary-border-radius:25px !important;
                            --height-navigation: calc(80px + 40px + 0px);
                            --primary-navigation-color: var(--dark-color) ;

                            --background-color: #ffffffff;
                            --surface-color: #ffffff00;
                            --primary-color: #ec681cff;
                            --primary-variant-color: #ec681cff;
                            --secondary-color: #22c55eff;
                            --secondary-variant-color: #22c55eff;
                            --tertiary-color: #c10000ff;
                            --tertiary-variant-color: #c10000ff;
                            --dark-color: #000000ff;
                            --dark-gray-color: #333333ff;
                            --gray-color: #ccccccff;
                            --light-gray-color: #fafafaff;
                            --light-color: #ffffffff;
                            --approve-color: #274af1ff;
                            --succeed-color: #2ecc71;
                            --error-color: #d93025ff;
                            --warning-color: #f28f1d;
                            --link-color: #000000ff;
                            --link-hover-color: #ec681cff;

                            --on-background-color: var(--dark-color);
                            --on-surface-color:  var(--dark-color);
                            --on-primary-color: var(--light-color);
                            --on-secondary-color: var(--light-color);
                            --on-tertiary-color:  var(--light-color);
                            --on-dark-color:  var(--light-color);
                            --on-dark-gray-color: var(--light-color);
                            --on-gray-color: var(--dark-color);
                            --on-light-gray-color: var(--dark-color);
                            --on-light-color:  var(--dark-color);
                            --on-link-color: var(--light-color);
                            --on-approve-color: var(--light-color);
                            --on-error-color: var(--light-color);

                            --inner-content:1200px;
                            --input-border-width: 1px;

                            --custom-font: Lato;
                        }
                        @media (hover: hover) {
                            .PrimaryWrapper .navButton:hover > a, .PrimaryWrapper .navButton:hover > .subButton svg, .PrimaryWrapper .navButton:hover > a.active{
                                color: var(--primary-color);
                            }
                            .SecondaryWrapper .navButton:hover > a, .SecondaryWrapper .navButton:hover > .subButton svg, .SecondaryWrapper .navButton:hover > a.active  {
                                color: var(--primary-color) !important;
                                fill: var(--primary-color) !important;
                            }
                            .TertiaryWrapper .navButton:hover > a, .TertiaryWrapper .navButton:hover > .subButton svg, .TertiaryWrapper .navButton:hover > a.active  {
                                color: var(--primary-color) !important;
                                fill: var(--primary-color) !important;
                            }
                            a.item.child:hover::before {
                                width: 100%;
                                content:"";
                                position: absolute;
                                top: calc(100% - 3px);
                                border-bottom: inset 3px var(--dark-color);
                            }
                        }
                        html {
                            /*background-color: var(--dark-color);*/
                        }
                        body {
                            font-family: Lato !important;
                            font-size: 13pt !important;
                            color: var(--dark-color);
                            background-color: var(--background-color);
                        }
                        main, footer {
                            letter-spacing: 0px;
                        }
                        .polygon polygon {
                            fill: var(--background-color) !important;
                        }
                        textarea {
                            font-family: Lato !important;
                        }
                        h1,h2,h3,h4,h5,h6, .text-huge, big {
                            color: var(--dark-color);
                            letter-spacing: 0px;
                        }
                        h1 {
                            
                            
                        }
                        h2 {
                            
                            
                        }
                        h3 {
                            
                            
                        }
                        .inner-content a, #cartContainer a {
                            color: #000000ff;
                        }
                        .inner-content a:hover, #cartContainer a:hover {
                            color: #ec681cff;
                        }
                        hr {
                            color: var(--light-gray-color);
                            border-width: 1px;
                            border-radius: 0px;
                        }
                        input, input::placeholder, textarea::placeholder, select {
                            color: var(--dark-color);
                            opacity: 1;
                        }
                        input:-ms-input-placeholder, textarea:-ms-input-placeholder {
                            color: var(--dark-color);
                        }
                        input::-ms-input-placeholder, textarea::-ms-input-placeholder {
                            color: var(--dark-color);
                        }
                        input[type=submit], input[type=button], button, .pageTags a, a.stdButton, a.stdButton svg, .sliderButtons, ::selection, .ui-widget-header, .toggleFilters, .toggleFilters a, .toggleFilterContainers, .toggleFilterContainers svg, .toggleFilterContainers a, .paginationButton.Active, .paginationButton.Active a, .ProductSale, .submitDiscountCode {
                            background: var(--primary-color);
                            color: var(--on-primary-color) !important;
                            fill: var(--on-primary-color) !important;
                            border-radius: 25px !important;
                            border-width: 0px !important;
                            border-color: 	var(--on-primary-color);
                        }
                        .paginationWrapper div a {
                            border-radius: 25px !important;
                        }
                        a.secondairButton {
                            background: var(--secondary-color);
                            color: var(--on-secondary-color) !important;
                            fill: var(--on-secondary-color) !important;
                            border-radius: 25px !important;
                            border-width: 0px;
                            border-color: var(--on-secondary-color);
                        }
                        .dropdownListHead::before {
                            color: var(--primary-color) !important;
                        }
                        .whiteModernPrimairButton:hover, .blackModernPrimairButton:hover, .dropdownListOpen .dropdownListHead::before, .primaryColors  {
                            background: var(--primary-color) !important;
                            color: var(--on-primary-color) !important;
                            box-shadow: 0px 15px 20px rgba(170,170,204,.2);
                        }
                        .whiteModernSecondairButton:hover, .blackModernSecondairButton:hover {
                            background: var(--secondary-color) !important;
                            color: var(--on-primary-color) !important;
                            box-shadow: 0px 15px 20px rgba(174,205,172,.2);
                        }
                        .filterHead, .filterHead a {
                            background: var(--primary-color);
                            color: var(--on-primary-color) !important;
                            fill: var(--on-primary-color) !important;
                        }
                        #compassSVG {
                            fill: var(--primary-color);
                        }
                        .shareContainerIcons {
                            fill: var(--dark-color) !important;
                        }
                        .bgcolor .social-media svg {
                            fill: var(--dark-color) !important;
                        }
                        header input::placeholder {
                            color: var(--dark-color) !important;
                        }
                        header .social-media svg {
                            fill: var(--dark-color) !important;
                        }
                        #headerBar .social-media svg {
                            fill: var(--light-color) !important;
                        }
                        footer .social-media svg {
                            fill: var(--dark-color) !important;
                        }
                        input[type=submit]:hover, input[type=button]:hover, button:hover, .pageTags a:hover, a.stdButton:hover, .webButton:hover {
                            background: rgba(170,170,204,.9);
                            color: var(--on-primary-color);
                        }
                        input[type=submit]:active, input[type=button]:active, button:active, .pageTags a:active, a.stdButton:active, .webButton:active {
                            background: rgba(170,170,204,.6);
                            transition: .0s !important;
                        }
                        .webButton.secuodairButton:hover {
                            background: rgba(174,205,172,.9);
                        }
                        .webButton.secondairButton:active {
                            background: rgba(174,205,172,.6);
                            transition: .0s !important;
                        }
                        .PrimaryWrapper .navButton, .PrimaryWrapper, .mobileWrapper, header .PrimaryWrapper .navButton a.item {
                            min-height: 80px;
                        }
                        #logoContainer img, #logoContainer svg {
                            max-height: 80px;
                        }
                        #logoContainer svg {
                            height: 100%;
                        }
                        .SecondaryWrapper, .SecondaryWrapper .navButton {
                            min-height: 40px;
                        }
                        .TertiaryWrapper, .TertiaryWrapper .navButton {
                            min-height: 0px;
                        }
                        .PrimaryWrapper .navButton {
                            font-size: 14px !important;
                            max-height: 80px;
                        }
                        .TertiaryWrapper .navButton {
                            font-size: 14px !important;
                            max-height: 0px;
                        }
                        #headerBar {
                            height: calc(25px + 10px);
                            background-color: var(--dark-color);
                            color: var(--light-color);
                            border-bottom-style: solid;
                            border-bottom-width: 0px;
                            border-color: var(--light-gray-color);
                        }
                        #headerBar a, #headerBar #searchContainer input, #headerBar #searchContainer input::placeholder {
                            color: var(--light-color);
                        }
                        #headerBar #searchContainer svg {
                            fill: var(--light-color);
                        }
                        #headerBar #searchContainer input {
                            border-bottom-color: var(--light-color);
                        }
                        #spinner {
                            border-top-color: var(--primary-color) !important;
                        }
                        .scrollBackground, header.scrollBackground, .staticBackgroundColor, header.staticBackgroundColor , .PrimaryWrapper .subBground, #logoContainer::before, #logoContainer::after, #navigation::after, .scrollBackground.secundairNav, .staticBackgroundColor.secundairNav, .secundairNav .navButtonWrapper::before {
                            background-color: var(--light-color) !important;
                            border-bottom-style: solid;
                            border-bottom-width: 0px;
                            border-color: 	var(--light-gray-color);
                        }
                        .SecondaryWrapper, .SecondaryWrapper .subBground {
                            background-color: var(--light-color) !important;
                        }
                        .TertiaryWrapper, .TertiaryWrapper .subBground {
                            background-color: var(--light-color) !important;
                        }
                        #navigationBground.staticBackgroundColor {
                            border-bottom-style: solid;
                            border-bottom-width: 0px;
                            border-color: 	var(--light-gray-color);
                        }
                        /*.PrimaryWrapper .subBground::before {
                            border-bottom-color: var(--light-color) !important;
                        }*/
                        .PrimaryWrapper a, .PrimaryWrapper svg, .MobileWrapper svg, .cartContainer svg, .PrimaryWrapper input, .PrimaryWrapper #searchContainer input::placeholder {
                            color: var(--dark-color);
                            fill: var(--dark-color);
                        }
                        #hamburgerFlatNav span {
                            background-color: var(--dark-color) ;
                        }
                        .PrimaryWrapper .navButton a {
                            letter-spacing: 0px;
                        }
                        .SecondaryWrapper .navButton a, .SecondaryWrapper .subBground {
                            letter-spacing: 0px;
                            color: var(--dark-color);
                        }
                        .TertiaryWrapper .navButton a, .TertiaryWrapper .subBground {
                            letter-spacing: 0px;
                            color: var(--dark-color);
                        }
                        .Sub .closeSub svg {
                            fill: var(--dark-color);
                        }
                        header .PrimaryWrapper .navButton a {
                            padding-left:10px;
                            padding-right:10px;
                        }
                        #socialContainer {
                            padding-left:10px;
                        }
                        header .SecondaryWrapper .navButton {
                            padding-left:10px;
                            padding-right:10px;
                        }
                        header .TertiaryWrapper .navButton {
                            padding-left:10px;
                            padding-right:10px;
                        }
                        .navButton a {
                            
                        }
                        .navButton a.active {
                            color: var(--primary-color) !important;
                            
                        }
                        .SecondaryWrapper .navButton a.active {
                            color: var(--primary-color) !important;
                        }
                        .SecondaryWrapper #headerInnerContainer {
                            border-top-width: 0px !important;
                        }
                        .SecondaryWrapper #headerInnerContainer {
                            border-top-color: var(--light-gray-color) !important;
                        }
                        .TertiaryWrapper .navButton a.active {
                            color: var(--primary-color) !important;
                        }
                        .TertiaryWrapper #headerInnerContainer {
                            border-top-width: 0px !important;
                        }
                        .TertiaryWrapper #headerInnerContainer {
                            border-top-color: var(--light-gray-color) !important;
                        }
                        .quantityNotification {
                            background-color: var(--primary-color) !important;
                            color: var(--light-color) !important;
                        }
                        #headerInnerBar, .inner-content, .SecondaryWrapper #headerInnerContainer, .PrimaryWrapper #headerInnerContainer {
                            max-width: 1200px;
                        }
                        .subBground {
                            margin: 0 calc((-100vw + 1200px) / 2);
                            padding: 0 calc((100vw - 1200px) / 2);
                        }
                        .Sub {
                            max-width: 1200px;
                            background-color: var(--light-color);
                        }
                        #footer {
                            background-color: var(--light-gray-color);
                        }
                        #footer, #footer td, #footer strong, #footer b, #footer i {
                            color: var(--dark-color);
                        }
                        #footer #searchContainer input, #footer #searchContainer input::placeholder {
                            color: var(--dark-color);
                        }
                        #footer #searchContainer input {
                            border-bottom-color: var(--dark-color);
                        }
                        #footer #searchContainer svg {
                            fill: var(--dark-color);
                        }
                        #footer a {
                            color: var(--dark-color);
                        }
                        #footer, #footer a, #footer td, #footer p {
                            font-size: 13pt !important;
                        }
                        #footer hr {
                            color: var(--dark-color);
                        }
                        #footer a:hover {
                                color: var(--primary-color);
                            }#overlay, .bgcolor, .openCart {
                            background-color: var(--background-color);
                        }
                        #spinner {
                            border-top-color: var(--dark-color);
                        }
                        .ProductContainer, .CategoryContainer, .catalogItem {
                            background-color: var(--light-color);}
                        .ProductContainer img, .CategoryContainer img {}
                        .catalogSelector a, .filterSubWrapper a.closeFilter {
                            color: var(--dark-color) !important;
                        }
                        p.categoryName, p.productName, .span.menuTitle {
                            color: var(--dark-color);
                        }
                        .productDescription p {
                            color: var(--dark-color);
                        }
                        .productPrice p, span.productFilterPrice {
                            color: var(--dark-color);
                        }
                        a.stdButton.orderButton {
                            color: var(--on-primary-color);
                            fill: var(--on-primary-color);
                        }
                        #poweredBy {
                            background-color: var(--light-color) !important;
                            border-color: var(--light-color) !important;
                        }
                        #poweredBy a, #poweredBy p {
                            color: var(--dark-color) !important;
                        }
                        @media screen and (max-width: 1200px) {
                            .subBground {
                                width: 100vw;
                                margin: unset !important;
                            }
                        }
                        input[type=button], input[type="password" i], input[type=time], input[type=text], input[type=search], input[type=email], input[type=number], input[type=tel], input[type=mail], input[type=date], select, textarea {
                            border-color: var(--on-primary-color);
                            border-width: var(--input-border-width);
                            border-radius: 0px;
                            background: var(--light-color);
                        }
                        @media screen and (max-width : 810px) {
                            body {
                                --height-navigation: 80px;
                            }
                            h1,h2,h3,h4,h5,h6, .text-huge, big {
                                
                            }
                            #navigationBground.staticBackgroundColor, .staticBackgroundColor #headerInnerContainer {
                                border-bottom-style: unset;
                                border-bottom-width: unset;
                                border-color: unset;
                            }
                            #navigation {
                                background-color: var(--light-color) !important;
                                padding-top: calc(80px + 25px);
                            }
                            #searchBackground, header, .MobileWrapper, .openMobileNavigation .primaryWrapper {
                                background-color: var(--light-color) !important;
                            }
                            #navigation::after {
                                height: 80px;
                            }
                            .scrollBackground #navigation::after {
                                height: 80px;
                            }
                            .scrollBackground #navigation {
                                padding-top: 80px;
                            }
                            .catalogFilter {
                                background-color: var(--background-color);
                            }
                            #socialContainer {
                                padding-right:10px;
                            }
                            .PrimaryWrapper .navButton {
                                min-height: unset;
                            }
                            header {
                                height: 80px ;
                            }
                            <!--.coverImage {
                                margin-top: -80px !important;
                            }-->
                            #logoContainer img, #logoContainer svg {
                                max-height: 80px !important;
                            }
                            header .PrimaryWrapper .navButton {
                                border-width: 1px !important;
                            }
                            header .SecondairyWrapper .navButton {
                                border-width: 0px !important;
                            }
                            .openCatalogFilter {
                                transform: translateY(80px) !important;
                            }
                        }
                        @media screen and (max-width : 600px) {
                            h1,h2,h3,h4,h5,h6, .text-huge, big {
                                
                            }
                        }