/* Menu general */

.menu ul,
.menu li {
	list-style: none;
	display: inline-block;
}

.menu li a {
	display: inline-block;
}

.menu ul li ul {
	display: none;
}

/* fullwitdh */
.menu.menu-full-width li {
	width: 100%
}

a[title=Shop] {pointer-events: none;}


.main-menu-wrap>ul>li>ul>li.showAll {
    height: 100%;
    display: block;
}

.main-menu-wrap>ul>li>ul>.showAll a{
    font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
    line-height: initial;
	margin: 0;
}

.main-menu.menu.active {
	top: 61px;
    padding-left: 0;
    padding-right: 0;
    height: 100%;
    height: calc(100vh - 61px);
}

.menu>div>ul>li>ul>li.child-menu-items > ul{
	gap:2rem;
}
.menu>div>ul>li>ul>li.child-menu-items > ul li a {
	margin-bottom: 0.3rem;
	display: flex;
	flex-direction: column;
}


@media only screen and (min-width: 48.01em) {
	.main-menu-wrap > ul > .active > a{text-decoration: underline;}
	.menu.main-menu .wrap{margin: 0;}

	.showmore:after{
		font-family: "Font Awesome 5 Pro";
		content: "\f054";
		margin-left: 0.5em;

	}

	.main-menu-wrap>ul{
		display: inline-flex;
		flex-wrap: nowrap;
	}

	.child-ul>li:hover>.menybild-wrap {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		padding: 3rem;
	}

	/* FOOTER menu */
	.menu-menu li a {
		padding: 0 .5em;
		padding: 0 calc(var(--gutter)/2);
	}

	.menu li a {
		padding: 0 .5em; /* fallback */
		padding: 0 calc(var(--gutter)/1.5);
	}

	.footer .menu li a {
		padding: 2px;
	}

	.menu.main-menu li.orphan>a {
		text-decoration: underline;
	}


	.main-menu.menu .Close {
		display: none;
	}

	/* .main-menu .wrap {
		position: relative;
	} */

	.menu ul li ul li {
		width: 100%;
		/* max-height: 200px; */
		overflow: hidden;
	}

	.menu ul li ul li a {
		padding: 0
	}

	/* .menu>div>ul>li>ul {
		position: absolute;
		background: var(--base-background4);
		color:var(--base-color4);
		width: calc(100% - 2em);
		left: 1rem;
		z-index: 7;
		padding: 1rem;
	} */
	.menu>div>ul>li>ul {
		display: grid;
		grid-template-columns: repeat(12,1fr);
		column-gap: 2rem;
		align-items: stretch;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		background: var(--base-background1);
		border-top: 0px;
		margin-top:0px;
		width: 100%;
		padding: var(--gutter);
		padding-left: calc(var(--gutter)*6); /* fallback */
		padding-top: .5em; /* fallback */
		padding-top: calc(var(--gutter)/2);
		max-height: 650px;
		overflow-y: auto;
		overflow-x: hidden;
		z-index: -1;
		/* visibility: hidden; */
		overflow: hidden;
		width: 100%;
		-webkit-transform: translate3d(0,-100%,0);
		-ms-transform: translate3d(0,-100%,0);
		transform: translate3d(0,-100%,0);
		-webkit-transform-style: preserve-3d;
		-ms-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transition: -webkit-transform 300ms ease-in-out;
		-webkit-transition: transform 300ms ease-in-out;
		transition: transform 300ms ease-in-out;
	}

	/* .menu>div>ul>li>ul>li{
		grid-column: 2 / span 2;
	} */
	.menu>div>ul>li>ul>li.showAll{
		grid-column: 1 / span 1;
		padding-top: 1.5rem;
	}
	.menu>div>ul>li>ul>li.child-menu-items{
		grid-column: 1 / span 4;
		padding-top: 1.5rem;
	}
	.menu>div>ul>li>ul.no-children>li.child-menu-items{
		grid-column: 1 / span 12;
	}
	.menu>div>ul>li>ul>li.child-menu-items > ul{
		display: grid;
		grid-template-columns: repeat(2,1fr);
		column-gap: 2rem;
		row-gap: 3rem;
	}
	.menu>div>ul>li>ul.no-children>li.child-menu-items > ul{
		/*grid-template-columns: repeat(4,1fr);*/
		display: flex;	
	}
	.menu>div>ul>li>ul.no-children>li.child-menu-items > ul >li{
		max-width: 370px;
	}
	.menu>div>ul>li>ul>li.child-menu-items > ul ul{
		display:flex;
		flex-direction: column;
	}
	.menu>div>ul>li>ul>li.category-menu-wrapper{
		grid-column: 6 / span 7;
		grid-row: 1 / 1;
	}
	.menu>div>ul>li>ul>li.category-menu-wrapper{
		display: flex;
		flex-wrap: wrap;
		column-gap: calc(var(--gutter) * 2);
	}

	.menu>div>ul>li>ul>li.category-menu-wrapper .category-menu{
		flex: 1;
		max-height: 597px;
	}
	.menu>div>ul>li>ul>li.category-menu-wrapper .category-menu a{
		width: 100%;
		height: 100%;
    	display: flex;
		flex-direction: column;
	}
	.menu>div>ul>li>ul>li.category-menu-wrapper .category-menu span{
		font-size: 0.75rem;
	}
	.menu>div>ul>li>ul>li.category-menu-wrapper .category-menu img{
		width: 100%;
		object-fit: cover;
	}
	.menu>div>ul>li>ul>li.category-menu-wrapper .category-menu-heading{
		font-size: 1rem;
		text-transform: none;
		font-weight: 700;
		margin-block: calc(var(--gutter)/2);
		width: 100%;
		margin-top: 0;
	}


	.main-menu-wrap>ul>li>ul>li {
		flex: 0 1 20%;
		text-align: left;
	}

	.main-menu-wrap>ul>li>ul>li>a {
	margin-top: .5em; /* fallback */
	margin-bottom: .5em; /* fallback */
	margin-top: calc(var(--gutter)/2);
	margin-bottom: calc(var(--gutter)/2);
	}


	.main-menu-wrap>ul>li>ul>li>ul {
		display: block;
		margin-bottom: .5em; /* fallback */
		margin-bottom: calc(var(--gutter)/2);

	}

	.main-menu-wrap>ul>li>ul>li>ul>li {
		font-size: 0.9rem;
	}

	.main-menu-wrap>ul>li>ul>li>a,
	.main-menu-wrap>ul>li>ul>li>ul>li>a {
		font-weight: 400;
	}

	.main-menu-wrap>ul>li.delayHover> a {
		text-decoration: underline;
	}

	.main-menu-wrap>ul>li.delayHover>ul {
		/* display: inline-block;
		column-count: 5; */
		top: 73px;
		align-items: stretch;
		position: absolute;
		left: 0;
		right: 0;
		background: var(--base-background1);
		border-top: 0px;
		margin-top:0px;
		width: 100%;
		padding: var(--gutter) 2rem;
		padding-top: 2rem;
		padding-bottom: calc(var(--gutter)*2);
		box-shadow:var(--box-shadow1);
		overflow-y: auto;
		overflow-x: hidden;
	}
	.main-menu-wrap>ul>li.delayHover>ul {
		visibility: visible;
		transform: translate3d(0px, 0px, 0px);
		-webkit-transform-style: preserve-3d;
		-ms-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transition: -webkit-transform 300ms ease-in-out;
		-webkit-transition: transform 300ms ease-in-out;
		transition: transform 300ms ease-in-out;
	}
	.menu>div>ul>li>ul.has-children>li.child-menu-items > ul > li > a {
		font-size: 1rem;
		font-weight: 500;
	}

		.main-menu-wrap>ul>li.content-page:hover>ul{}

		/* .scroll-sticky .main-menu-wrap>ul>li:hover>ul {
			top: 77px;
		} */

		/* scrollMenu */ 
		.scrollMenu {position: relative;}
		.main-menu-wrap>ul>li.scrollMenu.delayHover>ul {width: 200px;}
		.main-menu-wrap>ul>li.scrollMenu.delayHover>ul li {flex:100%;}
		.main-menu-wrap>ul>li.scrollMenu>ul > li > a {font-weight: normal;}
		.main-menu-wrap>ul>li {height: 100%;}
		.main-menu-wrap>ul>li.active {text-decoration: underline;}

		/* Menu content */
		.content-page.delayHover>ul{display: flex;flex-direction: row;gap: 1em;}
		.main-menu-wrap>ul>li.delayHover>ul{line-height: var(--lineheight500);}
		li.content-page .content-page-item{max-height:400px !important;}
		li.content-page .content-page-item a{display: flex;flex-direction: column;padding: 1em;max-height:400px !important;}
		.content-page .menu-label{font-size: 12px;}
		li.showmore a{font-size:1.5rem;}
		li.showmore {display: flex;align-self: center;align-items: center;justify-content: center;}
		.main-menu-wrap>ul>li.content-page>ul>li>a {font-weight: 400;}


}

