@charset "utf-8";
/* CSS Document

Site Name: BioTrop Wintergärten GmbH
Site URI: www.biotrop-wintergarten.de
Description: Seite der BioTrop Wintergärten GmbH
Version: 1.2
Author: Jan-Niklas Postulart, p'art medienwerkstatt
Author URI: www.design-part.de, www.fotopart.de
*/

/*  =COLORS
---------------------------------------------------
  Body Background: #1c1e24
  Main Text: #ffffff
  Links: #ee7f00
*/

/* =RESET
---------------------------------------------------*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { padding: 0; margin: 0; }
table { border-collapse: collapse; border-spacing: 0; }
ol,ul { list-style: none; }
h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%; }
abbr,acronym,a,img { border: 0; }

/*  =GLOBAL ELEMENTS
-------------------------------------------------------------- */

body { background-color: #1C1E24; color: #fff; font: 12px Verdana, Arial, sans-serif; }
#wrapper { width: 960px; margin: 0 auto 30px auto; overflow: auto; background: url(../img/bg.png) top center no-repeat; }
hr { border: 0; height: 1px; background-color: #EE7F00; clear: both; margin: 0 0 10px 0; }
.invisible { display: none; }

/*  =HEADER
-------------------------------------------------------------- */

#logo { width: 960px; height: 100px; margin: 20px auto 10px auto; background: url(../img/logo.png) top center no-repeat; }
#logo a { display: block; width: 250px; height: 100px; float: right; }
#logo span { display: none; }
#living { display: none; }

/*  =NAVIGATION
-------------------------------------------------------------- */

#navigation { margin: 20px 0; font: 18px "Arial Narrow", Arial, Helvetica, sans-serif; color: #ccc; height: 1.8em; position: relative; z-index: 100; }
#navigation li { float: left; display: block; position: relative; }
#navigation li a, #navigation li span.active { color: #ccc; text-decoration: none; display: block; padding: 0 10px; line-height: 1.8em; }
#navigation li a:hover, #navigation li span.active:hover, #navigation li:hover { color: #EE7F00; background: url(../img/75schwarz.png) top left repeat; }
#navigation li span.active, #navigation li a.trail { color: #EE7F00; }
#navigation ul.level_2 { display: none; position: absolute; top: 1.8em; left: 0; z-index: 100; background: url(../img/75schwarz.png) top left repeat; width: 150px; padding-bottom: 10px; }
#navigation ul.level_2 li { padding: 0 10px 0 0; float: none; line-height: 1.2em; background: none; }
#navigation ul.level_2 li a, #navigation ul.level_2 li span.active { line-height: 1.2em; }
#navigation ul.level_2 li a:hover, #navigation ul.level_2 li span.active:hover { background: none; }
#navigation li:hover ul.level_2 { display: block; }

span.active { color: #EE7F00; }

/*  =BREADCRUMB
-------------------------------------------------------------- */

#breadcrumb { float: right; font: 10px Arial, Helvetica, sans-serif; margin-right: 10px; }
h6 { padding-right: 10px; float: left; }

/*  =GALLERY
-------------------------------------------------------------- */

.ce_image { position: relative; }
.ce_image a { display: block; }
h5, #container .caption { position: absolute; bottom: 12px; left: 10px; padding: 10px 20px; font: 24px "Arial Narrow", Arial, Helvetica, sans-serif; background: url(../img/75schwarz.png) top left repeat; color: #fff; }

/*  =SLOGAN
-------------------------------------------------------------- */

#slogan, .mod_randomImage { width: 960px; height: 250px; overflow: hidden; margin-bottom: 20px; z-index: 10; position: relative; }
.mod_randomImage div.image_container { position: relative; }
h4, .image_container div.caption { position: absolute; left: 0; bottom: 0; padding: 20px 50px; font: 34px "Arial Narrow", Arial, Helvetica, sans-serif; color: #EE7F00; background: url(../img/75schwarz.png) top left; }

/*  =CONTENT
-------------------------------------------------------------- */

.ce_text { margin-bottom: 20px; }
#container { overflow: auto; margin-bottom: 20px; }
h2, h3 { font: 32px "Arial Narrow", Arial, Helvetica, sans-serif; color: #ccc; padding: 0 10px; }
#container p { font: 14px Arial, Helvetica, sans-serif; padding: 10px 10px; line-height: 140%; }
#container p.date { font: 10px Arial, Helvetica, sans-serif; color: #666; display: block; padding: 10px 10px 0 10px; }
#container ul { padding-left: 25px; font: 14px Arial, Helvetica, sans-serif; line-height: 140%; }
#container ul li { list-style: disc; line-height: 140%; }
a { color: #EE7F00; text-decoration: none; }
a:hover { text-decoration: underline; }
.ce_hyperlink { margin: 5px 10px; }

/*  =FOOTER
-------------------------------------------------------------- */

#footer { overflow: auto; margin-bottom: 10px; }
#footer p { font: 10px Arial, Helvetica, sans-serif; color: #ccc; width: 310px; margin-left: 10px; margin-bottom: 10px; }
#footer p.credit { width: auto; }
.credit { font: 10px Arial, Helvetica, sans-serif; color: #ccc; margin-left: 10px; margin-right: 10px; }
.credit a { color: #EE7F00; text-decoration: none; }
.credit a:hover { color: #ccc; }

/*  =FORMS
-------------------------------------------------------------- */

form { padding: 0; width: 610px; text-align: left; margin: 15px; }
input, select { border: 1px solid #000; width: 200px; background: #fff; margin-bottom: 10px; }
textarea { width: 200px; height: 100px; border: 1px solid #000000; font: 7.5pt Verdana, sans-serif; margin-bottom: 10px; }
.form { padding-top: 5px; }
#opt_8_0 { margin-right: 10px; width: auto; float: left; }
#lbl_8_0 { float: none; width: 400px; }
#ctrl_8 { margin-top: 10px; margin-left: 100px; }
label { display: block; width: 100px; float: left; margin-bottom: 5px; }
.submit { border: 1px solid #000; background: #fff; padding: 0 5px; margin-top: 10px; width: 200px; height: 25px; }
.submit:hover { color: #333; background: #ddd; cursor: pointer; }
.mandatory { color: #EE7F00; }
#container p.error { margin: 0; padding: 0; color: #f00; display: block; width: 280px; float: right; }

/*  =DEFAULT STYLES
-------------------------------------------------------------- */

.left { float: left; }
.right { float: right; }
.column2 { width: 320px; }
.column4 { width: 640px; }
.orange { color: #EE7F00; }
strong { font-weight: bold; }