/* ------------------------------------ 
   ------>>> TABLE OF CONTENT <<<------ 
   ------------------------------------ 
   |- TABLE OF CONTENT
   |- GLOBALS 
   |- HTML CSS DEV-HELPER
   |- NAVIGATION 
   |- GRID HELPERS
   |- ABSOLUTES 
   |- CONTAINERS 
   |- FORM & INPUT 
   |- JQUERY UI OVERWRITE & ADD ON
   |- OVERWRITE
   ------------------------------------
*/

/* =GLOBALS
--------------------------------------------------------------------------------*/

/* = HTML CSS DEV-HELPER
--------------------------------------------------------------------------------*/
#dev_16_grid_overlay {
  background-image: url(../images/_dev.16_col.png);
  position: absolute;
  height: 500%;
  width: 960px;
  z-index: 999;
}

/* IE (PC) only :hover behaviour helper */
/* @see http://www.xs4all.nl/~peterned/ */
/* html body { behavior:url("2SBM/stylesheets/csshover2.htc");} */

div.spacer {font-size:0.08em;background:transparent;clear:both;width: 0;height: 0;}


/* = NAVIGATION
--------------------------------------------------------------------------------*/
ul.langnav {
  color: #bdbdbd;
  font: 10px arial, sans-serif;
  margin: 0 0 60px 0;
}
ul.langnav li {
  color: #bdbdbd;
  font: 10px arial, sans-serif;
  float: left;
  margin: 0 5px 0 0;
}
ul.langnav li a {
  color: #bdbdbd;
  text-decoration: none;
}
ul.langnav li a:hover,
ul.langnav li a.active {
  color: #2f2f2f;
}

ul#pnav {
  margin: 0 0 25px 0;
}
ul#pnav li {
  float: left;
  color: #bdbdbd;
padding-top:2px;
padding-bottom:0px;
}

html*+ul#pnav li {
  float: left;
  color: #bdbdbd;
padding-top:0px;
padding-bottom:2px;
}

ul#pnav li:hover ul.sub li a,
ul#pnav li:hover a.head {
  color: #2f2f2f;
}
ul#pnav li.active ul.sub li a,
ul#pnav li.active a.head {
  color: #2f2f2f;
}
ul#pnav li a.head {
  color: #bdbdbd;
  font: bold italic 18px Georgia, serif;
  text-decoration: none;
  margin: 0 0 10px 0;
  display: block;
}
ul#pnav li p.head {
  font: bold italic 18px Georgia, serif;
  text-decoration: none;
  margin: 0 0 10px 0;
  display: block;
}
ul#pnav li ul.sub {
  border-top:1px dotted #ccc;
}
ul#pnav li ul.sub li {
  float: none;
  border-bottom:1px dotted #ccc;
  display: block;
}
ul#pnav li ul.sub li a {
  color: #bdbdbd;
  /*MESO font: italic 14px/160% Georgia, serif;*/
  font: 12px/160% arial, serif;
  text-decoration: none;
  text-transform:uppercase;
}
ul#pnav li ul.sub li a:hover,
ul#pnav li ul.sub li a.active {
  color: #b92044;
}


/* =GRID HELPERS
--------------------------------------------------------------------------------*/

/* =ABSOLUTES
--------------------------------------------------------------------------------*/
body {
  background: #fff url(../images/bg.gif) repeat-y 0 0;
  margin: 20px 30px 0 30px;
}
a {
  color:#2f2f2f;
  text-decoration:none;}
p {
  /* MESO font: 18px/24px Georgia, serif;*/
  font: 14px/20px arial, sans-serif;
  color: #111111;
}

h1 {
  position: absolute;
  right: -20px;
}
h1 a {
  display: block;
  width: 60px;
  height: 60px;
  background: url(../images/logo.png) no-repeat 0 0;
}
h2 {
  /*MESO font: italic 30px Georgia, serif;*/
  font: bold italic 26px Georgia, serif;
  color: #000;
  margin: 15px 0 15px 0;
}
h3 {
  /*MESO font: italic 24px/120% Georgia, serif;*/
  font: 24px/120% arial, sans-serif;
  color: #9a9a9a;
  margin: 30px 0 20px 0;
}

