/* Toppmeny */
#topmenu{
	position:relative;
	display:block;
	z-index:1000;
	width:100%;
	max-width:100%;
	height:60px;
	font-family: 'Raleway', serif;
	font-weight: 400;
	text-align:center;
	background-color:#fdf2f0;
	transition: background-color 0.5s ease 0s;
}

/* Används om menyn ska ligga kvar i toppen - sticky (styrs även av js på rad 172 funktion: ellibot_topmenu_scrolling) */
/*
#topmenu.fixed{position:fixed; top:0;}
#wpadminbar{position:fixed !important; top:0;}
*/

#frontpage #topmenu{
	background-color:#fff;
}
#topmenu ul{
	list-style-type:none;
	margin:0;
	padding:0;
	width:100%;
	margin:auto;
	font-size:0; /* Tar bort margin mellan li */
}
#topmenu ul li{
	display:inline-block;
	margin:0;
	padding:0;
	font-size:16px;
}
#topmenu ul li a{
	display:block;
	margin:0;
	padding:17px 20px;
	text-decoration:none;
	color:#863127;
	background-color:transparent;
	transition: background-color 0.5s ease 0s;
	font-weight:600;
	border:none;
}
#topmenu ul li a:link, #topmenu ul li a:visited, #topmenu ul li a:active{
	text-decoration:none;
}
#topmenu ul li a:hover, #topmenu ul li a:focus{
	background-color:#f7e0dc;
}

#topmenu ul li.page_item_has_children{
	position:relative;
}
#topmenu ul li.page_item_has_children ul.children li{
	display:block;
}

#topmenu button{
	cursor:pointer;
}

/* Markerar vald länk i huvudmeny (stor skärm) */
#topmenu.topmenu-closed ul li.current_page_item a, #topmenu.topmenu-closed ul li.current_page_ancestor a{
	background-color:#fff;
}

/* Döljer under-menyer (stor skärm) */
#topmenu.topmenu-closed ul.children, #topmenu.topmenu-closed .topmenuOpener{
	display:none !important;
}

/* Döljer ned-pil på länkar i huvudmenyn (stor skärm) */
#topmenu.topmenu-closed ul li.page_item_has_children a::after{
	display:none;
}


/* Mindre skärm */
@media only screen and (max-width: 1250px){
	#topmenu.topmenu-closed ul li > a{
		max-height:60px;
	}
	#topmenu ul li{
		font-size:15px;
	}
	#topmenu ul li a{
		padding:18px 8px;
	}
}


/* Mobil meny (liten skärm) */
#topmenu.topmenu-open, #topmenu.search-open{
	
	text-transform: none;
	width:100%;
	height:auto;
}
#topmenu.topmenu-open ul li{
	text-align:left;
	margin:0;
	padding:0;
	float:none;
	width:100%;
}
#topmenu.topmenu-open ul li a{
	padding:15px 10px 15px 10px;
	font-weight:400;
	padding-right:60px;
}
#topmenu.topmenu-open .topmenuOpener{
	position:absolute;
	top:0;
	right:0;
	margin:0;
	padding:0;
	display:block;
	padding:0px 15px;
	line-height:55px;
	font-size:25px;
	font-weight: 900;
	vertical-align: middle;
	text-align:center;
	transition: background-color 0.5s ease-in-out;
}
#topmenu.topmenu-open .topmenuOpener span{
	display:none;
}


/* Sökfält (liten skärm) */
#searchContent{
	clear:both;
	display:none;
	background-color:#501d17;
	border-bottom:solid 1px #6b271f;
	padding:15px 10px;
	color:#fff;
}
#searchContent > div{
	position:relative;
	padding-right:60px;
}
#searchContent fieldset{
	border:none;
	margin:0;
	padding:0;
}
#searchContent legend{
	display:none;
}


/* Meny knappar (öppna stäng mobil meny, visa sök) */
#topmenuBtns{
	display:none;
}
@media only screen and (max-width: 1024px){
	#topmenuBtns{
		display:block;
		float:right;
	}
	#topmenuToggle, #searchToggle{
		display:block;
		float:left;
		width: 56px;
		height: 60px;
		margin:0;
		padding:0;
		padding-top:7px;
		line-height:25px;
		background-color:transparent;
		color:#fff;
		border:none;
		border-left:solid 1px #6b271f;
		cursor:default;
		font-size:15px;
		text-align:center;
	}
	#topmenuToggle em, #searchToggle em{
		display:block;
	}
}

