/* test.css  */

 *  {
	font-family	: sans-serif, 'Comic Sans MS', arial; /* Immer Family schreiben  */
	color		: #000000;
	font-size		: 18px;
	line-height		: 27px;
	box-sizing	: border-box;	
}
html {
	background-image: url("../img/bg_check.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	min-height	: 100%;
}
html, body{
	margin	: 0 auto;
	padding	: 0;	
	border	: 0;	
}
body{
	background	: LIGHTsteelBLUE;
	border		: 1px solid goldenrod;	
	width		: 100%;    /*  Fixe Breite z. B. 480px 768px oder 50% 120%  */
	min-width	: 460px;
	max-width	: 71em;	
}
#rauf{
	position: fixed; bottom: 20px; right:20px; padding:10px; border: black 1px dotted; background-color: orange; z-index:2;
}
.band{
	background	: transparent;
	padding		: 0.1em 0 0 2.0em;
	margin		: 0px 0px 0px 0px;
	border-top	: 1px solid white;		
	border-bottom	: 1px solid white;
	clear: both;
}
#corpus{
	background-color: transparent;
	border-top	: 0px solid maroon;
	border-bottom	: 0px solid green;		
	margin		: 0 0 0 0;
	padding		: 20px 30px 30px 30px;

	left		: 0%;
	width		: 100%;
	height		: 100%;

}
abc{
	font-size	: 1.26em;
	color: #fff;	
}
efg{
	font-family	: 'Comic Sans MS', arial; /* Immer Family schreiben  */
	font-size	: 0.95em;
}
abc{
	color: #fff;	
	font-size	: 1.16em;
}
efg{
		color: #e1e1e1;
	font-family	: 'Comic Sans MS', arial; /* Immer font-family schreiben  */
	font-size	: 0.95em;
}
/* a * [target]{
	border		: 20px solid red;
}
 * [title]{
	border		: 20px solid red;
} */
   /*        {border: 20px solid #fa0000;}  */
.spalte{
	background	: lightcyan;	
	border		: 10px dotted green; /* groove ridge double dotted */
	padding		: 2% 0.1% 2% 1.52%;	
	width		: 50.0%;
	float		: left;	
}
.nofloat{
	clear:both;
	border	: 1px solid red;	
	padding		: 2% 21.3% 2% 1.52%;	
	
 }

 #tabelle{
	 display	: table;
	background	: peachpuff;	 
	clear		:both;	 
 }
 .t_zelle{
	display		: table-cell;
	padding		: 1.2em 0 1.2em 1.2em;
	background	: yellow;		
 } 
 #flexibel{
	clear		: both;	 	 
	background	: red;		 
	display		: flex;
	flex-direction: row;
	 
 }
 #a_1{
	background	: pink;
	padding		: 1.2em 0 1.2em 1.2em;

 }
 #a_2{
	background	: lightgreen;
	padding		: 1.2em 0 1.2em 1.2em;	
 }
 #a_3{
	background	: lightblue;
	padding		: 1.2em 0 1.2em 1.2em;	
 } 
footer{
	clear:both;
}
#rechteck{
	margin-top:2em;
	margin-right:2em;
	margin-bottom:2em;
	margin-left:1em;
	transform: rotate(272deg);
	visibility: visible;	/* visibility: visible;/hidden; | display: inline/block/none=kein Platz reserviert in Ansich wie bei visibility:hidden */ 
}
#kleinherz{
}
span:hover{
		 font-weight: bold;
		color: cyan;
}
span:active{
		color: magenta;
}	 	 
p:hover{
		color: sienna;
}
p:active{
	color: red;
	 font-weight: bold;		
}
p:focus{
	color: yellow;
}
#kopf_banner {
	background	: transparent url(../img/hometopbotori.jpg) top left repeat-x;
	border		: 0px;
	margin		: 0px;
	position	: relative;
	top			: 0px;
	left		: 0px;
	width		: 100%; 
	height		: 100px;	

}  
#kopf_banner_1{
	background: violet url(../img/math7777.png) top left repeat-x;
	top			: 0px;	
	border		: 0px;
	margin		: 0px;
	position	: relative;	
	left		: 0%;
	width		: 100%;
	height		: 100px;

}
#kopf_banner_gedanken{
	background		: violet;
	background-image: url(../img/gedanken1.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	top			: 0px;	
	border		: 0px;
	margin		: 0px;
	position	: relative;	
	left		: 0%;
	width		: 100%;
	height		: 100px; /* ursprünglich 58px; jetzt gleich wie #kopf_banner_math_index  */
}
#corpus{
	background-color: #fafad2; /*  KHAKI = #f0e68c; dunkler =  #d4e177; wie transparend = #g4ef97; LIGHTsteelBLUE; = #b0c4de; PALEGOLDENROD; = #eee8aa; LIGHTGOLDENRODYELLOW; = #fafad2; */
	border-top	: 0px solid maroon;
	border-bottom	: 0px solid white;		
	margin		: 1px 0px 1px 0px;
	padding		: 20px 30px 30px 30px;

	left		: 0%;
	width		: 100%;
	height		: 100%;

} 
#fuss_banner_1 {
	background	: transparent url(../img/math7777.png) left repeat-x;
	border		: 0px;
	margin		: 0px;
	position	: relative;
	top			: 0px;
	left		: 0%;
	height		: 100px;
	width		: 100%;

}
#fuss_banner {
	background	: transparent url(../img/homebottopori.jpg) left repeat-x;
	border		: 0px;
	margin		: 0px;
	position	: relative;
	top			: 0px;
	left		: 0%;
	height		: 100px;
	width		: 100%;
}
#fuss_banner_gedanken{
	background		: violet;
	background-image: url(../img/gedanken.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	top			: 0px;	
	border		: 0px;
	margin		: 0px;
	position	: relative;	
	left		: 0%;
	width		: 100%;
	height		: 100px; /* ursprünglich 58px; jetzt gleich wie #kopf_banner_math_index  */
}
.z,  .y, .x{
	background: url("../img/xyz.png") no-repeat;
	display: inline-block;
	width: 64px;
	height: 64px;
}	
.x:link{background-position: 0px 0px;}
.x:hover {background-position: -68px 0px;}
.x:active {background-position: -136px 0px;}

