MediaWiki:Common.css

/** CSS an dieser Stelle wirkt sich auf alle Skins aus */
/* Common skin for desktop and mobile versions */
/* MediaWiki:Mobile.css is a copy of MediaWiki:Common.css */
/* <nowiki> */

/* Design für Dialoge */
@import url('//de.wikivoyage.org/w/index.php?title=MediaWiki:WV-Dialog.css&action=raw&ctype=text/css');

/* Support of desktop pages */
body .voy-only-mobile {
	display: none;
}

/* Stile für Hauptseite: Anfang */
/* Unterdrückung Ausgabe Überschrift auf Hauptseite */
body.page-Hauptseite.action-view .firstHeading,
body.page-Hauptseite.action-view #contentSub {
	display: none;
}
/* Artikel des Monats auf der Hauptseite */
#voy-destination-of-the-month .floatleft {
	margin: 0 0.5em 0.5em 0;
	max-width: 60%;
}
#voy-destination-of-the-month img {
	max-width: 100%;
	height: auto;
}
/* Stile für Hauptseite: Ende */

/* Unterdrückt Ausgabe nachgestellter Links */
#content .url a.external.text:after, #content .url a.external.autonumber:after,
#content a[href^="tel:"].external.text:after, #content a[href^="tel:"].external.autonumber:after,
#content a[href^="mailto:"].external.text:after, #content a[href^="mailto:"].external.autonumber:after,
#content .printNoLink a.external.text:after, #content .printNoLink a.external.autonumber:after {
	content: '';
}
@media print {
	#content a.external.text:after, #content a.external.autonumber:after {
		font-weight: normal;
	}
}

/* Unterseiten und Brotkrümelnavigation */
#contentSub, #contentSub2 {
	font-size: 1em; /* 0.7 -> 1em */
	margin-bottom: 1em; /* 1.4 -> 1em */
}
#contentSub .subpages {
	display: block;
}
.ns-0 #contentSub .subpages, .ns-4 #contentSub .subpages,
.ns-12 #contentSub .subpages, .ns-14 #contentSub .subpages {
	display: none;
}
/* Breadcrumb nicht vorlesen */
@media speech {
	#contentSub { 
		display: none; 
	}
}

/* Styles for article indicators */
.mw-indicators {
	margin-top: 0.2em;
}
.mw-indicator {
	margin-left: 5px;
	vertical-align: top;
}
.mw-indicator p { /* for parsoid */
	margin: 0;
}
.mw-indicator a {
	display: inline-block;
}
.mw-indicator:hover {
	background-color: #d6e4ff;
}
#mw-indicator-i3-gpx, #mw-indicator-i4-thema, #mw-indicator-i4-unesco,
#mw-indicator-i5-ferientipps, #mw-indicator-i6-zdm, #mw-indicator-i9-status {
	vertical-align: top;
}
#mw-indicator-i3-gpx {
	margin-left: 9px;
}
#mw-indicator-i3-geo {
	background-color: transparent;
}
@media screen {
	html.skin-theme-clientpref-night .mw-indicators .voy-icon,
	html.skin-theme-clientpref-night #mw-indicator-i4-thema img {
		background-color: transparent;
		filter: invert(100%) hue-rotate(180deg) saturate(10);
	}
}
@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .mw-indicators .voy-icon,
	html.skin-theme-clientpref-os .mw-indicators #mw-indicator-parsoid,
	html.skin-theme-clientpref-os #mw-indicator-i4-thema img {
		background-color: transparent;
		filter: invert(100%) hue-rotate(180deg) saturate(10);
	}
}

/* Timeless skin */
.skin-timeless .mw-indicators {
	margin-top: -0.5em;
}
.skin-timeless .mw-indicators img {
	margin-top: 0;
}
/* preventing 'Segoe UI Emoji' font */
.skin-timeless .voy-timeless-no-emoji {
	font-family: 'Lato','Liberation Sans','Noto Sans','Helvetica Neue','Helvetica',sans-serif;
}
.skin-timeless .toctoggle {
	top: -0.5em;
	position: relative;
}
.skin-timeless #mw-content h1.firstHeading {
	overflow: visible;
}

/* Einzelnachweise, Hervorhebung in blau */

sup.reference a {
	white-space: nowrap;
}
.references {
	font-size:90%;
}
.references > li:target, sup.reference:target {
	background-color: #ddeeff;
}