#topmenuLogotype{
	display:none;
}

/* Mobil meny */
@media only screen and (max-width: 1024px){
	
	/* Används för att inte content under menyn ska hoppa vid sticky */
	header{
		min-height:60px;
	}
	
	#topmenu{
		position:absolute;
		height:60px;
	}
	#frontpage #topmenu{
		background-color:#863127;
	}
	#topmenuContent{
		display:none;
		width:100%;
	}
	#topmenu.topmenu-closed{
		background-color:#863127;
	}
	#topmenu.topmenu-open{
		background-color:#863127;
	}
	#topmenuLogotype{
		display:block;
	}
	#topmenuLogotype a{
		border:none;
		display:block;
		position:absolute;
		z-index:100;
		top:0px;
		background-position:center left;
		background-repeat:no-repeat;
		transition: background-image 0.5s ease-in-out;
		height:60px;
		left:10px;
		width:164px; 				/* Ange bildens max-bredd */
		background-size:164px 30px; /* Ange hur stor bilden ska vara (max 60px hög) */
		background-image:url(/wp-content/themes/nybro2/gfx/nybro-kommun-logotyp-vit.svg);
	}
	
	/* Används enbart om menyn är sticky ! */
	#topmenu.topmenu-open{
		overflow-y: auto;
		max-height:100%;
		max-height:100vh;
	}
	
	/* Markerar vald länk i huvudmeny */
	#topmenu.topmenu-open ul li.current_page_item > a{
		font-weight:700;
		/*background-color:#000 !important;*/
		text-indent:20px;
	}
	#topmenu.topmenu-open ul li.current_page_item > a::before{
		font-family: "Font Awesome 5 Pro";
		content: "\f105";
		display: inline-block;
		font-weight: 900;
		text-indent:-20px;
	}
	
	/* Länkar */
	#topmenu ul li a:hover, #topmenu ul.children li a:hover, #topmenu ul.children ul.children li a:hover, #topmenu ul.children ul.children ul.children li a:hover{
		outline-offset:-2px;
		outline: solid 2px #FFF;
		background-color:transparent;
	}
	#topmenu ul li a:focus{
		outline-offset:-2px;
		outline: solid 2px #FFF;
		background-color:transparent;
	}
	
	/* Nivå 1*/
	#topmenu ul li a{
		display:block;
		color:#fff;
		background-color:#6b271f;
		border-bottom:solid 1px #863127;
	}
	
	#topmenu .topmenuOpener{
		color:#fff;
		background-color:transparent;
		border:none;
		border-left:solid 1px #863127;
	}
	
	/* Nivå 2*/
	#topmenu ul.children li a{
		color:#fff;
		background-color:#501d17;
		border-bottom:solid 1px #6b271f;
		padding-left:30px;
	}
	#topmenu ul.children .topmenuOpener{
		color:#fff;
		background-color:transparent;
		border-left:solid 1px #6b271f;
	}
	
	/* Nivå 3 */
	#topmenu ul.children ul.children li a{
		color:#fff;
		background-color:#381410;
		border-bottom:solid 1px #501d17;
		padding-left:50px;
	}
	#topmenu ul.children ul.children .topmenuOpener{
		color:#fff;
		background-color:transparent;
		border-left:solid 1px #501d17;
	}
	
	/* Nivå 4 */
	#topmenu ul.children ul.children ul.children li a{
		color:#fff;
		background-color:#1b0a08;
		border-bottom:solid 1px #381410;
		padding-left:70px;
	}
	#topmenu ul.children ul.children ul.children .topmenuOpener{
		color:#fff;
		background-color:transparent;
		border-left:solid 1px #381410;
	}
	
	/* Nivå 5 */
	#topmenu ul.children ul.children ul.children ul.children li a{
		color:#fff;
		background-color:#100605;
		border-bottom:solid 1px #381410;
		padding-left:90px;
	}
	#topmenu ul.children ul.children ul.children ul.children .topmenuOpener{
		color:#fff;
		background-color:transparent;
		border-left:solid 1px #381410;
	}
	
	/* Nivå 6 */
	#topmenu ul.children ul.children ul.children ul.children ul.children li a{
		padding-left:110px;
	}
	
}


