Template:沙盒/TemplateStyles/QFQ/t.css

维基百科,自由的百科全书
#en-mp-topbanner {
	position: relative;
	box-sizing: border-box;
	min-width: 47em;
	border-color: #ddd;
	background-color: #f9f9f9;
	white-space: nowrap;
}

.en-mp-bordered,
.en-mp-h2,
body.skin-timeless .en-mp-h2 { /* Timeless needs a higher specificity */
	border-width: 1px;
	border-style: solid;
}

#en-mp-topbanner,
.en-mp-h2,
#en-mp-left {
	color: #000;
}

#en-mp-welcomecount {
	margin: 0.4em;
	width: 22em;
	text-align: center;
}

#en-mp-welcome {
	font-size: 162%;
	padding: 0.1em;
}

#en-mp-free {
	font-size: 95%;
}

#articlecount {
	font-size: 85%;
}

#en-mp-portals {
	position: absolute;
	right: -1em;
	top: 50%;
	margin-top: -2.4em;
	width: 38%;
	min-width: 25em;
	font-size: 95%;
}

#en-mp-portals li {
	position: absolute;
	left: 0;
	top: 0;
}

#en-mp-portals .portal-hmid {
	left: 33%;
}

#en-mp-portals .portal-hright {
	left: 66%;
}

#en-mp-portals .portal-vmid {
	top: 1.6em;
}

#en-mp-portals .portal-vbot {
	top: 3.2em;
}

#en-mp-portals li:last-child {
	font-weight: bold;
}

#en-mp-banner {
	margin-top: 4px;
	padding: 0.5em;
	background-color: #fffaf5;
	border-color: #f2e0ce;
}

.en-mp-h2,
body.skin-timeless .en-mp-h2 { /* Timeless needs a higher specificity */
	margin: 0.5em;
	padding: 0.2em 0.4em;
	font-size: 120%;
	font-weight: bold;
	font-family: inherit;
}

h2.en-mp-h2::after { /* Remove borders in Timeless */
	border: none;
}

.en-mp-later {
	font-size: 85%;
	font-weight: normal;
}

#en-mp-upper {
	width: 100%;
	margin-top: 4px;
	margin-bottom: 0;
	border-spacing: 0;
	border-collapse: separate;
}

#en-mp-upper .mid-table {
	border-color: transparent;
}

#en-mp-left {
	width: 55%;
	border-color: #cef2e0;
	background: #f5fffa;
}

#en-mp-right {
	 width: 45%;
	 border-color: #cedff2;
	 background: #f5faff;
}

#en-mp-left,
#en-mp-right {
	 padding: 0;
	 vertical-align: top;
}

#en-mp-left .en-mp-h2 {
	background: #cef2e0;
	border-color: #a3bfb1;
}

#en-mp-right .en-mp-h2 {
	background: #cedff2;
	border-color: #a3b0bf;
}

#en-mp-tfa,
#en-mp-dyk,
#en-mp-itn,
#en-mp-otd,
#en-mp-other-lower > div {
	padding: 0.1em 0.6em;
}

#en-mp-dyk-h2,
#en-mp-otd-h2 {
	clear: both;
}

#en-mp-middle {
	margin-top: 4px;
	border-color: #f2cedd;
	background: #fff5fa;
}

#en-mp-middle,
#en-mp-lower,
#en-mp-other-lower {
	overflow: auto;
}

#en-mp-tfl-h2 {
	background: #f2cedd;
	border-color: #bfa3af;
}

#en-mp-tfl {
	padding: 0.3em 0.7em;
}

#en-mp-lower {
	margin-top: 4px;
	border-color: #ddcef2;
	background: #faf5ff;
}

#en-mp-tfp-h2 {
	background: #ddcef2;
	border-color: #afa3bf;
}

#en-mp-tfp {
	 margin: 0.1em 0.4em 0.6em;
}

#en-mp-other-lower {
	padding: 0;
	border-color: #e2e2e2;
	margin-top: 4px;
}

#en-mp-dyk,
#en-mp-otd,
#en-mp-other-lower {
	padding-bottom: 0.5em;
}

#en-mp-other-lower .en-mp-h2 {
	background: #eee;
	border-color: #ddd;
	color: #222;
}