h4 {
  /*MESO font: italic 24px/120% Georgia, serif;*/
  font:  14px/120% arial, sans-serif;
  color: #B92044;
  margin: 20px 0 5px 0;
	padding-top:0px;
	padding-bottom:10px;
	margin-bottom:8px;
	border-bottom: 1px dotted #9a9a9a;
	margin-right:10px;
}

hr {border-bottom: #888888 1px dashed;} 

/* =FORM & INPUT
--------------------------------------------------------------------------------*/
div.content form p {
  margin: 0 0 10px 0;
  padding: 0;
}
label {
  font: 16px Georgia, serif;
  margin: 0 10px 0 0;
}
label.text {
 display: block;
 margin-top: 5px;
 float: left;
}
input.text {
  border: #888888 1px solid;
  height: 20px;
}
input.checkbox,
input.radio {
  margin: 0 10px 0 0;
}
input.button {
  margin: 10px 0 0 0;
}
textarea {
  border: #888888 1px solid;
}


/* =CONTAINERS
--------------------------------------------------------------------------------*/

/* =STAGE
--------------------------------------------------------------------------------*/
.container_16 div.stage { /* overrides 960gs! */
  margin: 0 0 25px 10px;
  padding: 0;
  width: 960px;
  line-height: 0;
}

div.stage div.top {
  width: 960px;
  height: 37px;
  background: url(../images/stage-top.png) no-repeat 0 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
}
div.stage a.toptrigger {
  display: block;
  width: 22px;
  height: 15px;
  margin: -10px auto 0 auto;
  position: absolute;
  background: #fff url(../images/arrow1.gif) no-repeat 0 0;
  text-indent: -5000px;
  z-index: 201;
  left: 469px;
  top: 0;
}
div.stage a.toptrigger:hover {
  background: url(../images/arrow1.gif) no-repeat 0 -30px;
}

div.stage div.bottom {
  width: 960px;
  height: 37px;
  background: url(../images/stage-bottom.png) no-repeat 0 0;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 100;
}

div.stage a.bottomtrigger {
  display: block;
  width: 22px;
  height: 15px;
  margin: -10px auto 0 auto;
  position: absolute;
  background: #fff url(../images/arrow2.gif) no-repeat 0 -30px;
  text-indent: -5000px;
  z-index: 201;
  left: 469px;
  bottom: -10px;
}
div.stage a.bottomtrigger:hover {
  background: url(../images/arrow2.gif) no-repeat 0 0;
}

div.stage div.left {
  margin: 0;
  padding: 0;
  width: 590px;
}

div.stage div#projectright {
  width: 370px;
  height: 400px;
  background: #000 url(../images/stage-bg2.png) no-repeat 0 0;
}

li.textitem {
  list-style: none;
  margin: 0;
  padding: 40px 20px 0 20px;
  width: 330px;
  overflow: hidden;
  height: 231px;
}
li.textitem ul {
  padding: 0 0 10px 0;
}
li.textitem ul li {
  font: 0.85em/140% arial, sans-serif;
  color: #fff;
  list-style: disc;
  list-style-position: inside;
  line-height: 140%;
}
div.stage div#projectright li.textitem h2 {
  /*MESO font: italic 30px Georgia, serif;*/  
  font: italic 26px Georgia, serif;
  color: #b5b5b5;
  margin: 0 0 15px 0;
}
div.stage div#projectright li.textitem p {
  font: 0.85em/140% arial, sans-serif;
  color: #fff;
  margin: 0 0 15px 0;
}


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

div.content p {
  margin: 0 0 20px 0;
}

/* breadcrumbs */
ul.bc {
  font: 10px arial,sans-serif;
  text-transform: uppercase;
}
ul.bc li {
  float: left;
  margin: 0 4px 0 0;
  color: #6A6A6A;
}
p.subh {
  /* font: italic 24px/120% Georgia, serif; */
  font: 20px/120% arial, sans-serif;
  color: #9a9a9a;
  margin: 0 0 20px 0;
}

/* pagination */
ol.pagination li  {
  display: block;
  float: left;
  margin: 0 5px 0 0;
  padding: 0;
  color: #000;
  font: 14px/120% arial, sans-serif;
}
ol.pagination li a.active {
  /* Changeg by DGM color: #B92044*/
  color: #B92044;
}

