/*
CSS Styling for elements with the class .mininav. Mini navigation is used to have multiple buttons in a row linking to other pages
See detailed documentation in Dev/mediawiki
*/

/* ---------- */
/* 1. General */

.mininav {
	margin: 15px 0;
	min-height: 55px;
}

.mininav.mn-2-lines { min-height: 110px; }
.mininav.mn-3-lines { min-height: 165px; }
.mininav.mn-4-lines { min-height: 220px; }

@media (max-width: 420px) {
	.mininav { min-height: 45px };
	.mininav.mn-2-lines { min-height: 90px; }
	.mininav.mn-3-lines { min-height: 135px; }
	.mininav.mn-4-lines { min-height: 180px; }	
}

.mininav ul {
	list-style: none;
	padding-left: 0 !important;
	margin-left: 0 !important;
	display: inline-block;
	font-size: 0;
}

.mininav li {
	display: inline-block;
	padding: 0 !important;
	margin-bottom: 5px;
	min-height: 50px;
	position: relative;
}

@media (max-width: 420px) {
	.mininav li {
		min-height: 40px;
	}
}

.mininav li > :not( span, img ) {
	background-color: #fafafa;
	padding: 9px 15px;
	text-decoration: none;
	font-size: 17px !important;
	color: #36b;
	display: inline-block;
	border-bottom: 4px solid white;
	transition: background-color .3s, border-bottom-color .3s;
	cursor: pointer;
}

@media (max-width: 420px) {
	.mininav li > :not( span, img ) {
		font-size: 15px !important;
		padding: 6px 10px;
	}
}

.mininav li:not(:last-child) > * {
	margin-right: 3px;
}

.mininav li > *:hover, .mininav li > *.selflink, .mininav li > *.active {
	background-color: white;
	border-bottom-color: #89d;
	box-shadow: 2px 2px 3px rgba(0,0,0,.05);
}

/* Images at the beginning */

.mininav li > span[typeof="mw:File"]:first-child img {
	position: absolute;
	left: 16px;
	top: 10px;
	width: 25px;
	height: 25px;
	object-fit: contain;
	object-position: center;
}

.mininav li > span[typeof="mw:File"]:first-child + * {
	padding-left: 50px;	
}

/* If external links are used */

.mininav .external {
	padding-right: 15px !important;
}

.mininav .ext-link-to-archive {
	display: none;
}

/* --------------- */
/* 2. Dark version */

.mininav.mn-dark li > *:not(.active):not(:hover) {
  background-color: #e8e8e8 !important;
  border-bottom-color: #f5f5f5;
}

.mininav.mn-dark li > *:hover,
.mininav.mn-dark li > *.selflink,
.mininav.mn-dark li > *.active {
	background-color: #f5f5f5;	
}

/*
[[Category:MultiWiki]]
*/