@media (max-width: 875px) {
	
	body.skin--responsive #en-mp-welcomecount {
		width: auto;
	}

	body.skin--responsive #en-mp-topbanner {
		min-width: 0;
		white-space: normal;
	}
	
	body.skin--responsive #en-mp-portals {
		position: static;
		width: auto;
		min-width: 0;
		text-align: center;
		border-top: 1px solid #ddd;
		padding: 0.4em 0;
		margin: 0 0.4em;
	}
	
	body.skin--responsive #en-mp-portals li {
		position: static;
		display: inline;
		padding: 0 5px;
		white-space: nowrap;
	}
	
	body.skin--responsive table,
	body.skin--responsive tr,
	body.skin--responsive td,
	body.skin--responsive tbody {
		display: block !important;
		width: 100% !important;
		box-sizing: border-box;
	}

	body.skin--responsive #en-mp-tfp tr:first-child td:first-child a {
		text-align: center;
		display: table;
		margin: 0 auto;
	}
}

ol.breadcrumb-nav-container,
ul.breadcrumb-nav-container {
   list-style-image:    none;
   list-style-position: outside;
   list-style-type:     none;
   margin:              0.2em 0;
   padding-left:        0;
}
ol.breadcrumb-nav-container > li,
ul.breadcrumb-nav-container > li {
   display:      inline;
   margin-right: 1.5em;
   padding:      0;
}
ol.breadcrumb-nav-midsep > li,
ul.breadcrumb-nav-midsep > li,
ol.breadcrumb-nav-pipe > li,
ul.breadcrumb-nav-pipe > li {
   margin-right: 0;
}
ol.breadcrumb-nav-midsep > li::after,
ul.breadcrumb-nav-midsep > li::after,
ol.breadcrumb-nav-pipe > li::after,
ul.breadcrumb-nav-pipe > li::after {
   margin-left:  0.2em;
   margin-right: 0.2em;
}
ol.breadcrumb-nav-midsep > li::after,
ul.breadcrumb-nav-midsep > li::after {
   content:        "\A0\25AA";
}
ol.breadcrumb-nav-pipe > li::after,
ul.breadcrumb-nav-pipe > li::after {
   content: "\A0|";
}
ol.breadcrumb-nav-midsep > li:last-child::after,
ul.breadcrumb-nav-midsep > li:last-child::after,
ol.breadcrumb-nav-pipe > li:last-child::after,
ul.breadcrumb-nav-pipe > li:last-child::after {
   display: none;
}
ul + ul.breadcrumb-nav-container,
div + ul.breadcrumb-nav-container {
   margin-top: 0.5em;
}
.center .breadcrumb-nav-container {
   margin-left:  auto;
   margin-right: auto;
   text-align:   center;
}
.center .breadcrumb-nav-container > li {
   margin-left:  0.75em;
   margin-right: 0.75em;
}
#hauptseite-toc,
.hauptseite-upward {
   display: none;
}
.hauptseite-box {
   display:      table;
   margin-left:  auto;
   margin-right: auto;
   margin-top:   1em;
}
#willkommen,
#willkommen p:first-child {
   margin-top: 0;
}
.hauptseite-box-title {
   font-family: inherit;
   font-size:   1em;
   font-weight: bold;
   line-height: 1.5;
}
.hauptseite-preview-wikidata {
   color:		 #444444;
}

