/*
Projekt:
Design: Sebastian Laube
Code: Sebastian Laube

Farben:
-------------------------------------------------------------- */

@import url("reset.css");
@import url("typography.css");

/* general
-------------------------------------------------------------- */
html, body {
	background: #66818e url('../gfx/bg2.png');
	font-size: 95%;
	font-family: Arial, 'Bitstream Vera Sans', 'Nimbus Sans L', helvetica, sans-serif;
}

/* cool way */
q:lang(de) { quotes:"\201E" "\201C" "\201A" "\2018"; }
q:before { content:open-quote;}
q:after { content:close-quote;}
q q:before { content:open-quote;}
q q:after { content:close-quote;}

/* safari needs hard coding...
q:before { content:"\201E"; }
q:after { content:"\201C"; }
... and ie sux!*/

/* structure
-------------------------------------------------------------- */
#wrap {
	width: 50%;
	max-width: 630px;
	min-width: 530px;
	margin: 0 auto;
	padding: 0 .8em;
	background: url('../gfx/trans.png');
}

/* head
-------------------------------------------------------------- */
#head h1, #head h2 { text-indent: -9999em;}
#logos {
	position: relative;
	top: 0;
	right: -80px;
	float: right;
	margin: 0 0 0 -70px;
}

/* navigation
-------------------------------------------------------------- */
#nav {
	position: absolute;
	top: 0;
	width: 50%;
	max-width: 630px;
	min-width: 530px;
	margin: 0 auto;
	list-style: none;
	background: #444;
}
#nav li { float: left;}
#nav a {
	float: left;
	padding: .8em .6em .4em .6em;
	color: #fff;
	text-decoration: none;
}
#nav a:hover { background: #ccc; color: #333;}

/* content
-------------------------------------------------------------- */
#main { margin: -4.5em 0 0; padding: 0 .5em;}
#main h2 { margin: 0 0 .1em 0;}
h3 { clear: both;}
p { text-align: justify;}
.date { font-size: 1.6em; text-align: left;}

.top { clear: both; border-bottom: 1px dotted #444; text-align: right; margin: -1em 0 2em 0;}
.top a { padding: 0 0 0 20px; background: url('../gfx/up.png') no-repeat left center; color: #666; text-decoration: none;}
.top a:hover { color: #222;}

.einrollen h3 { padding: .2em .2em .2em .5em; background: url('../gfx/news_back.gif'); border-left: 3px solid #66818e;  cursor: pointer;}
.einrollen h3 strong { display: block;font-weight: 400;}
.einrollen h3 strong:hover { background: url('../gfx/arrow_down.png') no-repeat right bottom;}
.einrollen h3.active strong { background: url('../gfx/arrow_up.png') no-repeat right bottom;}

.links p { clear: both; text-align: left;}

/* form
-------------------------------------------------------------- */
.left { text-align: left;}
form p { margin: .3em 0;}
input[type=text], input[type=file], input[type=password], textarea {
	border-top:1px solid #7c7c7c;
	border-left:1px solid #c3c3c3;
	border-right:1px solid #c3c3c3;
	border-bottom:1px solid #ddd;
	background:#fff url(../gfx/grey.png) repeat-x top;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 1em;
	color:#333;
	padding: .2em;
	margin: .3em .3em 0 0;
}
textarea {margin: .4em .3em 0 0;}

input[type=text], textarea { width: 20em;}

/* foot
-------------------------------------------------------------- */
#love p { margin:  -1em 0 0; padding: 0 0 .5em 0; font-size: 70%; text-align: right;}
#love a { padding: 0 0 0 12px; background: url('../gfx/love.png') no-repeat center left;}