MediaWiki:Common.css

Aus Markenheftchen

Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.

  • Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
  • Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
  • Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */

img {
	max-width:90%;
	height:auto;
}

/* Artikelname in Kapitälchen */
.mw-page-title-main {
    font-variant: small-caps;
/*    font-family:arial, "lucida console", sans-serif; */ /* Schriftart */
}

/* Artikelüberschrift für MH und FB etc. (nicht h1, h2, h3, h4 etc.) */
.mw-item-heading {
    font-weight: bold;
    font-size:large;
}

h1, h2, h3, h4 {
/*   color:#FF9F00;   Farbe orange */
/*   font-size:28pt;  Größe 28pt   */
/*  font-family:arial, "lucida console", sans-serif; */ /* Schriftart */
}

.mw-mh-deckel {
    display:inline-block;
    box-shadow:
/*        inset 0 -3em 3em rgb(0 200 0 / 30%), */
/*                0 0 0 2px white, */
        0.3em 0.3em 1em rgb(200 200 200 / 60%);
}

/* Schlagschatten für Bild oben links */
.timeless-logo img {
    box-shadow:
        0.3em 0.3em 1em rgb(200 200 200 / 60%);
}

.mw-drop-shadow-soft {
    display:inline-block;
    box-shadow:
        0.3em 0.3em 1em rgb(200 200 200 / 60%);
}

.bild-mittig {
/*    width: 200px; */
/*    height: 200px; */
/*    background-color: #0a0a23; */
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Zentriertes Grid für Bilder mit Quellenangabe */
/* Nötig, da die seitliche Quellenangabe auf dem */
/* Handy bei der responsiven Reformatierung      */
/* ursprünglich unter das Bild rutschte. Nun     */
/* bilden Bild, Quelle und Bildunterschrift      */
/* eine Einheit.                                 */
#imagegridc {
margin: 0 0 0 3%;
display: grid;
/* grid-template-rows: repeat(2, 1fr); */
grid-template-rows: min-content min-content;
grid-template-columns: auto min-content;
/* grid-template-columns: repeat(2, 1fr); */
grid-column-gap: 5px;
grid-row-gap: 5px;
align-items: center;
justify-content: center;
}

#igc-image { grid-area: 1 / 1 / 2 / 2; }
#igc-caption { grid-area: 2 / 1 / 3 / 2; justify-self: center;}
#igc-source { grid-area: 1 / 2 / 3 / 3; }

/* Quellenangabe vertikal => span */
.mw-quelle-vertikal {
    vertical-align: middle;
    writing-mode:tb-rl;
    writing-mode:vertical-rl;
    font-size: xx-small;
    letter-spacing:2px;
}

/* Quellenangabe akmh */
/*.quelleakmh img { width: 100%; } */
.quelleakmh { position: relative; }
.quelleakmh::after {
  content: " Quelle: akmh ";
  position: absolute;
  bottom: -5%;
  right: 0;
  opacity: 1;
  font-size: 1em;
  color: gray;
/*  writing-mode: vertical-lr; */
}

#rectangle11{
    width:50%;
    height:50%;
    border-style: solid;
    border-color: red;
}

.overlayW61 {
  position: absolute;
  display: none;
  width: 50%;
  height: 50%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0,1);
  border-style: solid;
  border-color: red;
  z-index: 2;
  cursor: pointer;
}

.chromo-zd-container:hover .overlayW61 {
  opacity: 1;
}

/*************************/
/* Timeless Skin Changes */
/*************************/
/* Werkzeuge ausblenden */
#site-tools.sidebar-chunk { display: none; }

/* "Druckversion" in 'Mehr' (rechts) ausblenden */
li#t-print { display:none; }

/*** Test ***/

 /* Container holding the image and the text */
.container {
  position: relative;
  text-align: center;
  color: white;
}

/* Bottom left text */
.bottom-left {
  position: absolute;
  bottom: 8px;
  left: 16px;
}

/* Top left text */
.top-left {
  position: absolute;
  top: 8px;
  left: 16px;
}

/* Top right text */
.top-right {
  position: absolute;
  top: 8px;
  right: 16px;
}

/* Bottom right text */
.bottom-right {
  position: absolute;
  bottom: 8px;
  right: 16px;
}

/* Centered text */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mygrid{
  margin: 20px auto;
  width:400px;
  height:400px;
  background-color:#fff;
  display:grid;
  grid-template-columns: 200px 200px;
  grid-row: auto auto;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
}

#mw-img-src {
    color:#a020f0;
    font-size: x-small;
/*    letter-spacing:2px; */
}