/* boKens 0_4screens.css */


 {
-webkit-box-sizing: border-box;
box-sizing: border-box; }

html {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 16px;

background-color : silver ;
background-color : #ffb9b3; /* darker lightsalmon;*/
background-color : DodgerBlue ;
background-color : LightSteelBlue ;
background-color : CornflowerBlue;

text-rendering: optimizeLegibility;
-webkit-font-kerning: normal;
font-kerning: normal;
-webkit-text-size-adjust: 100%;
 -moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
text-size-adjust: 100%; }

body {
 /*font-size: calc(16px + (32 - 16) * ((100vw - 320px) / (1920 - 320)));*/
font-size: 18px;

background-color : silver ;
background-color : #ffb9b3; /* darker lightsalmon;*/
background-color : DodgerBlue ;
background-color : LightSteelBlue ;
background-color : CornflowerBlue;

 margin-bottom: 0rem; 
 width= device-width;
min-height: 100vh;
text-rendering: optimizeLegibility;
-webkit-font-kerning: normal;
font-kerning: normal;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
text-size-adjust: 100%; 
font-weight: 300; 
color: white;
}
/* normal ist 300 - Lothar hat es aber gerne etwas dünner, deshalb nimmt er nur 100 */

.grid-container {
display: grid;
background-color : #ffb9b3; /* darker lightsalmon;*/
background-color : LightSteelBlue ; /* darker lightsalmon;*/
background-color : DodgerBlue ;
background-color : CornflowerBlue;
color: white:
padding: 1px;
width: device-width;
max-width: 600px;
justify-content: center 
}

 /*Rand-li */ 
div.Rand-li {
grid-area: span 5/ 1;
color: white;
text-align: center;
vertical-align: top;
font-size: 18px;
font-weight: normal;
 line-height: 36px;
}

 /*Rand-re */ 
div.Rand-re {
grid-area: span 5/ 3;
color: white;
text-align: center;
vertical-align: top;
font-size: 18px;
font-weight: normal;
 line-height: 36px;
}

 /*menu */ 
div.menu {
grid-area: 1 / 2;
color: white;
text-align: center;
vertical-align: top;
font-size: 16px;
font-weight: normal;
 line-height: 36px;
}

 /*titel */ 
div.titel {
grid-area: 2 / 2;
color: white;
text-align: center;
vertical-align: top;
font-size: 16px;
font-weight: normal;
 line-height: 36px;
}

div.inhalt {
grid-area: 3 / 2;
background: ;
color: white;
text-align: center;
font-size: calc(16px + 6 * ((100vw - 320px) / 1280));
/*font-size: 20px;*/
vertical-align: top;
}

 /*fusszeile */ 
div.fuss {
grid-area: 4 / 2;
color: white;
text-align: center;
vertical-align: top;
font-size: 18px;
font-weight: normal;
 line-height: 36px;
}

/* links */ 
/* unvisited link */
a:link{
 font-size: 15px; 
 color: blue; 
 text-decoration: none;
}

/* visited link */
a:visited {
text-decoration: none;
color:hotpink;
font-size: 100%;
}


/* mouse over link */
a:hover {
text-decoration: none;
font-style: italic;
color: yellow;
}* 

/* selected link */
a:active {
color: blue;
}



.abteilung {
 font-size: 2rem;
 font-weight: normal;
 font-style: italic; 
 color: PaleTurquoise;
}

.autor {
 font-size: 1.4rem;
 font-weight: normal;
}


.gross {font-size: 150%;} 


h1 {
color: #fff;
margin: 0;
padding: .25em; 
line-height: 1.1em; 
text-align: center;

}

h3 {color: yellow;}


.hinweis {
font-size: 14px;
font-style: italic;
color: white;
}


img {
/*width: auto; /* war: 100%; */
/*max-width: 100%; /* 100vw; */
/*height: auto; /* 100vh; */
/*max-height: 100vh; /* war: 80vh */
vertical-align: middle;
/*display: block;*/
-o-object-fit: cover;
 object-fit: cover;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
border:;
box-shadow: 8px 4px 12px rgba(0, 0, 0, 0.5); 
}


.jahr {
font-size: 2em;
 color: lightsalmon;
 font-weight: normal;
 font-style: italic;
}
.jahrklein {
font-size: 4vw;
 color: lightsalmon;
 font-weight: normal;
 font-style: italic; 
}


.medium {
 font-size: 1rem;
 font-weight: normal;
}


.nummer {
 font-size: 1.1rem;
 font-weight: bold;
 color: white;
}

p, div {
color: #fff;
margin: 0;
padding:.25em; 
 line-height: ;
text-align: center;}


picture {
width: auto; 
margin: 0;
display: grid;
grid-template-columns: 1fr;
}

.pubjahr {
font-size: .8rem;
color:yellow;
}

*Trennlienien lineale */

.ruler20 {
width: 20%;
height: 2;
color: white;
}


.ruler30 {
width: 30%;
height: 2;
color: ;
}


.ruler50 {
width: 50%;
height: 2;
color: ;
}

.ruler75 {
width: 75%;
height: 2;
}

.ruler90 {
width: 90%;
height: 2;
}

/* ende Trennlienien lineale */



.stern{
font-size: 2em;
}

.titel {
 font-size: 1.8rem;
 font-weight: bold;
 color: LightCyan;
}
.titel2 {
 font-size: 1.5rem;
 font-weight: bold;
 color: ;
}
.titel3 {
 font-size: 1.2rem;
 font-weight: bold;
 color: white;
}
.untertitel {
 font-size: 1.2rem;
 font-weight: bold;
 color: white;
}

.was {
	font-size: 16px;
	font-style: normal;
	color: white;
}