.y:link{background-position: 0px -68px;}
.y:hover {background-position: -68px -68px;}
.y:active {background-position: -136px -68px;}

.z:link{background-position: 0px -136px;}
.z:hover {background-position: -68px -136px;}
.z:active {background-position: -136px -136px;}


	/*		Beginn nav_wolf  */
	/*	BEGINN nav_wolf  */
	/*	BEGINN nav_wolf  */
#nav_wolf{
	background-color: transparent;
	padding: 0.1em 0.4em 0.1em 0.1em;	
	margin: 5px 0px 5px 30px;
	height: 35px;
}
#nav_wolf ul{
	list-style-type: none;
	margin: 0;
	padding: 0;

}
#nav_wolf ul li{
	padding: 0 0 0 0;
	float: left;

}
 ul li  a   {               /*      :link   weglassen sonst nicht richtig    */
	background-color: lightgray;
	display: block;
	font-family	: Arial, 'Comic Sans MS', sans-serif,  "Times New Roman";	   	
	font-size		: 1.0em;			/*	 font-size und line-height bei a geht */
	line-height		: 1.0em;			/*	 font-size und line-height bei a geht */

	text-indent	: 0px;
	text-decoration: none;	
	padding: 0.3em 0.4em 0.2em 0.4em;
	margin: 0 1.1em 0 0.1em;
 /* border: 1px solid yellow; */
	border-top: 1px solid yellow;	
	border-right: 1px solid darkgray;
	border-bottom: 1px solid darkgray;
	border-left: 1px solid yellow;
/*		width: 100px;  */	
}
  a:focus{
	background-color: bisque; /* silver; */
}
a{
	color: green;
}
#nav_wolf  ul li a:visited{
}
#nav_wolf ul li a:hover{		/*	Ludwig Von Hessen Fährt Auto :link :visited :hover :focus :active */
	background-color: LIGHTSLATEGRAY; /* silver; */
/*	border: 1px solid darkgray; */
	border-top: 1px solid red;		
	border-right: 1px solid black;	
	border-bottom: 1px solid black;
	border-left: 1px solid red;
	font-weight: bold;
}
#nav_wolf  ul li a:focus{
	background-color: orange; /* silver; */
}
#nav_wolf  ul li a:active{
	background-color: orange; /* silver; */

	border-top: 1px solid yellow;		
	border-right: 1px solid yellow;	
	border-bottom: 1px solid yellow;
	border-left: 1px solid yellow;	
}

	/*	ENDE nav_wolf  */
	/*	ENDE nav_wolf  */
	/*	ENDE nav_wolf  */


 	/*	Anfang nav @media  */
 @media only screen and (max-device-width: 768px){
	body{
		background	: violet;	
		border		: 1px solid green;	
		color		: maroon;
		width		: 900px;			
	}	
}
@media only screen and (max-device-width: 480px){
	body{
		background	: slategrey;	
		border		: 1px solid blue;	
		color		: 123123;
		width		: 730px;		
	}
#rechteck{
	display: none;
}	
}


 

 /*	ENDE nav_wolf  und  @media */

 /*		Ende nav_wolf und @media  */

	/*	E O F 	*/



/*    E O F           */