@media screen and (min-width: 900px) and (max-width: 1300px) {
	.menu>div>ul>li>ul>li.showAll {grid-column: 1 / span 2;}
	.menu>div>ul>li>ul>li.child-menu-items{grid-column: 3 / span 3;}
}

/*----------------------------------------------------------------------------------*/

@media only screen and (max-width: 48em) {

	.menu-categories-wrapper {
		display: flex;
		flex-direction: column;
		padding: 2rem 0;
	}

	.menu-categories-wrapper .category-menu-heading {
		font-size: 0.8rem;
		padding-inline: 1rem;
		margin: 0;
		font-weight: 400;
		display: none;
	}

	.menu-categories {
		display: flex;
		flex-wrap: nowrap;
		gap: var(--gutter);
		scroll-snap-type: x mandatory;
		overflow: auto;
		padding-left: var(--gutter);
	}
	.menu-categories .category-menu {
		min-width: 25%;
		padding-inline: 0rem;
	}
	.menu-categories .category-menu span {
		font-size: 0.75rem;
	}


	
	.main-menu-wrap>ul>li>ul>.showAll a{
		font-size: 1rem;
	}
	.menu>div>ul>li>ul>li.category-menu-wrapper{
		display: none;
	}
	/*  .main-menu-wrap > ul > li:nth-child(2)  */
	ul > .content-page{
		border-top: 1px solid #000;
		padding-top: 1em;
	} 
	ul > .content-page ~ .content-page{
		border-top: none;
		padding-top: 0;
	}
	/* .main-menu-wrap > ul > li:nth-child(2) {
		padding: 1em 0;
		margin-top: 0.5em;
	} */

	/* .main-menu-wrap > ul > li:nth-child(1) > a,
	.main-menu-wrap > ul > li:nth-child(1) > i
	 {display: none !important;} */

	.menu .wrap {
		height: 100%;
	}

	.mobilenav-icon.stang:after {
		content: "\f00d"
	}

	.main-menu-wrap {
		padding: 0;
		position: relative;
	}

	.main-menu.menu nav {
		position: relative;
	}

	.main-menu.menu ul,
	.main-menu.menu li {
		width: 100%;
	}
	.main-menu.menu ul.socialaMedier, 
	.main-menu.menu .socialaMedier li{
		width: auto;
		display: flex;
		justify-content: center;
	}

	.main-menu.menu ul li {
		font-size: 16px;
		position: relative;
	}

	.main-menu.menu ul li a,
	.main-menu.menu ul li span,
	.main-menu.menu .login.inloggning{
		padding:calc(var(--gutter) / 2) 0;
		display: inline-block;
		width: 100%;
		border-bottom:0;
		font-weight: 400;
		font-size: 13px;
	}
	.main-menu.menu .login{
		font-weight: 400 !important;
	}

	.main-menu.menu .Close{display: none;}
	.main-menu.menu ul li ul {display: none;}
	.main-menu.menu ul li.brand_menu{border-bottom: 1px solid; padding-bottom: var(--gutter);margin-bottom: var(--gutter);}
	.main-menu.menu ul li.content-page:first-of-type{border-top: 1px solid;}
	.main-menu.menu ul:not(.socialaMedier) li i {
		position: absolute;
		right: 0;
		text-align: center;
		padding: 0.35rem 0 0.35rem var(--gutter);
		width: 54px;
		top: 0;
		border-left:0;
		color:var(--base-color1);
		text-align: right;
		width: 100%;
	}
	.main-menu.menu ul:not(.socialaMedier) li i:after {font-family: "Font Awesome 5 Pro";content: "\f105";font-style: normal;}
	.main-menu.menu ul li.active>i:after {content: "\f104";padding-right: 0.3rem;}
	.main-menu.menu ul li.active>i {width: 100%;background-color:transparent;text-align: right;}
	.main-menu.menu ul li.active {background: var(--base-background1);}
	.main-menu.menu ul>li.active>ul,
	.main-menu.menu ul>li.active>ul .child-menu-items ul,
	.main-menu.menu ul>li>ul>li.active>ul {display: flex; flex-direction: column;}
	.main-menu.menu ul>li>ul>li.active>ul {padding-left: var(--gutter);}
	.main-menu.menu ul>li>ul>li.active>ul li a,
	.main-menu.menu ul>li.active > ul li a {font-weight: 400;}
	.content-page:nth-child(1){border-top: 2px solid;}

	li.category-menu-wrapper {
		display: flex;
		order: -1;
	}

	/*Open menu*/
	.main-menu .main-menu-wrap>ul{
		padding-top: 2rem;
        border-top: 1px solid var(--border-gray);
        display: flex;
        flex-direction: column;
		gap: 1rem;
		margin:0 1rem;
		width: calc(100% - 2rem);
	}
	.main-menu .main-menu-wrap>ul:has(li.active){
		border:none;
		padding-top: 1rem;
	}
	.main-menu .main-menu-wrap:has(li.active) .menu-categories-wrapper{
		display: none;
	}
	.main-menu .main-menu-wrap>ul:has(li.active) > li{
		display: none;
	}
	.main-menu .main-menu-wrap>ul:has(li.active) > li.active{
		display: block;
	}
	.main-menu .main-menu-wrap>ul > li > a{
		letter-spacing: .01em;
        font-weight: 500;
		padding: 0 0 1rem 0;
	}
	.main-menu .main-menu-wrap>ul > li.active > a{
		text-align: center;
		border-bottom: 1px solid var(--border-gray);
		margin-bottom:1rem;
	}
	.main-menu .main-menu-wrap>ul > li.active > i {
		right: inherit;
        left: 0;
        width: auto;
        padding: 0.1rem var(--gutter) 0 0;
	}
	.menu>div>ul>li>ul>li.child-menu-items > ul{
		gap:1rem;
	}
	.menu>div>ul>li>ul>li.child-menu-items > ul i{
		display: none;
	}
	.main-menu .main-menu-wrap > .mobile-xs{
		display: none !important;
	}
	.main-menu .main-menu-wrap .menybild-wrap{
		display: none;
	}
}

