/* ## DIVS #################################################### */
#main         { position:absolute; left:0px; width:950px; height:auto; z-index:5; border-right:1px solid #E9E9E9; }
#name         { position:fixed; left:0px; top:145px; z-index:100; }
#navigation   { position:fixed; height:auto; left:0px; top:80px; width:auto; z-index:110; }

#content      { position:absolute; left:350px; top:80px; width:460px; z-index:120;  }


/* ## BASICS ################################################## */
body        { margin:0px; padding:0px; background: url(http://www.kerstin.de/img/bg.gif) no-repeat left top; background-color:#E9E9E9;  }
body, td, div, p, span,
h1, h2, h3, h4, h5, h6
            { font-family:Arial, sans-serif; font-size:12px; line-height:19px; color:#333; padding:0px; margin:0px; }

p           { margin:0px; padding:0px; margin-bottom:8px; }
h1          { display:block; position:absolute; left:550px; top:6px; width:400px; z-index:150; text-align:right; color:#C4C4C4; font-size:18px; line-height:20px; padding:0px 5px 4px 0px; font-weight:normal; text-transform:lowercase;  }
h2          { color:#333; font-weight:normal; margin-bottom:4px; margin-top:0px; }
h3          { color:#333; font-size:14px; font-weight:normal; margin-bottom:12px; margin-top:20px; }

a:link, a:hover, a:visited, 
a:active    { color:#E70057; text-decoration:none; padding:0px 2px; }
a:hover     { color:#FFF; background-color:#E70057; }
.nopadd     { padding:0px; }
a.on        { color:#E70057; }

ul { padding:20px 0px 0px 0px; margin:0px; }
li          { list-style-type:none; margin-bottom:10px; }
.first, .projekt.first      { padding-top:0px; margin-top:0px; }

/* ## TABLES #################################################### */
td          { vertical-align:top; padding:0; margin:0px; }
table       { padding-bottom:20px; }


/* ## HOME #################################################### */
#home #main #content  { top:150px; } 
#projektcarousel      { position:absolute; left:307px; left:350px; top:358px; width:auto; height:auto; z-index:130; }
#projektcarousel a    { margin:0px; padding:0px; border:0px; background-color:transparent; }
#projektcarousel ul   { overflow:hidden; height:115px; width:600px; }
#projektcarousel #car       { overflow:hidden; height:115px; width:600px; }
#projektcarousel li         { float:left; margin-right:5px; overflow: visible !important; background:transparent;}
#projektcarousel li img     { border:2px solid transparent; border-top:15px solid transparent; display:block; }
#projektcarousel li div     { position:relative; overflow:visible !important; }
#projektcarousel li div div { display:none; }
#projektcarousel div#desc   { display:none; position:absolute; left:416px; top:15px; width:127px; height:100px; background:#FFF; }
#projektcarousel div#desc div { color:#E70057; padding:2px 5px; width:auto; }

.projektdetails  { position:relative; top:0px; right:0px; width:680px; height:auto; 
padding-top:0px; z-index:1000; }
.wech  { display:none; }
.projektdetails .screenshot         { float:left; width:410px; height:auto; text-align:right; padding:0px; background-color:#E9E9E9; }
.projektdetails .screenshot img     { background: url(http://www.kerstin.de/img/shadow_i.gif) no-repeat right bottom; padding:0px 5px 5px 0px; border: #eee 1px solid; border-right:none; border-bottom:none; margin-top:4px; margin-left:5px; }
.projektdetails .text               { float:left; width:235px; height:auto; padding:0px 20px 0px 15px; margin-top:2px; background-color:transparent; }
.projektdetails .text h3            { font-size:14px; font-weight:normal; text-transform:none; margin:2px 2px 4px 2px; }
.projektdetails .text .description, 
.projektdetails .text .since  { margin-bottom:12px; font-size:11px; line-height:15px; }
.projektdetails .text .jobs  { margin-bottom:12px; }


/* ## PROJEKTE #################################################### */
#projekte #content  { width:530px; }
#projekte #content .kunden   { /* font-size:10px; line-height:14px; */ margin-bottom:30px; }
#projekte #content p   { margin-left:4px; }
.projekt                     { clear:both; position:relative; top:0px; right:0px; width:600px; height:auto; padding:30px 0px 0px 0px; z-index:1000; }
.projekt .screenshot         { float:left; width:200px; height:auto; text-align:right; }
.projekt .screenshot img     { background: url(http://www.kerstin.de/img/shadow_p.gif) no-repeat right bottom; padding:0px 5px 5px 0px; border: #eee 1px solid; border-right:none; border-bottom:none; margin:2px 0 0 5px; }
.screenshot a     { padding:0px; background-color:transparent; }
.projekt .text               { float:left; margin-left: 30px; width:300px; height:auto; padding:0px 0px 0px 0px; }
.projekt .text h3            { font-size:14px; font-weight:normal; text-transform:none; margin:0px 2px 6px 2px; }
.projekt .text .jobs         { margin-bottom:2px; }
.projekt .text .description  { margin-bottom:0px; font-size:11px; }
.projekt .text a             { font-size:11px; }


/* ## VITA #################################################### */
#vita #main #content  { width:auto; } 
.firma        { line-height:18px; margin-left:2px; }
.description  {  }
#vita #content .kunden       { font-size:10px; line-height:15px; }
#expand1, #expand2, #expand3, #expand4, #expand5, #expand6, #expand7, #expand8 { background-color: #fff; margin:0 0 10px 0; }
#expand1 div, #expand2 div, #expand3 div, #expand4 div, #expand5 div, #expand6 div, #expand7 div, #expand8 div { padding:4px 8px 4px 8px; }
td.m        { width:80px; padding-right:18px; text-align:right; }
td.r        { width:410px; }


/* ## SKILLS #################################################### */
#skills #content  p.first { margin-bottom:20px !important; }
.skills a { margin-left:-2px; }
.skills h2 { margin-top:10px; }

/* ## KONTAKT #################################################### */
#kontakt #content  { width:600px; }
#kontakt #content div { margin: 30px 0px 0px 0px; }
#kontakt #content div.contentright p { color:#999; }
.contentleft  { float:left; width:230px; height:auto; }
.contentright { float:left; width:360px; height:auto; }


/* ## NAVIGATION ############################################## */
#navigation ul  { list-style-type:none; margin:0px; padding:0px; }
#navigation li  { text-transform:lowercase; margin-bottom:2px; }

#navigation a:link, #navigation a:hover, #navigation a:visited, #navigation a:active { color:#666; background-color:#FFF; padding: 1px 4px; }
#navigation a:hover { color:#FFF; background-color:#E70057; padding-left:20px; }

#navigation a.on:hover { color:#E70057; background-color:#FFF; }
#navigation a.on { color:#FFF; background-color:#AFAFAF; padding-left:20px; }