 

/********************************************************************************************************************************
											****    kleinkram    ****
											********************************************************************************************************************************/
*		{ margin:0; padding:0; outline:none; } /* */

html		{ height:100%; }

body 	{ width:100%; height:100%;
		  background:url(../images/main-bg.gif) repeat-x #0f0e09;
		  font-family:Verdana; font-size:11px; color:#000000; }

img 		{ border:0; }

li		{ list-style-type:none; line-height:16px; color:#bababa; font-family:'Arial', Verdana, Helvetica, sans-serif; font-size:11px; text-align:left; }

input, select { 
	width:120px; 
	height:15px; 
	background:transparent; 
	border:0; 
	border-bottom:1px solid #474747;
	font-family:Arial; font-size:11px; color:#fff;
}

input#ergebnis	{ 
	width:30px;
}
	
.buttons {
	width:80px; 
	height:16px; 
	background:#fff; 
}
	
select {
	width:60px; 
	height:18px; 
}
	
textarea { 
	width:385px; 
	background:#000; 
	border:1px solid #464646; 
	font-family:Arial; 
	color:#fff; 
	margin-top:6px; 
}
	
textarea#haftungsausschluss	{ 
	height:100px; 
	margin-top:20px; 
	font-size:10px; 
}
	
textarea#mitteilung	{ 
	height:150px; 
	font-size:11px; 
}
	
.left	{ float:left; }
.mehr-details	{ width:119px; height:30px; }


/********************************************************************************************************************************
											****    allgemeine textelemente   ****
											********************************************************************************************************************************/
