/* 
// beginn der dead simple seite von <em>Dead Simple Grid</em> by <a href="http://agafonkin.com/en">Vladimir Agafonkin</a>. //<em>View the source</em> and <a href="http://github.com/mourner/dead-simple-grid">check it out on GitHub</a>!</p>*/ 
/* Dead Simple Grid (c) 2015 Vladimir Agafonkin */

.row .row { margin:  0 0.1em; }
.col      { padding: 0 0 0 1 em; }

.row:after {
    content: "";
    clear: both;
    display: table;
}

@media only screen { 
.col {
    float: left;
    width: 100%;
    box-sizing: border-box;
}}

/* Proper box-model */
*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* Clearfix hack */
.clearfix:before,.clearfix:after {	content: " ";	display: table;}
.clearfix:after {clear: both;}
/* Cleafix hack: IE6/7 support */
.clearfix {*zoom: 1;}
.row{margin:0 0 0 0;padding:0 0 0 0px}
.row:before,.row:after{content:"";display:table}
.row:after{clear:both}




@media only screen {
.col{float:left;width:100%;  	-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.nav{padding-top: 26px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 2mm;}
}

/* MEDIA QUERIES und FORMATs*/
.container { max-width:1920px;max-width:120rem; min-width:80px;min-width:10rem; }
 
/* fängt von klein an */
@media only screen and (max-width:34em) {
.feature:first-child,.feature{border-top: 12px solid #ff8000;}
.feature:first-child{border-top: 12px solid #d91a9f;}
FIELDSET, TABLE {width:90%}
.nav{background: linear-gradient(-40deg,rgba(0,200,200,0.4), #000000);}
.nav #nav ul li ul li {background:transparent;color:#ffffff;}

}

@media only screen and (min-width: 34em)  and (max-width:53.9em){
  /*	.feature:first-child,*/
.nav{background: linear-gradient(-40deg,rgba(25,254,254,0.4), #308aed);}
.nav #nav ul li ul li {background:transparent;}
	.row:second-child {padding-top:1rem;}
	.container {padding: 0px;width: 100%;background:#c8c9c0;}
	/*.feature:first-child,.info:first-child {border-right: none}*/
 	.feature, .info { width: 50%;}
	/*.feature{border-top: none;}
	*/feature:first-child{border-top: none;}*/
	/*.info {border-top: none;padding-top:1rem;}*/
		FIELDSET, TABLE {width:95%,align:center middle;}
  }
}

@media only screen and (min-width: 54em) and (max-width:71.9em){
 	.nav  { width: 12.50%;border-right:solid 1px red; }
	.info:first-child {border-bottom: 1px dotted #000000;}
	.container {padding: 0px;width: 70%;background:#c8c9c0;}
 
	.content { width: 70.00%;border-left:solid 1px #ff0000; padding-left:2mm; margin-bottom: 1em;}
	.sidebar, .rechts { width: 15%;border-left:solid 1px #000000;	min-height: calc(100vh - 250px)}
	.feature { width: 15%;border-left: solid 1px #000000;float:right;padding-left:4mm;}
	.feature:first-child{border-top: none;border-bottom:solid 1px black;}
	.feature:second-child{border-top: none}
}


		

/**/




@media only screen and (min-width: 72em) {
	.nav { width:15%;  margin: 0 0 0 0;background: linear-gradient(-90deg, #eafffe,rgba(240,240,240,0.1));}
	.nav { width:15%;  margin: 0 0 0 0;}
  	.content {width: 66.67%;background-color: #ffffff; border:none; padding-left:3mm;} /* 8/12 */
	.sidebar, .rechts { width: 15%;border-left:solid 1px #efefef;background: linear-gradient(315deg,rgba(254,254,254,0.4), #ebebeb);padding-left:4mm;} /* 2/12 */
	.feature, .info { width: 15%;}
	.feature{border-top: solid,4px,#eeeeee;}
	.info,.info:first-child {border-bottom: 1px dotted #9dc534;}

}  	 
/* END OF  MEDIA QUERIES und FORMATs*/




/*iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii  actual 5 style  iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii*/

/*
relative Groesen
 
'em'	font size of the element
'ex'	x-height of the element's font
'ch'	width of the "0" (ZERO, U+0030) glyph in the element's font
'rem'	font size of the root element
'vw'	1vw= 1/100 viewport's width 60 zeichen wäre 1,7vw
'vh'	viewport's height
'vmin'	minimum of the viewport's height and width
'vmax'	maximum of the viewport's height and width
*/
 
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display: block;}
 a img {border: none;}
img{max-width:100%}
H1,H2,H3,H4,H5,H6{text-transform:uppercase;margin-top: 2mm;margin-bottom:2mm;} 
H0{font-family:JefferiesExtended;font-size:1.6vw;}
ol, ol ul.children {list-style: none;}
FIELDSET {border:solid 1px #000000;padding:4mm 4mm 4mm 4mm;}
LEGEND {padding:4mm 4mm 0mm 4mm;}
table tr:nth-child(even) {background: rgba(f,e,0,0.8);}
caption, th, td {text-align: left;font-weight: 500;vertical-align: middle;}
q, blockquote {quotes: none;}
q:before,q:after,blockquote:before,blockquote:after {content: ""; content: none;}
#eingeruckt{padding-left:1cm;}
.einge{padding-left:1cm;}
.e{float:left; text-align:left;font-style:italic;max-WIDTH:100%;line-height:1.6;}
.rechts{padding-right:2mm;}


 
 
/* Hide: keep in to bots and screen-readers */
.visuallyhidden {
	position: absolute;
	width: 1px; /* Setting this to 0 make it invisible for VoiceOver */
	height: 1px; /* Setting this to 0 make it invisible for VoiceOver */
	padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(0 0 0 0);
    overflow: hidden;    
}

/* Image replacement */
.ir {	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

/* Break string */
.break {
	-ms-word-break: break-all;
	word-break: break-all;
	word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
}

/* Ellipse string */
.ellipsis {
	width: 250px;
	white-space: nowrap;
	overflow: hidden;
	-ms-text-overflow: ellipsis; /* Required for IE8 */
	-o-text-overflow: ellipsis; /* Required for Opera */
	text-overflow: ellipsis;
}

/* Make wrap in pre tags */
pre {
	white-space: pre-wrap;       /* Chrome & Safari */
	white-space: -moz-pre-wrap;  /* Mozilla since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

/* Float classes */
.float-right { float: right; }
.float-left { float: left; } 

/* Hide / Show classes */
.hide { display: none; }
.show { display: block; }


/* Disabled effect class */
.disabled {
	pointer-events: none;
	opacity: 0.5;
}

/* Links improvement */
a {
	text-decoration: none;
 	transition: all 0.3s ease-out;
	position: relative;
 }

 
/* Print */
@media print {
	* {
		background: none !important;
		color: black !important;
		box-shadow: none !important;
		text-shadow: none !important;

		/* Images, vectors and such */
		filter: Gray(); 						 /* IE4-8: depreciated */
		filter: url('desaturate.svg#grayscale'); /* SVG version for IE10, Firefox, Safari 5 and Opera */
		-webkit-filter: grayscale(100%); 		 /* Chrome + Safari 6 */
		-moz-filter: grayscale(100%); 			 /* Future proof */
		-ms-filter: grayscale(100%); 			 /* Future proof */
		-o-filter: grayscale(100%); 			 /* Future proof */
		filter: grayscale(100%); 				 /* Future proof or polyfilled */
	}
a:hover { color:#ff0000;font-weight:700;text-intent:2px; }

	 
	a[href]:after {
		content: " (" attr(href) ")"; 
	}

	a[href="#"],
	a[href="javascript:"] {
		content: "";
	}
}


 
 


/*Table hervorgehoben*/
.rot {border:solid 1px #ac09b9;background-color:#fef5fe;}
.orange {border:solid 1px #ff8040;background-color:#fdb99f;}
.gelb {border:solid 1px #f3fdb3;background-color:#e0fdd2;}
li.spitz:before { content: "j"; padding-left:7px;font-family:'Symbols'; }
.pfeil:before {content:"o";color:#d91a9f;font-family:'Symbols';}
   
.ellipsis {
    width: 250px;
    white-space: nowrap;
    overflow: hidden;
    -ms-text-overflow: ellipsis; /* Required for IE8 */
    -o-text-overflow: ellipsis; /* Required for Opera */
    text-overflow: ellipsis;
}


code {
	font-size: 1.2727em;
	color: #008080;
}
iframe {
	border: 0;
	overflow: hidden;
}


.footer {
	padding-top: 1.5rem;border-top: 1px dotted #ff8000;

}
.desc {
	color: #888;
}
.intro {
	border-bottom: 41px dotted #bbb;
	/*padding-bottom: 1.5em;*/
}
.social {
	border-top: 1px dotted #bbb;
	padding-top: 1.5rem;
}

/* minor responsive adjustments */
 
.content {
 	margin-bottom: 1.5em;
}

.200{min-height:200px;}


/* Retina */
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2), /* Looks like a bug, so may want to add: */
only screen and (   -moz-min-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
	/* Your retina specific stuff here */
}

/* Debug: empty Elements */
.debug div:empty, .debug span:empty,.debug li:empty,.debug p:empty,.debug td:empty,.debug th:empty { padding: 20px; 	border: 5px dotted yellow important;
}

/* Debug: empty Attributes */
.debug *[alt=""], .debug *[title=""], .debug *[class=""], .debug *[id=""], .debug a[href=""] {border: 5px solid yellow !important;}

/* Debug: deprecated Elements */
.debug applet, .debug basefont, .debug center, .debug dir, .debug font, .debug isindex, .debug menu, .debug s, .debug strike, .debug u {
	border: 5px dotted red !important;
}

/* Debug: deprecated Attributes */
.debug *[background], .debug *[bgcolor], .debug *[clear], .debug *[color], .debug *[compact], .debug *[noshade], .debug *[nowrap], .debug *[size], .debug *[start],.debug *[bottommargin], .debug *[leftmargin], .debug *[rightmargin], .debug *[topmargin], .debug *[marginheight], .debug *[marginwidth], .debug *[alink], .debug *[link], .debug *[text], .debug *[vlink],.debug *[align], .debug *[valign],.debug *[hspace], .debug *[vspace],.debug *[height], .debug *[width],.debug ul[type], .debug ol[type], .debug li[type] {
	border: 5px solid red !important;
}

/* Debug: proposed Deprecated Elements */
.debug input[type="button"], .debug big, .debug tt {
	border: 5px dotted #33FF00 !important;
}

/* Debug: proposed Deprecated Attributes */
.debug *[border], .debug table[cellpadding], .debug table[cellspacing] { 
	border: 5px solid #33FF00 !important;
}}


ul {
   margin: 0;
  padding: 0;
}



ul, menu, dir, #nav {
    display: block;
    list-style-type: none;
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
}