/* =CONTENT GRADIENT
--------------------------------------------------------------------------------*/
.container_16 div.gradient { /* overrides 960gs! */
  background: url(../images/content-gradient.png) repeat-x 0 0;
  padding: 0;
  width: 960px;
  margin-left:10px;

}
div.gradient div.top {
  width: 960px;
  height: 37px;
  background: url(../images/stage-top.png) no-repeat 0 0;
}

/* =CONTENT PRESSETEXTE
--------------------------------------------------------------------------------*/
ol.press li {
  margin: 0 0 25px 0;
  border-bottom: #111111 1px dotted;
}
ol.press h3 {
  font: italic 18px/24px Georgia, serif;
  color: #2F2F2F;
  margin: 0 0 5px 0;
  padding: 0;
}
ol.press p {
  /*MESO font: 14px/140% Georgia, serif;*/
  font: 14px/140% arial, sans-serif;
  margin: 0 0 10px 0;
  padding: 0;
}
ol.press div.left {
  float: left;
}
ol.press a.more {
  color: #B92044;
}


/* =CONTENT ANFAHRT
--------------------------------------------------------------------------------*/
#map {
  height: 400px;
  background: f1f1f1;
  text-indent: -5000px;
}


/* =CONTENT PROJEKTÜBERSICHT
--------------------------------------------------------------------------------*/
div.content div.projekt {
  margin-bottom: 40px;
}
div.content div.projekt div.pic {
  border-bottom: #DCDCDC 1px solid;
  margin: 0 0 8px 0;
}
div.content div.projekt div.pic:hover {
  border-bottom-color: #888888
}
div.content div.projekt div.pic:hover img {
  border-color: #888888
}
div.content div.projekt div.pic img {
  border: #DCDCDC 3px solid;
}
div.content div.projekt div.pic a {
  display: block;
  padding: 0 0 4px 0;
}
div.content div.projekt p {
  /* MESO font: italic 14px/120% Georgia, serif; */
  font: italic 14px/120% Georgia, serif;
  color: #282828;
  margin: 0;
}
div.content div.projekt p a {
  color: #b92044;
}

/* =SLIDER
--------------------------------------------------------------------------------*/

#slider {
  /* You MUST specify the width and height */
  width:960px;
  height:400px;
  position:relative;	
  overflow:hidden;
}
#mask-gallery {
  overflow:hidden;
}
#gallery {
  /* Clear the list style */
  list-style:none;
  margin:0;
  padding:0;
  z-index:0;
  /* width = total items multiply with #mask gallery width */
  width:590px;
  overflow:hidden;
}
#gallery li {
  /* float left, so that the items are arrangged horizontally */
  float:left;
}
.projectslider #gallery li {
  cursor: pointer;
}
#mask-excerpt {
  /* Set the position */
  position:absolute;	
  top:0;
  right:0;
  z-index: 500;
  /* width should be lesser than #slider width */
  width:370px;
  overflow:hidden;
  background: #000 url(../images/stage-bg1.png) no-repeat 0 0;
}
#excerpt {
  /* Set the position */
  position:absolute;
  top:0;
  left:0;
  margin: 0;
  padding: 0;
}

#excerpt a{
color:#9a9a9a;
}

#excerpt a:hover{
color:#B92044;
}

#excerpt li.item {
  list-style: none;
  margin: 0;
  padding: 40px 20px 0 20px;
  width: 330px;
  height: 200px;
}
#excerpt li.item div.overflow{
  height: 325px;
  overflow: hidden;
}
#excerpt li.item div.overflow ul {
  padding: 0 0 10px 0;
}
#excerpt li.item div.overflow ul li {
  font: 0.85em/140% arial, sans-serif;
  /*MESO color: #fff; */
  color:#9a9a9a;
  list-style: disc;
  list-style-position: inherit;
  line-height: 140%;
  margin: 0 0 0 15px;
}
#excerpt li h2 {
  /*MESO font: italic 30px Georgia, serif;
  color: #fff;*/
  font: italic 26px Georgia, serif;  
  color:#9a9a9a;
  margin: 0 0 30px 0;
}

#excerpt li p {
  font: 0.85em/140% arial, sans-serif;
  /*MESO color: #fff; */
  color:#9a9a9a;
  margin: 0 0 0px 0;
}

