/* -------------------------------------------------------------- 
   
   screen.css
      * Sets up the screen styles.
	        
-------------------------------------------------------------- */

/* Default font setting 
   The font-size percentage is of 16px. (0.875 * 16px = 14px) 
   
   Default line height
   The line-height is 1.714285 * 14px = 24px */
body {
	font-size:0.875em;
	line-height:1.714285em;
	color:#443a31;
	background-color:#f9f9f1;
	font-family:'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', 'Lucida', Arial, sans-serif;
	text-align:left;
}

div.hr {
	height:1.714285em;
	overflow:hidden;
	background:url(../images/layout/hr.gif) repeat-x center center;
}
div.hr hr {
	display:none;
}
.bottom-line {
	margin-bottom:1.714285em;
}

/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
      [http://www.positioniseverything.net/easyclearing.html] */

.clearfix:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}
.clearfix {
	display:inline-block;
}
* html .clearfix {
	height:1%;
}
.clearfix {
	display:block;
}

/* Regular clearing */

.clear { clear:both; }


/* Navigation
-------------------------------------------------------------- */

#nav {
	color:#fff;
	background-color:#443a31;
}

/* Width calculation: 
   1em = 14px
   1px = 1 / 14 = 0.071428em
   940px = 0.071428 * 940 = 67.142857em */
#nav ul {
	width:67.142857em;
	margin:0 auto;
	padding-top:1.714285em;
	list-style-type:none;
	text-align:right;
}
#nav li {
	display:inline;
	padding-left:1em;
}
#nav a {
	text-decoration:none;
}
#nav a.active {
	text-decoration:underline;
}
#nav a:link,
#nav a:visited {
	color:#fff;
}
#nav a:hover, 
#nav a:active,
#nav a:focus {
	color:#5ac8ff;
}

/* Bluebar
-------------------------------------------------------------- */

#bluebar,
#bluebar-home {
	background-color:#5ac8ff;
	background-repeat:repeat-x;
	border-bottom:#e0d9b8 5px solid;
	margin-bottom:1.714285em;
}
#bluebar {
	background-image:url(../images/layout/bluebar_background.gif);
}
#bluebar-home {
	background-image:url(../images/layout/home_bluebar_background.gif);
}
#bluebar div,
#bluebar-home div {
	width:67.142857em;
	margin:0 auto;
	background-repeat:no-repeat;
	background-position:top right;
}
#bluebar div {
	height:166px;
	background-image:url(../images/layout/bluebar_eyecatcher.gif);
}
#bluebar-home div {
	height:321px;
	background-image:url(../images/layout/home_bluebar_eyecatcher.gif);
}
#bluebar div a,
#bluebar-home div a {
	display:block;
	width:222px;
	height:137px;
	background:url(../images/layout/logo.gif) no-repeat;
}
#bluebar div a strong,
#bluebar-home div a strong {
	display:none;
}
#bluebar div a:link,
#bluebar div a:visited,
#bluebar-home div a:link,
#bluebar-home div a:visited {
	background-position:0 0;
}
#bluebar div a:hover,
#bluebar div a:active,
#bluebar div a:focus,
#bluebar-home div a:hover,
#bluebar-home div a:active,
#bluebar-home div a:focus {
	background-position:0 -137px;
}

/* Container
-------------------------------------------------------------- */

#container {
	width:67.142857em;
	margin:0 auto;
}

/* Big text
-------------------------------------------------------------- */

/* font size calculation:
   14px * 1.428571 = 20px
   line height calculation:
   20px * 1.2 = 24px */
div.big-text {
	font-size:1.428571em;
	font-style:italic;
	line-height:1.2em;
	text-align:center;
	color:#ff9157;
}
div.big-text strong {
	font-size:1em;
	font-weight:normal;
}

/* Angebote
-------------------------------------------------------------- */

/* 1 column of a 3 column layout
   width calculation:
   14px * 21.428571 = 300px
   margin right calculation:
   14px * 1.428571 = 20px 
   rounded down a little bit to prevent from breaking the layout */
div.angebot {
	float:left;
	width:21.426em;
	margin-right:1.426em;
}

/* Grid
-------------------------------------------------------------- */

/* 1 column of a 3 column layout
   width calculation:
   14px * 21.428571 = 300px
   margin right calculation:
   14px * 1.428571 = 20px 
   rounded down a little bit to prevent from breaking the layout */
