/*RESETS*/
*{
    box-sizing: border-box;
    margin: 0}

main img,main video,main iframe{
    display: block;
    width: 100%;
    object-fit: cover}

[hidden]{display: none}
html,body{height: 100%}

html{
    -webkit-text-size-adjust:none;
    text-size-adjust:none}

@media(prefers-reduced-motion:no-preference){html{scroll-behavior: smooth}}

body{
    font-family:roboto,system-ui;
    font-size: 100%;
    line-height: 1.4;
    background-color:#fdfcfb}

/*HELPERS*/
:root{
    --lang-picker:40px;
    --nav-bar:72px;
    --sub-nav:60px;
/*LANG PICKER AND MAIN NAV*/
    --nav-2:calc(var(--lang-picker) + var(--nav-bar));
/*LANG PICKER, MAIN NAV, SUB NAV*/
    --nav-3:calc(var(--lang-picker) + var(--nav-bar) + var(--sub-nav))
} 

@media(max-width:767px){
    :root{
        --sub-nav:42px;
        --nav-bar:50px;
    }
}

.trp-language-wrap,#gblCart,#header,.sub-nav{-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale}

.footer-widgets{z-index: 999}

/*HIDES SUBNAV ON PAGES NOT TAGGED OCC, OHOP, WMM*/
.sub-nav{display: none}

.visually-hidden {
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.pseudo{position: relative}
.pseudo::before,
.pseudo::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
}