/* Döljer element på stor skärm */
@media only screen and (min-width: 1025px){
	#topmenu ul.hide_on_widescreen{
		display:none;
	}
}


/* Tillbaka till toppen-knapp */
#topmenuBackbutton{
	position:fixed;
	bottom:15px;
	right:15px;
	height:50px;
	width: 50px;
	font-size:30px;
	line-height:50px;
	text-align:center;
	border-radius:10px;
	cursor:pointer;
	display:none;
	background-color:#863127;
	color:#fff;
	z-index:1000000;
	border:none;
}
#topmenuBackbutton span{
	display:none;
}

/* Megameny */
@media only screen and (min-width: 1025px){
	#frontpage #topmenu:hover{
		background-color:#fdf2f0;
	}
}


/* Fix för att visa megameny */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children{
	display:block !important;
}
/* Länk som öppnar megameny */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu > a{
	background-color:#fff;
	color:#000;
	transition: background-color 0.4s ease 0s;
}
/* Länkar i megameny */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul li a{
	color:#863127;
}
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul li a:hover,
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul li a:focus{
	background-color:#f7e0dc !important;
}

/* Toppnivå (megamenyns behållare) */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu{
	position:static;
}
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu > ul.children{
	position:absolute;
	height:auto;
	text-align:left;
	border-left:solid 1px #fdf2f0;
	border-right:solid 1px #fdf2f0;
	border-bottom:solid 1px #fdf2f0;
	background-color:#fff;
	padding-top:30px;
	padding-bottom:20px;
	column-count: 4;
	column-width:auto;
	column-rule: solid 1px #eee;
	column-gap: 1px;
	border-radius:0 0 10px 10px !important;
	
	-webkit-box-shadow: 0px 41px 54px -40px rgba(0,0,0,0.53);
	-moz-box-shadow: 0px 41px 54px -40px rgba(0,0,0,0.53);
	box-shadow: 0px 41px 54px -40px rgba(0,0,0,0.53);
	
}

@media only screen and (max-width: 1250px){
	#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu > ul.children{
		
	}
	#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu > ul.children li a{
		padding-left:20px;
		padding-right:20px;
	}
}

#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu > ul.children > li{
	padding-bottom:20px;
	/*break-inside: auto;*/
	break-inside: avoid;
	column-gap: 100px;
}

/* Megameny nivå 1 */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children li a{
	padding-top:0;
	padding-bottom:0;	
	font-size:13px;
	font-weight:600;	
}

/* Megameny nivå 2 och över */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children ul.children li a{
	font-weight:500;
	font-size:13px;
	overflow: hidden;
    white-space: nowrap;
	text-overflow: ellipsis;
}
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children ul.children li a:before{
	font-family: "Font Awesome 5 Pro";
	content: "\f105";
	display: inline-block;
	font-weight: 400;
	vertical-align:middle;
	padding-right:5px;
	font-size:7px;
	line-height:0;
}

/* Megameny nivå 3 och över (dolda från start) */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children ul.children ul.children li{
	display:none;
}
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children ul.children ul.children li a{
	font-weight:400;
	padding-left:30px;
}
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children ul.children ul.children li a:before{
	font-family: "Font Awesome 5 Pro";
	content: "\2d";
	display: inline-block;
	font-weight: 400;
	vertical-align:middle;
	padding-right:5px;
	font-size:7px;
	line-height:0;
} 
/* Megameny nivå 4 */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children ul.children ul.children ul.children li a:before{
	padding-left:10px;
}
/* Megameny sista nivån */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul.children ul.children ul.children ul.children ul.children li a:before{
	padding-left:10px;
}

/* Megameny aktuell sida */
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu  ul li.current_page_item > a{
	color:#000;
}
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu  ul li.current_page_item > a:after{
	font-family: "Font Awesome 5 Pro";
	content: "\f00c";
	display: inline-block;
	font-weight: 400;
	vertical-align:middle;
	padding-left:5px;
	padding-bottom:3px;
	font-size:10px;
	line-height:0;
}

/* Mega meny knapp, visa alla nivåer */
#topmenu li.megamenu_btn_show_all{
	display:none;
}
#topmenu.topmenu-closed #topmenuContent ul li.page_item.megamenu ul li.megamenu_btn_show_all{
	display:block;
	padding-left:20px;
	font-size:13px;
}