@charset "UTF-8";
/* Welcome to my Main CSS file Nosey! */
* {
	margin: 0;
	padding: 0;
}
html,body,#container{
	height: 100%;
}
.clear {
	clear: both;
}
a { 
	outline: none; }
/* "Do it how you do it" -Snoop Dogg----------------*/
/**/.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 */
/**/
body > #container{
	height: auto;
	min-height: 100%;
}

body{	/*font-size: 62.5%;*/
	font-family: Helvetica, sans-serif;
background-color: #666666;
background-image: url("../images/bg04.jpg");/**/
background-attachment: fixed;
background-repeat: repeat;
background-position: top left;
color: #cdcdcd;
top:0;
left:0;
width:100%;
height:100%;
}

#container{
display: block;	
width: 100%;
min-height: 100%;
height: 100%;
position: relative;
/*height:1000px;*/
text-align:center;
}
#center
{
margin:0 auto;
text-align: left;
width: 852px;
}
#body{

	padding-bottom: 150px;
	height: 100%;
}
/* Navigation -----------------------------*/
ul#navigation{
	display: inline;
	list-style: none;
	width: 243px;
	height: 27px;

}
ul#navigation li{
	display: inline;
}
ul#navigation li a{
	
	display: block;
	float: right;
	height:27px;
	max-height: 27px;
	background-image: url("../images/nav.png");
	text-indent: -9999px;
	width: auto;
	margin: 10px 0 0 0px;
	
}


ul#navigation li a.portfolio{
	width:132px;
	background-position: 0 0;
	overflow: hidden;
}
ul#navigation li a.contact{
	width:112px;
	background-position: -132px 0;
	overflow: hidden;
	margin-right: 25px;
}
ul#navigation li a.portfolio:hover, ul#navigation li a.portfolio:focus{
	background-position: 0 -27px;
	overflow: hidden;
}
ul#navigation li a.contact:hover, ul#navigation li a.contact:focus{
	background-position: -132px -27px;
	overflow: hidden;
}
#navbar{
	
	background-image: url("../images/navbar.png");
	background-repeat:no-repeat;
	z-index:-1;
	width:852px;
	height:53px;
	overflow: hidden;
/*top:66px;
	left:316px;
position:absolute;
*/
}
/* selector ----------------------*/
ul#navigation li span.portfolio{
	display: block;
	float: right;
	height:27px;
	background-image: url("../images/nav.png");
	text-indent: -9999px;
	margin-top: 10px;
	width:132px;
	background-position: 0 -54px;
	overflow: hidden;
}
ul#navigation li span.contact{
	display: block;
	float: right;
	height:27px;
	background-image: url("../images/nav.png");
	text-indent: -9999px;
	margin-top: 10px;
	width:112px;
	background-position: -132px -54px;
	margin-right: 25px;
	overflow: hidden;
}
/* Welcome Header ---------------------------*/
#welcome{
	margin-top:30px ;

	background-image: url("../images/welcomeheader01.png");
	background-repeat: no-repeat;
	width: 525px;
	height: 254px;
	float: left;
}
h1.namaste { 
	margin:5px auto; 
 	padding: 10px 0px 0px 26px;
	font-family:Helvetica, Verdana, Arial, san-serif; 
	font-size:36px; 
	font-weight:normal;
	line-height: 40px;
	color:#FFFFFF; 
}
.boxgrid{
	width: 310px;
	height: 252px;
	margin:30px 0px 0px 15px;
	float:right;
	background:#161613;
	border: solid 1px #339933;/**/
	overflow: hidden;
	position: relative;
}
.boxgrid img{
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
}
#recentwork{
	margin: 15px;
}
#recentwork h3{
	font-size: 22px;
	font-weight: bold;
	color: #339933;
	margin: 0px 0px 10px 0px;
	
}
#recentwork p{
	color: #FFFFFF;
	font-size: 18px;
	margin: 0px 15px 0px 0px;
	
}
#recentwork a:link, #recentwork a:visited, #recentwork a:hover, #recentwork a:active{
	text-decoration: none;
	display: block;
	width:40%;
	background-color: #669966;
	line-height: 24px;
	text-indent: 2px;
	color: #000000;
	margin: 15px 0px 0px 0px;

}
/* DLT Welcome Header ---------------------------*/
#welcomeheader{
	margin-top:30px ;
	padding: 0px;
	background-image: url("../images/welcomeheader2.png");
	background-repeat: no-repeat;
	width: 852px;
	height: 254px;
}
/* Home Portfolio List ---------------------------*/
#homelist{
	margin: 63px 0 0 0;
}
.list{
	list-style: none;
}
.list li a:link, .list li a:visited {
	background-image: url("../images/homelistbtn.png");
	background-repeat: repeat-y;
	color: #FFFFFF;
	display: block;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 12pt;
	line-height: 20pt;
	margin:0;
	padding:0;
	text-align: left;
	text-decoration: none;
	text-indent:12px;
	width:309px;
}
.list li a:hover, .list li a:active{
	background-image: url("../images/homelistbtnhover.png");
	background-repeat: repeat-y;
	color: #000000;
	display: block;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 12pt;
	line-height: 20pt;
	margin:0;
	padding:0;

	text-align: left;
	text-decoration: none;
	text-indent:12px;
	width:309px;
}
#ninja{
	background-image: url("../images/homelistbtnhover.png");
		position: absolute;
		overflow: hidden;
		left: -9999px;
		top: -9999px;
		height: 1px;
		width: 1px;
}
.interactive, .email{
	float: left;
	width: auto;
	}
