/* {{pp|small=yes}} */

.mp-box {

	border: 1px solid #aaa; /* all border colors overriden on specific elements */

	padding: 0 0.5em 0.5em;

	margin-top: 4px;

}



.mp-h2,

body.skin-timeless .mp-h2 { /* Timeless needs a higher specificity */

	border: 1px solid #aaa; /* all border colors overriden on specific elements */

	margin: 0.5em 0;

	padding: 0.2em 0.4em;

	font-size: 120%;

	font-weight: bold;

	font-family: inherit;

}



.mp-later {

	font-size: 85%;

	font-weight: normal;

}



#mp-topbanner {

	background: #f9f9f9;

	border-color: #ddd;

}



#mp-welcomecount {

	text-align: center;

	margin: 0.4em;

}



#mp-welcome {

	font-size: 162%;

	padding: 0.1em;

}



#mp-welcome h1 {

	font-size: inherit;

	font-family: inherit;

	display: inline;

	border: none;

}



#mp-free {

	font-size: 95%;

}



#articlecount {

	font-size: 85%;

}



/* clear fix */

.mp-contains-float::after {

  content: "";

  display: block;

  clear: both;

}



#mp-banner {

	background: #fffaf5;

	border-color: #f2e0ce;

}



#mp-left {

	background: #f5fffa;

	border-color: #cef2e0;

}



#mp-left .mp-h2 {

	background: #cef2e0;

	border-color: #a3bfb1;

}



#mp-right {

	 background: #f5faff;

	 border-color: #cedff2;

}



#mp-right .mp-h2 {

	background: #cedff2;

	border-color: #a3b0bf;

}



#mp-middle {

	background: #fff5fa;

	border-color: #f2cedd;

}



#mp-middle .mp-h2 {

	background: #f2cedd;

	border-color: #bfa3af;

}



#mp-lower {

	background: #faf5ff;

	border-color: #ddcef2;

}



#mp-lower .mp-h2 {

	background: #ddcef2;

	border-color: #afa3bf;

}



#mp-bottom {

	/* no background */

	border-color: #e2e2e2;

}



#mp-bottom .mp-h2 {

	background: #eee;

	border-color: #ddd;

}



@media (max-width: 875px) {

	/* We need to improve Template:POTD as used on the main page so that these

	 * hacks aren't necessary */

	#mp-tfp table,

	#mp-tfp tr,

	#mp-tfp td,

	#mp-tfp tbody {

		display: block !important;

		width: 100% !important;

		box-sizing: border-box;

	}



	#mp-tfp tr:first-child td:first-child a.mw-file-description {

		text-align: center;

		display: table;

		margin: 0 auto;

	}

}



@media (min-width: 875px) {

	#mp-upper {

		display: flex;

	}

	

	#mp-left {

		flex: 1 1 55%;

		margin-right: 2px;

	}

	

	#mp-right {

		flex: 1 1 45%;

		margin-left: 2px;

	}

}