
@font-face {font-family:"lobster"; src:url(lobster.woff2) format("woff2"); }
*,::after,::before{box-sizing:border-box}
html, body, header, article {margin:0; padding:0; width:100vw;}

html { background-image:url(../img/bg.jpg);background-size:cover;background-repeat:no-repeat;}
body{font-family:Verdana, Roboto;font-size:100%;font-weight:400;line-height:1.5;color:#222;text-align:left;overflow-x:hidden;}
article {display:block;min-height:100vh;width:100vw}
li{list-style-type:none;margin:1px;}
a:hover{text-decoration:none}
.lobster {font-family:lobster;margin-left:20px}
.overlay{background-color:rgba(43,33,2,.9);height:100%;width:100%}

header{color:#fff;background:#c00;text-align:center; min-height:100px;width:120vw;}
header button{display:block;transform:skew(-20deg);padding:10px 30px;background-color:#fc3;margin:20px 70px;}
header button a{transform:skew(20deg);float:left;width:100%}

ul {padding:6px;margin:1px}
.breit99{width:100%;padding:5px;text-align:center}
.container>*{flex:1 1 310px}
.spalte_l, .spalte_r,.spalte_rot{padding:10px;margin:5px 0 0 5px;min-height:80px;color:#000;}

footer {display:flex; flex-wrap:wrap;background:#ddd;width:100%}

footer .container{display:flex;flex-wrap:wrap;padding-right:10px}
footer .container>*{flex:1 1 200px}
footer .spalte {padding:6px;margin:5px 0 0 8px; min-height:80px;color:#000;width:28%;}

img{vertical-align:middle;border-style:none}
.logo {position:absolute;left:20px; top:24px; width:160px;height:46px;
  box-shadow:1px 2px 10px #fff, -1px -2px 10px #fff;}
.logo img{width:100%}
.ico {width:50px;float:left;padding:5px}

button{border-radius:5px}
button:focus{outline:1px dotted}
button,input,textarea{margin:0 40px 0 0;font-family:inherit;font-size:inherit;line-height:inherit}

input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}
textarea{overflow:auto;resize:vertical}


h1,h2,h3,h4,h5 {margin:0 .2rem .2rem;font-weight:500;line-height:1.2;color:inherit;}
h1{font-size:1.8rem}
h2{font-size:1.6rem}
h3{font-size:1.4rem}
h4{font-size:1.2rem}


.container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}
.row{display:flex;flex-wrap:wrap;margin-right:-15px;margin-left:-15px}

@media (min-width:992px) {article {display:flex;}  }

@media print {
*,::after,::before{text-shadow:none;box-shadow:none}
a:not(.btn){text-decoration:underline}
img{page-break-inside:avoid}
h2,h3, p{orphans:3;widows:3}
h2,h3   {page-break-after:avoid}
}

/* ------------------------------------------------------------------ */
.copyright{text-align:center;padding:15px 0}
.copyright p{margin:0}
.copyright p a{color:#222}
.copyright p a:focus,.copyright p a:hover{color:#c00}
@media (max-width:1200px) {  header h1{font-size:45px} }
@media (max-width:992px) {
header button{position:static}  
footer {display:block;}
}
