/* ===================================================================== */
/* ===== Der standard Stil für http://www.norrut.de/ =========== */
/* ===================================================================== */

/* Wichtige Farben
Hintergrund HTML (blau)	: #8bbfdd;
Hintergrund Body (blau)	: #97cef0;

Hauptmenü Hover			: #7894a1
Hintergrund Infobox dt	: #7894a1



Link-Reihenfolge:
:link, :visited, :hover,

line-height evt. noch einbauen

*/

/* Alle Abstände werden auf Null gesetzt             */
/* Die Schriften festgelegt und alle Rahmen gelöscht */

* {
	padding:0;
	margin:0;
	border:none;
	color:#fff;
	background-color:transparent;
	font-family:Verdana, Arial, Sans-serif;
}


html{
	padding:10px;
	background:#8bbfdd;
}

body{
	position:relative;
	font-size:0.8em;
	max-width:1000px;
	margin:75px 10px 10px auto;
}

/* ******************************************************************* */
/* *** Die Grundelemente formatieren ********************************* */
/* ******************************************************************* */

.center{
	text-align:center
}
.clear{clear:both
}
a:link, a:visited, a:hover, a:active, a:focus{
	text-decoration:none;
}
a:hover, a:active, a:focus{
	color:#557587;
}
address{
	font-size:18px;
	margin-bottom:18px;
}

dt{
	font-weight:bold;
	font-size:1.1em;
}
dd{
	margin:0 0 18px 1em;
}
h1, h2, h3{
	font-family:Verdana, Arial, Sans-serif;
	font-weight:normal;
}
h1, h2, h3{
	margin:0 170px 0 0;	
	text-align:right;
}
h1{
	font-size:72px;
}
h2{
	font-size:36px;
	margin-top:18px;
}
h3{
	font-size:18px;
	margin-top:40px;
	text-align:right;
	font-size:18px;
	font-style:italic;
	padding-top:105px;
}
h4{
	margin:0 0 9px 0;
	font-weight:bold;
	font-size:1.1em;
}

p#impressum{
	text-align:right;
	margin:2em 170px 0 0;
	font-size:0.8em;
}
body#ort p#impressum{
	text-align:left;
}

body#impressum h3, body#startseite li#impressum{
	background:url(../bilder/impressum.jpg) top right no-repeat;	
}
body#ort h3, body#startseite li#ort{
	background:url(../bilder/ort.jpg) top right no-repeat;
}

body#produkte h3, body#startseite li#produkte{
	background:url(../bilder/produkte.jpg) top right no-repeat;	
}
body#team h3, body#startseite li#team{
	background:url(../bilder/team.jpg) top right no-repeat;
}

body#produkte ul{
	list-style:none inside;
	margin:18px 170px 0 0;
	text-align:center;
}
body#produkte li{
	display:inline;
	font-size:18px;
	margin:0.3em;
	line-height:2em;
}
/* ============================================================================= */
/* === Formulare und Eingabefelder ============================================= */
/* ============================================================================= */

/* ******************************************************************* */
/* *** Die Boxen fürs Layout ***************************************** */
/* ******************************************************************* */

#main{
	position:absolute;
	top:10px;
	left:10px;
	right:520px;
}

ul#menu{
	list-style:none inside;
	margin:40px 170px 0 0;
}
ul#menu li{
	font-style:italic;
	font-size:18px;
	text-align:right;
	float:right;
	margin-left:10px;
	padding:105px 0 0 0;
}

li#ort{
	width:133px;
}
li#produkte{
	width:341px;	
}
li#team{
	width:150px;
}
li#impressum{
	width:100px;
}
ul#menu li#facebook{
	padding:50px 0 0 0;
}
li#facebook a{
	font-size:0.8em;
	font-style:normal
}

body#team ul#teamliste{
	list-style:none inside;
	margin:40px 85px 0 0;
	height:200px;	
}
body#team ul#teamliste a{
	cursor:default;
}
body#team h3{
	width:150px;
	margin-left:auto;
}
/* ******************************************************************* */
/* *** Die hover Effekte der Elemente ******************************** */
/* ******************************************************************* */
span#arcteryx{
	background:url(../bilder/logos/logo_arcterys.png) bottom no-repeat;
}
body#produkte li span{
	display:none;
}
body#produkte li:hover span{
	display:block;
	position:absolute;
	top:-10px;
	left:0;
	width:470px;
	height:300px;
	font-size:0.9em;
	text-align:left;
	line-height:1.1em;
}
body#produkte li:hover{
	color:#557587;
}

ul#teamliste li span, body#team h3 span{
	display:none;
}
ul#teamliste li:hover span, body#team h3:hover span, body#team-einzeln div#bild{
	display:block;
	position:absolute;
	top:-10px;
	left:0;
	width:300px;
	height:300px;
}
ul#teamliste li{
	font-style:italic;
	font-size:12px;
	text-align:center;
	float:left;
	margin:0 8px;
	width:100px;
	padding:105px 3px 3px 3px;
}
ul#teamliste li a:hover{
	color:#7894a1;
}

ul#teamliste img{
	margin-left:auto;
	margin-right:auto;
}
li#inga{
	background:url(../bilder/team_inga-100px.jpg) top no-repeat;
}
li#fredrik{
	background:url(../bilder/team_fredrik-100px.jpg) top no-repeat;
}
li#nicole{
	background:url(../bilder/team_nicole-100px.jpg) top no-repeat;
}
li#felix{
	background:url(../bilder/team_felix-100px.jpg) top no-repeat;
}
li#doerte{
	background:url(../bilder/team_doerte-100px.jpg) top no-repeat;
}
li#chris{
	background:url(../bilder/team_chris-100px.jpg) top no-repeat;
}
li#anna{
	background:url(../bilder/team_anna-100px.jpg) top no-repeat;
}

body#impressum div#adresse{
	width:150px;
	float:right;
	margin:10px 0 0 0;
}

body#ort address{
	font-size:16px;
	margin:5px 0;
}

div#aufwiedersehn{
	position:absolute;
	top:10px;
	left:75px;
	width:350px;
	font-size:1.2em;
	font-weight:bold;
}
div#aufwiedersehn h3{
	margin:0 0 1em 0;
	padding:0;
	text-align:left;
	font-size:1.3em;
	font-weight:bold;
}

div#aufwiedersehn p{
	margin-bottom:0.5em;
}

div#aufwiedersehn a{
	text-decoration:underline;
}