/*---------------------
General
---------------------*/
a { font-weight: 600; color: #333; text-decoration: none; }
    a:hover { text-decoration: underline; }

h1, h2, h3 { font-weight: 600; }
h1 { font-size: 48px; margin: 0 0 10px 0; font-weight: bold; }
h2 { font-size: 22px; margin: 25px 0 5px 0; }
h3 { font-size: 18px; margin: 25px 0 5px 0; }
h4 { margin: 25px 0 5px 0; font-weight: bold; line-height: 1.5; }
p { margin: 0 0 10px 0; font-family: "Montserrat", sans-serif; }

::selection { background: #d0e8ff; }
::-moz-selection { background: #d0e8ff; }

img, table { border: 0; }
html { margin: 0; padding: 0; font-size: 16px; }
body { margin: 0; padding: 0; COLOR: #000; font-size: 1rem; font-family: "Oswald", Arial, Sans-serif; line-height: 1.5; background: #fff; }
    body.hide-overflow { overflow: hidden;}
    body.hideOverflow { overflow: hidden; padding-right:16px;}

.beigeLinkBtn { background: var(--beige); color: #000; padding: 10px 25px; border-radius: 100px; font-size: 1rem; font-weight: 400; display: inline-block; text-transform:uppercase; }
    .beigeLinkBtn:hover { opacity: 0.9; text-decoration: none; }

.topmenu .thirdLevel .childNavItem a { font-size: max(16px, 0.6vw); line-height: 1.4; }

.customerService { display: flex; justify-content: flex-start; align-items: center; gap: 10px; height: auto; cursor: pointer; }
.customerService.top { padding: 0 0 0 30px; margin: -0.8em 0 0 40px; position: initial; right: -290px; bottom: 15px; border-left: 1px dashed #ffffff50;}
.siteHeader.fixed .customerService.top { bottom: 7px; right: -250px; margin-top: 0; }
.customerService.bottom { position: fixed; bottom: 40px; right: 40px; background: var(--gray); z-index: 1000; padding: 0.4em 1.4em 0.4em 0.4em; border-radius: 100px; box-shadow: 0px 3px 6px #00000029; }
.customerService img { position: relative; top: 0px; display: block; height: max(43px, 1.6vw); width: auto; }
.customerService p {margin:0; color:#fff;}
.customerService p.phone {font-size: 14px;}
    .customerService p.phone, .customerService .popupHeader p { font-size: max(16px, 0.8vw) !important; }
    .customerService p.open, .customerService .popupBody p { font-size: max(14px, 0.6vw) !important; }
.customerService p.open {font-size: 12px;}
    .customerService p.open span { color: #00de9d; }
    .customerService.top .popupArrow { position: absolute; top: -38px; right: calc(50% - 19px); }
    .customerService.bottom .popupArrow { position: absolute; bottom: -37px; right: calc(50% - 19px); transform:rotate(180deg); }
    .customerService .phonePopup { display:none; position:absolute; z-index:10; background: #F5F4EF; border-radius: 20px; width: 195px; padding: 20px; box-sizing:border-box;  }
    .customerService.top .phonePopup { bottom: -245px; right: 0%; }
    .customerService.bottom .phonePopup { bottom: 60px; right: 0; }
        .customerService .popupHeader { display: flex; justify-content: space-between; align-items: center; }
    .customerService .popupHeader p {color:#000; font-weight:bold; font-size: 19px;}
            .customerService .popupHeader img { position: relative; top: auto; height: max(32px, 1.2vw) !important; }
    .customerService .popupBody { margin: 20px 0 0 0; }
    .customerService .popupBody p {margin: 0; font-size: 14px; color:#000; }
        .customerService .popupBody p span:first-child { font-weight: 600; width: 60px; display: inline-block; }
        .customerService .popupBody .phoneNr {text-align: left; margin: 10px 0 0 0; font-size: 18px !important; display:none;}

.customerService.top, .siteHeader.fixed .customerService.top { bottom: unset; }

    /*---------------------
Body layout
---------------------*/
    #wrapper { margin: 0 auto; }
.inner { width: 95%; margin: 0 auto; }
    .inner.form {width: 600px; max-width: 90%;}

.topBar { background: var(--gray); text-align: center; padding: 0.6em 0; }
.topBar.red {background:red;}
    .topBar p { margin: 0; display: flex; justify-content: center; align-items: center; gap: 15px; color: var(--white); font-size: max(14px, 0.6vw); }
        .topBar p span { display: flex; justify-content: center; align-items: center; gap: 9.5px; border-right: 1px solid #FFFFFF30; padding: 0 15px 0 0; }
            .topBar p span:last-child { border-right: none; padding: 0; }

.siteHeader { background: var(--gray); display: flex; justify-content: center; align-items: center; height: 90px; position: relative; width: 100%; padding: 20px 2.5%; box-sizing: border-box; transition: all 0.6s ease; }
.siteHeader.start {position: absolute; top: 0; width:100%; z-index:4; background:none;}    
.siteHeader.start.banner {top: 50px;}
.siteHeader.small { height: 130px; justify-content: space-between; }
    .siteHeader .headerSubNav { position: absolute; top: 35px; display: flex; gap: 30px; }
        .siteHeader .headerSubNav.left { left: 2.5%; }
        .siteHeader .headerSubNav.right { right: 2.5%; }
        .siteHeader .headerSubNav a,
        .siteHeader .headerSubNav span.link { color: #fff; line-height: 1em; cursor: pointer; position:relative; }
        .siteHeader .headerSubNav span.cartCount {display:inline; position:relative; right: 5px;}
    .siteHeader #responsive-menu-btn { display: none; }

    .siteHeader .continueShoppingLink { font-size: 18px; color: #fff; display: inline-flex; align-items: center; justify-content: flex-start; gap: 5px; margin-right: auto; line-height: 1em; position:absolute;}

    .siteHeader.fixed { height: 68px; position: fixed; top: 0; z-index: 1000; justify-content: center; transition: all 0.6s ease; background:var(--gray); }
    .siteHeader.fixed.start.banner {top: 0;}
    .siteHeader.fixed .logoDiv {}
    .siteHeader.fixed #logo {bottom:0;}
        .siteHeader #logo img { height: 43px; }
        .siteHeader.fixed #logo img { height: 30px; transition: height 0.6s ease; }
    .siteHeader.fixed .headerSubNav.right {}
    .siteHeader.fixed .headerSubNav {top: 20px;}
        .siteHeader.fixed .headerSubNav.left {top: 25px;}
        .siteHeader.fixed .headerSubNav a, .siteHeader.fixed .headerSubNav span { font-size: 0px; align-items: flex-end; }

            .siteHeader.fixed .headerSubNav span #cartCount { font-size: 18px; right:10px; }
    .siteHeader.fixed .headerSubNav.right img { height: 26px; width: auto; }
    .siteHeader.fixed .headerSubNav.left {}
        .siteHeader.fixed .topmenuWrapper {position:initial; order: 2;}
            .siteHeader.fixed .topmenuWrapper .topmenu .topLevel {top: 10px;}

            #logo img { display:block;}
.siteHeader.small .logoDiv { margin: 0 auto; display: flex; align-items: center; justify-content: center; width:250px;}
.siteHeader.small #logo { bottom: 0; margin-right: auto; }
.topmenuWrapper { position: absolute; bottom: 0; display:flex; justify-content:center; align-items:center;}
.topmenu .topLevel { margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; gap: 20px; list-style: none; }
.topmenu .topLevel .navItem {padding: 0 0 50px 0;}
        .topmenu .topLevel .navItem.hasChilds .navItemText .arrowUp { display: none; }
            .topmenu .topLevel .navItem.hasChilds .navItemText:hover {  }
            .topmenu .topLevel .navItem.hasChilds .navItemText:hover a { }
        .topmenu .topLevel .navItem.hasChilds .navItemText:hover .arrowUp { display: block; }
                .topmenu .topLevel .navItem.hasChilds .navItemText:hover .arrowDown { display: none; }
        .topmenu .topLevel .navItem .navItemText { display: flex; justify-content: center; align-items: center; gap: 8px; padding: 0px; }
        .topmenu .topLevel .navItem a { color: #FFF; line-height: 1em; text-transform:uppercase; font-weight:400; font-size: 0.875rem; }
    .topmenu .topLevel .navItem .expand { display: inline-flex; align-items: center; }
        .topmenu .topLevel .navItem.on a { }
        .topmenu .topLevel .navItem a:hover { text-decoration: none; }
        .topmenu .topLevel .navItem a.haschild { display: none; }

.siteHeader.small > *:nth-child(3) { display: none; /* Dölj eventuell extra innehåll på höger sida */ }

.topmenu .secondLevel { display: none; margin: 0 0 15px 0; width: 100vw; position: fixed; top: 70px; left: 0; z-index: 4; background: #f5f4ef; box-shadow: 0px 15px 10px 0px #00000010; padding: 20px 50px; list-style: none; }
.siteHeader.banner .topmenu .secondLevel {top: 110px;}
.siteHeader.fixed .topmenu .secondLevel {top: 68px !important;}
.topmenu .secondLevel .inner { display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; max-width: none; width: auto; margin: 0; gap: 15px;}
    .topmenu .topLevel .navItem:hover .secondLevel { display: flex; }
    .topmenu .secondLevel .childNavItem { min-width: 20%; display: block; margin: 0 0 15px 0; }
    .topmenu .secondLevel .childNavItem a { color: #000; font-size: 0.875rem; font-weight: 600; }

    .topmenu .thirdLevel {padding:0; margin: 0; list-style:none; margin: 10px 0 0 0; display:block;}
        .topmenu .thirdLevel .childNavItem { width: 100%; display:block; margin: 0 0 5px 0; font-size: 0.875rem; }
            .topmenu .thirdLevel .childNavItem a { color: #000; font-weight: 400; padding: 0 0 3px 0; }
                .topmenu .secondLevel .childNavItem a:hover,
                .topmenu .thirdLevel .childNavItem a:hover { text-decoration: underline; }

        .topmenu .secondLevel a:hover, .topmenu .thirdLevel a:hover { text-decoration: underline; }

.topmenuWrapper .searchIcon { margin: 0 0 0 20px; position: relative; top: -0.1em; cursor: pointer; }
.siteHeader.fixed .topmenuWrapper {position:relative;}
    .siteHeader.fixed .topmenuWrapper .searchIcon { top: 0.1em; }

.header #nav ul#responsive { display: none; }

/*---------------------
Page layout
---------------------*/
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html .clearfix { height: 1%; }

.content { position:relative;}
    .content .inner { min-height: 450px; padding: 40px 0; }
.contentcenter { width: 100%; margin: 0; padding: 0; }
#siteFilter { position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: #00000040; z-index: 3; height: 10000%; width: 100%; display: none; cursor: pointer; }
#contentFilter {position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: #00000040; z-index: 3; height: 100%; width:100%; display: none; }
/*---------------------
Submenu vertical
---------------------*/
.leftmenu { float: left; width: 25%; }
    .leftmenu ul { width: 90%; margin: 0; padding: 0 0 10px 0; list-style: none; overflow: hidden; }
        .leftmenu ul li { width: 100%; margin: 0; padding: 0; border-bottom: 1px dotted #999; }
            .leftmenu ul li:last-child { background: none; border: 0; }
            .leftmenu ul li a { width: 100%; margin: 0; padding: 0; font: normal 12px/40px Arial; color: #555; text-decoration: none; display: block; }
                .leftmenu ul li a:hover { color: #333; }
            .leftmenu ul li.on a { color: #333; font-weight: bold; }
            .leftmenu ul li.on-childs { background: none; border: 0; }
                .leftmenu ul li.on-childs a { color: #555; font-weight: bold; line-height: 30px; }

                .leftmenu ul li.on-childs ul { margin: 0 0 0 15px !important; }
                    .leftmenu ul li.on-childs ul li { background: none; border: 0; }
                        .leftmenu ul li.on-childs ul li a { font-weight: normal !important; line-height: 24px !important; font-size: 11px; color: #555; }
                            .leftmenu ul li.on-childs ul li a:hover { color: #333; }
                        .leftmenu ul li.on-childs ul li.on a { color: #333; font-weight: bold !important; }

/*---------------------
Submenu horizontal
---------------------*/
.fullmenu { background-color: #cccccc; }
    .fullmenu ul { width: auto; text-align: center; margin: 0; padding: 0; list-style: none; overflow: hidden; }
        .fullmenu ul li { display: inline-block; margin: 0 10px; padding: 0; }
            .fullmenu ul li:last-child { background: none; border: 0; }
            .fullmenu ul li a { margin: 0; padding: 5px 10px; font: normal 12px/40px Arial; color: #555; text-decoration: none; display: block; }
                .fullmenu ul li a:hover { color: #333; }
            .fullmenu ul li.on a, .fullmenu ul li.on-childs a { color: #333; font-weight: bold; }

/*---------------------
Footer layout
---------------------*/
.siteFooter { background: var(--beige); padding: 40px 0 77px 0; margin: 130px 0 0 0; position:relative; overflow:hidden; }
    .siteFooter .inner { width: 90%; margin: auto; display: flex; justify-content: space-between; align-items: flex-start; z-index:2; position:relative; }
    .siteFooter .footerColumn { width: 13.2%; }
        .siteFooter .footerColumn:first-child { width: 25%; }
        .siteFooter .footerColumn h3 { color: #000; font-weight: 400; margin: 0 0 15px 0; line-height: 1em; }
        .siteFooter .footerColumn h4 { color: #000; margin: 0 0 15px 0; font-size: 1.125rem; font-weight:400; text-transform:uppercase; }
        .siteFooter .footerColumn:last-child h4 {}
        .siteFooter .footerColumn p { color: #000; margin: 0 0 20px 0; font-size: 0.875rem; }
        .siteFooter .footerColumn:first-child p a { font-size: 1rem; background: none; border: 1px solid #000;  border-radius: 100px; padding: 10px 25px; display: inline-block; color: #000; font-weight:400; }
        .siteFooter .footerColumn p a { font-weight: 400; }
            .siteFooter .footerColumn:first-child p a::after { background: url(/gfx/arrow-right-short.svg) no-repeat; content: ""; width: 14px; height: 12px; display: inline-block; }

        .siteFooter .footerColumn.socialMedia a { color: #000; font-size: 28px; background: none; border: 1px solid #000; border-radius: 100px; width: 50px; height: 50px; margin: 0 7px 0 0; box-sizing: border-box; display: inline-flex; justify-content: center; align-items: center; }
            .siteFooter .footerColumn.socialMedia a:hover { text-decoration: none; background:#000; color: var(--beige); }

            .siteFooter .gfx {position:absolute; pointer-events:none; z-index:1;}
                .siteFooter .gfx.left { left: -258px; bottom: -734px; }
                .siteFooter .gfx.right { right: -151px; bottom: -1024px; }

#prodLink { font-size: 0.75rem; font-weight: 100; font-family: "Montserrat", sans-serif; margin: 50px 0 0; }

div#footerLogo { display: flex; justify-content: center; align-items: flex-end; flex-direction: column; margin: 175px auto 0; width: 95%; }

@media screen and (max-width: 1510px) {
    .inner.small { width: 90%; }

}
@media screen and (max-width: 1250px) {
    .customerService.top { display:none;}
}

    @media screen and (max-width: 1000px) {
        .siteHeader { height: 75px; padding: 20px 13px; justify-content: space-between; flex-direction: row; }
            .siteHeader.start.banner {top: 18px;}
            .siteHeader .headerSubNav.left { display: none; }
            .siteHeader .topmenuWrapper { display: none; }
            .siteHeader .logoDiv { display: flex; justify-content: flex-start; align-items: center; gap: 12px; order: 1;}
            .siteHeader .headerSubNav { order: 2; }
        #logo { bottom: 0; height: 33px; }
            #logo img { height: 100%; }
        .siteHeader.small {height:70px; flex-direction:row;}
        .siteHeader.small .logoDiv {width:136px;}
        .siteHeader #responsive-menu-btn { display: block; height: 20px; padding: 0; z-index: 2; color: #fff; font-size: 20px; line-height: 20px; text-decoration: none; cursor: pointer; }
            .siteHeader.small #responsive-menu-btn {display:none;}
            .siteHeader.small #logo { margin:auto;}
            .siteHeader .headerSubNav { position: relative; top: 0; }
            .siteHeader .headerSubNav.right { right: 0; }
            .siteHeader .headerSubNav .searchIcon { display: flex; position: relative; top: 0px; }
        .siteFooter { margin: 90px 0 0 0; padding: 40px 0 25px 0; }
            .siteFooter .inner { flex-wrap: wrap; flex-direction: column; gap: 20px; }
            .siteFooter .footerColumn:first-child,
            .siteFooter .footerColumn { width: 100%; }
                .siteFooter .footerColumn p:last-child { margin: 0; }
            .siteFooter .footerLogo { margin: 50px auto 0; justify-content: flex-start; align-items: flex-start; width: 90%; }
    }
@media screen and (max-width: 1000px) {
    html { font-size: 14px !important; }
    .siteHeader.fixed{justify-content:space-between;}
        .siteHeader.fixed .headerSubNav{top:initial;}
}

    @media screen and (max-width: 860px) {
        h1 { font-size: 24px; }
        h2 { font-size: 18px; }
        h3 { font-size: 14px; }

        .topBar { overflow-x: scroll; }
            .topBar p { width: 840px; justify-content: flex-start; padding: 0 10px; box-sizing: border-box; }

        .content { width: auto; height: auto; min-height: 100px; margin: 0; padding: 0; }
            .content .inner { min-height: 100px; padding-bottom: 2%; }
        .submenu { display: none; }

        .content .inner { width: auto; height: auto; margin: 0; padding: 25px 5%; }
        .contentright { float: none; width: 100%; }

        #footer { width: auto; margin: 0; padding: 2% 0 0 0; clear: left; position: relative; font-size: 11px; line-height: 16px; }
            #footer .links { display: none; }

        table.responsive-table,
        table.responsive-table thead,
        table.responsive-table tbody,
        table.responsive-table th,
        table.responsive-table td,
        table.responsive-table tr { display: block; border: 0; }
            table.responsive-table thead tr { position: absolute; top: -9999px; left: -9999px; }
            table.responsive-table tr { border: 1px solid #ccc; }
            table.responsive-table td { padding: 4px 6px; }
            table.responsive-table td { border: none; border-bottom: 1px solid #ddd; position: relative; padding-left: 50%; white-space: normal; text-align: left !important; }
                table.responsive-table td:before { position: absolute; top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; text-align: left; font-weight: bold; }
                table.responsive-table td:before { content: attr(data-title); }
    }


    @media screen and (max-width: 600px) {
        .siteHeader .headerSubNav a, .siteHeader .headerSubNav span { display: flex; align-items: center; }
            .siteHeader .headerSubNav a img, .siteHeader .headerSubNav span img { margin-right: 0; }
        .siteHeader .headerSubNav a, .siteHeader .headerSubNav span { font-size: 0; }
            .siteHeader .headerSubNav a img, .siteHeader .headerSubNav span img { font-size: initial; }
        .siteHeader .headerSubNav img { height: 20px; width: auto; }
        .siteHeader .headerSubNav { gap: 20px; }
        .customerService.bottom { bottom: 20px; right: 20px; padding: 0 !important; width: 55px; height: 55px; display: flex; justify-content: center; align-items: center; }
            .customerService.bottom div:nth-child(1) img { position: relative; left: -6px; }
        .customerService .popupBody .phoneNr { display: block; }
        .customerService > div:nth-child(2) { display: none; }
        .customerService.bottom .popupArrow { right: 10px; bottom: -34px; }
    }

    @media screen and (max-width: 480px) {
        .siteHeader.small { justify-content: flex-end; }
        .siteHeader .continueShoppingLink { left: 10px; font-size: 14px; }
        .siteHeader .headerSubNav { gap: 20px; }
        .siteFooter { margin: 45px 0 0 0; }
    }

    @media screen and (max-width: 420px) {
        .siteHeader .headerSubNav { gap: 15px; }
    }