.interactive h1{
	background-image: url("../images/h1interactive.png");
	background-repeat: no-repeat;
	width:309px;
	height:79px;
	text-indent: -9999px;
}

.website, .banner{
	float: right;
	width: auto;
}
.website h1{
	background-image: url("../images/h1website.png");
	background-repeat: no-repeat;
	width:309px;
	height:79px;
	text-indent: -9999px;
	}
.email, .banner{
	margin-top: 50px;
}
.email h1{
	background-image: url("../images/h1email.png");
	background-repeat: no-repeat;
	width: 309px;
	height: 79px;
	text-indent: -9999px;
}
.banner h1{
	background-image: url("../images/h1banner.png");
	background-repeat: no-repeat;
	width: 309px;
	height: 79px;
	text-indent: -9999px;
}
h1{
	color: #FFFFFF;
}

/* Portfolio -----------------------------------*/
img{
	border: 0 none;
}
#portfolio_section{
	
}
#portfolio_section #previous{
	float: left;
	width: auto;
}
#portfolio_section #next{
	float: left;
	width: auto;
}
#portfolio_section #content{
	float: left;
	background-image: url("../images/foliomid.png");
	background-repeat: no-repeat;
	width: 720px;
	height: 501px;
	margin-bottom: 14px;
	text-align: center;
}
/* Portfolio. Prev/Next -----------------------------------*/

/*#tooltip.lefty { 
	border: none;
	padding:20px;
	background: url("../images/arrowprev.png");
	width: 130px;
	height: 178px;	
}*/
/* Portfolio. Client -----------------------------------*/
#portfolio_section #client{
	display: block;
	overflow: hidden;
	width: 262px;
	height: 167px;
	background-image: url("../images/clients.png");
	background-repeat: no-repeat;
	float: left;
	margin-right: 14px;
}
#portfolio_section #client li{
	font-size: 16px;
	list-style: none;
}
#portfolio_section #client ul.title{
	float: left;
	width: auto;
	margin: 20px 0 0 15px;
}
#portfolio_section #client ul.title li{
	font-weight: bold;
	color: #339933;
	margin: 0px 0px 0px 0px;
	padding: 0 5px 30px 0;
}

#portfolio_section #client ul.subject{
	float: right;
	width: 175px;
	
	margin: 20px 0px 0 0px;
}
#portfolio_section #client ul.subject li{
	padding: 0 2px 30px 0;
}
/* Portfolio. Purpose -----------------------------------*/
#portfolio_section #purpose{
	width: 576px;
	height: 232px;
	display: block;
	background-image: url("../images/description.png");
	float: right;

}
#portfolio_section #purpose h3{
	font-weight: bold;
	font-size: 16px;
	margin: 8px 0 20px 15px;
}
#portfolio_section #purpose p{
	font-size: 14px;
	padding: 0px 15px 5px 15px;
	line-height: 20px;
	
}

