html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: top; box-sizing: border-box;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; WIDTH: 100%; height: auto;}
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

html, body, #main, main {height: 100%; width: 100%; font-size: 16px;}
section {width: 100%; min-height: 100%; padding-bottom: 3.5rem;}
html, body, input, textarea {font-family: "Yantramanav", Helvetica, Calibri, Arial, sans-serif; line-height: 1.75rem; font-size: 1rem;}
label {cursor: pointer}
input, textarea {border-radius: 4px;}
.b {font-weight: 700}

.gwrap {font-size: 0%; line-height: 0%; padding: 0 30px; text-align: left;}

/************************* TYPE ESSENTIALS - HANDLE WITH CARE *************************/
a {transition: all .2s ease;}
h1, h2, h3, h4, span.headl {font-weight: 300; line-height: 3.5rem;}
h1, h2 {font-size: 3em;}
li, p {line-height: 1.25rem;}
table { border-collapse: collapse; border-spacing: 15px; }
h1 + p, h2 + p, h1 + h2, h2 + h3, h1 + h3, .twocols, p + h3, .twocols + p, .twocols + h3 {padding-top:1.5rem;}
p + p, img + p, .twocols h3 + p, .headlines div, ul + p  {padding-top: 1.75rem}
.padme {padding-top: 3.5rem !important}

/*** ALLE RASTERZELLEN WERDEN ZUNÄCHST AUF 100% GESETZT ***/
.g01, .g02, .g03, .g04, .g05, .g06, .g07, .g08, .g09, .g10, .g11, .g12 {text-align: left; display: inline-block; font-size: 1rem; line-height: 1.75rem; padding: 0 10px; width: 100%}

.nopad {padding: 0}
.baseline {vertical-align: baseline}

@media screen and (min-width: 400px) {
h3, span.headl {font-size: 1.5em; line-height: 2.625rem}

.g01, .g02, .g03, .g04, .g05, .g06, .g07, .g08, .g09, .g10, .g11, .g12, .col-1, col-2 {padding: 0 20px}
}

@media screen and (min-width: 600px) {
.g01, .g02, .g03, .g04, .g05, .g06, .g07, .g08, .g09, .g10, .g11, .g12 {padding: 0 30px}
    /* RASTER 12 */ .g01, .g02, .g04 {width: 33.33%}  .g05, .g06, .g07, .g08, span.headl {width: 66.66%}.g03, .g09, .g10, .g11, .g12 {width: 100%}
   
    }

@media screen and (min-width: 900px) {
h1 + h2, h2 + h3, span.headl {padding-top: 3.5rem;}
/* RASTER 12 */    .g01, .g02 {width: 16.66%} .g04, .g03, .g05, .g06 {width: 50%} .g07, .g08, span.headl {width: 66.66%} .g09, .g10 {width: 83.33%}

    }


@media screen and (min-width: 1200px) {
/* RASTER 12 */     .g01 {width: 8.33%} .g02 {width: 16.66%} .g03 {width: 25%} .g04 {width: 33.33%} .g05 {width: 41.66%} .g06 {width: 50%} .g07, span.headl {width: 58.33%} .g08 {width: 66.66%} .g09 {width: 75%} .g10 {width: 83.33%} .g11 {width: 91.66%}

}