/* General design classes */
.voy-serif {
	font-family: 'Times New Roman', 'Nimbus Roman No9 L', Times, serif; 
	font-size: 118%;
}

.voy-small {
	font-size:80%;
}
.voy-bold {
	font-weight: bold;
}

.voy-color-red {
	color: red;
}

.voy-color-green {
	color: green;
}

/* Fehlerausschriften */
.error {
	background-color: #ffffff;
}

/* Stellt den Text so dar, als würde man das Tag <code>...</code> oder die Vorlage {{Code|...}} benutzen */
.code {
	font-family: monospace,Courier; 
	color: black; 
	background-color: #f9f9f9; 
	border: 1px solid #ddd; 
	border-radius: 2px; padding: 1px 4px;
}

/* Tags for most accessed pages */

#tags {
	float: right;
	background: #ffffff;
	width: 25%;
	padding: 0.5em 1em;
	line-height: 2em;
}
#tags span {
	display: inline-block;
}
#tags a {
	padding: 2px 4px 2px 0;
}

.tag0 a {
	font-size: 12px;
	color: #004f80;
}
.tag1 a {
	font-size: 16px;
	color: #247ca1;
}
.tag2 a {
	font-size: 18px;
	color: #48aac2;
}
.tag3 a {
	font-size: 20px;
	color: #6cc8f3;
}

/* Pretty and multiline tables */

