/* Allgemeines, u.a. wie die Schrift im Inhalt aussieht */
:root {
  --fett: #F4EF86;
  --text-color: #eee;
  --dunkler: #ffa366;
  --input-submit: #d86a86;
  --textarea-background: #f9efef;
  --textarea-border: #dea4b3; /* #c68282 */
}    

body {
	background: #000;
}

.bgbild {
    background-image: url('../images/bg1.jpg');
	width: 100%;
	height: 70vh;
}
    
.wechselbild1 {
    background-image: url('../images/bg1.jpg');
}
.wechselbild2 {
    background-image: url('../images/bg2.jpg');
    bottom: -50px;
    left: -50px;
}
.wechselbild3 {
    background-image: url('../images/bg3.jpg');
    bottom: -50px;
    left: -50px;
}
.wechselbild4 {
    background-image: url('../images/bg4.jpg');
}
.wechselbild5 {
    background-image: url('../images/bg5.jpg');
}

.wechselbild6 {
    background-image: url('../images/bg6.jpg');
    bottom: -30px;
    left: -70px;
}


#content, nav {
    background: #333;
}
		
nav {
    background: #333;
}

nav > .col > a > .navbutton {
    background: #333;
}
nav > .col > a > .navbutton:hover {
    background: #444;
}
nav > .col > a > .navbutton:active {
    background: #000;
}

i,em {
    font-style: italic;
    color: var(--fett);
    text-decoration: none;}

s, strike { color: #1d8cab; }

u {
    color: #5f5f5f;
    border-color: var(--dunkler);
}
b, strong { color: var(--dunkler); }



blockquote {
    background: rgba(50,50,50,0.5);
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6), 0 6px 20px 0 rgba(0, 0, 0, 0.5);
}

h1 {
    color: var(--dunkler);
    text-shadow:1px 1px 0 rgb(0,0,0);
    font-family: Consolas;
	font-style: normal;
    letter-spacing: 3px;
}
    
h2 {
    color: var(--fett);
    text-shadow:1px 1px 0 rgb(0,0,0); 
}

.block { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6), 0 6px 20px 0 rgba(0, 0, 0, 0.5); }
.kreis { background-color: #6699cc; }

/*--- A Underline ---*/

a:link{ color: var(--fett); }
a:visited { color: var(--fett); }
a:active{ color: var(--dunkler); }
a:hover { color: var(--dunkler); }

#content a:before {
  background-color: var(--dunkler);
}

textarea, select, input[type=text], input[type=password], input[type=email], input[type=number] {
	background: #fff;
}


input[type=submit], #content button {
	background: #000;
	color: #fff;
}

#content button a, #content button a:link, #content button a:visited {
    color: #fff;
}

input[type=submit]:hover, #content button:hover, #content button a:hover {
	background: #333;
    color: var(--text-color);
}

input[type=submit]:active, #content button:active, #content button a:active {
	background: #6699cc;
    color: var(--text-color);
}

input[type=submit]:disabled, input[type=submit]:disabled:active, #content button:disabled, #content button:disabled:active {
    background: #999;
}

/* ---------- TOOLTIP ---------- */

.csstooltip {
  color: #ff0000;
}

.csstooltip span {
  background-color: black;
  color: #fff;
}

.csstooltip span::after {
  border-color: black transparent transparent transparent;
}

/* ---------- KARTE ---------- */


.labl >   input:checked + div { /* (RADIO CHECKED) DIV STYLES */
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6), 0 6px 20px 0 rgba(0, 0, 0, 0.5);
}


.meter {
	background: #ccc;
}
.meter > span {
  background: #e16969;
}