/* BRANDPAGE */
.ankare_varum {
    display: flex;
    justify-content: space-around;
}

.Varum_Grupperad {
	padding: 2em;
	box-sizing: border-box;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex: 0 1 auto;
	-webkit-box-flex: 0;
	flex: 0 1 auto;
	-ms-flex-direction: row;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	flex-direction: row;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -1rem;
	margin-left: -1rem;
}

.Varum_Grupperad>div {
	box-sizing: border-box;
	-ms-flex: 0 0 auto;
	-webkit-box-flex: 0;
	flex: 0 0 auto;
	padding-right: 1rem;
	padding-left: 1rem;
	display: flex;
	align-items: center;
}

.Varum_Grupperad ul {
	list-style: none;
	display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 0rem 3rem;
}

.Varum_Grupperad h2 {
	font-size: 3rem;
	margin-right: 1em;
}
.Varum_Grupperad>div {
	-ms-flex-preferred-size: 100%;
	flex-basis: 100%;
	max-width: 100%;
}




.inner-scroll{
	display: flex;
    flex-direction: row;
	justify-content: space-around;
	font-size: 1.2rem;
}
.letter-links{cursor: pointer;}
.letter-links.disabled {
    color: #7e7e7e;
    cursor: initial;
}

.brand-letter{font-size: 3rem;}

