﻿
/**
*  Beginn         26.08.2020
*  Veröffentlicht 
*
*  Erstellt von Ulrich Vollmer
*  www.ulvo.de
*/


/* Die wichtigsten Werte auf Null setzen */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a, acronym, address, code, del, em, img, q, small, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0; padding: 0; border: 0; outline: 0;
font-weight: inherit; font-style: inherit; font-size: 100.1%;
font-family: inherit; font-variant: inherit; vertical-align: baseline;
}

body { background: #ffaf00; }
body, p, a, td, li, ul { font-family: verdana, arial, sans-serif; }

h1 { font-family: verdana, sans-serif; text-align: left; color: #fff; background: #ffaf00; margin: 10px 10px 5px 0; }
h2 { font-family: Verdana, sans-serif; color: #305496; margin: 5px 10px 5px 0; }
h3, h4 { font-family: arial, sans-serif; }
.kl { font-size: 1.2rem; color: #ccc; }
h3 { font-size: 1.5rem; color: #ffaf00; margin: 7px 0; } /* #404040 */
h4 { font-size: 1rem; color: #ff6a00; font-weight: bold; }

p, td, li, div { font-size: 1rem; color: #666; }
p { margin: 5px 20px 5px 20px; -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; }
p.sp { columns: auto 350px; column-gap: 2rem; }
ul { margin: 5px 0 10px 20px; }
ol li { color: #fff; margin-left: 60px; margin-right: 20px; }
li { margin-bottom: 5px; }

td { background: transparent; padding: 15px; }
h2.ar { text-align: right; float: right; margin-right: -5px; clear: both; }
h2.ac, p.ac { text-align: center; clear: both; }

h1, h2, p, li, td, a { -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; }

a, a:visited { font-family: verdana, helvetia, arial; font-size: 1em; color: #fff; background: #ff6a00; text-decoration: none; }
a:hover, a:active { color: #ff6a00; background: #fff; text-decoration: none; }

#oben { position: fixed; bottom: 40px; right: 20px; width: 60px; height: 60px; display: none; text-align: center; background: #fff; z-index: 999; border-radius: 50%; }
#oben a { color: #ff6a00; background: transparent; text-decoration: none; font-size: 2.5em; padding: 8px }


.clean { clear:both; display:block; overflow:hidden; visibility:hidden; width:0; height:0; }
article { border: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-background-clip: padding-box !important; -webkit-background-clip: padding-box !important; background-clip: padding-box !important; background: transparent; z-index: 2; }

.bg1 { background: #666 url(img/bg1_guettke.jpg) 0 0 fixed; background-size: cover; }
.bg2 { background: #666 url(img/bg2_landschaft.jpg) 0 0 fixed; background-size: cover; }


/* 0px - 550px 
----------------------------------------------------------------------------- */

@media screen and (min-width: 0px) and (max-width: 550px) {

.cont {margin: 10px auto; padding: 0 20px; }
/*.row { width: 98%; margin: 0; border-radius: 0 }
.col { padding: 0; margin: 0 auto; min-height: 30px; border-radius: 0; }*/
header, nav, section, footer { width: 98%; margin: 0; border-radius: 0 }
article { padding: 0; margin: 0 auto; min-height: 30px; border-radius: 0; }
h1 { font-size: 2.5rem; }
h2 { font-size: 1.7rem;  color: #fff; background: #ffaf00; padding: 5px 15px; width: fit-content; }
p, td { font-size: 0.9rem; }
}

/* Grid 551px - Infinity 
----------------------------------------------------------------------------- */
 @media screen and (min-width: 551px) {
.cont { margin: 0 auto; padding: 0 20px; }
header, nav, section, footer { max-width: 900px; margin: 0 auto; }
article { padding: 0; margin: 0 auto; }
/*.row { max-width: 900px; margin: 0 auto; }
.col { padding: 0; margin: 0 auto; }*/
h1 { font-size: 3.5rem; }
h2 { font-size: 2.5rem; color: #fff; background: #ffaf00; padding: 5px 15px; width: fit-content; }
/*div.ac { width: 32.33333%; margin: 0 0.5%; float: left; }*/
}