.prettytable, .multiline {
	border: none;
	border-collapse: collapse;
	border-spacing: 0 0;
	margin: 1em 0;
	empty-cells: show;
	background-color: #fff;
	color: inherit;
}
.prettytable td, .prettytable th, .multiline th, .multiline td {
	border: 1px solid #6cc8f3;
	padding: 0.25em;
	vertical-align: baseline;
}
.prettytable th, .multiline th { /* hightlighting */
	text-align: center;
	background-color: #f0f0f0;
	color: #004f80;
}
.prettytable tr:not(:first-child) th, .multiline tr:not(:first-child) th {
	text-align: left;
}
.multiline tr:nth-child(even) td,
.multiline.sortable tr:nth-child(odd) td {
	background-color: #F8f8f8;
}
.multiline tr:nth-child(odd) td,
.multiline.sortable tr:nth-child(even) td{
	background-color: #fff;
}
@media screen {
	html.skin-theme-clientpref-night .prettytable,
	html.skin-theme-clientpref-night .multiline {
		background-color: var(--background-color-base, #101418);
	}
	html.skin-theme-clientpref-night .prettytable th,
	html.skin-theme-clientpref-night .multiline th {
		background-color: #333;
		color: #6cc8f3;
	}
	html.skin-theme-clientpref-night .multiline tr:nth-child(odd) td,
	html.skin-theme-clientpref-night .multiline.sortable tr:nth-child(even) td {
		background-color: #333;
	}
	html.skin-theme-clientpref-night .multiline tr:nth-child(even) td,
	html.skin-theme-clientpref-night .multiline.sortable tr:nth-child(odd) td {
		background-color: var(--background-color-base, #101418);
	}
}
@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .prettytable,
	html.skin-theme-clientpref-os .multiline {
		background-color: var(--background-color-base, #101418);
	}
	html.skin-theme-clientpref-os .prettytable th,
	html.skin-theme-clientpref-os .multiline th {
		background-color: #333;
		color: #6cc8f3;
	}
	html.skin-theme-clientpref-os .multiline tr:nth-child(odd) td,
	html.skin-theme-clientpref-os .multiline.sortable tr:nth-child(even) td {
		background-color: #333;
	}
	html.skin-theme-clientpref-os .multiline tr:nth-child(even) td,
	html.skin-theme-clientpref-os .multiline.sortable tr:nth-child(odd) td {
		background-color: var(--background-color-base, #101418);;
	}
}

/* Some Standard classes for tables */

.sortable th {
	text-align: left;
}

.voy-table-odd-even tr:nth-child(even) td {
	background-color: #F8f8f8;
}
.voy-table-odd-even tr:nth-child(odd) td {
	background-color: #ffffff;
}
.voy-table-cell-vAlignTop tr th, .voy-table-cell-vAlignTop tr td {
	vertical-align: top;
}
.voy-table-cell-vAlignMiddle td, .voy-table-cell-vAlignMiddle th {
	vertical-align: middle;
}
.voy-textCentered td, .voy-textCentered th {
	text-align: center;
}
.lastColAlign td:last-child,
.voy-lastColAlign td:last-child {
	vertical-align: middle;
	text-align: center;
}
.voy-table-no-border th {
	border-left: none;
	border-right: none;
}
.voy-table-no-border td {
	border: none;
}

/* Tabellen für Bildergalerien, deprecated */

.galleryTable {
	clear: right;
	float: right;
	margin: 0 0 1em 1em;
	vertical-align: top;
	border-collapse: collapse;
	background: #fff;
	border-spacing: 0 0;
}
.noFloat {
	clear: both;
	float: none;
	margin: 0;
}
.galleryTable td, .galleryTable th {
	padding: 0;
	vertical-align: top;
}

/* Quickbar styles */

.qb { /* is table */
	width: 308px;
	margin: 0 0 0.5em;
	border: 1px solid #6cc8f3;
	border-radius: 5px;
}
.skin-minerva table.qb {
	display: table; /* In der mobilen Ansicht werden Tabelen als block dargestellt! */
	width: 308px !important;
	margin: 0;
}
.skin-minerva  div.qb {
	width: 308px !important;
	margin: 0;
}
.qbRight {
	clear: right;
	float: right;
	margin-left: 1em;
}
.qbLeft {
	clear: left;
	float: left;
	margin-right: 1em;
}
.qbDiv, .qbRightDiv {
	box-sizing: border-box;
	overflow: hidden;
	border: 1px solid #6cc8f3;
	border-radius: 5px;
	margin: 0;
}
.qbRightDiv {
	clear: right;
	float: right;
	margin: 0 0 0.5em 1em;
}
.qbDiv .qb, .qbRightDiv .qb {
	border: none;
	margin: 0;
}
.qb td {
	padding: 2px 4px;
	vertical-align: baseline;
}
.qb th {
	padding: 2px 4px;
	vertical-align: baseline;
	text-align: left;
	font-weight: bold;
}
.qb .qbHeader {
	text-align: center;
	color: #004f80;
	padding: 0.3em 0.35em;
	font-size: 1.2em;
	background: #f0f0f0;
	border-top: 1px solid #c0c0c0;
}
.qb tr:first-child .qbHeader {
	border-top: none;
	border-radius: 5px 5px 0 0;
}
.qbImage {
	text-align: center;
	padding: 5px 3px;
	margin-left: auto;
	margin-right: auto;
}
.qbImage div.thumb {
	border-style: none;
	margin-bottom: 0;
	margin-top: 0;
}
.qbImage div.thumbinner {
	border-style: none;
	padding: 0 !important;
	background: transparent;
	margin: 0 auto;
}
.qbImage div.tright, .qbImage .thumb.tright {
	float: none;
	margin: 0;
	padding: 0;
}
.qb .qbImageCell {
	padding: 0;
}
.qbImageCell .qbHeader {
	border-bottom: none;
}
.qbEmpty {
	display: none;
}
.qbItemSmall {
	font-size:80%;
}

.qb-two-images {
	width: 100%;
}
.qb-flag img, #qb_flag img /* <- veraltet */ {
	box-shadow: 2px 2px 6px #a4a4a4;
}

.qb-line td {
	padding: 0 4px;
	height: 1px;
	vertical-align: middle;
}
.qb-line td hr {
	height: 0;
	border-bottom: 1px solid gray;
}
.qb-alt-image {
	clear: right;
	float: right;
	display: none;
}

.breakable {
	font-size: 7%;
	line-height: 0.1%;
	text-decoration: none !important;
	visibility: hidden;
}

@media print {
	#content .qb { border-width: 0.25mm; }
	#content .qb .qbHeader {
		font-size: 1em;
		background: #f0f0f0;
		border-top: 0.25mm solid #c0c0c0;
		border-bottom: 0.25mm solid #c0c0c0;
	}
}

/* Mobile devices: different containers */
@media (max-width: 600px) {
	.qbRightDiv, .qbRight, .qbLeft {
		clear: both;
		float: none;
	}
	.qbRightDiv {
		width: auto !important;
		margin: 0.7em 0;
	}
	.content table.qb, .content div.qb, .qbDiv .qb, .qbRightDiv .qb {
		width: 100% !important;
	}
}

/* Corporate Design */
/* Rahmen und Überschriften */

.container {
	border: 1px solid #6cc8f3;
	border-radius: 5px;
	position: relative;
	padding: 0 0.5em 3px;
}
.container + .container, .voy-box-wrapper + .container {
	margin-top: 0.75em;
}
p.container {
	padding-top: 0.4em;
}
/* removes border and margins of [[Template:MultiColsLayout]] intro paragraph
   in page preview popups */
.mwe-popups .container {
	border: none;
	padding: 0;
	margin: 0;
}
.skin-minerva .container {
	width: auto !important;
}

.var1 { /* blau */
	border-color: #6cc8f3;
}
.var2 { /* grün */
	border-color: #80f000;
}
.var3 { /* rot */
	border-color: #f3706c;
}

.container .header {
	background: #f0f0f0;
	color: #004f80;
	margin: 0.75em -0.4em 0.4em;
	padding: 0.3em 0.4em;
	border-top: 1px solid #c0c0c0;
	font-size: 1.25em;
}
.container .header:first-child {
	margin-top: 0;
	border-top: none;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}
.var1 > .header, .var1 > .header a {
	color: #004f80;
}
.var2 > .header, .var2 > .header a {
	color: #00804f;
}
.var3 > .header, .var3 > .header a {
	color: #800200;
}
@media print {
	.container { border: 0.25mm solid #6cc8f3; }
	.container .header {
		font-size: 1em;
		border-top: 0.25mm solid #c0c0c0;
		border-bottom: 0.25mm solid #c0c0c0;
	}
}

/* Removes underlines from certain links */

.nounderlines a,
.IPA a:link, .IPA a:visited { /* Vorlage:IPA (phonetisches Alphabet) */
	text-decoration: none !important;
}

/* Zwingt Bild etc. auf Grundlinie */

.baseline * {
	vertical-align: baseline;
}

/* General */
/* Floating not in mobile view */

.float-left {
	clear: left;
	float: left;
	margin: 0 1em 1em 0;
}
.float-right {
	clear: right;
	float: right;
	margin: 0 0 1em 1em;
}
@media (max-width: 720px) {
	.float-left, .float-right {
		clear: both;
		float: none;
		margin: 0 0 1em;
		width: 100% !important;
	}
}

/* Centering block elements */
div.centered, table.centered, ul.centered, .centered,
div.voy-centered, table.voy-centered, ul.voy-centered, .voy-centered {
	clear: both;
	float: none;
	margin: 1em auto;
}
.tablecenter, .voy-tablecenter {
	margin-left: auto;
	margin-right: auto;
}

/* Bilder mit maximal 100 % Breite */

.voy-img-maximum-width img {
	max-width: 100%;
	height: auto;
}

/* Karten- und Datenquellen: Wikivoyage:Karten- und Datenquellen */

.voy-mapsources-map div.thumb {
	margin: 0 auto;
}
.voy-mapsources-map div.thumbinner {
	border: none;
	padding: 0;
}
.voy-mapsources-map .thumbcaption {
	display: none;
}

/* Vorlagenmaster */

h3.tm_group_heading {
	margin-top: 2px !important;
	margin-left: 2px !important;
}

div.tm_group input {
	margin: 0;
}

/* Prevent line breaks in silly places:
   1) Where desired
   2) Links when we don't want them to
   3) Bold "links" to the page itself
*/
.nowrap,
.nowraplinks a,
.nowraplinks .selflink {
	white-space: nowrap;
}
/* But allow wrapping where desired: */
.wrap,
.wraplinks a {
	white-space: normal;
}

.wdItem:hover {
	background-image: url('//upload.wikimedia.org/wikipedia/commons/f/ff/Wikidata-logo.svg');
	background-size: 15px;
	background-position: right center;
	background-repeat: no-repeat;
}

/* Ausgaben des Moduls Wikidata */
/* Ranking */
.wd-rank-truth { color: blue; }
.wd-rank-preferred { color: green; }
.wd-rank-normal { color: black; }
.wd-rank-deprecated { color: gray; }

/* Wikivoyage-Tools */
#wvDEaddTools-requestDelete-edit-message {
	margin: 0.5em 2em;
	font-size: 1.2em;
	color: red;
}

/* Wikidata-Tools */
/* spezielle Quickbar Elemente für Wikidata individuell formatieren */
.qb .qb-wd-comment td {
	display: none;
	text-align: center;
	font-size: 80%;
	border-bottom: 1px solid #999999;
}

.qb-edit-delete:hover {
	cursor:pointer;
}

#wvDEaddWDTools-deleteQBItemValue {
	margin: 0.5em 2em;
	font-size: 1.2em;
	color: red;
}