h1	{ font-family:'Arial',Verdana, Helvetica, sans-serif; font-size:11px; font-weight:bold; color:#ffffff; margin-bottom:10px }
h2	{ line-height:16px; font-family:'Arial',Verdana, Helvetica, sans-serif; font-size:11px; font-weight:normal; color:#bababa; }
h3	{ font-family:'Arial',Verdana, Helvetica, sans-serif; font-size:14px; font-weight:bold; color:#ffffff; margin-bottom:10px }

p				{ line-height:16px; color:#bababa; font-family:'Arial', Verdana, Helvetica, sans-serif; font-size:11px; text-align:left; }
.imprint_box	{ width:100%; margin:0 0 8px 0; }
p.imprint_1		{ float:left; width:35%; margin-right:1%; }
p.imprint_2		{ float:left; width:64%; }

a, a:link, a:visited, a:active, a:focus	{ font-family:Arial; font-size:11px; color:#e7830a; text-decoration:none; outline:none; }
a:hover									{ text-decoration:underline; }

strong	{ color:#fff; }

form span	{ color:#e7830a; }

.referenzright {float:left; margin-top: 5px; font-weight: bold;}

/********************************************************************************************************************************
											****    grundlayout    ****
											********************************************************************************************************************************/
#index	{ width:1100px; height:780px; margin-left:auto; margin-right: auto; }

#main	{ width:1100px; height:685px; }
	#main_bg	{ width:1046px; height:685px; background:url(../images/content-bg.gif) no-repeat; margin-left:41px; position: relative;}
		#sonne {position:absolute; top:20px; right:100px; z-index:1; width:130px; height:73px;}
		a#zeit, a#zeit:hover {
			background:url(../images/es-wird-zeit.png) no-repeat;
			color:#A66D20;
			display:block;
			height:80px;
			right:20px;
			position:absolute;
			top:5px;
			width:146px;
		}
	/** startseite anfang				**/
		#content_cont_links	{ float:left; width:444px; height:685px; }
		#content_cont_mitte	{ float:left; width:108px; height:685px; }
		#content_cont_rechts{ float:left; width:396px; height:685px; position: relative; }
	/** startseite ende				**/
	
	/** produkte anfang				**/
		#kreativ_zusammen	{ width:197px; height:393px; background:url(../images/produkt/kreativ-zusammen.png) no-repeat; margin:155px 0 0 90px; padding:50px 10px 0 25px; }
		#kreativ_effect		{ width:197px; height:393px; background:url(../images/produkt/kreativ-effect.png) no-repeat; margin-top:155px; padding:50px 10px 0 25px; }
		#kreativ_design		{ width:197px; height:393px; background:url(../images/produkt/kreativ-design.png) no-repeat; margin:155px 64px 0 0; padding:50px 10px 0 25px; }
		.strich				{ width:49px; height:586px; background:url(../images/produkt/strich.png) no-repeat; margin-top:93px; }
	/** produkte ende					**/
	
	/** jobs anfang					**/
		#job_angebote	{ width:399px; height:505px; background:url(../images/jobs/jobs_bg-links.png) no-repeat; margin:131px 0 0 27px; padding:13px 20px 0 40px; }
		#job_strich		{ width:1px; height:586px; background:url(../images/jobs/jobs_strich.png) no-repeat; margin-top:93px; }
		#job_formular	{ width:399px; height:505px; background:url(../images/jobs/jobs_bg-rechts.png) no-repeat; margin:131px 4px 0 0; padding:13px 29px 0 29px; }
	/** jobs ende					**/	
	
	/** kontakt & impressum anfang		**/
		#kont-impr_kontakt		{ width:399px; height:505px; background:url(../images/kontakt-impressum/kont-impr_bg-links.png) no-repeat; margin:131px 0 0 27px; padding:13px 20px 0 40px; }
		#kont-impr_strich		{ width:1px; height:586px; background:url(../images/kontakt-impressum/kont-impr_strich.png) no-repeat; margin-top:93px; }
		#kont-impr_impressum	{ width:399px; height:505px; background:url(../images/kontakt-impressum/kont-impr_bg-rechts.png) no-repeat; margin:131px 4px 0 0; padding:13px 29px 0 29px; }
	/** kontakt & impressum anfang		**/	
	
	
#navigation	{ 
	float:left; width:85px; height:685px; padding-left:13px;
}
#nav_startseite			{ display:block; width:75px; height:67px; background:url(../images/navigation/Startseite.jpg) no-repeat; }
#nav_startseite:hover, 
#nav_startseite.active { background:url(../images/navigation/a_Startseite.jpg) no-repeat; }

#nav_produkt { display:block; width:75px; height:56px; background:url(../images/navigation/Produkt.jpg) no-repeat; }
#nav_produkt:hover, 
#nav_produkt.active { background:url(../images/navigation/a_Produkt.jpg) no-repeat; }

#nav_jobs { display:block; width:75px; height:73px; background:url(../images/navigation/Jobs.jpg) no-repeat; }
#nav_jobs:hover, 
#nav_jobs.active { background:url(../images/navigation/a_Jobs.jpg) no-repeat; margin-left:-1px; }

#nav_kontakt-impressum { display:block; width:75px; height:78px; background:url(../images/navigation/Kontakt-Impressum.jpg) no-repeat; }
#nav_kontakt-impressum:hover, 
#nav_kontakt-impressum.active { background:url(../images/navigation/a_Kontakt-Impressum.jpg) no-repeat; }

#nav_bitskin			{ display:block; width:75px; height:45px; background:url(../images/navigation/Bitskin-GmbH.jpg) no-repeat; }
	/*	#nav_bitskin:hover			{ background:url(../images/navigation/a_Bitskin-GmbH.jpg) no-repeat; } */

#footer	{ width:1100px; height:95px; }
	#footer_links	{ float:left; width:95px; height:95px; background:url(../images/main-footer_rand-l.gif) no-repeat; }
	#footer_mitte	{ float:left; width:855px; height:95px; background:url(../images/main-footer_bg.gif) repeat-x; }
	#footer_mitte p	{ margin-top:20px; margin-left:13px; }
	#footer_rechts	{ float:left; width:150px; height:95px; background:url(../images/main-footer_rand-r.gif) no-repeat; }


/********************************************************************************************************************************
											****    content - elemente    ****
											********************************************************************************************************************************/
	/**
	* startseite
	**/
	#willkommens-text	{ width:371px; height:215px; background:url(../images/startseite/start_halbtrans-element.png) no-repeat; margin-left:27px; margin-top:131px; padding-left:45px; padding-top:13px; }
	#willkommens-text p	{ width:325px; }
	#unterschrift_links	{ float:left; width:130px; padding-top:15px; }
	#unterschrift_rechts{ float:left; width:134px; height:70px; }
	#produkt-bg			{ width:428px; height:306px; background:url(../images/startseite/start_produkt-element.png) no-repeat; margin-top:-2px;}
		#box_headline	{ float:right; width:365px; height:17px; margin-top:20px; margin-bottom:10px; margin-right:10px; }
		#box_grey		{ float:right; width:328px; height:182px; margin-right:25px; overflow:hidden;}
		#box_leiste		{ float:right; width:333px; height:61px; margin-right:23px; margin-top:3px; position:relative}
		/*#produkt		{ display:none; float:right; width:365px; height:204px; background:url(../images/startseite/start_produkt.png) no-repeat; margin-top:30px; margin-right:10px; }*/
		.produkt-topic	{ font-weight:bold; color:#454545; padding-left:19px; }
		
	a.impressions, a.impressions:link, a.impressions:visited{
		background-position:left;
	}
	a.impressions:hover, a.impressions:active{
		background-position:right;
	}

	a.impressions {
		background-image:url(../images/ueber_uns/galery.gif); 
		background-repeat: no-repeat;
		display:block; 
		width:32px; 
		height:32px; 
		position:absolute; 
		z-index:2; 
		bottom:12px; 
		left:46px;
	}

	a.impressions2, a.impressions2:hover {
		background:url(../images/ueber_uns/galery.gif) no-repeat right; 
		display:block; 
		width:32px; 
		height:32px; 
		position:absolute; 
		z-index:2; 
		bottom:12px; 
		left:46px;
	}
	
	a.compvideo, a.compvideo:link, a.compvideo:visited{
		background-position:left;
	}
	a.compvideo:hover, a.compvideo:active{
		background-position:right;
	}

	a.compvideo {
		background-image:url(../images/ueber_uns/video.gif); 
		background-repeat: no-repeat;
		display:block; 
		width:32px; 
		height:32px; 
		position:absolute; 
		z-index:2; 
		bottom:12px; 
		left:0px;
	}
	a.compvideo2 {
		background:url(../images/ueber_uns/video.gif) no-repeat right; 
		display:block; 
		width:32px; 
		height:32px; 
		position:absolute; 
		z-index:2;
		bottom:12px; 
		left:0px;
	}
	
	#video_galerie_linie {
		background:url(../images/ueber_uns/line.gif) no-repeat;
		width:2px;
		height:31px;
		position:absolute;
		left:38px;
		bottom: 13px;
	}
	
	#bildleiste {
		position:absolute;
		bottom:10px;
		left:88px;
		width:246px;
	}
	.impressionen_pics {
		margin-top:2px;
		width:43px; 
		height:26px; 
		border:2px solid #000; 
		margin-right:2px;
	}
	.impressionen_pics_grau {
		margin-top:2px;
		width:43px; 
		height:26px; 
		border:2px solid #000; 
		margin-right:2px;
	}
	.impressionen_pics:hover { 
		border:2px solid #FA8704; 
	}
		
	a#vor_aktiv {
		margin-left:5px;
		margin-top:2px;
		width:40px; 
		height:32px;
		float:right;
		background-image:url(../images/ueber_uns/fwd.gif);
		background-position:top left;
		background-repeat:no-repeat;
	}
	a#zurueck_aktiv {
		width:40px;
		margin-top:2px;
		height:32px;
		float:right;
		background-image:url(../images/ueber_uns/bwd.gif);
		background-position:top left;
		background-repeat:no-repeat;
	}
	
	a#vor_aktiv:hover {
		background-position:top right;
	}
	a#zurueck_aktiv:hover {
		background-position:top right;
	}
	
	#vor_inaktiv {
		background:url(../images/ueber_uns/fwd.gif) no-repeat top left;
		width:40px;
		height:32px;
		margin-top:2px;
		float:right;
		margin-left:10px;
	}
	#zurueck_inaktiv {
		background:url(../images/ueber_uns/bwd.gif) no-repeat top left;
		width:40px;
		margin-top:2px;
		height:32px;
		float:right;
	}

	
	#flash-element		{ width:108px; height:586px; margin-top:93px; background:url(../images/startseite/start_flash-element.gif) no-repeat; }
	
	#referenzen_gross	{ width:391px; height:277px; margin-top:93px; }
		#referenzen_bg			{ width:272px; height:222px; background:url(../images/startseite/start_ref_background.png) no-repeat; margin-left:34px; margin-top:29px; }
		#referenzen_pic			{ width:256px; height:175px; margin-left:6px; margin-top:10px; }
		#referenzen_l-vorschau	{ float:left; display:block; width:115px; height:24px; background:url(../images/startseite/start_ref_letzte-vorschau.png) no-repeat; margin-left:15px; }
		#referenzen_n-vorschau	{ float:right; display:block; width:114px; height:24px; background:url(../images/startseite/start_ref_naechste-vorschau.png) no-repeat; margin-right:17px; }
	#referenzen_main	{ width:340px; height:58px; background:url(../images/startseite/start_halbtrans-element2.png) no-repeat; padding-top:14px; padding-left:41px; padding-right:10px; }
	#referenzen_detail	{ width:340px; height:223px; background:url(../images/startseite/start_halbtrans-element2.png) no-repeat; padding-top:14px; padding-left:41px; padding-right:10px; }

