@charset "UTF-8";

/**
 stylesheet for http://www.der-gestalt.de
 © Maximilian Wambach, http://www.der-gestalt.de

***/

/*************************************************************************/

/**
*
* Tags
*
**/

* {	margin: 0;padding: 0;}

html {
	height: 110%;
}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin: 0; padding: 0;border: 0;outline: 0;font-weight: inherit; font-style: inherit; font-size: inherit;	font-family: inherit; vertical-align:  baseline;}

body {font-family: "Trebuchet MS", Arial, sans-serif; font-size: 90%; color: #000000; line-height: 1.6em; letter-spacing: 0.1em;}
h1 {text-indent: -9999px;}
h2 {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color: #7F539A; font-size: 150%;}
h3 {text-decoration: none; font-size: 110%; padding-bottom: 10px; }
p {line-height: 20px; font-size: 85%;}
a {color: #7F539A; text-decoration: underline;}
dl {font-size: 85%;}
li {font-size: 85%;}

h2.intro {color: #000000;line-height: 1.3em;text-decoration: none; font-size: 28px; display: block; border-bottom: 3px solid #000000; padding-bottom: 20px;}
h2 strong {color: #7F539A;}

#wrapper {width: 970px; margin: 0 auto;}

#navi {float: right; list-style-type: none; width: 651px; height: 45px; margin-bottom: 35px; clear: both;}
#navi li {float: left;}
#navi li a{display: block; background: transparent url('_img/navi.gif') no-repeat left top; text-indent: -9999px;}
#navi li a:hover, #navi li a.active {background-image: url('_img/navi_hover.gif')}
#navi li.home_link a {background-position: 0 0; width: 111px; height: 45px;}
#navi li.work_link a {background-position: -116px 0; width: 111px; height: 45px;}
#navi li.contact_link a {background-position: -398px 0; width: 129px; height: 45px;}
#navi li.expe_link a {background-position: -227px 0; width: 171px; height: 45px;}
#navi li.blog_link a {background-position: -526px 0; width: 129px; height: 45px;}

#language {position:absolute; top: -21px; left: 228px; }
#language li {display:block; float: left;}
#language li a {text-indent: -9999px; width: 64px; height: 64px; display: block;}
#language #de {background: transparent url(_img/deutsch.png) no-repeat left top; }
#language #en {background: transparent url(_img/english.png) no-repeat left top; }

#content {margin: 22px 0 0 30px; width: 910px;}

#home {position: relative; padding-bottom: 20px; }
#home p {width: 660px; margin: 10px 0;}
#home img {margin-top: 20px;}
#home .glasses dd {background: transparent url('_img/glasses.gif') no-repeat left center; padding-left: 35px; }
#home .square {background: transparent url('_img/heart.gif') no-repeat 165px 76px; position: absolute; top: -20px; right: 0; border: 1px solid #000000; width: 180px !important; width: 210px; height: 188px !important; padding: 10px 0 30px 20px;}
#home .square dt {text-decoration: underline; font-size: 150%; padding-bottom: 10px;}
#home .square dd {color: #7F539A; padding: 5px 0; background: none;}
#home .square strong {color: #000000; font-size: 120%; padding: 0;}

#work {position: relative; border-bottom: 3px solid #000000; height: auto; margin-bottom: 50px;}
#work h2 {padding: 0 0 20px 0; }
#work .work h3 {margin: 15px 0 0 15px;}
#work li {color: #7F539A;list-style-position: inside;}
#work p {margin-bottom: 5px;}
#work img {	cursor: pointer; margin-left: 45px;}
#work .work {width: 910px; height: 280px; margin-bottom: 40px;}
#work .work .nobox {background:  none;}
#work .work .left {position: relative; float: left; width: 400px; height: 290px; background: transparent url('_img/bg.jpg') no-repeat left center;}
#work .work .right {position: relative; float: right; width: 400px; height: 290px; background: transparent url('_img/bg.jpg') no-repeat left center;}
#work .more {display: none; position: absolute; bottom: 0; left: 0; background: transparent url('_img/more.gif') no-repeat left top; width: 141px; height: 20px; text-indent: -9999px;}
#work .descr {height: 500px;}
#work .descr_txt {position: absolute; width: 480px; right: 0; top: 21px;}
.expe #work {border: none; height: 550px;}
.expe #work p {margin: 10px auto; line-height: 1.3em; font-size: 0.9em;}
.expe #work a {margin: 5px 0; display: block;}
.expe #work a.pdf {background: transparent url('_img/mime_pdf.png') no-repeat left center; padding: 0 0 0 30px;}
.expe #work a.sound {background: transparent url('_img/mime_mp3.png') no-repeat left center; padding: 0 0 0 30px;}
.expe #work a.zip {background: transparent url('_img/mime_zip.png') no-repeat left center; padding: 0 0 0 30px;}
#work .work .nobox {background:  none;}
#content .experimental .work {height:  520px;}
#content .experimental .noblock {display: inline;}
#content .experimental img {cursor: default;}
#contact {position: relative; margin-top: 20px; height: 750px;}
#contact h2 {padding: 20px 0;}
#contact img {width: 154px; float: left;}
#contact div {float: right; width: 700px; padding-left: 20px;}
#contact p {line-height: 1.4em; padding-bottom: 20px;}
#contact dd {background: transparent url('_img/glasses.gif') no-repeat left center; padding-left: 35px; }
#contact .contact_btn {display: block; background: transparent url('_img/contact_me.gif') no-repeat left top; width: 182px; height: 21px; text-indent: -9999px; margin: 20px 0; cursor: pointer;}
#contact .mailform {position: relative; width: 180px; float: none; text-align: left; padding: 0;}
#contact .mailform .required {border: 1px solid #7F539A; width: 150px; height: 20px;}
#contact .mailform .required email {border: 1px solid #7F539A; width: 150px; height: 20px;}
#contact .mailform label {width: auto; padding: 5px 0;}
#contact .mailform textarea.required {font-family: Arial,Helvetica,sans-serif; margin: 10px 0; border: 1px solid #7F539A; width: 150px; height: 100px;}
#contact .submit {background:transparent url('_img/send.gif') no-repeat scroll left center; border:0 none; color:#193589; cursor:pointer !important; display:block; height:20px; text-indent:-9999px;width:70px;font-size: 0; color: #fff;	text-align: right;}
#contact .error {display: block; color: #7F539A;}

.see_all {position: absolute; top: 0; right: 0; background: transparent url('_img/close.gif') no-repeat left center; padding-left: 33px; text-decoration: underline; width: 62px; height: 20px;cursor: pointer !important;}
.header {clear: both; display: block; background: transparent url('_img/header.jpg') no-repeat left top; width: 970px; height: 311px;}
.back {position: absolute; top: 0; right: 0; background: transparent url('_img/top.gif') no-repeat left center; padding-left: 25px; text-decoration: underline; width: 100px !important; width: 130px; height: 20px;cursor: pointer !important;}
.loading {position: absolute; top: 0; left: 0; background: transparent url('_img/loading.gif') no-repeat left center; width: 26px; height: 26px;}
.failure {position:absolute;right:-300px;top:20px; width:250px;color: #7F539A;}
.mail_sent {position:absolute;right:-300px;top:20px; width:250px;color: #7F539A;}
/*
*
* IE 6 Fixing
*
*/
#home,#work,#work .work .left,#work .work .right,#contact,#contact .mailform {zoom:1;}