/*  Tags im Fließtext für Leser ausblenden */
.wd-tools-message-inline {
	display: none;
}
.wd-tools-message-block {
	display: none;
}

/* Boxes with the same height, z. B. Wikivoyage:Autorenportal */
.voy-justifyContent {   
	display: flex;
	justify-content: space-between;
}

/* <noscript>-Emulation, vgl. [[phab:T47731]] */
.client-js .noscript {
	display: none;
}

/* Lines */
.voy-line-thin-grey {
	border-top: 1px solid grey; border-bottom: none; height: 0;
}

/* prevents display of markers and listing icons in page preview popups */
.mwe-popups .listing-map, .mwe-popups .listing-icon {
	display: none;
}

/* social-media site icons */
.voy-social-media-icon span {
	display: inline-block;
	position: relative;
	top: 2px;
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: 16px;
	width: 16px;
	height: 16px;
	white-space: nowrap;
	padding-left: 16px;
	box-sizing: border-box;
	overflow: hidden;
	color: transparent;
}
.voy-social-media-facebook-profile span,
.voy-social-media-facebook-page span,
.voy-social-media-facebook-numeric-id span,
.voy-social-media-facebook-places-id span {
	background-image: url('//upload.wikimedia.org/wikipedia/commons/thumb/b/b8/2021_Facebook_icon.svg/64px-2021_Facebook_icon.svg.png');
}
.voy-social-media-instagram-username span {
	background-image: url('//upload.wikimedia.org/wikipedia/commons/thumb/9/95/Instagram_logo_2022.svg/64px-Instagram_logo_2022.svg.png')
}
.voy-social-media-x-username span {
	background-image: url('//upload.wikimedia.org/wikipedia/commons/thumb/c/ce/X_logo_2023.svg/64px-X_logo_2023.svg.png');
	background-position: 0 2px;
}
.voy-social-media-youtube-channel span,
.voy-social-media-youtube-alias span{
	background-image: url('//upload.wikimedia.org/wikipedia/commons/thumb/e/ee/Logoyoutube2011favicon.svg/64px-Logoyoutube2011favicon.svg.png');
	background-position: 0 3px;
}
.voy-social-media-hashtag span {
	background-image: url('//upload.wikimedia.org/wikipedia/commons/thumb/f/f3/Twemoji2_23-20e3.svg/240px-Twemoji2_23-20e3.svg.png');
}
.voy-social-media-tiktok span {
	background-image: url('//upload.wikimedia.org/wikipedia/commons/thumb/d/d6/Iconoir_tiktok.svg/64px-Iconoir_tiktok.svg.png');
	width: 20px;
	background-size: 20px;
	background-position: left center;
}
.voy-social-media-flickr span {
	background-image: url('//upload.wikimedia.org/wikipedia/commons/thumb/4/44/Flickr.svg/64px-Flickr.svg.png');
}
.voy-social-media-icon + .voy-social-media-icon:before,
.voy-social-media-icon + link + .voy-social-media-icon:before { /* Parsoid */
	content: ' ';
	white-space: normal;
}
span.voy-social-media.voy-social-media-icon a.external {
	background: none;  /* no link symbol on social media links are displayed with symbol */
	padding-right: 0;
}
@media screen {
	html.skin-theme-clientpref-night .voy-social-media-tiktok span,
	html.skin-theme-clientpref-night .voy-social-media-x-username span {
		filter: invert(100%);
	}
}
@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .voy-social-media-tiktok span,
	html.skin-theme-clientpref-os .voy-social-media-x-username span {
		filter: invert(100%);
	}
}

@media screen {
	/* Workaroud for syntaxhighlight */
	html.skin-theme-clientpref-night .mw-highlight {
		filter: invert(100%);
	}
}
@media screen and (prefers-color-scheme: dark) {
	/* dark-mode exceptions */
	html.skin-theme-clientpref-os #mw-indicator-i4-unesco img {
		filter: none;
	}
	/* Workaroud for syntaxhighlight */
	html.skin-theme-clientpref-os .mw-highlight {
		filter: invert(100%);
	}
}

/* </nowiki> */