ul#picnav {
  position: absolute;
  z-index: 501;
  /*right: 305px;*/
  left:610px;
  bottom: 10px;
}
ul#picnav li {
  float: left;
  background: url(../images/picnav1.gif) no-repeat 0 0;
  margin: 4px 5px 0 0;
}
ul#picnav li a {
  display: block;
  width: 10px;
  height: 10px;
  background: url(../images/picnav1.gif) no-repeat 0 0;
  text-indent: -5000px;
}
ul#picnav li.selected a {
  background: url(../images/picnav2.gif) no-repeat 0 0;
}

a.slideshow {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 501;
  font: 10px arial, sans-serif;
  color: #bdbdbd;
  background: url(../images/picnav1.gif) no-repeat 0 0;
  text-transform: uppercase;
  padding: 0 0 0 14px;
}
a.slideshows {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 501;
  font: 10px arial, sans-serif;
  color: #bdbdbd;
  background: url(../images/picnav2.gif) no-repeat 0 0;
  text-transform: uppercase;
  padding: 0 0 0 14px;
}


/* =BOXSLIDER
--------------------------------------------------------------------------------*/

li#boxslider {
  /* You MUST specify the width and height */
  width:360px;
  margin-left: 10px;
  height:120px;
  position:relative;	
  overflow:hidden;
}
div#mask-boxitem {
  overflow:hidden;
  width:350px;
}
ul#boxlist {
  /* Clear the list style */
  list-style:none;
  margin:0;
  padding:0;
  z-index:0;
  /* width = total items multiply with #mask picitem width */
  overflow:hidden;
}
ul#boxlist li.item {
/* float left, so that the items are arrangged horizontally */
  float:left;
  width: 340px;
  height: 100px;
  padding: 10px 10px 10px 10px;
  margin: 0;
  background: #000 url(../images/stage-bg3.png) no-repeat 0 0;
}
ul#boxlist li.noscroll {
  float:none;
  margin: 10px 0 10px 10px;
}
ul#boxlist li.noscroll.active {
  background: #000 url(../images/stage-bg3_over.png) no-repeat 0 0;
}
ul#boxlist li.item p {
  font: 12px arial,sans-serif;
  text-transform: uppercase;
  color: #b5b5b5;
}
ul#boxlist li.item h2 {
  font: 14px arial, sans-serif;
  color: #B92044;
  margin: 5px 0 0 0;
  padding: 0;
}
ul#boxlist li.item h2 a {
  color: #B92044;
}
ul#boxlist li.item img {
  float: left;
  width: 160px;
}
ul#boxlist li.item div.right {
  float: left;
  width: 160px;
  margin: 0 0 0 10px;
  padding: 15px 0 0 0;
}


/* =TEXTBOXSLIDER
--------------------------------------------------------------------------------*/
li#textboxslider {
  /* You MUST specify the width and height */
  width:360px;
  height:400px;
  position:relative;	
  overflow:hidden;
}
div#mask-textboxitem {
  overflow:hidden;
  height:400px;
}
ul#textboxlist {
  /* Clear the list style */
  list-style:none;
  margin:0;
  padding:0;
  z-index:0;
  /* width = total items multiply with #mask picitem width */
  width: 1150px;
  overflow:hidden;
}
ul#textboxlist li.textboxitem {
/* float left, so that the items are arrangged horizontally */
  float: left;
  height: 400px;
  padding: 0 0 0 10px;
  margin: 0;
}
ul#textboxlist li.textboxitem div.textitem {
  padding: 30px 20px 0 10px;
  overflow: hidden;
}
ul#textboxlist li.textboxitem div.textitem ul {
  padding: 0 0 10px 0;
}
ul#textboxlist li.textboxitem div.textitem ul li {
  font: 0.85em/140% arial, sans-serif;
  color: #fff;
  list-style: disc;
  list-style-position: inside;
  line-height: 140%;
}	
ul#textboxlist li.textboxitem div.textitem h2 {
  margin: 0 0 20px 0;
}
ul#textboxlist li.textboxitem div.textitem p {
  margin: 0 0 10px 0;
  display: block;
  height: 95px;
}
ul#textboxlist li.textboxitem ul#boxlist li.item {
  height: 100px;
}