/**
* jobs formular
**/
form {
	width: 400px;
	font-family: arial, verdana;
	font-size: 11px;

}

form div {
	overflow: hidden;
}

fieldset {
	border: none;
	overflow: hidden;
}

fieldset legend {
	font-size: 14px;
	margin: 0 0 10px 0;
	font-weight: bold;
}
input {
	margin: 4px 0 0 0;
}
textarea {
	margin: 0 0 5px 0; 
}

label {	
	float: left;
	width: 65px;
	margin: 3px 0 9px 0;
	color: #E7830A;
}

#mail_part label {
	display: block;
	margin: 0 0 3px 0;
	width: 100%;
}


/* fieldset definitions */
#name_part_left {
	float: left;
	width: 190px;
	margin: 0 25px 10px 0;
}

* #name_part_left {
	float: left;
	width: 190px;
	margin: 0 21px 10px 0;
}

#name_part_right {
	width: 188px;
	margin: 0 0 10px 0;
}


#mail_part {
	clear: left;
	overflow: hidden;
	margin-top: 15px;
}
#mail_part div {
	overflow: hidden;
	margin-top: 10px;
}

#mail_part input {
	width: 400px; 
	height: 25px;
	color: #000;
	border: 1px solid #474747;
}
#mail_part textarea {
	width: 400px;
	height: 90px; 
	margin: 0 0 10px 0;
}
#buttons {
	margin: 40px 0 0 76px;
}