@media only screen {
   /* klassischer Desktop, zweispaltig; Grundstruktur */
   #spalten {
      overflow:       auto;
      padding-bottom: 1px;
   }
   #links,
   #rechts {
      float: left;
      width: calc(50% - 0.5em - 0.005px);
   }
   #links {
      margin-right: 1em;
   }
   #links .hauptseite-box {
      margin-left: 0;
   }
   #unten {
      clear: both;
   }
   .hauptseite-portale a,
   #schwesterprojekte a {
      font-weight: bold;
   }
   .hauptseite-box {
      width: 100%;
   }
   .hauptseite-box-content,
   .hauptseite-box-title {
      border: #8898BF thin solid;
   }
   .hauptseite-box-title {
      background-color: #D8E8FF;
      margin-bottom:    0;
      margin-top:       0;
      padding:          0.2em 0.8em;
   }
   .hauptseite-box-content,
   .hauptseite-preview-wikidata {
      background-color: #FFFFFF;
      border-top: none;
      min-width:  20em;
      overflow:   auto;
      padding:    0.3em 0.8em 0.3em;
   }
   .hauptseite-mehr {
      font-size:  90%;
      margin-top: 0.8em;
      text-align: right;
   }
   .hauptseite-audiodesc {
      font-family: monospace;
   }
   .hauptseite-item {
      white-space: nowrap;
   }
   .hauptseite-item-long {
      white-space: normal;
   }
   #oben  .hauptseite-box-title,
   #unten .hauptseite-box-title {
      text-align: center;
   }
}
@media only screen and (max-width: 54rem) {
   /* Platzmangel */
   #links,
   #rechts {
      float:        none;
      margin-right: 0;
      width:        auto;
   }
   .hauptseite-box {
      width: 99%;
   }
   .hauptseite-box-content,
   .hauptseite-preview-wikidata {
      border-bottom: none;
      border-left:   none;
      border-right:  none;
      min-width:     inherit;
      padding:       0.5em 0;
   }
   ul:not(.breadcrumb-nav-container) li:not(.hauptseite-item) {
      margin-left: 0.5em;
   }
   .hauptseite-details,
   .breadcrumb-nav-container > li.hauptseite-details  {
      display: none;
   }
   #hauptseite-toc {
      display:       block;
      font-size:     92%;
      line-height:   1.4em;
      margin-bottom: 1em;
   }
   .hauptseite-upward {
      display:     block;
      float:       right;
      margin-left: 2em;
   }
   #oben  .hauptseite-box-title,
   #unten .hauptseite-box-title,
   #willkommen p:first-child {
      text-align: left;
   }
}
@media only screen and (max-width: 42rem) {
   /* Besonders kleiner Screen */
   #hauptseite-toc {
      display: none;
   }
   #oben .hauptseite-upward {
      display: none;
   }
}
@media only screen and (min-width: 180rem) {
   /* Mehr als zweispaltig; 121rem */
   #links {
      float:        none;
      margin-right: 0;
      width:        auto;
   }
   #links-oben,
   #links-unten {
      float: left;
   }
   #oben  .hauptseite-box,
   #unten .hauptseite-box {
      max-width: none;
      width:     auto;
   }
}
@media only screen and (min-width: 99999rem) {
   /* Dreispaltig */
   #links-oben,
   #links-unten {
      margin-right: 3%;
      width:        28%;
   }
   #rechts {
      width: 38%;
   }
}
@media only screen and (min-width: 180rem) {
   /* Vierspaltig */
   #rechts {
      float: none;
      width: auto;
   }
   #links-oben,
   #links-unten,
   #rechts-oben,
   #rechts-unten {
      width: 23%;
   }
   #links-oben,
   #links-unten,
   #rechts-oben,
   #rechts-unten {
      margin-left:  1%;
      margin-right: 1%;
   }
   #rechts-oben,
   #rechts-unten {
      float: left;
   }
}
@media only screen and (min-width: 260rem) {
   /* Fünfspaltig */
   #rechts-unten {
      float: none;
      width: auto;
   }
   #links-oben,
   #links-unten,
   #rechts-oben,
   #rechts-unten-1,
   #rechts-unten-2 {
      margin-left:  1%;
      margin-right: 1%;
      width: 18%;
   }
   #rechts-unten-1,
   #rechts-unten-2 {
      float: left;
   }
   #rechts-unten-2 {
      margin-right: 0;
   }
   .hauptseite-box {
      max-width: 75em;
   }
   #unten .hauptseite-box  {
      max-width: none;
   }
}
@media print {
   .hauptseite-portale,
   #intern,
   #schwesterprojekte,
   .hauptseite-mehr {
      display: none;
   }
   .hauptseite-box {
      margin-left: 10%;
      max-width:   70em;
      width:       80%;
   }
}

