/*-------------------- 
	BASIC
--------------------*/
* { margin: 0px; padding: 0px; }

html, body { height: 100%; }
body { background-color: #EEE; font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #033147; }
	
img, fieldset { border: 0px none; outline: none; }
area { outline: none; }

a, a:link, a:active, a:visited { color: #033147; text-decoration: none; outline: none; }
a:hover { }

p { margin: 0px 0px 15px 0px; }

ul li { list-style-type: none; }


/*-------------------- 
	PAGE
--------------------*/
#page { position: absolute; top: 50%; left: 50%; margin: -300px 0px 0px -490px; width: 980px; height: 600px; }
#main-left { float: left; width: 180px; height: 600px; background-color: #CBCCCC; }
#main-right { float: left; width: 800px; height: 600px; background: #FFF url('../img/bg-footer.gif') no-repeat 0px bottom; }


/*-------------------- 
	HEADER
--------------------*/
#header { padding: 40px 20px; }
#logo { }


/*-------------------- 
	NAVIGATION
--------------------*/
#nav { padding: 25px 0px 0px 25px; text-transform: uppercase; font-weight: bold; }
#nav ul { font-size: 12px; }
#nav ul.nav-2 { margin: 102px 0px 0px 0px; }
#nav li { margin: 0px 0px 11px 0px; }
#nav li a { display: block; height: 13px; text-indent: -9999px; background-image: url('../img/nav.gif'); }
#nav li.item1 a { width: 84px; background-position: 0 0; }
#nav li.item1 a.sel, #nav li.item1 a:hover { background-position: -160px 0; }
#nav li.item2 a { width: 87px; background-position: 0px -15px; }
#nav li.item2 a.sel, #nav li.item2 a:hover { background-position: -160px -15px; }
#nav li.item3 a { width: 111px; background-position: 0px -30px; }
#nav li.item3 a.sel, #nav li.item3 a:hover { background-position: -160px -30px; }
#nav li.item4 a { width: 59px; background-position: 0px -45px; }
#nav li.item4 a.sel, #nav li.item4 a:hover { background-position: -160px -45px; }
#nav li.item5 a { width: 124px; background-position: 0px -60px; }
#nav li.item5 a.sel, #nav li.item5 a:hover { background-position: -160px -60px; }
#nav li.item6 a { width: 32px; background-position: 0px -75px; }
#nav li.item6 a.sel, #nav li.item6 a:hover { background-position: -160px -75px; }
#nav li.item7 a { width: 116px; background-position: 0px -90px; }
#nav li.item7 a.sel, #nav li.item7 a:hover { background-position: -160px -90px; }
#nav li.item8 a { width: 56px; background-position: 0px -105px; }
#nav li.item8 a.sel, #nav li.item8 a:hover { background-position: -160px -105px; }
#nav li.item9 a { width: 93px; background-position: 0px -120px; }
#nav li.item9 a.sel, #nav li.item9 a:hover { background-position: -160px -120px; }
#nav li.item10 a { width: 132px; background-position: 0px -135px; }
#nav li.item10 a.sel, #nav li.item10 a:hover { background-position: -160px -135px; }
#nav li.item11 a { width: 33px; background-position: 0px -150px; }
#nav li.item11 a.sel, #nav li.item11 a:hover { background-position: -160px -150px; }
#nav li.item12 a { width: 35px; background-position: 0px -165px; }
#nav li.item12 a.sel, #nav li.item12 a:hover { background-position: -160px -165px; }
#nav li a.sel { color: #7A1108; }
#nav li a:hover { color: #7A1108; }
#nav ul ul { padding: 0px 0px 0px 15px; font-size: 10px; }
#nav ul ul li { margin: 11px 0px 0px 0px; }


/*-------------------- 
	CONTENT
--------------------*/
#content { height: 600px; }
#content-left { float: left; width: 670px; height: 352px; }
#content-right { float: left; width: 130px; }

#content.technik-clean { padding: 154px 0px 0px 0px; height: 446px !important; background-image: url('../img/bg-content-technik-clean.jpg'); background-repeat: no-repeat; }
#content.technik-handmade { padding: 154px 0px 0px 0px; height: 446px !important; background-image: url('../img/bg-content-technik-handmade.jpg'); background-repeat: no-repeat; }
#content.infografik { padding: 154px 0px 0px 0px; height: 446px !important; background-image: url('../img/bg-content-infografik.jpg'); background-repeat: no-repeat; }
#content.grafisch { padding: 154px 0px 0px 0px; height: 446px !important; background-image: url('../img/bg-content-grafisch.jpg'); background-repeat: no-repeat; }
#content.comic { padding: 154px 0px 0px 0px; height: 446px !important; background-image: url('../img/bg-content-comic.jpg'); background-repeat: no-repeat; }
#content.roughs { padding: 154px 0px 0px 0px; height: 446px !important; background-image: url('../img/bg-content-roughs.jpg'); background-repeat: no-repeat; }
#content.dies-und-das { padding: 154px 0px 0px 0px; height: 446px !important; background-image: url('../img/bg-content-dies-und-das.jpg'); background-repeat: no-repeat; }
.dies-und-das-video { display: none; }

.technik-clean-content { background-image: url('../img/content-technik-clean-intro.jpg'); background-repeat: no-repeat; }
.technik-handmade-content { background-image: url('../img/content-technik-handmade-intro.jpg'); background-repeat: no-repeat; }
.infografik-content { background-image: url('../img/content-infografik-intro.jpg'); background-repeat: no-repeat; }
.grafisch-content { background-image: url('../img/content-grafisch-intro.jpg'); background-repeat: no-repeat; }
.comic-content { background-image: url('../img/content-comic-intro.jpg'); background-repeat: no-repeat; }
.roughs-content { background-image: url('../img/content-roughs-intro.jpg'); background-repeat: no-repeat; }
.dies-und-das-content { background-image: url('../img/content-dies-und-das-intro.jpg'); background-repeat: no-repeat; }


/*-------------------- 
	MISC
--------------------*/
.clearer { clear: both; }


/*-------------------- 
	FORM
--------------------*/
form { }
legend { }
label { padding: 0px 0px 5px 10px; display: block; }
input { margin: 0px 0px 15px 0px; padding: 8px 10px; width: 484px; border: 1px solid #D4D4D4; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; }
input.text-small { width: 220px; }
input.submit { margin: 0px 0px 15px 0px; padding: 0px; width: auto; border: 0px none; }
textarea { margin: 0px 0px 15px 0px; padding: 8px 10px; width: 484px; border: 1px solid #D4D4D4; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; }
input.send { }
.error { color: red; font-weight: bolder; }
.success { color: green; font-weight: bolder; padding-bottom: 20px; }
