/* =================================================================================
Stylesheet für die Intrinsic Homepage 
Datum: 29-08-2007
Autor: Condensator
Aufbau: 1. Kalibrierung und Styles
             2. Styles für Layoutbereiche
	   3. Sonstige Styles
====================================================================================*/

/*=================================
    1. Kalibrierung und allgemeine Styles
=================================*/

/* Kalibrierung der wichtigsten Abstände*/	
* { padding: 0; margin: 0; }

/* Abstand nach unten */
p, ul { margin-bottom: 1em; } 


/* Abstand von links */
li { margin-left: 1em; } 


/* Allgemeine Selektoren */
html { height: 101%; } /* Erzwingt Scrollbar im Firefox */

body
{
color: white;
background-color: #5f5f5f;
background-image: url(grafik/zinc04braun.jpg);
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
}

h1 { font-size: 120%; color: #8da8c5; }
h2 { font-size: 100%; color: #6272a2; }
h3 { font-size: 80%; color: #FAAC58; }
p { font-size: 80%; }
ul { font-size: 80%; }


address 
{
text-align: center;
font-size: 80%;
font-style: normal;
letter-spacing: 2px;
line-height: 1.5em;
}

/*Hyperlinks allgemein */

a { text-decoration: none; outline: none; }

a:link { color: #3fddef; }

a:visited { color: #1a80ff; } 

a:hover, :focus  {border-bottom: 0px solid #ffffff; }

a:active { 
color: white
background-color:#cc00cc;
}


/* Allgemeine Klassen und IDs */

/*Link um das Navigationsmenue zu überspringen (Barrierefreiheit)*/
.skiplink
{
position: absolute;
top: -2000px;
left: -3000px;
width: 0px;
height: 0px;
overflow:hidden;
display:inline;
}

/*Mp3 Player Klasse*/
.player
{
width: 700px;
text-align: center;
color: white;
background-color: black;
margin-top: 20px;
margin-right: auto;
margin-bottom: 20px;
margin-left: auto;
}

/* Klasse für Hover-Links im #textbereich  */
a:hover.textlinks
{
border-bottom: 1px solid #ffffff;
border-bottom-color: white;
}


/*Breite und Abstand der Textboxen im #Textbereich*/
.text
{
width: 680px; 
margin: 5px auto 30px auto;
padding: 5px 20px 5px 20px; 
background-color: black;
}

.datum 
{
width: 680px; 
margin: -15px auto 30px auto;
padding: 5px 20px 5px 20px; 
background-color: black;
font-size: 70%;
}



/*Schriftgröße fuer Text unter dem Mp3 Player*/
.playerfont
{
font-size: 50%;
}


.banner
{
background-image: url(grafik/Banner-Intrinsic-Condensator.jpg);
background-repeat: no-repeat;
display: block;
height: 83px;
width: 800px;
top: 0px;
left: 50%;
}

.normal
{
margin: 5px auto 5x auto;
padding: 5px 20px 5px 20px; 
}

p.gaestebuch
{
width: 400px; 
margin: 5px auto 10px auto;
padding: 5px 20px 5px 20px; 
background-color: #485578;
}



/*============================
   2. Styles für die Layoutbereiche
 ============================*/


#wrapper
{
color: #d9d9d9;
background-color: #485578;
width: 800px; 
margin: 10px auto;

}

/*
#kopfbereich
{
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
*/
/*
#kopfbereich h2 { text-align: center; }
*/

/*
#kopfbereich p 
{
padding: 5px 0 5px 0;
margin-bottom: 0;
}

*/

/* Navibereich Formatierungen*/

#navibereich
{
text-align: center;
background-color: #1F1A17;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
border-bottom: 0px solid #8c8c8c;
font-size: 150%;
}

#navibereich li 
{ 
display: inline; 
list-style-type: none; 
margin: 0 0 0 0;
}

#navibereich a  
{
text-decoration: none;
color: black;
background-color: #efefef;
padding: 0 8px 0 8px;
border: 0px solid #000000;
}


#navibereich a:hover
{
color: #ff0080;
border-bottom: 1px solid #ffffff;
border-bottom-color: white; 
}

#navibereich a:focus
{
color: red;
background-color: purple;  
border-bottom: 1px solid #ffffff;
border-bottom-color: white;
}

#startseite #navi01 a,
#music #navi02 a,
#lyrics #navi03 a,
#video #navi04 a,
#kontakt #navi05 a,
#gaestebuch #navi06 a,
#spass #navi07 a
{
color: #7d91aa;
background-color: #485578;  
border-bottom-color: white; 
}





/* Textbereich Formatierungen*/


#textbereich
{
color: #d9d9d9;
background-color: #485578;
margin-top: 10px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
}

/*
#textbereich  h1, h2, p , ul
{ 
margin: 0px 20px 0px 20px;
padding: 0px 20px 0px 20px; 
background-color: black;
}
*/

#counter
{
text-align: center; 
margin-top: 5px;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto;
padding: 0px 20px 0px 20px; 
background-color: black;
}



#textbereich #mp3 
{
text-align: center; 
}
#textbereich  .player p 
{
border-bottom: 5px solid #485578;
}

#textbereich  h2
{
margin-bottom: 5px;
}

#textbereich p
{
margin-top: 5px;
margin-right: auto;
margin-bottom: 50px;
margin-left: auto;

}

#textbereich h1
{
margin-top: 5px;
margin-right: auto;
margin-bottom: 2px;
margin-left: auto;
}
#textbereich #bildstartseite
{
/*width: 556px;
height: 510px;
*/
width: 520px;
height: 568px;
margin-top: 20px;
margin-right: 30px;
margin-bottom: 20px;
margin-left: 30px;
}

#pleftlyrics
{

width: 680px;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
padding: 20px 20px 5px 20px; 
background-color: black;
font-size: 80%;
}

#prightlyrics
{
width: 150px;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
padding: 20px 20px 5px 20px; 
background-color: black;

}






/* Formatierungen für das Gästebuch*/
#textbereich  table
{
margin-top: 0;
margin-right: auto;
margin-bottom:0;
margin-left: auto;
}

#none
{
color: #d9d9d9;
background-color: #485578;
}

/* Fussbereich Formatierungen*/

#fussbereich
{
width: 800px;
color: white;
background-color: black;
margin-top: 10px;
margin-right: auto;
margin-bottom: 20px;
margin-left: auto;
border-top: 1px solid #8c8c8c;
}






/*=================================
E N D E   D E S   S T Y L E S H E E T S
=================================*/