#button_submit {
	float: right;
	width: 187px;
	height: 30px;
	border: 0;
	background: url(../images/jobs/jobs_bewerbung-absenden.png) top left no-repeat;
	cursor: pointer;
}

div.fileinputs {
	position: relative;
}

div.fakefile {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0;
	z-index: 1;
}
div.fakefile input {
	width: 300px !important;
	color: #fff !important;
}
div.fakefile span {
	position: absolute;
	top: 10px;
	right: 0px;
	z-index: 1;
}
.btn {
	cursor: pointer;
}
input.file {
	position: relative;
	text-align: right;
	-moz-opacity:0 ;
	filter:alpha(opacity: 0);
	opacity: 0;
	z-index: 2;
}

div.error {
	height: 1px;
	margin: 0;
	padding: 0;
}

form .error {
	border-bottom: 1px solid #E7830A;
}

/**
* kontakt formular
**/
#kontakt {
	width: 388px;
}
#kontakt select {
	width: 110px;
}
#kontakt input {
	margin: 4px 0 0 0;
	width: 110px;
}
#kontakt textarea {
	height: 100px;
	margin: 0 0 5px 0; 
}

#kontakt label {	
	float: left;
	width: 75px;
	margin: 3px 0 9px 0;
	color: #E7830A;
}

/* fieldset definitions */
#name_part {
	float: left;
	width: 200px;
	margin: 0 3px 15px 0;
}

#kontakt_mail_part {
	clear: left;
	overflow: hidden;
}

label#betreff {
	float: left;
	width: 70px;
}
#kontakt_mail_part input {
	width: 318px;
}


#kontakt_mail_part textarea {
	width: 386px;
	height: 93px; 
	margin: 0 0 0 0;
}
#kontakt_mail_part .error {
	width: 388px;
}
#kontakt #buttons {
	margin: 5px 0 5px 0;
}

input#submit_kontakt {
	float: right;
	width: 139px;
	height: 30px;
	border: 0;
	background: url(../images/kontakt-impressum/kont-impr_anfrage-stellen.png) top right no-repeat;
	cursor: pointer;
}

#security {
	clear: left;
	margin: 0 0 0 0px;
}

#security label {
	width: 130px
}
#math_code {
	display: block;
	float: left;
	width: 60px;
}
#ergebnis {
	width: 210px;
}

form#kontakt .error {
	border-bottom: 1px solid #E7830A;
}


