@charset "UTF-8";
/* CSS Document */

body {
margin-top: 25px;
font-family:Arial, Helvetica, sans-serif;
font-size: 12px;
a { outline:none; }
}

#wrapper {
width : 1002px;
height : 100%;
margin : 0 auto;
padding : 0;
text-align : left;
}

#bckg_top {
margin: 0px;
padding: 0px;
background-image:url(/images/bckg_top.jpg);
background-repeat:no-repeat;
background-position:top;
width: 1002px;
height: 26px;
}

#bckg_mid {
margin: 0px;
padding: 0px;
background-image:url(/images/bckg_line.jpg);
background-repeat:y-repeat;
background-position:top;
width: 1002px;
height: 100%;
}

#bckg_sub {
margin: 0px;
padding: 0px;
background-image:url(/images/bckg_bot.jpg);
background-repeat:no-repeat;
background-position:top;
width: 1002px;
height: 70px;
}

#header {
margin: 0px;
padding: 0px;
background-image: url(/images/logo.gif);
background-repeat: no-repeat;
background-position: 55px 50%; 
width: 1002px;
height: 70px;
}

#nav {
margin : 0 auto;
padding: 0px 0px 0px 2px;
background-image: url(/images/bckg_menu.jpg);
background-repeat: x-repeat;
background-position: top; 
width: 940px;
height: 60px;
}

#spacer {
margin : 0 auto;
padding: 0px;
width: 940px;
height: 60px;
}

#contentframe {
margin: 0 auto;
padding: 0px;
width: 940px;
height: 100%;
}

#sidebar {
float:left;
width: 275px;
height: 100%;
margin-right: 60px;
margin-top: 0px;
padding: 0;
text-align:right;
}

#sidebar p {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #999;
line-height: 20px;
}

#sidebar h1 {
padding: 0;
margin: 0;
color: #ddd;
letter-spacing: -1px;
text-transform: uppercase;
}

#content {
float:right;
width: 605px;
height:100%;
margin: 0;
padding: 0;
}

#content p {
margin-top: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #999;
padding-right: 160px;
line-height: 20px;
}

#content h1 {
margin-top: 0px;
color: #999;
letter-spacing: -1px;
padding-right: 160px;
}

#hr_content {
width: 445px;
height: 1px;
background-color:#CCCCCC;
margin-top: 25px;
margin-bottom: 25px;
overflow: auto;
}

#newscontent {
float:right;
width: 605px;
height:100%;
margin: 0;
padding: 0;
}

#newscontent p {
margin-top: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #999;
padding-right: 160px;
line-height: 20px;
}

#content a.back2news:link, #content a.back2news:visited  {
margin-top: 0px;
font-family: Arial, Helvetica, sans-serif;
text-decoration:none;
font-size: 14px;
color: #666;
}

#content a.back2news:hover, #content a.back2news:active  {
margin-top: 0px;
font-family: Arial, Helvetica, sans-serif;
text-decoration:none;
font-size: 14px;
color: #333;
}

#content a:link, #content a:visited  {
margin-top: 0px;
font-family: Arial, Helvetica, sans-serif;
text-decoration:none;
font-size: 14px;
color: #666;
}

#content a:hover, #content a:active   {
margin-top: 0px;
font-family: Arial, Helvetica, sans-serif;
text-decoration:none;
font-size: 14px;
color: #333;
}

#newscontent h1 {
margin-top: 0px;
color: #999;
letter-spacing: -1px;
padding-right: 160px;
}

#newscontent h1 a:link, #newscontent h1 a:visited {
margin-top: 0px;
color: #999;
letter-spacing: -1px;
text-decoration: none;
}

#newscontent h1 a:hover, #newscontent h1 a:active {
margin-top: 0px;
color: #666;
letter-spacing: -1px;
text-decoration: none;
}

#gallerycontent {
float:right;
width: 605px;
height:100%;
margin: 0;
padding: 0;
}

#gallerycontent p {
margin-top: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #999;
padding-right: 160px;
padding-left: 150px;
line-height: 20px;
}

#gallerycontent h1 {
margin-top: 0px;
color: #999;
letter-spacing: -1px;
padding-right: 160px;
}

