@charset "utf-8";

/* ----- CSS Document ----- */
/* ----- Projektname  ------ */
/* ----- Viermament GmbH ----- */
/* ----- Wilhelm-Leuschner-Str. 14 ------ */
/* ----- 60329 Frankfurt ----- */

/* -------------------------- */
/* ----- Erstellt: 2009-10-06 ------ */
/* -------------------------- */

/* -------------------------- */
/* ----- Color Management ----- */
/* ----- dark: #1A171B ----- */

html, body{
	width: 100%;
	height: 100%;
}

html, body, table, tr, td, div, ul, li, p, img, a, h1, h2, h3, fieldset{
	margin: 0;
	padding: 0;
	border: none;
	text-decoration: none;
	list-style: none;
}

body {
	background: #FFFFFF url() 0 0 repeat;
	font: normal normal normal 0.8em/1.4em Arial, sans-serif;
	color: #FFFFFF;
}
a{ 
	display: block;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
}

p{ font-size: 0.85em }

#emm, #fake{
	display: block;
	height: 100%;
	width: 50%;
	float: left;
}
#emm > div{
	background: transparent url(../images/emm.png) right 0 no-repeat;
	width: 400px;
	height: 600px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -300px 0 0 -400px;
}

#fake{ background-color: #1A171B; }
#fake > div{
	background: transparent url(../images/fake.png) 0 0 no-repeat;
	width: 400px;
	height: 600px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -300px 0 0 0;
}

#url{
	background: transparent url(../images/url.png) 0 0 no-repeat;
	display: block;
	width: 140px;
	position: absolute;
	bottom: 30px;
	right: 220px;
}

/* ----- Newsletter ----- */

#newsletter{
	background: white url(../images/newsletter_btn.png) 0 0 no-repeat;
	display: block;
	width: 119px;
	height: 24px;
	border: 3px solid #1A171B;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: 238px 0 0 -60px;
}
#newsletter:hover{ 
	border-color: #CCCCCC; 
	cursor: pointer;
}

#nl-container{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent url(../images/nl-bg.png) 0 0 repeat;
	display: none;/**/
}

#nl-container > div{
	position: absolute;
	top: 50%;
	left: 0;
	width: 300px;
	height: 560px;
	padding: 20px;
	margin: -300px 0 0 0;
}
.form-field{ margin: 0 0 15px 0; }

#nl-container p{
	display: block;
	margin: 30px 0 0 0;
}

#closer{
	position: absolute;
	top: 20px;
	right: 20px;
	background: transparent url(../images/close_btn.png) 0 0 no-repeat;
	width: 20px;
	height: 20px;
	display: none;
}

label{ 
	text-transform: uppercase; 
	font-weight: bold;
	float: left;
}

input{
	background: transparent;
	color: #FFFFFF;
	padding: 0 0 0 10px;
	display: block;
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: 1px solid #FFFFFF;
}
.first{	width: 84%;}
.second{ width: 83%;}
.third{	width: 82%;}
.hidden{ visibility: hidden }
.button{
	background: transparent url(../images/senden_btn.png) 0 0 no-repeat;
	display: block;
	width: 83px;
	height: 32px;
	border: 3px solid #1A171B;
	text-indent: -9999px;
	margin: 0 0 0 218px;
}
.button:hover{ cursor: pointer }

#nl-container h1{
	display: block;
	height: 40px;
	margin: 190px 0 25px 0;
	text-indent: -9999px;
	background: transparent url(../images/nl_headline.png) 0 0 no-repeat;
}

/* ----- Iconliste EMM - Fake----- */

.item-list_emm{
	position: absolute;
	top: 375px;
	right: 10px;
}

.item-list_fake{
	position: absolute;
	top: 375px;
	left: 13px;
}

.item-list_emm li,
.item-list_fake li
{
	float: left;
	width: 85px;
	height: 25px;
	margin: 0px 20px;
}

.item-list_emm #facebook{ background: transparent url(../images/facebook_btn.png) center -2px no-repeat; }
.item-list_emm #myspace{ background: transparent url(../images/myspace_btn.png) center -1px no-repeat; }
.item-list_emm #twitter{ background: transparent url(../images/twitter_btn.png) right 1px no-repeat; }

.item-list_fake #facebook{ background: transparent url(../images/facebook_btn.png) center -27px no-repeat; }
.item-list_fake #myspace{ background: transparent url(../images/myspace_fake_btn.png) center -27px no-repeat; }
.item-list_fake #twitter{ background: transparent url(../images/twitter_btn.png) right -25px no-repeat; }

/* --- Hover-Effekt --- */

.item-list_emm #facebook:hover{ background-position: center -27px; }
.item-list_emm #myspace:hover{ background-position: center -27px; }
.item-list_emm #twitter:hover{ background-position: center -25px; }

.item-list_fake #facebook:hover{ background-position: center -2px; }
.item-list_fake #myspace:hover{ background-position: center -1px; }
.item-list_fake #twitter:hover{ background-position: center 1px; }