div.col-1 {
	float:left;
	width:21.427em;
	margin-right:1.427em;
}
div.col-2 {
	float:left;
	width:44.281em;
	margin-right:1.427em;
}
div.add-space-1 {
	margin-left:22.854em;
}
div.last {
	margin-right:0;
}

/* Subnavigation
-------------------------------------------------------------- */

div.col-1 ul.nav li {
	padding-left:0;
	background:url(../images/layout/subnav_background.gif) repeat-x bottom center;
}
div.col-1 ul.nav li a {
	display:block;
}
div.col-1 ul.nav li a:link,
div.col-1 ul.nav li a:visited {
	text-decoration:none;
}
div.col-1 ul.nav li a:hover,
div.col-1 ul.nav li a:active,
div.col-1 ul.nav li a:focus {
	text-decoration:underline;
	background-color:transparent;
}
div.col-1 ul.nav li a.active {
	text-decoration:underline;
}


/* Images
-------------------------------------------------------------- */

div.col-1 a.image-4-3,
div.angebot a.image-4-3,
div.col-1 a.image-16-9 {
	display:block;
	overflow:hidden;
	background-color:#e0d9b8;
}
div.col-1 a.image-4-3 img,
div.angebot a.image-4-3 img,
div.col-1 a.image-16-9 img {
	border-color:#fff;
	border-style:solid;
}
/* height calculation: 
   14px * 15.642857 = 219px
   padding calculation:
   14px * 0.357142 = 5px
   margin bottom calculation:
   14px * 0.785714 = 11px */
div.col-1 a.image-4-3,
div.angebot a.image-4-3 {
	height:15.642857em;
	margin-bottom:0.785714em;
	padding:0.357142em;
}
/* height calculation:
   14px * 15.357142 = 215px
   width calculation:
   14px * 20.428571 = 286px
   border width calculation:
   14px * 0.142857 = 2px */
div.col-1 a.image-4-3 img,
div.angebot a.image-4-3 img {
	width:20.428571em;
	height:15.357142em;
	border-width:0.142857em;
}
/* height calculation: 
   14px * 11.785714 = 165px
   padding calculation:
   14px * 0.357142 = 5px
   margin bottom calculation:
   14px * 1.214285 = 17px */
div.col-1 a.image-16-9 {
	height:11.785714em;
	margin-bottom:1.214285em;
	padding:0.357142em;
}
/* height calculation:
   14px * 11.5 = 161px
   width calculation:
   14px * 20.428571 = 286px
   border width calculation:
   14px * 0.142857 = 2px */
div.col-1 a.image-16-9 img {
	width:20.428571em;
	height:11.5em;
	border-width:0.142857em;
}
div.col-1 a.image-4-3:hover,
div.col-1 a.image-4-3:active,
div.col-1 a.image-4-3:focus,
div.col-1 a.image-16-9:hover,
div.col-1 a.image-16-9:active,
div.col-1 a.image-16-9:focus,
div.angebot a.image-4-3:hover,
div.angebot a.image-4-3:active,
div.angebot a.image-4-3:focus,
div.angebot a.image-16-9:hover,
div.angebot a.image-16-9:active,
div.angebot a.image-16-9:focus {
	padding:0.142857em;
}
/* height calculation:
   14px * 16.071428 = 225px */
div.col-1 a.image-4-3:hover,
div.col-1 a.image-4-3:active,
div.col-1 a.image-4-3:focus,
div.angebot a.image-4-3:hover,
div.angebot a.image-4-3:active,
div.angebot a.image-4-3:focus {
	height:16.071428em;
}
/* height calculation:
   14px * 12.214285 = 171px */
div.col-1 a.image-16-9:hover,
div.col-1 a.image-16-9:active,
div.col-1 a.image-16-9:focus {
	height:12.214285em;
}
div.col-1 a.image-4-3:hover img,
div.col-1 a.image-4-3:active img,
div.col-1 a.image-4-3:focus img,
div.angebot a.image-4-3:hover img,
div.angebot a.image-4-3:active img,
div.angebot a.image-4-3:focus img,
div.col-1 a.image-16-9:hover img,
div.col-1 a.image-16-9:active img,
div.col-1 a.image-16-9:focus img {
	border-width:0.357142em;
}

/* Forms
-------------------------------------------------------------- */

/* height calculation:
   14px * 10.285714 = 6 * 24px = 144px */