/***** most outer div (wraps the whole page); general styles *****/
div.hp {
	background-color: #ffffff;
	color: #333333;
}
.wikipedia-w { /* for the stylized W of Wikipedia */
	font-feature-settings: 'ss05';
}
div.hp table {
	margin: 0;
	border-collapse: separate;
}
div.hp p {
	margin: 0.5em 0;
}

/***** header, portals, footer *****/
div.hp-header,
div.hp-portalen,
div.hp-footer {
	margin: 10px 0;
	background-color: #ffffff;
}
div.hp-header {
	padding: 10px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}
div.hp-header > table,
div.hp-portalen > table {
	width: 100%;
	margin: 0;
}
div.hp-header td {
	vertical-align: middle;
	text-align: center;
	padding: 1.5em 1em;
}
div.hp-header td.hp-welkom {
	width: 65%;
	font-family: 'Linux Libertine G', 'Linux Libertine', 'Linux Libertine O', 'Libertinus Serif', Georgia, serif;
	font-size: 1.3em;
	line-height: 150%;
}
div.hp-header .hp-welkom-1 {
	font-variant: small-caps;
	font-size: 185%;
}
div.hp-header td.hp-welkom a {
	color: #333333;
}
div.hp-header td.hp-statistieken {
	border-left: 1px solid #cccccc;
}
div.hp-header .hp-statistieken-1 {
	display: inline-block;
	text-align: left;
}
div.hp-portalen {
	padding: 2px 0;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
div.hp-portalen table {
	text-align: center;
	font-size: 0.9em;
	border-spacing: 1px;
}
div.hp-portalen td { /* background-color, border-color and width are defined inline */
	padding: 0;
	border-width: 5px 0 0 0;
	border-style: solid;
}
div.hp-portalen a {
	display: block;
	padding: 3px 0.25em;
	color: #000000;
}
div.hp-footer {
	text-align: center;
	font-size: 0.95em;
}

/***** blocks of segments *****/
table.hp-block {
	width: 100%;
	border-spacing: 2px;
}
table.hp-block > tbody > tr > td {
	vertical-align: top;
	padding: 0;
}
table.hp-block h2.hp-segment-title {
	background-color: #ffffff;
	margin: 0;
	padding: 10px 10px 10px 25px;
	white-space: nowrap;
	border-bottom: 1px solid #555555;
	font-family: unset;
	font-size: 2em;
	font-variant: small-caps;
	line-height: unset;
}
@media screen and ( max-width: 999px ) {
	/* slightly smaller segment titles on narrower screens/windows */
	table.hp-block h2.hp-segment-title {
		padding-left: 15px;
		font-size: 1.8em;
	}
}
table.hp-block h2.hp-segment-title a {
	color: #555555;
}
table.hp-block div.hp-segment-content {
	padding: 10px;
	border-top: 2px solid #ffffff;
}
#segment-Zusterprojecten div.hp-segment-content {
	text-align: center;
}

/***** vertical lay-out on narrow screens, both desktop and mobile *****/
@media screen and ( max-width: 899px ) {
	.hp-responsive-table,
	.hp-responsive-table > tbody,
	.hp-responsive-table > tbody > tr,
	.hp-responsive-table > tbody > tr > td {
		display: block;
		width: 100% !important;
		height: auto;
		box-sizing: border-box;
	}

	div.hp-header td.hp-statistieken {
		padding-top: 0;
		border-left: 0 none;
	}

	div.hp-portalen table tr {
		display: flex !important;
		flex-wrap: wrap;
	}
	div.hp-portalen table td {
		width: auto !important;
		margin: 0 1px 1px 0;
		flex: auto;
	}

	table.hp-block > tbody > tr {
		display: flex !important;
		flex-direction: column;
	}

	#segment-Over_Wikipedia {
		background-color: transparent !important;
		order: -1;
	}
	#segment-Over_Wikipedia h2.hp-segment-title {
		display: none;
	}
	#segment-Over_Wikipedia div.hp-segment-content {
		background-color: transparent !important;
		padding: 0;
		font-size: 0.95em;
	}
	
	table.hp-block tr.hp-3colsegment-content > td {
		border-top: 2px solid #ffffff;
	}
}

/* [[Categorie:Wikipedia:TemplateStyles-pagina's]] [[Categorie:Wikipedia:Sjablonen hoofdpagina|2020]] */