@media(max-width: 400px){
    #box{
		background-color:#FFF;
		border-top:3px solid #0744b7;
		width:100%;
		line-height:1.5em;
	}

	td{
        display:block; 
        float:left; 
        page-break-after:always; 
    	text-align: center;
		width:100%;
    }
	
	h1{
		font-size: 18pt;
		text-align: center;
	}
	
	h2{
		font-size: 16pt;
		text-align: center;
	}
}

@media(max-width: 700px) and (min-width: 401px){
	#box{
		background-color:#FFF;
		border-top:3px solid #0744b7;
		width:100%;
		line-height:1.5em;
	}

	#pictable{
		margin-left: auto;
    	margin-right: auto;
    }
	
	td{
		page-break-after: always;
		text-align: center;
		display: block;
		float: left;
		width: 100%;
	}
	
	h1{
		font-size: 18pt;
		text-align: center;
	}
	
	h2{
		font-size: 16pt;
		text-align: center;
	}
}

@media(min-width: 701px){
	#box{ 
	    background-color:#FFF;
	    border-top:3px solid #0744b7;
	    width:90%;
	    margin-left: auto;
    	margin-right: auto;
        line-height: 150%;
	    padding : 0% 3% 1% 3%;
		max-width:850px;
	}

    #pictable{
    	float:left;
    	display: block;
        margin-left: auto;
        margin-right: auto;
    }
}

fieldset{
	border: 0;
}

h1{
    line-height: 150%;
}

.tags{
	font-size: 12px;
}

body{
    background-color:#eeeeee;
	font-family:Century Gothic, Arial, Courier New, Sans-Serif;
	background-image:url(pics/splash.jpg);
	background-attachment:fixed;
	background-repeat:no-repeat;
}

h1{color:#555;}



h2{color:#555;}



form{font-size: 12pt;

	font-weight:bold;}

	

.u1{color:#36d;}

#pic{
width: 100%;
}

#st{border-bottom:1pt solid;}



#foot{font-size:8pt; color:#555;}



.error{color:#ff0000;}



.einfach{font-size: 12pt;

		font-weight:normal;}

.navigationsboxen{  
				float:right;
				text-decoration:none;
				background-color: none;
				color:#666;
				font-size: 16px;
				cursor: auto;
				text-align: center;
				padding: 1% 1% 0% 1%;
}
.navigationsboxen:link{
}
.navigationsboxen:visited{
}
.navigationsboxen:focus{
				background-color:#0744b7;
				color:#FFF;
}
.navigationsboxen:hover{
				background-color:#06F;
				color:#FFF;
}
.navigationsboxen:active{

}

#rechner{
    margin: auto;
}

.rechnerbox{
    text-decoration:none;
    color:#666;
    font-size: 16px;
    text-align: center;
    padding: 15px 15px 15px 15px;
}					 
.rechnerbox:link{
}
.rechnerbox:visited{
}
.rechnerbox:focus{
				background-color:#0744b7;
				color:#FFF;
}
.rechnerbox:hover{
				background-color:#06F;
				color:#FFF;
}
.rechnerbox:active{
				
}

:link = für Verweise zu noch nicht besuchten Seiten
:visited = für Verweise zu bereits besuchten Seiten
:focus = für Elemente, die den Fokus erhalten, z.B. durch "Durchsteppen" mit der Tabulator-Taste (CSS 2.0)
:hover = für Elemente, während der Anwender mit der Maus darüber fährt (CSS 2.0)
:active = für gerade angeklickte Elemente