/* Portfolio. Button! -----------------------------------*/
#portfolio_section #button .span{
	color: #CCCCCC;
	float: left;
	font-size: 16px;
	font-weight: bold;
	display: block;
	overflow: hidden;
	width: 249px;
	height: 34px;
	background-color: #003300;
	margin: 14px 0px 0px 0px;
	padding: 18px 0px 0px 15px;
}
#portfolio_section #button a:link, #portfolio_section #button a:visited{
	display: block;
	float: left;
	overflow: hidden;
	width: 249px;
	height: 34px;
	background-color: #003300;
	text-decoration: none;
	font-weight: bold;
	font-size: 16px;
	color: #FFFFFF;
	margin: 14px 0px 0px 0px;
	padding: 18px 0px 0px 15px;
	}
#portfolio_section #button a:hover, #portfolio_section #button a:active{
	display: block;
	float: left;
	overflow: hidden;
	width: 249px;
	height: 34px;
	background-color: #669966;
	text-decoration: none;
	font-weight: bold;
	font-size: 16px;
	color: #000000;
	margin: 14px 0px 0px 0px;
	padding: 18px 0px 0px 15px;
	}
/* Portfolio:interactive----------------*/
#portfolio_section #interactive h2{
	margin-top: 30px;
	background-image: url("../images/h2interactive.png");
	background-repeat: no-repeat;
	display: block;
	width:852px;
	height:63px;
	text-indent: -9999px;
}

/* Portfolio:website----------------*/
#portfolio_section #website h2{
	margin-top: 30px;
	background-image: url("../images/h2website.png");
	background-repeat: no-repeat;
	display: block;
	width:852px;
	height:63px;
	text-indent: -9999px;
}

/* Portfolio:email----------------*/
#portfolio_section #email h2{
	margin-top: 30px;
	background-image: url("../images/h2email.png");
	background-repeat: no-repeat;
	display: block;
	width:852px;
	height:63px;
	text-indent: -9999px;
}

/* Portfolio:banner----------------*/
#portfolio_section #banner h2{
	margin-top: 30px;
	background-image: url("../images/h2banner.png");
	background-repeat: no-repeat;
	display: block;
	width:852px;
	height:63px;
	text-indent: -9999px;
}


/* Contact Page --------------------*/
#contact{
	float: left;
	background-image: url("../images/contactoform.png");
	background-repeat: no-repeat;
	overflow: hidden;
	width: 397px;
	height: 812px;
	margin-top: 30px;
	padding-top: 60px;
}
input, textarea {
	outline: none;
	border: none;
	text-indent: 5px;
}
#fieldset{
	border:none;
	outline: none;
}
form #contactform{
	border: none;
}
#formleft {
	width: 340px; 	
	float: left;
	margin:20px 0 0 30px;
	}
	#formleft input {
		width: 337px;
		margin: 0 0 10px 0;
		border: none;
		text-align: left;
		background: #FFFFFF;
		margin: 2px 0px;
		font-size: 1.2em;
		
	}
		#formleft input:hover, #formleft input:focus {
		background: #CCFFCC;	
	}
/*	#formleft .inputbg {
		background: url("../images/formbg01.gif");
		background-repeat: no-repeat;
		background-color: transparent;
		
		background-position: top left;
		height: 32px;
		margin-bottom: 10px;
		position: relative;
	} */
/*	#formleft .active {
		background: url("../images/formbg01.gif");
		background-repeat: no-repeat;
		background-color: #ccffcc;
		background-position: bottom left;
	} */
	#formleft .honey{
		display: none;
}
	#formleft textarea {
		width: 337px;
		max-width: 337px;
		height: 209px;
		max-height: 209px;
		display: block;
		border: none;
		background: #FFFFFF;
		margin: 2px 0px;
		padding: 13px 0 13px 0;
		font-family: Helvetica, sans-serif;
		font-size: 1.2em;
	}
	#formleft textarea:hover{
	background: #CCFFCC;
}
/*	#formleft .active {
		background: url("../images/formbg02.gif") top left no-repeat transparent;
	} */
label {
	font-family: Helvetica, Verdana, Arial, sans-serif;
	display: block;
	font-size: 16px;
	color: #FFFFFF;
	margin-top: 15px;
}
label.error {
	position: absolute;
	top: -16px;
	right: 49px;
	padding: 3px;
	color: #da3939;
	font-size: 1.0em;
	text-align: right;
	font-style: italic;
	font-weight: normal;
}

#formleft .send{
	text-align: left;
	display: block;
	float: left;
	overflow: hidden;
	width: 249px;
	height: 34px;
	background-color: #003300;
	text-decoration: none;
	font-weight: bold;
	font-size: 16px;
	color: #FFFFFF;
	margin: 14px 0px 0px 0px;
	padding: 5px 0px 0px 5px;
	}
	#formleft .send:hover{
	background-color: #CCFFCC;
	color: #000000;
	}
	
