
.madmin_layout{
	display: flex;
}

.madmin_panel{
	width:200px;
	padding:10px;
}

.logomark{
	padding:1rem;
}

.logo_container {
	position: fixed;
	top: 0.75rem;
	right: 0.75rem;
	z-index: 1200;
	width: 200px;
	height: auto;
	padding: 0.5rem 0.5rem 0 0.5rem;
	background-color: white;
	border-radius: 4px;
	box-shadow: 0px 0px 6px rgba(0,0,0,0.6);

	transition:var(--transition);
}
.toggled .logo_container{
	box-shadow: none;
	transition:var(--transition);
}

.mem .logo_container{
	display: none;
}

.logo_container svg{
	width:100%;
	height:auto;
}

.mm_div_icon{
	width: 36px !important;
	height: 36px !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: relative;
	margin-left: -18px !important;
	margin-top:-18px !important;
	background-color: var(--theme);
}

.mm_route_2.mm_div_icon{
	background-color: var(--route2);
	color:black;
}

/* .mm_div_icon:before{
	content: ' ';
	display: flex;
	align-items: center;
	justify-content: center;
	color:var(--orange);
	font-weight: var(--strong);
	font-size: 1.3rem;
} */


.mm_icon_urinal{
	border:0;
	background: url(/site/assets/images/icons/toilets_urinal.svg) no-repeat;
}

.mm_icon_toilet_accessible{
	border:0;
	background: url(/site/assets/images/icons/toilets_accessible.svg) no-repeat;
}

.mm_icon_toilet{
	border:0;
	background: url(/site/assets/images/icons/toilets.svg) no-repeat;
}

.mm_icon_meet{
	border:0;
	background: url(/site/assets/images/icons/muster_long.svg) no-repeat;
}

.mm_icon_meet_short{
	border:0;
	background: url(/site/assets/images/icons/muster_short.svg) no-repeat;
}

.mm_icon_megaphone{
	border:0;
	background: url(/site/assets/images/icons/megaphone.svg) no-repeat;
}

.mm_icon_rest_stop{
	border:0;
	background: url(/site/assets/images/icons/icon_rest_stop.svg) no-repeat;
	background-color:pink;
}

.mm_start_icon{
	border:0;
	background: url(/site/assets/images/marker_start.svg) no-repeat;
}

.mm_finish_icon{
	border:0;
	background: url(/site/assets/images/marker_end.svg) no-repeat;
}

.mm_mile_icon{
	border:2px solid black;
}

.mm_mile_icon:before{
	content: '1';
	font-size: 18px;
	color:white;
}

.mm_route_2.mm_mile_icon:before{
	color:black;
}

.mm_mile_icon-1:before{	content: '1'}
.mm_mile_icon-2:before{	content: '2'}
.mm_mile_icon-3:before{	content: '3'}
.mm_mile_icon-4:before{	content: '4'}
.mm_mile_icon-5:before{	content: '5'}
.mm_mile_icon-6:before{	content: '6'}
.mm_mile_icon-7:before{	content: '7'}
.mm_mile_icon-8:before{	content: '8'}
.mm_mile_icon-9:before{	content: '9'}
.mm_mile_icon-10:before{	content: '10'}
.mm_mile_icon-11:before{	content: '11'}
.mm_mile_icon-12:before{	content: '12'}
.mm_mile_icon-13:before{	content: '13'}
.mm_mile_icon-14:before{	content: '14'}
.mm_mile_icon-15:before{	content: '15'}
.mm_mile_icon-16:before{	content: '16'}
.mm_mile_icon-17:before{	content: '17'}
.mm_mile_icon-18:before{	content: '18'}
.mm_mile_icon-19:before{	content: '19'}
.mm_mile_icon-20:before{	content: '20'}
.mm_mile_icon-21:before{	content: '21'}
.mm_mile_icon-22:before{	content: '22'}
.mm_mile_icon-23:before{	content: '23'}
.mm_mile_icon-24:before{	content: '24'}
.mm_mile_icon-25:before{	content: '25'}
.mm_mile_icon-26:before{	content: '26'}

/* we hide miles that are the same as checkpoints */

/* .mm_mile_icon-9,
.mm_mile_icon-14{
	display: none !important;
} */

.mm_infobox_icon{
	background: url(/site/assets/images/checkpoint1.svg) no-repeat;
	background-size:cover;
	border:0;
}

.mm_infobox {
	width: fit-content !important;
	height: fit-content !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: relative;
	max-width: 120px;
	margin-left: -50% !important;
	margin-top: -50% !important;
	background-color: white;
	border: 2px solid var(--theme);
	padding:2px;
}

.mm_cone{
	width: 20px !important;
	height: 32px !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: relative;
	margin-left:  -50% !important;
	margin-top: -50% !important;
	background-image: url(/site/assets/images/icons/cone.svg);
	background-size: 20px auto;
	background-repeat: no-repeat;
	background-position: center;
}

.mm_icon_music {
	background-image: url(/site/assets/images/icons/music.svg);
	background-size: 26px auto;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-position: center;
}

.mm_icon_towerlight {
	background-image: url(/site/assets/images/icons/lightbulb.svg);
	background-size: 26px auto;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-position: center;
}


.mm_icon_roadclosed{
	background-image: url(/site/assets/images/icons/roadclosed.svg);
	background-size: 26px auto;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-position: center;
	background-color: var(--blue);
}

.mm_icon_start {
	background-image: url(/site/assets/images/icons/chequered-flag.svg);
	background-size: 22px auto;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-position: center;
	background-color: white;
	border: 2px solid black;
}

