/* =============================================
Stylesheet REDPONY Digitale Medien & MAC Support 
  
Stand: Fertigstellung
Datei: bildschirm.css 
Datum: 14. Januar 2009
Autor: Roland Heuberger 

Aufbau: 1. Kalibrierung
        2. Allgemeine Styles
        3. Styles für Layoutbereiche
        4. Sonstige Styles 
============================================= */

/* ==================================
   1. Kalibrierung
   =============================== */

* { padding: 0; margin: 0; } 
 
h2, h3, p, ul, ol { margin-bottom: 1em; } 

ol ul { margin-bottom: 0; } 

li { margin-left: 2em; }    
   
/* ==================================
   2. Allgemeine Styles 
   =============================== */   

html { height: 101%; }    
   
body { 
  background-color: #353535;
  background-image:url(../bilder/bg.gif);
  color: white; 
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: small;
}

h1 { font-size: 150%; }
h2 { font-size: 130%; }
h3 { font-size: 110%; }

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

/* ================
   Hyperlinks    */  

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

a:link,
a:visited { 
	color: black;
}

a:hover, 
a:focus { 
 text-decoration: none; 
 outline: none;  
} 
a:active { 
  text-decoration: none; 
  outline: none; 
}  

/* =====================
   Klassen und IDs    */

.skiplink {
  position: absolute; 
  top: -5000px; 
  left: -5000px; 
  width: 0;
  height: 0; 
  overflow: hidden; 
  display: inline; 
}

.bildlinks {
  float: left; 
  padding: 8px; 
  border: 0px;
  margin-left: -18px;
  margin-right: 10px; 
  margin-top: -18px;
  margin-bottom: -2px; 
}
.bildrechts {
  float: right; 
  padding: 8px; 
  border: 0px solid #cccccc;
  margin-bottom: 10px; 
  margin-left: 10px; 
}

.clearing {
  clear: both; 
}

.headline {
	position:relative;
	top:32px;
	left:95px;
}
.subline {
	font-variant:small-caps;
	border: 0px;
}

#logo { 
  padding-bottom: 10px; 
  border: 0px; 
}

/* ==================================
   3. Styles für Layoutbereiche 
   =============================== */   

#wrapper {
  margin: 30px auto;
  padding:10px 5px 0px 5px; 
  background-color: white; 
  color: black; 
  width: 770px; 
}  

#textbereich_start {
	margin: 5px 5px 0px 10px;
	background-image:url(../bilder/start_bg.png);
	background-repeat:no-repeat;
	height:460px;
}

#textbereich_portfolio {
	margin: 5px 5px 0px 10px;
	background-image:url(../bilder/portfolio_bg.png);
	background-repeat:no-repeat;
	height:460px;
}

#textbereich_kontakt {
	margin: 5px 5px 0px 10px;
	background-image:url(../bilder/kontakt_bg.png);
	background-repeat:no-repeat;
	height:460px;
}


div.portfolio {
	margin-left:320px;
	overflow: hidden; /* zum Umschließen der Floats */ 
}
	div.portfolio p {
		padding-top:60px;
		width:150px;
		font-size:150%;
		font-weight:bold;
		text-align:center;
	}
	div.portfolio a {
		text-decoration:none; 
    }
    div.portfolio a:hover,
    div.portfolio a:focus {
		color:#059EE4;
	}
	div.portfolio a:active {
		color:#FF0630;
	}

#navibereich {
	text-align: center;
	padding: 5px 10px 5px 10px;
}
    #navibereich ul {
      margin-bottom: 0; 
    }
    #navibereich li {
      display: inline; 
      list-style-type: none; 
      margin: 0;
    }
    #navibereich a,
    #navibereich span {
      background-color: white;
      color: black;
    }
    #navibereich a:hover,
    #navibereich a:focus {
      background-color: white;
      color: black;
	  text-decoration:none;
    }
	#navibereich img {
	padding-left:5px;
	padding-right:5px;
	border:0;
	}

#fussbereich {	
	margin-top: 10px;
	padding: 10px;
	border-top: 1px solid #353535; 
}

  
/* ==================================
   4. Sonstige Styles 
   =============================== */   

/* ==================
   Kontaktformular */
   
form {
	color: white;
	width: 300px;
	padding: 20px;
	margin-bottom: 50px;
	margin-left: 10px;
	border: 0px;
	position:relative;
	top:180px;
	left:350px;
}       
label {
  display: block; 
  cursor: pointer; 
}
input#absender, textarea {
  width: 300px;
  border: 1px solid #808080; 
  margin-bottom: 1em;
}
textarea { height: 9em; }

input#absender:focus, 
textarea:focus {
	background-color: #E6E6E6;
	color: black;
}

#kontakt p {
	color: white;
	width: 300px;
	padding: 20px;
	margin-bottom: 50px;
	margin-left: 10px;
	border: 0px;
	position:relative;
	top:250px;
	left:350px;
	}

/* ============
   Portfolio */

#port01 {
	float:left;
	margin-top:70px;
	margin-left:0px;
	width:150px;
	height:150px;
}
#port02 {
	float:left;
	margin-top:70px;
	margin-left:30px;
	width:150px;
	height:150px;
}
#port03 {
	float:left;
	margin-top:30px;
	margin-left:0px;
	width:150px;
	height:150px;
}
#port04 {
	float:left;
	margin-top:30px;
	margin-left:30px;
	width:150px;
	height:150px;
}

/* ==================================
   ENDE DES STYLESHEETS
   =============================== */