/* Alert! ---------------------------*/
.message{
	float: left;
	text-align: left;
	color: #FFFFFF;
	padding:10px 0px;
	display: block;
	width: 337px;
}
#alert{
		
}	

/* About meh------------------------*/
#about{
	float: right;
	background-image: url("../images/aboutomeh.png");
	background-repeat: no-repeat;
	overflow: hidden;
	width: 397px;
	height: 812px;
	margin-top: 30px;
}
#frame{
	float: left;
	width: 105px;
	max-width: 105px;
	height: 110px;
	max-height: 110px;
	background-image: url("../images/frame.png");
	background-repeat: repeat-x;
	padding:5px 0 0 5px;
	margin: 20px 0 0 17px;
}
#titleofme{
	float: left;
	margin: 50px 0 68px 20px;
}
#about p{
	width: 337px;
	float: left;
	margin-top: 15px;
	padding:5px 2px 5px 20px;
	font-size: 15px;
	font-weight: normal;
	color: #FFFFFF;
}
#about p a:link, #about h2 a:visited, #about h2 a:hover, #about h2 a:active{
	text-decoration: underline;
	color: #66CC66;
	font-weight: inherit;
}
#about ul{
	float: left;
	display: block;
	list-style: none;
	margin: 5px 0 0 30px;
	width: 340px;
}
#about ul li{
	padding: 8px 5px 0 0;
}
.question{
	width: 28%;
	text-align: left;
	color: #003300;
	font-weight: bold;
	font-size: 15px;
	float: left;
	font-family: Helvetica, Verdana, Arial, sans-serif;

}
.answer{

	width: 235px;
	text-align: left;
	color: #FFFFFF;
	font-weight: normal;
	font-size: 15px;
	float: left;
	font-family: Helvetica, Verdana, Arial, sans-serif;
}
.clearleft{
	clear: left;
}
/* Footer---------------------------*/
#footer {
	position: absolute;
	bottom: 0;
	background-image: url("../images/footer.png");
	width: 852px;
	height: 45px;
	overflow: hidden;
	/*
margin-top: 141px;
float: left;*/
/*	
	margin-top: -150px;  negative value of footer height 
	height: 150px;
	clear:both;*/
	}
ul#sociallinks{
	list-style: none;
	width: 292px;
	margin: 0px 0 0 560px;
}
ul#sociallinks li{
	display: inline;
}
ul#sociallinks li a{
	
	display: block;
	float: left;
	height:41px;
	background-image: url("../images/linktwitface.png");
	text-indent: -9999px;
	width: auto;
}
ul#sociallinks li a.linkedin{
	width:83px;
	background-position: 0 0;
	overflow: hidden;
}
ul#sociallinks li a.twitter{
	width:96px;
	background-position: -83px 0;
	overflow: hidden;
}
ul#sociallinks li a.facebook{
	width:113px;
	background-position: -179px 0;
	overflow: hidden;
}
ul#sociallinks li a.linkedin:hover, ul#sociallinks li a.linkedin:focus{
	background-position: 0 -45px;
	overflow: hidden;
}
ul#sociallinks li a.twitter:hover, ul#sociallinks li a.twitter:focus{
	background-position: -83px -45px;
	overflow: hidden;
}
ul#sociallinks li a.facebook:hover, ul#sociallinks li a.facebook:focus{
	background-position: -179px -45px;
	overflow: hidden;
}
/* Portfolio. Website, Email -----------------------------------*/
/* Listen */
#content ul#webfolio li img{
	
}
#content ul#webfolio{
	border: none;
	width: 720px;
	height: 480px;
	overflow: hidden;
	list-style-type: none;
}
.fade{
	/*margin-bottom: 2em;*/
}

/**** noscript-Hinweis ****/

div#att {
	background-color: #fffeb8;
	border-bottom: 1px solid;
	height: 2.5em;
	line-height: 2.5em;
	position: absolute;
	top:0;
	width: 100%;
}

div#att p{
	background: transparent url(../images/att.png) no-repeat 0 46%;
	margin: 0;
	display: inline;
	padding: 6px 0 6px 26px;
}
/* Hover tooltips------------------------------------------*/
.tooltip{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	display: none;
}