#gallerycontent h1 a:link, #gallerycontent h1 a:visited {
margin-top: 0px;
color: #999;
letter-spacing: -1px;
text-decoration: none;
}

#gallerycontent h1 a:hover, #gallerycontent h1 a:active {
margin-top: 0px;
color: #666;
letter-spacing: -1px;
text-decoration: none;
}

#gallerycontent img {
float:left;
margin: 0 20px 0 0;
padding: 4px;
border: 1px solid #D9E0E6;
border-bottom-color: #C8CDD2;
border-right-color: #C8CDD2;
background: #FDFDFD;
}

#formcontent {
margin : 0 auto;
padding: 0px;
width : 940px;
height : 100%;
}

#formcontent p {
padding-left: 335px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #999;
line-height: 20px;
margin-top: 0px;
}

#formcontent h1 {
margin-top: 0px;
color: #999;
letter-spacing: -1px;
}

#clear {
clear:both;
}

#footer {
font-size:9px;
color:#999;
margin-left:57px;
padding-top:43px;
}

#footer a:link {
color:#999;
text-decoration:none;
outline:none;
}

#footer a:hover {
color:#666;
text-decoration:none;
outline:none;
}

#footer a:active {
color:#666;
text-decoration:none;
outline:none;
}

#footer a:visited {
color:#999;
text-decoration:none;
outline:none;
}

/**************************************************************

	Gallery

**************************************************************/

#gallery {
margin : 0 auto;
padding: 0px;
width: 820px;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:#999999;
}

#MooFlow img {
cursor:pointer;
}

ul.sub {
list-style:none;
padding:0;
margin:0;
text-align:center;
}

ul.sub li {
display:inline;
padding:0;
}

ul.sub a {
background:#fdfdfd;
text-decoration:none;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight:bold;
color:#999999;
outline:none;
}

ul.sub a:hover{
color:#333333;
outline:none;
}

/**************************************************************

	NAVMenu

**************************************************************/


/* NAVSTATS */
#navstates { width: 940px; height: 60px; margin: 30px auto; position: relative; /*z-index: 9998;*/ }
#navstates #nav { margin: 0; padding-left: 2px; }
#navstates #nav li { display: inline; }
#navstates #nav li a { float: left; width: 225px; height: 0; padding-top: 60px; overflow: hidden; outline:none; }
#navstates #nav li a,
#navstates  { background-image: url(..//images/nav_states.png); _background-image: url(..//images/nav_states.png); background-repeat: no-repeat; }


/* BUTTONS*/
#navstates #nav li#home a { background-position: 0 0; }
#navstates #nav li#gallerie a { background-position: -225px 0; }
#navstates #nav li#info a { background-position: -425px 0; }
#navstates #nav li#kontakt a { background-position: -625px 0; }


/* OVER STATES*/
#navstates #nav li#home a:hover { background-position: 0 -60px; }
#navstates #nav li#gallerie a:hover { background-position: -225px -60px; }
#navstates #nav li#info a:hover { background-position: -425px -60px; }
#navstates #nav li#kontakt a:hover { background-position: -625px -60px; }


/* PRESSED STATES */
#navstates #nav li#home a:active { background-position: 0 -120px; }
#navstates #nav li#gallerie a:active { background-position: -225px -120px; }
#navstates #nav li#info a:active { background-position: -425px -120px; }
#navstates #nav li#kontakt a:active { background-position: -625px -120px; }


/* ON STATES*/
#navstates.hom #nav li#home a { background-position: 0 -180px; cursor:default; }
#navstates.gal #nav li#gallerie a { background-position: -225px -180px !important; }
#navstates.inf #nav li#info a { background-position: -425px -180px !important; }
#navstates.kon #nav li#kontakt a { background-position: -625px -180px !important; }


/*************************************************************/

/*	-------------------------------------------------------------
	Kontaktformular
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
       
/*	-------------------------------------------------------------
	STRUKTUR
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/


               div#formwrapper {
                    /* Allgemeines Container */
               	margin: 0;
               	width: 940px;
				padding: 0 0 35px 0;
				text-align:left;
				float:left;
               }

               div#formular {
                    /* Sub-Container, wird nach rechts verschoben, da links bei einem Formulare
                    weitere Elemente stehen werden. Typische Alternative: margin: 0 auto; */
                    margin: 0 auto;
               	padding: 0 5px 0 0;
               	text-align: left;
               	width: 500px;
               }
               .contactleft {
                    /* Linker Bereich des Formulars: Labels */
                    width: 10%;
                    clear: both;
                    float: left;
                    display: inline;
                    padding: 4px;
                    margin: 10px 0;
                    text-align: right;
               }
               .contactright {
                    /* Rechter Bereich des Formulars: Eingabefelder */
                    width: 70%;
                    text-align: left;
                    float: right;
                    display: inline;
                    padding: 4px;
                    margin: 5px 30px;
               }

/*	-------------------------------------------------------------
	GESTALTUNG VON EINGABEFELDERN
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
               input, textarea {
                    border: 1px solid #d6d6d6;
                    -moz-border-radius: 3px;
               }

               .contactform {
                    /* Hintergrundebene mittels overflow */
                    height: 100%;
                    overflow: auto;
                    
               }

               .contactform #Name,
               .contactform #Email,
               .contactform #Site,
               .contactform #Feedback {
                    width: 80%;
                    padding: 5px; 
                    color: #7b7b7b;
                    font: 1.1em/1.6em Verdana ,Arial, Helvetica, sans-serif; 
               }

               #subm {
                    /* Versenden*/
                    font: 1.1em/1.6em Verdana ,Arial, Helvetica, sans-serif; 
                    width: 100px;
                    border: 1px solid #d6d6d6;
                    padding: 4px 5px 4px 5px;
                    color: #7b7b7b;
					background: #fff;
                    
               }

               /*  ICONS EINGABEFELDER   */

               .contactform #Name {
                    background: #fff url(/images/user.jpg) no-repeat left;
               }
               .contactform #Email {
                    background: #fff url(/images/mail.jpg) no-repeat left;
               }
               .contactform #Site {
                    background: #fff url(/images/world.jpg) no-repeat left;
               }
               .contactform #Feedback {
                    width: 86%;
                    background: #fff url(/images/comment.gif) no-repeat bottom right; 
               }
               .contactform #Name,
               .contactform #Email,
               .contactform #Site 
               {
                    width: 80%;
                    padding: 5px 5px 5px 30px;
               }
               
               /* Hover-jeweilige Eingabefelder */
              
               .contactform #Name:hover,
               .contactform #Email:hover,
               .contactform #Site:hover,
               .contactform #Feedback:hover {
                    background-color: #fff;
                    border: 1px solid #d6d6d6;
                    color: #7b7b7b;
               }

               .contactform #Name:focus,
               .contactform #Email:focus,
               .contactform #Site:focus,
               .contactform #Feedback:focus
               {
                    border: 1px solid #d6d6d6;
                    color: ##7b7b7b;
                    background-color: #fff;
               }

               .contactform .wrong #Email {
                    /* Gestaltung der Felder mit Fehlermeldungen */
                    background: #ffffff url(/images/warning.gif) no-repeat left;
                    -moz-border-radius: 3px;
                    color: #333333;
                    border: 1px solid #d6d6d6;
               }
               
               .contactform #Erfolg {
                    /* Mitteilung: Informationen wurden versandt */
                    background: #fff url(/images/accept.gif) no-repeat left;
                    border: 1px solid #eeeeee;
                    color: #0066CC;
                    padding: 10px 10px 10px 30px;
                    -moz-border-radius: 3px;
                    width: 80%;
                    margin: 1.5em auto;
               }

/*	-------------------------------------------------------------
	ALLGEMEINE ATTRIBUTE
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
               h2 {
                    font-family: Verdana ,Arial, Helvetica, sans-serif;
                    font-weight: normal;
                    font-size: 4em; 
                    color: #7b7b7b;
               }
               span.required {
                    /* Markierung des Eingabefeldes */
                    color: #ccc;
                    font-size: 16px;
					padding-left: 2px;
               }
               label {
                    /* Beschriftung des Eingabeldes */
                    color: #999;
                    padding: 2px 5px 2px 5px;
                    
                    /* Hintergrundfarbe + Abrundung 
                    background-color: #5ea4d7;
                    -moz-border-radius: 3px;*/
               }
	