/* =GMAP
--------------------------------------------------------------------------------*/
div.infowindow p {
  margin: 0 0 10px 0;
  font: 14px arial, sans-serif;
}

/* =FOOTER
--------------------------------------------------------------------------------*/
div.footer {
  margin: 30px 0 0 30px;
  padding:0 0 20px 0;
  text-align: right;
}
div.footer p {
  font: 10px arial, sans-serif;
  color: #2f2f2f;
}
div.footer p a:hover{
  color: #b92044;
}


/* =JQUERY UI OVERWRITE & ADD ON
--------------------------------------------------------------------------------*/

/* Bubble pop-up */
.popup {
  position: absolute;
  z-index: 600;
}
.popup .popcont {
  width: 395px;
  /*Original MESO -> height: 147px;*/
  height: 137px;
  position: absolute;

  left: 209px;
  z-index: 600;
  margin: 0;
}
.popup .popcont a {
  background: none
}
.popup .popcont img {
  float: left;
  /*Original MESO -> width: 160px;*/
  width: 213px;
}
.popup .popcont div.right {
  float: left;
  width: 160px;
  margin: 0 10px;
  padding: 15px 0 0 0;
}
.popup .popcont div.right p {
  font: 12px arial,sans-serif;
  text-transform: uppercase;
  color: #b5b5b5;
}
.popup .popcont div.right h2 {
  /*MESO font: 14px Georgia, serif;*/
  font: 14px arial, sans-serif;
  color: #B92044;
  margin: 5px 0 0 0;
  padding: 0;
}
.popup .popcont div.right h2 a {
  color: #B92044;
}

.bubbleInfoTop .popup,
.bubbleInfoBottom .popup {
  display: none;
  position: relative;
}
.bubbleInfoTop .popup .popcont {
  padding: 23px 12px 0 14px;
  top: 85px;
  background: transparent url(../images/popup2.png) no-repeat 0 0;
}
.bubbleInfoBottom .popup .popcont {
  padding: 10px 12px 13px 14px;
  /*Original MESO -> height: 120px;*/
  height: 110px;
  bottom: -100px;
  background: url(../images/popup1.png) no-repeat 0 0
}


/* =OVERWRITE ---- MUST APPEND TO ALL OTHER STYLES ----
--------------------------------------------------------------------------------*/
.right, a.right { float: right; }
.left, a.left { float: left; }
.t_right { text-align: right; }
.t_left { text-align: left; }
.noborder { border: none;}
.relative {	position: relative; }
.invisible {position:absolute;left:-5000px;}

#breadcrumb {
  font: 10px arial,sans-serif;
  margin: 0 4px 4px 0px;
  text-transform:uppercase;
  color:#6A6A6A;
}

#breadcrumb a {
  color:#6A6A6A;
}

#breadcrumb .active {
  color:#B92044;
}

.grid_16 h3 {
	  /* MESO font: italic 20px/120% georgia, serif;*/
	  font: 20px/100% arial, sans-serif;
	  color: #9a9a9a;
	  margin: 0px 0 14px 0;
}

.profil_liste p{
	color: #111111;
	font: 14px/170% arial, sans-serif;
	padding-top:0px;
	margin:0px;
}

h6 {
	color: #111111;
	font:  14px/120% arial, sans-serif;
	color: #B92044;
	padding-top:0px;
	padding-bottom:10px;
	margin-bottom:8px;
	border-bottom: 1px dotted #9a9a9a;
	margin-right:10px;
	text-transform:uppercase;
}

a:link {}
a:hover {	color: #B92044;}

.error {
	margin-left: 10px;
	color: #990000;
	font-style:italic;
	font-size:1.2em;
	background-color:#ff9f9f;
	border:1px dotted #990000;
	padding:10px;
	margin-bottom:10px;
	width:auto;
	margin-right:10px;
}

.grid_16 sup {
	font-size:11px;
}

.grid_16 h3 sup {
	font-size:14px;
}

.popup .popcont div.right p.slider_nav {
	font-size:10px;color:#666;
}

#flash_content_einstieg {
	width: 590px;
	height: 400px;
	margin: 0;
	padding: 0;
}

#flash_content_seite {
	width: 960px;
	height: 147px;
	margin: 0;
	padding: 0;
}

.pjframe{
	float:left;
}

*+html .pjframe{
	padding-bottom:40px;
}