.mm_icon_lightinstallation {
	background-image: url(/site/assets/images/icons/lightbulb.svg);
	background-color: var(--yellow);
	background-size: 26px auto;
	border-radius: 50%;
	background-color: var(--yellow);
	background-repeat: no-repeat;
	background-position: center;
}

.mm_infobox_3{
	background-image: url(/site/assets/images/checkpoint2.svg);
}

.mm_infobox_4{
	background-image: url(/site/assets/images/checkpoint3.svg);
}

.mm_marshal_icon {
	background-color: var(--red);
	border: 1px solid white;
	color: white;
	text-align: center;
	line-height: 1.1;
	font-weight: 600;
	font-size: 10px;
}

.mm_marshal_icon_low{
	border-radius: 50%;
	background-color: var(--blue);
}

/* .mm_div_icon:after{
	content: '';
	display: block;
	width:3px;
	height:8px;
	position: absolute;
	bottom:-8px;
	left:13px;
	background-color: var(--orange);
} */

/* .mm-infobox{
	background-color: white;
	border:2px solid  var(--orange);
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: relative;
	margin-left: -17px !important;
	margin-top:-40px !important;
} */

.leaflet-popup-content{
	margin:1rem !important;
	font-size:0.8125rem;
}

.marker_title{
	color:var(--theme);
	font-size:1.1rem;
	font-weight: var(--strong);
}

.marker_content{
	padding-top: 0.25rem;
	min-width: 260px;
}

.leaflet-popup-content p {
	margin: 0.25rem 0 !important;
	font-size: 0.825rem;
	line-height: 1.2;
}

.key_icons{
	display: grid;
	padding-top:0.5rem;
	row-gap:0.5rem;
	column-gap: 0.2rem;
	grid-template-columns: 44px 44px 44px 44px;
}

.key_icon{
	text-align: center;
	text-transform: capitalize;
}

.key_icon_image{
	width:32px;
	height:32px;
	margin:auto;
	background-repeat: no-repeat;
	background-size: contain;
}

.key_icon_eating_area{ background-image: url('/site/assets/images/icons/icon_eating_area.svg')}
.key_icon_first_aid{ background-image: url('/site/assets/images/icons/icon_first_aid.svg')}
.key_icon_food{ background-image: url('/site/assets/images/icons/icon_food.svg')}
.key_icon_music{ background-image: url('/site/assets/images/icons/icon_music.svg')}
.key_icon_toilets{ background-image: url('/site/assets/images/icons/icon_toilets.svg')}
.key_icon_water{ background-image: url('/site/assets/images/icons/icon_water.svg')}

.mm_menu{
	display: flex;
	flex:1;
}

.mm_menu_item a{
	font-size:1.8rem;
	text-decoration: none;
	color:var(--theme);
}

.mm_menu_inner {
	padding: 148px 1.5rem 2rem 1.5rem;
	flex: 1;
	overflow: auto;
	display: flex;
	flex-direction: column;
}


.mm_menu_inner h1{
	font-size:2rem;
	margin-bottom: 1rem;
}

.menu_content_block{
	max-height:0;
	overflow: hidden;
	transition:var(--transition);
}

.menu_content_block_inner{
	padding:1rem 0;
}

.menu_content_block_inner a{
	font-size: 1rem;
	text-decoration: underline;
}

.kit{
	margin-top:auto;
}

.kit_links{
	margin-top:auto;
	display: grid;
	gap: 1rem;
	grid-template-columns: 60px 60px 60px;
}

@media(min-width: 360px ){

	.kit_links{
		grid-template-columns: 60px 60px 60px 60px;
	}

}

.kit_title {
	font-size: 1.4rem;
	margin: 1rem 0;
	border-top: 1px solid #eee;
	padding-top:1rem;
	font-weight: 400;
}

.kit_link{
	display: block;
	width:60px;
	height:60px;
	margin-right:2rem;
}

.kit_fill{
	fill:var(--theme);
}

.kit_stroke{
	stroke:var(--theme);
}

.kit-link svg{
	width:100%;
	max-width: 100%;
	height:auto;
}

.marker{
	border:2px solid white;
	background-color: #333;
	border-radius: 50%;
	background-size: 22px 22px;
	font-size: 20px;
	color:white;
	display: flex;
	align-items: center;
	justify-content: center;
}

.marker_hidden{
	display: none !important;
	transition:var(--transition);
}


#edit_markers{
	padding:var(--gap-small);
	max-width: 220px;
}

.edit_feedback{
	min-height: 40px;;
	color: #999;
	font-size: 12px;
}

.maplibregl-popup-content{
	padding-top: 2.4rem;
}

.maplibregl-popup-close-button {
	color: var(--theme);
	padding: 1rem;
	font-weight: 600;
	height: 20px;
	margin: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.marker_title{
	font-size:1.2rem;
	text-align: center;
}

.marker_type_mile-marker,
.marker_type_mile-marker-1{
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: none !important;
	background-color: rgba(0,0,0,0.7);
	border-radius: 50%;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	border: 2px solid white;
}

.marker_for_route_full{
	background-color: hsl(330, 76%, 52%);
}

.marker_type_info-box {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: none !important;
	background-color: white;
	color:  var(--dark);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	text-align: center;
	border: 2px solid #D400FF;
	width: fit-content !important;
	height: fit-content !important;
	max-width: 120px;
	max-height: 120px;
}

.mc_inner{
	display: flex;
	align-items: center;
	justify-content: center;
}

.marker_type_info-box .mc_inner{
	padding-inline: 2px;
}

.mc_location_resources{
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.mc_location_resource{
	display: grid;
	grid-template-columns: 32px 1fr;
	gap: 6px;
	align-items: center;
}

.location_resource{
	width: 36px;
	height: 36px;
}

.mc_w3w_link a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-block: 1rem;
	text-decoration: none;
}