﻿/*
Hell-Blau : #bccad6;
Dunkel-Blau : #5d7e9a;
*/
body 
{
font-size:13px;
background:#ffffff url(../images/bg.gif) center top repeat-x; 			/* Hintergrundbild*/
margin:0px;
}

* {
	margin: 0px;
	padding: 0px;
	list-style: none; 
}
.clear {clear:both;}					/* Vergrößert den Hintergrund der Body in Vertical*/

a:link {text-decoration:none;color:#5d7e9a;}    /* unvisited link */
a:visited {text-decoration:none;color:#5d7e9a;} /* visited link */
a:hover {text-decoration:underline;color:#5d7e9a;}   /* mouse over link */
a:active {text-decoration:underline;color:#5d7e9a;}  /* selected link */
	
#wrap 									/* Die Gesamte Wrap wird angepasst*/
{
	width:840px;
	margin:auto;
}

#wrap .bottom_menu						/* Die Zwei Links auf auf dem Logo werden formatiert (Anmelden und Impressum)*/
{
	width: 840px;
	height: 5px;
	color: white;
	margin-top:5px;
	margin-bottom:5px;
	text-align: right;
}
#wrap .bottom_menu a:link
{
	text-decoration: none;
	float: right;
	color: white;
	font: 12px Calibri;
	padding-right:10px;
	text-align: right;
}

#wrap .bottom_menu li a:hover
{
	float: right;
	color: white;
	font: 12px Calibri;
	padding-right:10px;
	text-decoration: underline;
	text-align: right;
}
#wrap .bottom_menu a:visited
{
	text-decoration: none;
	float: right;
	color: white;
	font: 12px Calibri;
	padding-right:10px;
	text-align: right;
}

#header{
	width:		840px;
	height:		140px;
	margin-top:	30px;
}
	
#menu  ul{
	width:		840px;
	height: 	38px;				/* Hier durch lässt sich der abstand zwischen Navi-Button und der Body-Spalte einstellen*/
	list-style-type: none;	
}

#menu ul li{
	float: left;
	width: 120px;    /* Navi Button breite*/
}

#menu ul li a{	
	display:block;
	color: #404040;
	text-decoration: none;
	font: bold 14px Calibri;  /* Navi Button - Textgrößen ändern*/
	text-align: center;
	padding-top:10px;
	padding-bottom:10px;
	background: url(../images/button_bg.png);
	border-right:1px solid #FFF;
	}

#menu ul li a:hover{
	background: url(../images/button_hover.png);
	}
#menu .active{
	background: url(../images/button_hover.png);
}

#menu .current-menu-item A{
	background: url(../images/button_hover.png);
}

#body	h1
{
	color:	#5d7e9a;
	font:	bold 23px Calibri;	
}
	
#body	h2
{
	padding-top: 10px;
	color: #000;
	font:	bold 14px Calibri;	
}
#body						/* Body Anteil ab dem Überschrift */
{
	width:	840px;
	margin:	auto;
	background: url(../images/body_bg.png) repeat-x #e6eef4;	/* Schattenbild unter dem Navi-Button*/
	color: #000;
	font:	15px Calibri;	
}
#body .body_top						/* Gleich unterm Navi*/
{
	width:		750px;				/* Überschrift abstand zur LInke Randseite*/
	margin:		auto;
	padding-top: 	20px;			/* Überschriftsabstand vom Navi-Button*/
	padding-bottom: 10px;
	border-bottom: dotted  1px #5d7e9a; /* Horizontalerlinie unter dem Überschrift*/
}
#body .contentexample				/* Der Kasten auf der Projektseite wird platziert*/
{
	width:	750px;					/* Die Breite für den Kasten auf der Projektseite*/
	float:	left;
	padding: 0 10px 0 45px;			/* Links und Rechts position */
}

#body .contentexamplegastbook		/* Der Kasten auf der Projektseite wird platziert*/
{
	width:	450px;					/* Die Breite für den Kasten auf der Projektseite*/
	float:	left;
	padding: 0 0px 0 200px;			/* Links und Rechts position */
}

#body .content
{
	width:	690px;
	float:	left;
	padding: 0 30px 0 50px;	
}
#body .contentimg
{
	width:	690px;
	float:	left;
	padding: 0px 0px 0 110px;	
}
#body .medium{
	width: 840px;
	height: 20px;
	margin:	auto;
	background: url(images/body_bottom.png);
	}
	
#body .body_bottom{
	width:			840px;
	margin:			auto;
	padding-bottom: 20px;
}

a.tryitbtn, a.tryitbtn:link, a.tryitbtn:visited
{
display:inline-block;
color:#FFFFFF;
background-color:#5d7e9a;
font-weight:bold;
font-size:12px;
text-align:center;
padding-left:10px;
padding-right:10px;
padding-top:3px;
padding-bottom:4px;
text-decoration:none;
margin-left:5px;
margin-top:0px;
margin-bottom:5px;
border:1px solid #aaaaaa;
border-radius:5px;
white-space:nowrap;
}

a.tryitbtn:hover, a.tryitbtn:active
{
background-color:#ffffff;
color:#5d7e9a;
}
 input.tryitbtn, input.tryitbtn:link, input.tryitbtn:visited
{
display:inline-block;
color:#FFFFFF;
background-color:#5d7e9a;
font-weight:bold;
font-size:12px;
text-align:center;
padding-left:10px;
padding-right:10px;
padding-top:3px;
padding-bottom:4px;
text-decoration:none;
margin-left:5px;
margin-top:0px;
margin-bottom:5px;
border:1px solid #aaaaaa;
border-radius:5px;
white-space:nowrap;
}

input.tryitbtn:hover, input.tryitbtn:active
{
background-color:#ffffff;
color:#5d7e9a;
}

div.example 
{
    color:#000000;
    background-color:#bccad6;
    margin:auto;
    padding:5px;      /* Der Inhalt hält dem Rand etwas abstand*/
    border:1px dotted #5d7e9a;
    background-image:linear-gradient( #ffffff , #e4e9ee 100px);
}

div.exampleguestbookentre
{
    color:#000000;
    background-color:#bccad6;
    margin:auto;
    padding:5px;      /* Der Inhalt hält dem Rand etwas abstand*/
    border:1px dotted #5d7e9a;
    background-image:linear-gradient( #ffffff , #e4e9ee 100px);
}

td.exampleright
{
font-size:10px;
text-align: right;
}

td.exampleleft
{
font-size:10px;
text-align: left;
}

#shadow{
	width: 836px;
	height:23px;
	margin:auto;
	text-align: right;
	color:#E6E6E6;
	background: url(../images/body_shadow.png);
	}

.textfeld {
    height:20px;
	width:250px;
}

.arithmeticfeld {
	height:20px;
	width:70px;
}