Difference between revisions of "MediaWiki:Common.css"
(45 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | + | body.page-Main_Page h1 { display: none; } | |
− | .page-Main_Page h1 { display: none; } | + | body{font-family: sans-serif} |
− | body | + | .externalimage-holder { |
− | + | position: relative; | |
− | + | } | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
+ | /* CSS for small screens */ | ||
+ | @media only screen and (max-width: 768px) { | ||
+ | .slideshow {display:none;} | ||
+ | .taw-smallscreen {display:block;} | ||
+ | .taw-nosmallscreen {display:none;} | ||
+ | } | ||
− | + | @media only screen and (min-width: 768px) { | |
+ | .slideshow {display:block;} | ||
+ | .taw-smallscreen {display:none;} | ||
+ | .taw-nosmallscreen {display:block;} | ||
+ | } | ||
+ | |||
+ | /* CSS for small screens */ | ||
+ | |||
+ | .externalimage-holder img { | ||
+ | width: 100%; | ||
+ | height: auto; | ||
+ | } | ||
+ | .image100px img { width: 100px; } | ||
+ | .mainpagetable{ display: flex; justify-content: center;} | ||
+ | .mainpagetable th {margin: 1em; padding: 1.5em; } | ||
+ | .imagetable th {margin: 1em; padding: 1em;} | ||
+ | |||
+ | |||
+ | /* Infobox template style */ | ||
+ | .infobox { | ||
+ | border: 1px solid #a2a9b1; | ||
+ | border-spacing: 3px; | ||
+ | background-color: #f8f9fa; | ||
+ | color: black; | ||
+ | /* @noflip */ | ||
+ | margin: 0.5em 0 0.5em 1em; | ||
+ | padding: 0.2em; | ||
+ | /* @noflip */ | ||
+ | float: right; | ||
+ | /* @noflip */ | ||
+ | clear: right; | ||
+ | font-size: 88%; | ||
+ | line-height: 1.5em; | ||
+ | } | ||
+ | .infobox caption { | ||
+ | font-size: 125%; | ||
+ | font-weight: bold; | ||
+ | padding: 0.2em; | ||
+ | text-align: center; | ||
+ | } | ||
+ | .infobox td { | ||
+ | vertical-align: top; | ||
+ | /* @noflip */ | ||
+ | text-align: left; | ||
+ | } | ||
+ | .infobox th { | ||
+ | vertical-align: top; | ||
+ | /* @noflip */ | ||
+ | } | ||
+ | .infobox.bordered { | ||
+ | border-collapse: collapse; | ||
+ | } | ||
+ | .infobox.bordered td, | ||
+ | .infobox.bordered th { | ||
+ | border: 1px solid #a2a9b1; | ||
+ | } | ||
+ | .infobox.bordered .borderless td, | ||
+ | .infobox.bordered .borderless th { | ||
+ | border: 0; | ||
+ | } | ||
+ | |||
+ | .infobox.sisterproject { | ||
+ | width: 20em; | ||
+ | font-size: 90%; | ||
+ | } | ||
+ | |||
+ | .infobox.standard-talk { | ||
+ | border: 1px solid #c0c090; | ||
+ | background-color: #f8eaba; | ||
+ | } | ||
+ | /* Infobox template style */ | ||
+ | |||
+ | |||
+ | /* BEGIN: Main Page CSS */ | ||
+ | .banner-image { | ||
+ | position: relative; | ||
+ | overflow: hidden; | ||
+ | max-width: 1125px; | ||
+ | height: auto; | ||
+ | margin-bottom: .6em; | ||
+ | } | ||
+ | .banner-image img { | ||
+ | max-width: 100%; | ||
+ | height: auto; | ||
+ | width: auto\9; | ||
+ | } | ||
+ | .banner-box-wide { | ||
+ | width: 80% | ||
+ | } | ||
+ | .banner-box-left, | ||
+ | .banner-box-right { | ||
+ | padding: 8px 7px; | ||
+ | background: rgb(16,16,16); | ||
+ | background: rgba(0,0,0,0.3); | ||
+ | border-radius: 4px; | ||
+ | width: 40%; | ||
+ | } | ||
+ | .banner-box-left { | ||
+ | left: 3%; | ||
+ | text-align: left; | ||
+ | } | ||
+ | .banner-box-right { | ||
+ | right: 3%; | ||
+ | text-align: right; | ||
+ | } | ||
+ | #mainpage-map { | ||
+ | position: relative; | ||
+ | overflow: hidden; | ||
+ | height: auto; | ||
+ | margin-bottom: .6em; | ||
+ | max-width: 1125px; | ||
+ | } | ||
+ | #mainpage-maptext { | ||
+ | position: absolute; | ||
+ | top: 1.5em; | ||
+ | left: 1em; | ||
+ | z-index: 2; | ||
+ | text-align: center; | ||
+ | white-space: nowrap; | ||
+ | padding: 0.5em 0.5em 0 0.5em; | ||
+ | } | ||
+ | #mainpage-tagline { | ||
+ | margin: 0; | ||
+ | } | ||
+ | #mainpage-searchinput { | ||
+ | padding:0.5em 0 0.7em; | ||
+ | } | ||
+ | #mainpage-searchinput label { | ||
+ | font-size: 85%; | ||
+ | font-style: italic; | ||
+ | } | ||
+ | #mainpage-searchinput input[type="text"] { | ||
+ | margin-right: 0.5em; | ||
+ | } | ||
+ | #mainpage-maplinks { | ||
+ | position:absolute; | ||
+ | bottom: 0; | ||
+ | left: 1em; | ||
+ | color: white; | ||
+ | padding:0 0.5em; | ||
+ | } | ||
+ | .mainpage-shadowbox { | ||
+ | color: white; | ||
+ | background: rgb(16,16,16); | ||
+ | background: rgba(0,0,0,0.3); | ||
+ | border-radius: 4px; | ||
+ | } | ||
+ | .mainpage-shadowbox h2, .mainpage-shadowbox h3 { | ||
+ | color: white; | ||
+ | border:none; | ||
+ | font-family: sans-serif; | ||
+ | line-height: 1.2em; | ||
+ | margin:0; | ||
+ | } | ||
+ | .mainpage-shadowbox h2 { | ||
+ | font-size: 190%; | ||
+ | } | ||
+ | .mainpage-shadowbox h3 { | ||
+ | font-size: 150%; | ||
+ | padding: 0; | ||
+ | } | ||
+ | #mainpage-maplinks a, .mainpage-shadowbox a { | ||
+ | color: white; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | .banner-box-2 { | ||
+ | position: absolute; | ||
+ | z-index: 2; | ||
+ | margin-top: 2em; | ||
+ | min-width: 20em; | ||
+ | } | ||
+ | .banner-box-2 .quote { | ||
+ | font-size: 80%; | ||
+ | line-height: 1.2em; | ||
+ | } | ||
+ | /* END: Main Page CSS */ | ||
+ | |||
+ | .mf-mobile-only { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | /* BEGIN Main Page carousel code */ | ||
+ | |||
+ | .jcarousel { | ||
+ | position: relative; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | |||
+ | .jcarousel-wrapper { | ||
+ | max-width: 1125px; | ||
+ | margin: 0; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | .jcarousel .jcarousel-list { | ||
+ | position: relative; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | .jcarousel .jcarousel-item { | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | .jcarousel-item img { | ||
+ | display: block; | ||
+ | max-width: 100%; | ||
+ | height: auto !important; | ||
+ | } | ||
+ | |||
+ | .jcarousel-control-prev, | ||
+ | .jcarousel-control-next { | ||
+ | position: absolute; | ||
+ | top: 45%; | ||
+ | width: 30px; | ||
+ | height: 30px; | ||
+ | text-align: center; | ||
+ | background: #fff; | ||
+ | color: #fff; | ||
+ | text-decoration: none; | ||
+ | text-shadow: 0 0 1px #000; | ||
+ | font: 24px/27px Arial, sans-serif; | ||
+ | -webkit-border-radius: 30px; | ||
+ | -moz-border-radius: 30px; | ||
+ | border-radius: 30px; | ||
+ | -webkit-box-shadow: 0 0 2px #999; | ||
+ | -moz-box-shadow: 0 0 2px #999; | ||
+ | box-shadow: 0 0 2px #999; | ||
+ | } | ||
+ | |||
+ | .jcarousel-control-prev { | ||
+ | left: -15px; | ||
+ | } | ||
+ | |||
+ | .jcarousel-control-next { | ||
+ | right: -15px; | ||
+ | } | ||
+ | |||
+ | .jcarousel-control-prev:hover span, | ||
+ | .jcarousel-control-next:hover span { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .jcarousel-control-prev.inactive, | ||
+ | .jcarousel-control-next.inactive { | ||
+ | opacity: .5; | ||
+ | cursor: default; | ||
+ | } | ||
+ | |||
+ | .jcarousel-pagination { | ||
+ | position: absolute; | ||
+ | bottom: 10px; | ||
+ | left: 15px; | ||
+ | } | ||
+ | |||
+ | .jcarousel-pagination a { | ||
+ | text-decoration: none; | ||
+ | display: inline-block; | ||
+ | font-size: 11px; | ||
+ | line-height: 14px; | ||
+ | min-width: 14px; | ||
+ | background: #fff; | ||
+ | color: #4E443C; | ||
+ | border-radius: 14px; | ||
+ | padding: 3px; | ||
+ | text-align: center; | ||
+ | margin-right: 2px; | ||
+ | opacity: .75; | ||
+ | } | ||
+ | |||
+ | .jcarousel-pagination a.active { | ||
+ | background: #4E443C; | ||
+ | color: #fff; | ||
+ | opacity: 1; | ||
+ | text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.75); | ||
+ | } | ||
+ | |||
+ | /* END Main Page carousel code */ | ||
+ | |||
+ | /* Start Corporate Design */ | ||
+ | .wv-tabsWrapper { | ||
+ | position: relative; | ||
+ | top: 1px; | ||
+ | z-index: 1; | ||
+ | margin: 0 0.75em; | ||
+ | word-spacing: -0.25em; | ||
+ | white-space: nowrap; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | .wv-tab { | ||
+ | display: inline-block; | ||
+ | border: 1px solid #6cc8f3; | ||
+ | border-radius: 5px 5px 0 0; | ||
+ | margin: 0 0.75em 0 0; | ||
+ | padding: 0.1em 1em; | ||
+ | background: #f0f0f0; | ||
+ | max-width: 15%; | ||
+ | word-spacing: normal; | ||
+ | vertical-align: bottom; | ||
+ | text-overflow: ellipsis; | ||
+ | white-space: nowrap; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | .wv-mainTab { | ||
+ | border-bottom: 1px solid #f0f0f0; | ||
+ | } | ||
+ | /* JS-generierte Tabs, siehe [[Portal:Ägypten/Auf einen Blick 2]] */ | ||
+ | .tabbedContainers .wv-tabsWrapper { | ||
+ | display: none; | ||
+ | } | ||
+ | .tabbedContainers .wv-tab { | ||
+ | font-weight: normal; | ||
+ | text-decoration: none; | ||
+ | color: #002bb8; | ||
+ | cursor: pointer; | ||
+ | max-width: 30%; | ||
+ | } | ||
+ | .tabbedContainers .wv-mainTab { | ||
+ | font-weight: bold; | ||
+ | color: #000000; | ||
+ | cursor: text; | ||
+ | } | ||
+ | .tabbedContainers.wv-js .wv-tab { | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | .tabbedContainers.wv-js .wv-tab:hover, .tabbedContainers.wv-js .wv-tab:active { | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | .tabbedContainers.wv-js .wv-mainTab { | ||
+ | text-decoration: none !important; | ||
+ | } | ||
+ | @media print { | ||
+ | .wv-tabsWrapper, .tabbedContainers .wv-showIt { | ||
+ | display: none; | ||
+ | } | ||
+ | } | ||
+ | /* End Corporate Design */ |
Latest revision as of 20:30, 19 August 2018
body.page-Main_Page h1 { display: none; }
body{font-family: sans-serif}
.externalimage-holder {
position: relative;
}
/* CSS for small screens */
@media only screen and (max-width: 768px) {
.slideshow {display:none;}
.taw-smallscreen {display:block;}
.taw-nosmallscreen {display:none;}
}
@media only screen and (min-width: 768px) {
.slideshow {display:block;}
.taw-smallscreen {display:none;}
.taw-nosmallscreen {display:block;}
}
/* CSS for small screens */
.externalimage-holder img {
width: 100%;
height: auto;
}
.image100px img { width: 100px; }
.mainpagetable{ display: flex; justify-content: center;}
.mainpagetable th {margin: 1em; padding: 1.5em; }
.imagetable th {margin: 1em; padding: 1em;}
/* Infobox template style */
.infobox {
border: 1px solid #a2a9b1;
border-spacing: 3px;
background-color: #f8f9fa;
color: black;
/* @noflip */
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
/* @noflip */
float: right;
/* @noflip */
clear: right;
font-size: 88%;
line-height: 1.5em;
}
.infobox caption {
font-size: 125%;
font-weight: bold;
padding: 0.2em;
text-align: center;
}
.infobox td {
vertical-align: top;
/* @noflip */
text-align: left;
}
.infobox th {
vertical-align: top;
/* @noflip */
}
.infobox.bordered {
border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
border: 1px solid #a2a9b1;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
border: 0;
}
.infobox.sisterproject {
width: 20em;
font-size: 90%;
}
.infobox.standard-talk {
border: 1px solid #c0c090;
background-color: #f8eaba;
}
/* Infobox template style */
/* BEGIN: Main Page CSS */
.banner-image {
position: relative;
overflow: hidden;
max-width: 1125px;
height: auto;
margin-bottom: .6em;
}
.banner-image img {
max-width: 100%;
height: auto;
width: auto\9;
}
.banner-box-wide {
width: 80%
}
.banner-box-left,
.banner-box-right {
padding: 8px 7px;
background: rgb(16,16,16);
background: rgba(0,0,0,0.3);
border-radius: 4px;
width: 40%;
}
.banner-box-left {
left: 3%;
text-align: left;
}
.banner-box-right {
right: 3%;
text-align: right;
}
#mainpage-map {
position: relative;
overflow: hidden;
height: auto;
margin-bottom: .6em;
max-width: 1125px;
}
#mainpage-maptext {
position: absolute;
top: 1.5em;
left: 1em;
z-index: 2;
text-align: center;
white-space: nowrap;
padding: 0.5em 0.5em 0 0.5em;
}
#mainpage-tagline {
margin: 0;
}
#mainpage-searchinput {
padding:0.5em 0 0.7em;
}
#mainpage-searchinput label {
font-size: 85%;
font-style: italic;
}
#mainpage-searchinput input[type="text"] {
margin-right: 0.5em;
}
#mainpage-maplinks {
position:absolute;
bottom: 0;
left: 1em;
color: white;
padding:0 0.5em;
}
.mainpage-shadowbox {
color: white;
background: rgb(16,16,16);
background: rgba(0,0,0,0.3);
border-radius: 4px;
}
.mainpage-shadowbox h2, .mainpage-shadowbox h3 {
color: white;
border:none;
font-family: sans-serif;
line-height: 1.2em;
margin:0;
}
.mainpage-shadowbox h2 {
font-size: 190%;
}
.mainpage-shadowbox h3 {
font-size: 150%;
padding: 0;
}
#mainpage-maplinks a, .mainpage-shadowbox a {
color: white;
font-weight: bold;
}
.banner-box-2 {
position: absolute;
z-index: 2;
margin-top: 2em;
min-width: 20em;
}
.banner-box-2 .quote {
font-size: 80%;
line-height: 1.2em;
}
/* END: Main Page CSS */
.mf-mobile-only {
display: none;
}
/* BEGIN Main Page carousel code */
.jcarousel {
position: relative;
overflow: hidden;
}
.jcarousel-wrapper {
max-width: 1125px;
margin: 0;
position: relative;
}
.jcarousel .jcarousel-list {
position: relative;
margin: 0;
padding: 0;
}
.jcarousel .jcarousel-item {
float: left;
}
.jcarousel-item img {
display: block;
max-width: 100%;
height: auto !important;
}
.jcarousel-control-prev,
.jcarousel-control-next {
position: absolute;
top: 45%;
width: 30px;
height: 30px;
text-align: center;
background: #fff;
color: #fff;
text-decoration: none;
text-shadow: 0 0 1px #000;
font: 24px/27px Arial, sans-serif;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
-webkit-box-shadow: 0 0 2px #999;
-moz-box-shadow: 0 0 2px #999;
box-shadow: 0 0 2px #999;
}
.jcarousel-control-prev {
left: -15px;
}
.jcarousel-control-next {
right: -15px;
}
.jcarousel-control-prev:hover span,
.jcarousel-control-next:hover span {
display: block;
}
.jcarousel-control-prev.inactive,
.jcarousel-control-next.inactive {
opacity: .5;
cursor: default;
}
.jcarousel-pagination {
position: absolute;
bottom: 10px;
left: 15px;
}
.jcarousel-pagination a {
text-decoration: none;
display: inline-block;
font-size: 11px;
line-height: 14px;
min-width: 14px;
background: #fff;
color: #4E443C;
border-radius: 14px;
padding: 3px;
text-align: center;
margin-right: 2px;
opacity: .75;
}
.jcarousel-pagination a.active {
background: #4E443C;
color: #fff;
opacity: 1;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.75);
}
/* END Main Page carousel code */
/* Start Corporate Design */
.wv-tabsWrapper {
position: relative;
top: 1px;
z-index: 1;
margin: 0 0.75em;
word-spacing: -0.25em;
white-space: nowrap;
overflow: hidden;
}
.wv-tab {
display: inline-block;
border: 1px solid #6cc8f3;
border-radius: 5px 5px 0 0;
margin: 0 0.75em 0 0;
padding: 0.1em 1em;
background: #f0f0f0;
max-width: 15%;
word-spacing: normal;
vertical-align: bottom;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.wv-mainTab {
border-bottom: 1px solid #f0f0f0;
}
/* JS-generierte Tabs, siehe [[Portal:Ägypten/Auf einen Blick 2]] */
.tabbedContainers .wv-tabsWrapper {
display: none;
}
.tabbedContainers .wv-tab {
font-weight: normal;
text-decoration: none;
color: #002bb8;
cursor: pointer;
max-width: 30%;
}
.tabbedContainers .wv-mainTab {
font-weight: bold;
color: #000000;
cursor: text;
}
.tabbedContainers.wv-js .wv-tab {
text-decoration: none;
}
.tabbedContainers.wv-js .wv-tab:hover, .tabbedContainers.wv-js .wv-tab:active {
text-decoration: underline;
}
.tabbedContainers.wv-js .wv-mainTab {
text-decoration: none !important;
}
@media print {
.wv-tabsWrapper, .tabbedContainers .wv-showIt {
display: none;
}
}
/* End Corporate Design */