@charset "utf-8";
/* CSS Document */

html, body, #wrap, #wrap_index {height: 100%;}

body > #wrap, body > #wrap_index {height: auto; min-height: 100%;}

body {background:url(images/bckgr_small.png);  margin:0 auto;}

a, a img, a .images { border: none; padding:0px;}
p {font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; color: #000000; margin:0 0 15px 0;}
h1, h2 {font-family:Verdana, Arial, Helvetica, sans-serif; font-size:24px; color:#000000; text-decoration:none; font-weight:normal; margin:0;}
h2 {margin:0px 0px 30px 0px;}
h2.second {margin:35px 0px 15px 0px;}

/* ######### LAYOUT ELEMENTS ######## */

#body {background:url(images/bckgr.png) repeat-x top center;}

#wrap {
	/*margin:0 auto;*/ 
	padding:15px 0 0 0;
	width:750px;
	margin: 0 auto; 
}

#wrap_index { padding:15px 0 -42px 0; width:750px; margin: 0 auto; }

#head { float:none; clear:both; margin:100px auto 30px auto; padding:0 0 5px 0; border-bottom:solid 1px #dddddd;}

#head img {width:750px; height:120px; }

/* ######### NAVIGATION ######## */

/*#nav_bar { margin:500px auto 0 auto; width:100%; text-align:center;}*/
#nav_bar_index { padding:490px 0 0 0; margin:0 auto; width:750px; height:100px; text-align:center;}

#wrap #nav_bar { margin:20px 0px 0px auto; width:300px; height:20px; text-align:center; float:right;}

#wrap #logo, #wrap #logo a {float:left; display:inline; border:none;}
#nav {
	position:relative;
	margin:0 auto 0 auto;
	padding:0px;
	width:300px;
	height:20px;
}

#nav li {list-style: none; display:block; float:left;}

#nav li a, #nav li.item1_a, #nav li.item2_a, #nav li.item3_a, #nav li.item4_a {
	display:block;
	position:absolute;
	background-image: url('images/menu.png');
	background-repeat:no-repeat;
	padding:0px;
	width:300px;
	height:20px;
	border:none;
	/**background-image: none;
	*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='images/menu.png')*/
}

#nav li a.item1 {background-position:0px 0px; width:80px; left:0px;}
#nav li a:hover.item1 {background-position:0px -21px;  width:80px; left:0px}

#nav li a.item2 {background-position:-80px 0px; width:95px; left:80px;}
#nav li a:hover.item2 {background-position:-80px -21px;  width:95px; left:80px;}

#nav li a.item3 {background-position:-175px 0px; width:50px; left:175px;}
#nav li a:hover.item3 {background-position:-175px -21px; width:50px; left:175px;}

#nav li a.item4 {background-position:-225px 0px; width:75px; left:225px;}
#nav li a:hover.item4 {background-position:-225px -21px; width:75px; left:225px;}

#nav li.item1_a { left:0px; width:80px; height:30px; background-position: 0px -42px}
#nav li.item2_a { left:80px; width:95px; height:30px; background-position: -80px -42px}
#nav li.item3_a { left:175px; width:50px; height:30px; background-position: -175px -42px}
#nav li.item4_a { left:225px; width:75px; height:30px; background-position: -225px -42px}

/* ######### CONTENT ######## */

/* box with text and heading */
.box, .wallpaperbox, .iconbox, .infobox {
	position:relative;
	display:block;
	clear:both;
	width:750px;
	height: 100px;
	margin:60px 0 0 0;
	paddiing:0;
}

.wallpaperbox {	height: 220px;}
.iconbox { height: 200px;}
.infobox { height:auto;}

/* text in the box div */
.h1 { position:absolute; left:6px; top:15px;}
.welcome { position:absolute; right:5px; top:20px; width:580px; padding:0; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; color:#FFFFFF; }

/* item */
.item { position:relative; background: url(images/portfolio_background.png) no-repeat top left; width:740px; height:235px; margin:0 auto 40px auto;}
.item img {width:420px; height:210px; position:relative; top:15px; left:15px;}
.item img.small_preview {width:auto; height:auto; margin:0 0 -6px 0; position:static;}
.item .preview img {width:auto; height:auto; margin:auto; position:static}

/* item descrption */
.description { position:absolute; top:0px; left:490px; width:280px; height:210px; padding:20px 0 0 0;}
.description a .button_more, .description a .button_download { position:static; width:258px; height:38px; margin:9px 0px 0px -6px; padding:0; border:none;}
.description a {font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; color: #3b3f4b; margin:0 0 15px 0; text-decoration:none;}
.description a {color: #000000; }
.description a:hover {text-decoration:underline}

/* kontaktitem */
.kontaktitem { position:relative; display:block; width:740px; height:235px; margin:0 auto 40px auto;}
.kontaktitem img {width:420px; height:210px; margin:0 0 0 -5px}

/* kontaktitem descrption */
.kontaktitem .description { position:absolute; top:10px; left:430px; width:280px; height:185px; padding:0 0 0 20px; border-left:solid 1px #dddddd;}

/* infoitem (textbox) */
.infoitem { width:740px; margin:0 auto 40px auto;}

.infoitem .icon {width:96px; height:96px; padding:0px 5px 5px 0px; margin-top:-5px; margin-bottom:0px; border:none; float:left; display:block;}
.infoitem .icon_r {width:96px; height:96px; padding:0px 5px 5px 0px; margin-top:-5px; margin-bottom:0px; border:none; float:right; display:block;}

/* ######### KONTAKTFORMULAR ######## */

form {margin:0px;}

.contact_textbox {
	background:url(images/index_footer_1.png) repeat-x;
	background-color:#737c90;
	border:solid 1px #CCCCCC;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#eeeeee;
	padding:4px 4px;
	margin:-5px 0 0 0;
}

.textfeld_r {position:absolute; top:0px; left:430px;}

.button_box {margin-top:50px;}

.contact_button {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:#eeeeee;
	border: solid #FFFFFF 1px ;
	background-color:#1c2126;
	padding:3px 3px;
}

/* ######### FOOTER ######## */

/* separator and link to top */
.separator {
	width:600px; height:25px;
	text-align:right;
	margin:30px 0px 0px 0px; padding:0px 150px 0px 0px;
	clear:both; float:none;
}

.separator a {color:#dddddd; font-family: "Times New Roman", Times, serif; font-size:12px; font-weight:normal; text-decoration:none;}

/* smile on bottom */
#smile {background:url(images/index_smile.png) no-repeat center; width:25px; height:25px; margin:0 auto; clear:both; padding:10px 0;
		*background-image: none;
		*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop src='images/index_smile.png'); 
		/*position:absolute; bottom: 50px;*/}

/* footer STICKY */

#footer_sticky {
	background:url(images/index_footer.png) repeat-x; width:100%; height:30px; clear:both; float:none; /*position:absolute; bottom:0px;*/
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; color: #3b3f4b; 
	padding:12px 0 0 0;
	position: relative;
	margin-top: -42px; /* negative value of footer height */

}
#footer_sticky a{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; color: #3b3f4b; margin:0 0 15px 0; text-decoration:none;}
#footer_sticky a:hover {text-decoration:underline}

/* footer */

#footer {
	background:url(images/index_footer.png) repeat-x; width:100%; height:30px; clear:both; float:none; /*position:absolute; bottom:0px;*/
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; color: #3b3f4b; 
	padding:12px 0 0 0; margin:0;

}
#footer a{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; color: #3b3f4b; margin:0 0 15px 0; text-decoration:none;}
#footer a:hover {text-decoration:underline}


.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */