/*
Theme Name: bennyroth.de 2010
Theme URI: http://www.bennyroth.de
Description: bennyroth.de 2010
Version: 1.0
Author: Benjamin Roth
Author URI: http://bennyroth.de/
Tags: typography, clean
*/


/******** Reset ********/
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, 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: 100%;
font-family: inherit;
vertical-align: baseline;
}


/********* Defaults ********/
body {
background: #eed423;
color: #fff;
font-family: Helvetica, "Arial";
}

a {
color: #fff;
}

a:hover {
text-decoration: none;
}

p {
font-size: 18px;
font-weight: normal;
line-height: 130%;
margin: 0 0 24px 0;
}

em {
font-style: italic;	
}

img {
vertical-align: middle;	
}


/********* Typography ********/
h1 {
color: #eed423;
font-size: 100px;
font-weight: normal;
letter-spacing: -8px;
margin: 0 0 12px 0;
}

h2 {
font-size: 36px;
}

h3 {
font-size: 60px;
font-weight: bold;
margin: 0 0 6px 0;
}

h4 {
font-size: 18px;
margin: 0 0 6px 0;
}

h4 strong {
background: #fff;
color: #eed423;
display: inline-block;
font-size: 18px;
padding: 6px 12px;
}

h5 {
font-size: 18px;
font-weight: bold;
margin: 24px 0;
}


/********* Links ********/
a.bigLink {
background: #eed423;
color: #fff !important;
display: inline-block;
margin: 24px 36px 24px 0;
padding: 6px 12px;
text-decoration: none;
}

a.bigLink:hover {
background: #fff;
color: #eed423 !important;
text-decoration: line-through !important;
}


/********* Position Elements ********/
.floatLeft {
float: left;	
}

.clear {
clear: both;
font-size: 1px;
height: 0;
line-height: 1%;
overflow: hidden;
}


/********* Lists ********/
ul.normalList {
font-size: 18px;
line-height: 130%;
list-style-type: disc;
margin: 0 0 24px 16px;
}


/********* Layout Containers ********/
div#wrapper {
text-align: center;
}

div#site {
margin: 0 auto;
text-align: left;
width: 1000px;
}

div#logoLine {
margin: 24px 0 36px 0;	
}

div#content {
padding: 12px 12px 80px 0;
}

div#topRip,
div#botRip {
height: 50px;
}

div#topRip {
background: url(images/bg_toprip.png) 0 0 repeat-x;
}

div#botRip {
background: #fff url(images/bg_botrip.png) 0 0 repeat-x;
}

div#topFooterWrapper,
div#botFooterWrapper	{
padding: 50px 0 0 0;
text-align: center;
}

div#topFooterWrapper div#topFooter,
div#botFooterWrapper div#botFooter	{
margin: 0 auto;
padding: 0 0 24px 0;
text-align: left;
width: 1000px;
}

div#topFooterWrapper {
background: #fff;
}

div#topFooterWrapper div#topFooter {
background: #fff;
}

div#botFooterWrapper {
background: #eed423;
}

div#botFooterWrapper div#botFooter {
background: #eed423;
}


/********* Head ********/
div#head {
margin: 12px 0;	
}

div#head h1 strong,
div#head h2 strong {
display: none;
}

div#head h1 {
background: url(images/bg_hellothere.png) 0 0 no-repeat;
height: 166px;
width: 761px;
}

div#head h2 {
background: url(images/bg_mynameisbenjamin.png) 0 0 no-repeat;
height: 138px;
width: 942px;
}


/********* Navigation ********/
div#navigation {
margin: 24px 0 0 0;
}

div#navigation p {
background: url(images/bg_star.png) 60% 40% repeat-x;
margin: 0;
}

div#navigation p strong {
background: #eed423;
display: inline-block;
font-weight: normal;
}

div#navigation p strong a {
background: #eed423;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 24px;
margin: 0 24px 0 0;
padding: 0 0 0 12px;
text-decoration: none;
}

div#navigation p strong a span {
display: inline-block;
height: 30px;
line-height: 100%;
padding: 6px 12px 0 0;
}

