﻿/*

	CSS für Golßener.Website
	
	Struktur und Layout der Seite
	
	Datum: 05/2010
	Autor: Thomas Jung ( Telefon: +49 172 3465096; Email: thomas@tjwd.de; Web: www.tjwd.de) 

*/


/* Allgemeine Reset-Definitionen */
* { margin: 0; padding: 0; }
html, body { width: 100%; height: 100%; }
body { font-size: 62.5%; font-family: 'Lucida Grande', Verdana, Helvetica, Arial, sans-Serif; background: #048; color: #fff; text-align: center; }
.hidden, #sitenav, h2 { display: none; }
img { border: none; }
.csc-default { position: relative; }


/* grundsätzliche Angaben zum Aufbau */
#page { position: relative; min-height: 100%; width: 100%; font-size: 1.1em; overflow: hidden; }
#page #bgleft, #page #bgright { position: absolute; bottom: 0; width: 50%; height: 600px; }
#page #bgleft { left: 0; background: url(../images/bgleft.jpg) repeat-x right bottom; }
#page #bgright { right: 0; background: url(../images/bgright.jpg) repeat-x left bottom; }
#page #bgcontent { position: absolute; top: 190px; left: 0; width: 100%; min-height: 100%; background: url(../images/bgcontent.png) repeat-y center top; }
/* #page #bgcontent rauswerfen wenn zus. DIV#clearall in Quelltext. */


/* Gestaltung für Header */
#header { position: relative; height: 190px; width: 820px; margin: 0 auto;  background: url(../images/bgheader.png) no-repeat center bottom; text-align: left; }
#header h1 { position: relative; text-align: left; width: 160px; height: 160px; display: block; margin: 0; }
#header #h_link { position: relative; top: 10px; left: 40px; width: 160px; height: 160px; display: block; overflow: hidden; text-indent: -9000px; background: url(../images/golssenerlogo.png) no-repeat 0 0; text-align:left; margin: 0; }
#header #nav { position: absolute; right: 10px; top: 0; padding: 120px 0 0 0; list-style-type: none;  }
#header #nav li { position: relative; float: left; padding: 0 10px 28px 0; height: 30px; line-height: 30px; }
#header #nav li.act { background: url(../images/navactive.png) no-repeat center bottom; }
#header #nav li a { font-family: Georgia, Times, 'Times New Roman', serif; font-size: 1.5em; color: #fff; font-style: italic; text-decoration: none; font-weight: bold; background: url(../images/navsep.png) no-repeat left center; padding: 0 0 0 10px; }
#header #nav li a:hover, #header #nav li.act a { color: #abc; }
#header #nav li#n_mago  { position: absolute; top: 0; right: 0; width: 40px; height: 40px; background: transparent; padding: 0; }
#header #nav li#n_mago a { position: relative; display: block; height: 40px; width: 40px; overflow: hidden; text-indent: -9000px; background: url(../images/navmago.png) no-repeat 0 0; }
#header #nav li#n_home{padding: 0 10px 28px 10px; }
#header #nav li#n_home a { width: 22px; height: 30px; overflow: hidden; display: block; text-indent: -9000px; background: url(../images/navhome.png) no-repeat center top; padding: 0 0 0 0;  }
#header #nav li#n_home a:hover, #header #nav li#n_home.act a { background-position: center bottom; }


/* Darstellung des Content-Bereichs mit Sidebar */
#wrapper { position: relative; width: 830px; margin: 0 auto; padding: 0 30px 0 0; background: url(../images/bgcontent.png) repeat-y 20px 0; color: #333; text-align: left; }
#content { position: relative; width: 515px; padding: 0 30px 325px 0; margin: 0 0 0 30px; float: right; }
#sidebar { position: relative; top: 0; left: 0; width: 190px; float: right; margin: 25px 10px 325px 10px; padding: 0 0 10px 0; color: #456; background: url(../images/sidebarsep.png) no-repeat left bottom; line-height: 135%; }
#clearall { position: relative; clear: both; width: 100%; height: 100%; background: #f00; display: block; float: none; }


/* Footer-Designs */
#footer { position: relative; width: 100%; height: 325px; margin: -325px 0 0 0; background: url(../images/woodfooter.jpg) no-repeat center bottom; }	
#footer #fwrap { position: relative; top: 5px; width: 1100px; height: 320px; margin: 0 auto; background: url(../images/bgfwrap.png) no-repeat center top; }
#footer #fpics { position: absolute; top: 22px; left: 163px; width: 776px; height: 175px; }
#footer #fpics #wave { position: absolute; top: 0; left: 0; width: 774px; height: 100px; background: url(../images/fpicswave.png) no-repeat 0 0; }
#footer #fpics img { position: relative; width: 258px; float: left; }
#footer #cuke, #footer #polaroids { position: absolute; top: 120px; height: 200px; z-index: 90000; }
#footer #cuke { left: 0; width: 300px; background: url(../images/cukenpepper.png) no-repeat 0 0; }
#footer #polaroids { right: 0; width: 260px; background: url(../images/polaroids.png) no-repeat 0 0; }
#footer #technav { list-style-type: none; }
#footer #technav { position: absolute; bottom: 68px; left: 300px; width: 280px; padding: 7px 0 0 20px; height: 40px; background: url(../images/bgtechnavleft.png) no-repeat left top; text-align: left; }
#footer #technav .tnlink { position: relative; text-decoration: none; background: url(../images/technavsep.png) no-repeat right center; padding: 0 7px 0 0; margin: 0 7px 0 0; }
#footer #technav form { position: absolute; top: 0; right: -230px; width: 230px; height: 40px; overflow: hidden; background: url(../images/bgtechnavright.png) no-repeat right top; }
#footer #technav form h4 { display: none; }
#footer #technav form #blendstuff { position: absolute; top: 5px; right: 14px; width: 20px; height: 20px; background: #f00; text-align: left; padding: 0 0 0 10px; background: url(../images/technavsep.png) no-repeat 0 3px; overflow: hidden; }
#footer #technav form input#searchword { position: relative; background: #edc; border: 1px solid #a98; font-size: 11px; padding: 1px 4px; width: 160px; color: #a98; display: none; }
#footer #technav form input#searchword:focus { color: #048; background: #fff; border: 1px solid #048; }
#footer #technav form input#send { position: absolute; right: 0; top: 2px; height: 14px; width: 14px; border: none; background: url(../images/searchbtn.png) no-repeat 0 0; padding: 0 0 0 20px; overflow: hidden; text-indent: -900em; }
#footer #technav form input#send:active { background: url(../images/searchbtn.png) no-repeat 1px 1px; }

/* EOF */