div.col-2 textarea {
	width:30em;
	height:10.285714em;
}
div.col-2 ul.errors {
	border:1px solid #ff9157;
	margin:0.5em 0;
}
div.col-2 ul.errors li {
	display:block;
	padding:0 1em;
	color:#ff9157;
	background:#faeada;
}
/* font size calculation:
   14px * 0.857143 = 12px 
   margin top calculation:
   12px * 2 = 24px */
div.col-2 p.hint {
	margin-top:2em;
	font-size:0.857143em;
	font-style:italic;
	line-height:2em;
}
div.col-2 dd p.hint {
	margin-top:0;
}

/* Google Maps
-------------------------------------------------------------- */

/* line height calculation:
   14px * 30.857142 = 432px */
#map {
	height:30.857142em;
}
   
/* Typography
-------------------------------------------------------------- */

/* font size calculation:
   14px * 1.714285 = 24px
   line height calculation:
   24px * 1 = 24px
   margin bottom calculation:
   24px * 1 = 24px */
div.col-1 h1,
div.col-2 h1 {
	margin-bottom:1em;
	font-size:1.714285em;
	font-family:Georgia,"Times New Roman",Times,serif;
	font-weight:normal;
	line-height:1em;
	color:#b2cc5e;
}
/* font size calculation:
   14px * 1.714285 = 24px
   line height calculation:
   24px * 1 = 24px
   margin bottom calculation:
   24px * 1 = 24px */
div.col-1 h2,
div.col-2 h2 {
	margin-bottom:1em;
	font-size:1.714285em;
	font-family:Georgia,"Times New Roman",Times,serif;
	font-style:italic;
	font-weight:normal;
	line-height:1em;
}
/* font size calculation:
   14px * 1.285714 = 18px
   line height calculation:
   18px * 1.333333 = 24px
   margin bottom calculation:
   18px * 1.333333 = 24px */
div.col-1 h3,
div.col-2 h3 {
	margin-bottom:1.333333em;
	font-size:1.285714em;
	font-weight:normal;
	text-align:center;
	line-height:1.333333em;
	background:url(../images/layout/hr.gif) repeat-x center center;
}
div.col-1 h3 span,
div.col-2 h3 span {
	padding:0 .5em;
	background-color:#f9f9f1;
}
div.col-1 p,
div.col-2 p {
	margin-bottom:1.714285em;
}
div.col-1 p.no-bottom-line,
div.col-2 p.no-bottom-line {
	margin-bottom:0;
}
div.col-1 p.center,
div.col-2 p.center {
	text-align:center;
}
div.col-1 p a:link,
div.col-1 p a:visited,
div.col-1 li a:link,
div.col-1 li a:visited,
div.col-2 p a:link,
div.col-2 p a:visited,
div.col-2 li a:link,
div.col-2 li a:visited {
	text-decoration:underline;
	color:#443a31;
}
div.col-1 p a:hover,
div.col-1 p a:active,
div.col-1 p a:focus,
div.col-1 li a:hover,
div.col-1 li a:active,
div.col-1 li a:focus,
div.col-2 p a:hover,
div.col-2 p a:active,
div.col-2 p a:focus,
div.col-2 li a:hover,
div.col-2 li a:active,
div.col-2 li a:focus {
	text-decoration:none;
	background-color:#e0d9b8;
}
div.col-1 p strong,
div.col-2 p strong {
	font-weight:normal;
	font-style:italic;
	color:#ff9157;
}
div.col-1 ul,
div.col-2 ul {
	list-style-type:none;
	margin-bottom:1.714285em;
}
div.col-1 li,
div.col-2 li {
	line-height:1.714285em;
	padding-left:20px;
	background:url(../images/layout/list_bullet.gif) no-repeat 0 0.5em;
}
div.col-1 span.type,
div.col-2 span.type {
	display:none;
}

/* Footer
-------------------------------------------------------------- */

/* font size calculation:
   14px * 0.857143 = 12px */
#footer {
	font-size:0.857143em;
	line-height:2em;
	text-align:right;
}
#footer div {
	float:left;
}
#footer a {
	color:#443a31;
}
#footer a:link,
#footer a:visited {
	text-decoration:none;
}
#footer a:hover,
#footer a:active,
#footer a:focus {
	text-decoration:underline;
}
#footer a.active {
	text-decoration:underline;
}

/* Footer print
-------------------------------------------------------------- */

#footer-print {
	display:none;
}