/**** Grundstruktur ****/ 
* { border:0; }
html { width:100%; height:100%; padding:0; margin:0;}
body { width:100%; height:100%; padding:0; margin:0; background-color:#fff; font-family:sans-serif; background-image:url(../bilder/back.png); background-repeat:repeat; position:absolute; top:0;}
div.clear{ clear:both; }

@media only screen and (min-width: 1921px) {

	/* Main */
	h1 { text-align: center; font-size:4em; font-weight:normal; letter-spacing:0.1em;}   
	#wrapper { width:80%; margin:auto 10%; position:relative; top:25%;}
	#main { margin-top:10%;}
    .box {width:29.33%; margin:5px 1%; padding:5px 1%; display:block; float:left;}
	.box a img {width:100%; display:block; box-shadow:0; transition:all ease 0.5s;}
	.box a img:hover {width:100%; display:block; box-shadow:8px 8px 16px #000; transition:all ease 0.5s;}
	.box p {margin:15px 0px; font-size:2.8em; line-height:130%; text-align:center;}
	#footer { width:100%; margin:20px 0px; text-align: center;}
	#footer a{font-size:2em; color:#000; text-decoration:none; display:inline;}
	.imp{font-size:2em; margin:5px 5px 5px 35px; line-height:120%;}
	.impu{font-size:2em; margin:5px 5px 5px 5px; line-height:120%; font-weight:bold;}	
}

@media only screen and (min-width: 980px) and (max-width: 1920px){

	/* Main */
	h1 { text-align: center; font-size:2em; font-weight:normal; letter-spacing:0.1em;}   
	#wrapper { width:100%; max-width:1200px; margin:auto;}
	#main { margin-top:25%;}
    .box {width:29.33%; margin:5px 1%; padding:5px 1%; display:block; float:left;}
	.box a img {width:100%; display:block; box-shadow:0; transition:all ease 0.5s;}
	.box a img:hover {width:100%; display:block; box-shadow:4px 4px 8px #000; transition:all ease 0.5s;}
	.box p {margin:15px 0px; font-size:1.4em; line-height:130%; text-align:center;}
	#footer { width:100%; margin:20px 0px; text-align: center;}
	#footer a{font-size:1em; color:#000; text-decoration:none; display:inline;}
	.imp{font-size:1em; margin:5px 5px 5px 35px; line-height:120%;}
	.impu{font-size:1em; margin:5px 5px 5px 5px; line-height:120%; font-weight:bold;}
}

@media only screen and (min-width: 760px) and (max-width: 979px) {

	/* Main */
	h1 { text-align: center; font-size:1.6em; font-weight:normal; letter-spacing:0.1em;}   
	#wrapper { width:100%; max-width:1200px; margin:auto;}
	#main { margin-top:15%;}
    .box {width:29.33%; margin:5px 1%; padding:5px 1%; display:block; float:left;}
	.box a img {width:100%; display:block; box-shadow:0; transition:all ease 0.5s;}
	.box a img:hover {width:100%; display:block; box-shadow:4px 4px 8px #000; transition:all ease 0.5s;}
	.box p {margin:15px 0px; font-size:1.2em; line-height:130%; text-align:center;}
	#footer { width:100%; margin:20px 0px; text-align: center;}
	#footer a{font-size:1em; color:#000; text-decoration:none; display:inline;}
	.imp{font-size:0.9em; margin:5px 15px 5px 55px; line-height:120%;}
	.impu{font-size:0.9em; margin:5px 15px 5px 15px; line-height:120%; font-weight:bold;}      
}

@media only screen and (max-width: 759px) {

	/* Main */
	h1 { text-align: center; font-size:1.3em; font-weight:bold; letter-spacing:0.05em;}   
	#wrapper { width:100%; max-width:1200px; margin:25px auto;}
	#main { }
    .box {width:90%; margin:5px 2%; padding:5px 3%; display:block; float:left;}
	.box a img {width:100%; display:block; box-shadow:0; transition:all ease 0.5s;}
	.box a img:hover {width:100%; display:block; box-shadow:4px 4px 8px #000; transition:all ease 0.5s;}
	.box p {margin:5px 0px; font-size:1.2em; line-height:130%; text-align:center;}
	#footer { width:100%; margin:10px 0px; text-align: center;}
	#footer a{font-size:1em; color:#000; text-decoration:none; display:inline;}
	.imp{font-size:0.9em; margin:5px 15px 5px 55px; line-height:120%;}
	.impu{font-size:0.9em; margin:5px 15px 5px 15px; line-height:120%; font-weight:bold;}      
}