/*
    font-family: 'roboto_slablight';
    font-family: 'roboto_slabregular';
    font-family: 'roboto_slabthin';
    font-family: 'ralewayitalic';
    font-family: 'ralewayregular';
    font-family: 'ralewaysemibold';
    font-family: 'ralewaysemibold_italic';
 
    Farben:
      salmon:   #fc6c80
      rain:     #7bbeec
      buttermi: #fde282
      leaf:     #67ab92
      braun/si  #9d7b71
      hell:     #fdfdfd
      dunkel:   #111111

*/

* {margin: 0; padding: 0; border:0; }

html, body {
  font-family: 'ralewayregular', sans-serif!important;
  font-size: 100%;
  background-color: #fdfdfd; color: #111111;
  width: 100%;
  clear: both; 
  box-sizing: border-box;
}

h1#head-small {
  font-size: 0.2rem;
  position:absolute;
  z-index:100;
  color: #9ddfec !important;
}

h2 {
  text-align: center;
  font-size: 1.5rem;
  text-transform: uppercase;
  letter-spacing: 0.1rem; 
}

div.top-text div {
	font-size: 0.8rem;
}

p.top {
	font-size: 0.8rem;
	line-height: 1.2rem;
	margin-bottom: 0;
}

div#topKlick a {
  color: white;
  text-decoration: none;
}

div#topKlick a:hover {
  text-decoration: underline;
}


img#monster {
	width: 80px;
	animation: logo .5s;
}

@keyframes logo {
	0% {transform: scale(0)}
}

main p > a.anchor {position: relative; top:-2rem;}
main div#links h3, main div#links div.date {
  margin-top: 3rem;
}

div.artikelText {text-align: justify; }

main ul {
  padding-left: 2rem;
  list-style-type: '- ';
}
div.card h3 {
	text-decoration: underline;
	font-weight: 600;
	font-size: 1.5rem;
}

div.card p {
	line-height: 1.2rem;
}
div.card-text.sprachen p {font-size: 0.85rem; margin-bottom: 0; }

div#kontaktMap {
  /*max-height: 300px;*/
}

div#adresse p {
  line-height: 1.5rem;
  margin-bottom: 0;
}
div#adresse p#adresseLast {margin-bottom: 1rem;}
ul#language {
  list-style-type: none;
  text-align: right;
  position: absolute;
  z-index: 10000;
  right: 0px;
  cursor: pointer;
  width: 200px;
}
ul#language > li:hover {text-decoration: underline;}
span#languageSign {text-align:right; margin-left:0.6rem;}
form#language {display: inline; position: relative;}
select#language {position:absolute;}
span.flagge {padding: 0 0.2rem 0 0.2rem;}
div#languages {position: fixed; right: 0.5rem; bottom: 0.2rem; text-align: right; margin-bottom: 0.2rem; z-index: 100000}

aside.modal {
 display: none; 
 position: fixed; 
 z-index: 10000; 
 padding-top: 100px; 
 left: 0; 
 top: 0; 
 width: 100%; 
 height: 100%; 
 background-color: rgb(0,0,0); 
 background-color: rgba(0,0,0,0.9);
}

span.modal-close {
 position: absolute; 
 top: 15px; 
 right: 30px; 
 font-size: 3rem; 
 color: #f1f1f1; 
 font-weight: bold; 
 transition: 0.3s;
}

span.modal-close:hover, span.modal-close:focus {
	color: #bbb;
	text-decoration: none;
	cursor: pointer;
}

img.modal-inhalt {
 margin: auto; 
 display: block; 
 width: 80%; 
 max-width: 700px;
 background-color: rgb(0,0,0); 
 background-color: rgba(0,0,0,0.9);
}