.brands-inner {
	list-style: none;
	display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 0rem 3rem;
}


.brand-cells{
	flex-direction: column;
}



.border-T {
    border-top: 1px solid #ececec;
}

.padd-lg-B {
    padding-bottom: calc(1.5*15px);
}
.padd-lg-T {
    padding-top: calc(1.5*15px);
}



@media only screen and (max-width: 48em) {
	.inner-scroll {
		position: absolute;
		top: 15px;
		left: 0;
		white-space: nowrap;
		width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		-ms-overflow-style: -ms-autohiding-scrollbar;
		justify-content: start;
	}

	.inner-scroll>*:first-child {
		margin-left: 15px;
	}

	.letter-links {
		width: 34px;
		height: 30px;
		line-height: 34px;
		display: inline-block;
		margin-right: 5px;
	}

	.brand-letter {
		background: #fff;
		padding: 0;
	}
	.brands-inner {
		list-style: none;
		display: grid;
		grid-template-columns: 1fr;
		gap: 0;
		padding: 0;
	}

	.brands-inner li {
		padding: 1em;
		border-bottom: 1px solid;
	}

	.padd-lg-B {
		padding-bottom: 0;
	}
	.padd-lg-T {
		padding-top: 0;
	}

	.brand-cells {
		flex-direction: column;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 1em;
		margin: 1em 0;
	}
	.cell.brand{margin-bottom: 0;}
	.mobile-order1{order: 1;}
	.mobile-order2{order: 2;}

}