div#navigation p strong a:hover {
background: url(images/bg_menu_h_l.png) 0 0 no-repeat;
color: #eed423;
}

div#navigation p strong a:hover span {
background: url(images/bg_menu_h_r.png) 100% 0 no-repeat;
display: inline-block;
}

div#navigation p strong a.current {
background: url(images/bg_menu_h_l.png) 0 0 no-repeat;
color: #eed423;
}

div#navigation p strong a.current span {
background: url(images/bg_menu_h_r.png) 100% 0 no-repeat;
display: inline-block;
}


/********* Footer ********/
div#topFooterWrapper div#topFooter p a {
color: #eed423;
}

div#topFooterWrapper div#topFooter p a:hover {
text-decoration: none;
}

div#topFooterWrapper div#topFooter .division {
background: url(images/bg_division.png) 0 0 no-repeat;
height: 19px;
margin: 60px 0;
}

div#topFooterWrapper div#topFooter p {
color: #eed423;
font-size: 24px;
}


/********* About Me ********/
div#aboutMe {
background: url(images/bg_about_me.png) 8% 0 no-repeat;
min-height: 552px;
padding: 56px 0 0 480px;
}


/********* Recent Work ********/
div#recentWork {
background: url(images/bg_recent_work.png) 48% 0 no-repeat;
padding: 400px 0 120px 0;
}

div#recentWork .division {
background: url(images/bg_division_white.png) 0 0 no-repeat;
height: 19px;
margin: 120px 0;
}

div.projectCont div.projectData {
float: left;
padding: 36px 36px 0 0;
width: 330px;
}

div.projectCont div.projectScreen {
position: relative;
float: left;
}

div.projectCont div.projectScreen .featured {
position: absolute;
bottom: -60px;
left: -80px;
}

div.projectCont div.projectData p.slogan {
font-family: Georgia, "Times New Roman", serif;
font-size: 24px;
padding: 12px 24px;
}


/********* Contact Me ********/
div#contactMe {
background: url(images/bg_contact_me.png) 54% 0 no-repeat;
min-height: 596px;
padding: 90px 0 0 48px;
position: relative;
}

div#contactMeCont {
width: 400px;
}

div.formField {
margin: 0 0 36px 0;
width: 400px;
}

div.inputCont {
background: #fff;
padding: 11px 0;
margin: 0 11px;
width: 378px;
}

.submit {
background: url(images/bg_submit.png) 0 0 no-repeat;
cursor: pointer;
display: inline-block;
height: 57px;
width: 294px;
}

div.formField .tl { background: url(images/bg_tl.png) top left no-repeat; }
div.formField .tr { background: url(images/bg_tr.png) top right no-repeat; }
div.formField .bl { background: url(images/bg_bl.png) bottom left no-repeat; }
div.formField .br { background: url(images/bg_br.png) bottom right no-repeat; }

div#contactMe p.tweet {
position: absolute;
left: 690px;
top: 40px;
width: 192px;
}

div#contactMe p.tweet a {
background: url(images/bg_tweet.png) 0 0 no-repeat;
display: inline-block;
font-size: 36px;
height: 66px;
width: 192px;
}

div#contactMe p.tweet a:hover {
background: url(images/bg_tweet.png) 0 100% no-repeat;
}

div#contactMe p.tweet a strong {
display: none;
}


/********* Imprint ********/
div#imprint {
background: url(images/bg_imprint.png) 50% 0 no-repeat;
padding: 220px 24px 0 24px;
text-transform: lowercase;
}


/********* 404 ********/
div#vierNullVier {
background: url(images/bg_fourzerofour.png) 0 0 no-repeat;
padding: 380px 0 0 415px;
}


/********* Form ********/
input,textarea {
background: #fff;
border: none;
color: #eed423;
cursor: text;
font-family: Helvetica, "Arial";
font-size: 36px;
resize: none;
}

input {
width: 372px;
}

textarea {
height: 300px;
overflow: hidden;
width: 376px;
}

label {
display: inline-block;
font-size: 18px;
margin: 0 0 6px 0;
}