/* RESET */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}

table {border-collapse:separate;border-spacing:0;}

caption, th, td {text-align:left;font-weight:normal;}

table, td, th {vertical-align:middle;}

a img, :link img, :visited img { border: 0; }

a { outline: none; }


/* HTML ELEMENTS */

html, body { height: 100%; width: 100%; }

html { background: #1c202a url(../bilder/bg-html.gif) repeat top left; height: 100%; width: 100%; }

body { font:62.5%/2.1em arial, helvetica, sans-serif; line-height:2.1em; color: #bec2c2; }

.dunkelgrau { color: #191d22; }

.blaugrau { color: #1c202a; }

.grau { color: #bec2c2; }

.gelb { color: #f4c000; }

.rot { color: #cc0033; }

.weiss { color: #fafafa; }


/* PAGE STRUCTURE */

#header, #teaser, #content, #footer { display: block; width: auto; position: relative; }

#header { background: url(../bilder/bg-teaser.gif) repeat-x bottom left; z-index: 2; }

.navigation { height: 10em; padding-top: 5em; }

.teaser { padding: 2.1em 0 4.2em 4em; }

#content { background: url(../bilder/bg-content.gif) repeat-x top left; z-index: 1; }

#footer { padding: 4.2em 0 2.1em 0; background: url(../bilder/bg-footer.gif) repeat-x top left; }

.container, .productwrapper { margin: 0 auto; width: 96em; position: relative; display: block; }

.containerSmall { margin: 0 auto; width: 92em; position: relative; }

#content .container { background: url(../bilder/bg-floor.gif) no-repeat center 1px; padding-top: 7em; position: relative; }

.col2, .col3, .col4, .col5, .ratioBig, .ratioSmall { display: inline; float: left; padding: 0 2em 2.1em 2em; position: relative; }

.col2 { width: 44em; }

.col3 { width: 28em; }

.col4 { width: 20em; }

.col5 { width: 15.2em; background: url(../bilder/bg-footercol.gif) repeat-x 1px left; margin-top: 0.2em; padding-top: 2.1em; }

.ratioBig { width: 56em; }

.ratioSmall { width: 32em; }


/* NAVIGATION */

body#home .home, body#produkte .produkte, body#ueberuns .ueberuns, body#kontakt .kontakt { border-bottom: #f4c000 10px solid; }

#nav { font-size: 1.8em; letter-spacing: -0.05em; margin: 0; font-weight: bold; position: absolute; right: 0; z-index: 999; }

#nav li { float: left; list-style: none; padding: 1em 2.1em; margin-left: 0.1em; }

#nav li a { color: #bec2c2; text-decoration: none; padding-bottom: 0.3em; }

#nav li a:hover { border-bottom: #f4c000 10px solid; }

#content p a, #content p a:visited { color: #fafafa; font-weight: bold; text-decoration: none; border-bottom: #555 1px dotted; }

#content p a:hover { color:  #f4c000; }

#footer a, #footer a:visited { color: #bec2c2; text-decoration: none; border-bottom: #555 1px dotted; }

#footer a:hover { color: #f4c000; }


/* TYPROGRAPHY */

b, strong { font-weight: bold; }

em { font-weight: bold; color: #fafafa; font-style: normal; }

h1 { font-size:4.2em; line-height: 1em; letter-spacing: -2px; color: #9c9c9c; }

h2 { font-size:2.1em; line-height: 1.2em; font-family: georgia, times, serif; }

h3 { font-size:2.1em; padding-bottom: 0.5em; margin-bottom: 0.5em; letter-spacing: -1px; color: #f4c000; background: url(../bilder/bg-underline.gif) repeat-x bottom left; }

h4 { font-size:1.4em; font-family: georgia, times, serif; font-style: italic; }

h5 { font-size:1.4em; color: #f4c000; }

h6 { font-size:1.75em; line-height: 1.2em; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; }

i { font-style: italic; }

p { font-size:1.4em; line-height:1.5em; top: 0.1em; position: relative; margin-bottom: 1.5em; }

#footer p { font-size: 1.2em; line-height: 18px!important; }



/* OTHER CLASSES  */

.clear { clear: both; }

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }  

#diashow-wrapper { background: url(../bilder/bg-diashow.png) no-repeat top center; width:57.4em; height: 36.9em; position: absolute; top:-7em; right:0; display: block; z-index: 555; overflow: hidden; }

.georgia { font-family: georgia; }

.float-left { float: left; }

.float-right { float: right; }

.letterspacing { letter-spacing: 1px; }

#logo { width: 41.6em; height: 22em; position: absolute; top:0; left: -7.5em; background: url(../bilder/logo-audiosphere.gif) no-repeat top center; text-indent: -9999px; }

.nowrap { white-space: nowrap; }

.margin { margin: 2.1em 0; }

.margin-left { margin-left: 2em; }

.margin-right { margin-right: 2em; }

.minimum-height { min-height: 30em; height:auto !important; height: 30em; }

.nodisplay { display: none; }

.noborder { border: none; }

.nomargin { margin-bottom: none; }

.small { font-size: 10px; line-height: 21px; }

.transparent { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; }


/* IMAGES  */

p img { margin-bottom: 2.1em; position: relative; top: 0.5em; }

img.img-left { float: left; margin-right: 4em; }

img.img-right { float: right; margin-left: 4em; }
 

/* LISTS */

ul.typo, ol.typo { font-size: 1.4em; line-height: 1.5em; margin: 1.5em 0 1.5em 2.5em; list-style-position: outside; position: relative; top: 0.1em; }

ul.innerfade { list-style-type: none; }


/* FORM ELEMENTS */

form legend { font-size:42px; padding-bottom: 21px; letter-spacing: -0.05em; color: #f4c000; }

form { padding: 21px; }

form, form fieldset input, form fieldset textarea, form label { font-size: 15px; }

form p { position: relative; margin: 10px 0;}

form p label { position: absolute; top: 0; left: 0;}

form p br {display: none;}

form fieldset p input, form fieldset p textarea { display: block; padding: 4px; width: 400px; margin: 0; } 

form fieldset p label { width: 380px; display: block; margin: 0 5px 5px 6px; padding: 0; }

form fieldset p textarea { padding: 2px; width: 404px; }

form fieldset p textarea, form fieldset p input { border: solid 1px #bec2c2; font-family: arial, helvetica, sans-serif; }

form fieldset p textarea:focus, form fieldset p input:focus { background-color: #f4c000; }

form fieldset p label { color: #777; }

form .error { color: #cc0033; font-size: 14px; }

.button { 
	background: #222 url(../bilder/btn-overlay.png) repeat-x;
	border-bottom: 1px solid #222;
	border-bottom: 1px solid rgba(0,0,0,0.25);
	color: #bec2c2;
	cursor: pointer; 
	display: inline-block;
	font-size: 14px; 
	font-weight: bold; 
	padding: 8px 10px 9px;
	position: relative;  
	text-decoration: none;
	text-shadow: 0 -1px 1px #222;  
	line-height: 1; 
	-moz-border-radius: 5px; -webkit-border-radius: 5px; 
	-moz-box-shadow: 0 1px 3px #999; -webkit-box-shadow: 0 1px 3px #999; 
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5); 
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5); 
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25); }

.button:hover { background-color: #111; color: #f4c000; }

button { border: none; color: inherit; }



/* FANCY BOX */

div#fancy_overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #1c202a; display: none; z-index: 30; }

* html div#fancy_overlay { position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); }

div#fancy_wrap { text-align: left; }

div#fancy_loading { position: absolute; height: 40px; width: 40px; cursor: pointer; display: none; overflow: hidden; background: transparent; z-index: 100; }

div#fancy_loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background: transparent url('../bilder/fancy/fancy_progress.png') no-repeat; }

div#fancy_loading_overlay { position: absolute; background-color: #FFF; z-index: 30; }

div#fancy_loading_icon { position: absolute; background: url('../bilder/fancy/fancy_loading.gif') no-repeat; z-index: 35; width: 16px; height: 16px; }

div#fancy_outer { position: absolute; top: 0; left: 0; z-index: 90; padding: 18px 18px 33px 18px; margin: 0; overflow: hidden; background: transparent; display: none; }

div#fancy_inner { position: relative; width:100%; height:100%; border: 1px solid #BBB; background: #FFF; }

div#fancy_content { margin: 0; z-index: 100; position: absolute; }

div#fancy_div { background: #000; color: #FFF; height: 100%; width: 100%; z-index: 100; }

img#fancy_img { position: absolute; top: 0; left: 0; border:0; padding: 0; margin: 0; z-index: 100; width: 100%; height: 100%; }

div#fancy_close { position: absolute; top: -12px; right: -15px; height: 30px; width: 30px; background: url('../bilder/fancy/fancy_closebox.png') top left no-repeat; cursor: pointer;
	z-index: 181; display: none; }

#fancy_frame { position: relative; width: 100%; height: 100%; display: none; }

#fancy_ajax { width: 100%; height: 100%; overflow: auto; }

a#fancy_left, a#fancy_right { position: absolute; bottom: 0px; height: 100%; width: 35%; cursor: pointer; z-index: 111; display: none; background-image: url(data:image/gif;base64,AAAA); outline: none; }

a#fancy_left { left: 0px; }

a#fancy_right { right: 0px; }

span.fancy_ico { position: absolute; top: 50%; margin-top: -15px; width: 30px; height: 30px; z-index: 112; cursor: pointer; display: block; }

span#fancy_left_ico { left: -9999px; background: transparent url('../bilder/fancy/fancy_left.png') no-repeat; }

span#fancy_right_ico { right: -9999px; background: transparent url('../bilder/fancy/fancy_right.png') no-repeat; }

a#fancy_left:hover { visibility: visible; }

a#fancy_right:hover { visibility: visible; }

a#fancy_left:hover span { left: 20px; }

a#fancy_right:hover span { right: 20px; }

.fancy_bigIframe { position: absolute; top: 0; left: 0;  width: 100%; height: 100%; background: transparent; }

div#fancy_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 70; border: 0; padding: 0; margin: 0; }
	
div.fancy_bg { position: absolute; display: block; z-index: 70; border: 0; padding: 0; margin: 0; }

div.fancy_bg_n { top: -18px; width: 100%; height: 18px; background: transparent url('../bilder/fancy/fancy_shadow_n.png') repeat-x; }

div.fancy_bg_ne { top: -18px; right: -13px; width: 13px; height: 18px; background: transparent url('../bilder/fancy/fancy_shadow_ne.png') no-repeat; }

div.fancy_bg_e { right: -13px; height: 100%; width: 13px; background: transparent url('../bilder/fancy/fancy_shadow_e.png') repeat-y; }

div.fancy_bg_se { bottom: -18px; right: -13px; width: 13px; height: 18px; background: transparent url('../bilder/fancy/fancy_shadow_se.png') no-repeat; }

div.fancy_bg_s { bottom: -18px; width: 100%; height: 18px; background: transparent url('../bilder/fancy/fancy_shadow_s.png') repeat-x; }

div.fancy_bg_sw { bottom: -18px; left: -13px; width: 13px; height: 18px; background: transparent url('../bilder/fancy/fancy_shadow_sw.png') no-repeat; }

div.fancy_bg_w { left: -13px; height: 100%; width: 13px; background: transparent url('../bilder/fancy/fancy_shadow_w.png') repeat-y; }

div.fancy_bg_nw { top: -18px; left: -13px; width: 13px; height: 18px; background: transparent url('../bilder/fancy/fancy_shadow_nw.png') no-repeat; }

div#fancy_title { position: absolute; bottom: -33px; left: 0; width: 100%; z-index: 100; display: none; }

div#fancy_title div { color: #FFF; font: bold 12px Arial; padding-bottom: 3px; }

div#fancy_title table { margin: 0 auto; }

div#fancy_title table td { padding: 0; vertical-align: middle; }

td#fancy_title_left { height: 32px; width: 15px; background: transparent url(../bilder/fancy/fancy_title_left.png) repeat-x; }

td#fancy_title_main { height: 32px; background: transparent url(../bilder/fancy/fancy_title_main.png) repeat-x; }

td#fancy_title_right { height: 32px; width: 15px; background: transparent url(../bilder/fancy/fancy_title_right.png) repeat-x; }
