/* CSS Document */
/* start CSS-Import */
/* Import Teaser-Stylesheets */
@import "/css/stuttgart_teaser.css";
/* Import Elements-Stylesheets (leftCol / rightCol) */
@import "/css/stuttgart_elements.css";
/* Import Navigation-Stylesheets (navBar / leftCol navigation) */
@import "/css/stuttgart_navigation.css";
/* Import Modules-Stylesheets (additional modules) */
@import "/css/stuttgart_modules.css";
/* Import Custom-Stylesheets (additional projects) */
/* end CSS-Import */
/* Define HTML-Tags */
body {
 color: #333;
 background-color: #fbfaf6;
 margin: 0px;
 padding: 0px;
 font-family: Arial, Helvetica, sans-serif;
 text-align: center;
 /* part 1 of 2 centering hack */
}
a {
 color: #333;
}

/* #printLogo */
#printLogo {
 display: none;
}
/* Skip Links liegen ausserhalb des Sichtfeldes ... und werden bei :focus sichtbar */
a.skip {
  position: absolute;
  top: -10000px;
  left: -10000px;
}
a:focus.skip, a:hover.skip, a:active.skip {
  margin: 0 0 0 16px;
  padding: 2px;
  position: absolute;
  top: 29px;
  left: auto;
  font-size: 0.70em;
  color: #333;
  white-space: nowrap;
  font-weight: bold;
  display: block;
}
#navAccess {
display: none;
}
/* #selCategory */
#selCategory {
 width: 400px;
 padding: 0px;
 /*border: 1px solid #000;*/
 margin-top: 0px;
 margin-bottom: 0px;
 margin-right: auto;
 margin-left: auto;  
 /* opera does not like 'margin:20px auto' */
 background: #F6F5EE;
 text-align:left; 
 /* part 2 of 2 centering hack */
 width: 400px; /* ie5win fudge begins */
 voice-family: "\"}\"";
 voice-family:inherit;
 width: 370px;
}
html>body #selCategory {
 width: 930px; /* ie5win fudge ends */
 }
 
.clear {
 clear: both;
 line-height: 0px;
 height: 0px;
 margin: 0px;
 padding: 0px;
 border: 0px;
} 

/* #main */
#main {
 width: 930px !important; /* Breite alle Browser */
 margin: 0px;
 padding-top: 0px;
 padding-right: 11px;
 padding-bottom: 0px;
 padding-left: 11px;
 border-left: 0px solid #FBFBFA;
 border-right: 0px solid #FBFBFA;
 background: transparent url(/media_navigation/bg_main.gif) repeat-y 0px 0px;
}
/* #head */
#head {
 margin: 0;
 padding: 0;
 
 width: auto !important; /* Breite alle Browser */
 width /**/:759px; /* Breite PC IE 5 und 5.5 */
 
 background-color: transparent;
}
/* #topBar */
#topBar {
 height: 1.7em;
 background-position: bottom;
 background-repeat: repeat-x;
 border-bottom: 2px solid #FBFBFA;
}
.stadt #topBar,
.home #topBar {
 background-image: url/media_navigation/bg_topBar_stadt.gif);
 background-color: #0882c0;
}
.freizeit #topBar {
 background-image: url(/media_navigation/bg_topBar_freizeit.gif);
 background-color: #f3363a;
}
.events #topBar {
 background-image: url(/media_navigation/bg_topBar_events.gif);
 background-color: #17aa52;
}
.gastro #topBar {
 background-image: url(/media_navigation/bg_topBar_gastro.gif);
 background-color: #fdbc11; 
}
.ipunkt #topBar,
.ueberUns #topBar {
 background-image: url(/media_navigation/bg_topBar_ipunkt.gif);
 background-color: #aba571;
}
.kongresse #topBar {
 background-image: url(/media_navigation/bg_topBar_kongresse.gif);
 background-color: #8c8c8c;
}

/* #topBar-Content: language & metaNavigation */
#navLang {
 height: 1.5em;
 margin: 0px;
 padding: 0 0 0 2px;
 font-size: 0.7em;
 font-style: normal;
 line-height: 1.9em;
 float: left;
 color: #fff;
}
#navLang ul {
 list-style-type: none;
 margin: 0px;
 padding: 0px;
}
#navLang ul li {
 float: left;
 height: 1.5em;
 margin: 0;
 margin-left: 0px !important; /* margin-left alle Browser */
 margin-left /**/:2px; /* margin-left IE 5 und 5.5 */
 margin-right: 0px !important; /* margin-left alle Browser */
 margin-right /**/:3px; /* margin-left IE 5 und 5.5 */
 padding: 0 2px 0 5px;
}
#navLang li a {
 color: #fff;
 height: 16px;
 text-decoration: none;
 margin: 0px;
 padding: 0px;
}
#navLang li a span {
 display: none;    
}
.gastro #navLang li a {
 color: #333;
}
#navLang li.german a,
#navLang li.english a,
#navLang li.francais a,
#navLang li.italiano a,
#navLang li.espanol a {
 display: block;
}
#navLang li a:hover {
 text-decoration: underline;
}
#navLang ul li.german {
 width: 22px;
 height: 19px;
 background-image: url(/media_navigation/flag_german.gif);
 background-repeat: no-repeat;
 background-position: bottom;
}
#navLang ul li.english {
 width: 22px;
 height: 19px;
 background-image: url(/media_navigation/flag_english.gif);
 background-repeat: no-repeat;
 background-position: bottom;
}
#navLang ul li.francais {
 width: 22px;
 height: 19px;
 background-image: url(/media_navigation/flag_francais.gif);
 background-repeat: no-repeat;
 background-position: bottom;
}
#navLang ul li.italiano {
 width: 22px;
 height: 19px;
 background-image: url(/media_navigation/flag_italiano.gif);
 background-repeat: no-repeat;
 background-position: bottom;
}
#navLang ul li.espanol {
 width: 22px;
 height: 19px;
 background-image: url(/media_navigation/flag_espanol.gif);
 background-repeat: no-repeat;
 background-position: bottom;
}
#navLang ul li #fontnorm {
 display: block;
 margin: 4px 0px 0px 0px;
 width: 15px;
 height: 15px !important;
 background: url(/media_navigation/font.gif) no-repeat right top;
 line-height: 1pt;
 text-indent: -9999px;
 outline: none;
}
#navLang ul li #fontbig {
 display: block;
 margin: 4px 0px 0px 0px;
 width: 15px;
 height: 15px !important;
 background: url(/media_navigation/font.gif) no-repeat center top;
 line-height: 1pt;
 text-indent: -9999px;
 outline: none;
}
#navLang ul li #fontbigger {
 display: block;
 margin: 4px 0px 0px 0px;
 width: 15px;
 height: 15px !important;
 background: url(/media_navigation/font.gif) no-repeat left top;
 line-height: 1pt;
 text-indent: -9999px;
 outline: none;
}
#navLang ul li #fontnorm:hover,
#navLang ul li #fontnorm:focus {
 background-position: right bottom;
}
#navLang ul li #fontbig:hover,
#navLang ul li #fontbig:focus {
 background-position: center bottom;
}
#navLang ul li #fontbigger:hover,
#navLang ul li #fontbigger:focus {
 background-position: left bottom;
}
#navLang ul li #fontnorm.selected {
 background-position: right center;
}
#navLang ul li #fontbig.selected {
 background-position: center center;
}
#navLang ul li #fontbigger.selected {
 background-position: left center;
}
#navMeta {
 max-width: 500px;
 color: #FFF;
 width: auto;
 height: 1.4em;
 margin: 0 0 0 0;
 padding: 0 0 0 0;
 font-size: 0.7em;
 line-height: 1.9em;
 text-align: right;
 float: right;
}
#navMeta ul {
 width: auto;
 list-style-type: none;
 margin: 0px;
 padding: 0 5px 0 0;
 float: right;
}
/* nur fuer Opera-Browser */
@media screen and (min-width: 550px){
   #navMeta ul { width: auto; }
}
#navMeta ul li {
 float: left;
 padding: 0 5px 0 5px;
 line-height: 1.1em;
 border-right: 1px solid #fff;
 margin: 5px 0 0 0;
 width: 4em; /* wird so im MAC IE 5 angezeigt */
}
/* Achtung: MAC IE 5 workaround */
/* vor MAC IE 5 verbergen      \*/
#navMeta ul li {
 width: auto; /* wird in allen anderen Browsern angezeigt */
 /* naechste regel setzt aus - deshalb dopplung*/
}
#navMeta ul li {
 width: auto; 
}
/* ende hack */
#navMeta li a {
 color: #fff;
 display: block;
 text-decoration: none;
}
.gastro #navMeta li a {
 color: #333;
}
.gastro #navMeta ul li {
 border-right: 1px solid #333;
}
#navMeta li a:hover {
 text-decoration: underline;
}

/* #picBar */
#picBar {
 display: block;
 height: 230px;
 margin: 0px;
 padding: 0px;
 background: #efede2 url(/media_navigation/lgo_stuttgart_header.gif) no-repeat center center;
}

/* #picBar-Content: logo & picture */
#logo {
 display: none; /* Entfernung bei Breite */
 width: 254px;
 height: 156px;
 margin: 0px;
 padding: 0px;
 background-image: url(/media_navigation/bg_logo.jpg);
 background-repeat: no-repeat;
 float: left;
}
#logo a {
 width: 250px;
 height: 100px;
 display: block;
}
#logo a span {
 display: none;
}
#picture {
/* width: 505px;
 height: 156px;*/
 width: 930px;
 height: 230px;
 margin: 0px;
 padding: 0px;
 /*background-image: url();
 background-repeat: no-repeat;
 background-position: left;*/
 float: left;
}
#picture img {
 width: 930px;
 height: 230px;
}
#maskBar {
 display: none; /* Entfernt bei Breitenänderung */
 width: 759px;
 height: 76px;
 position: relative;
 margin-top: -73px;
 padding: 0px;
}
.stadt #maskBar,
.home #maskBar {
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader 
 (src='/media_navigation/maskBar_stadt.png',sizingMethod='scale');
}
.freizeit #maskBar {
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader 
 (src='/media_navigation/maskBar_freizeit.png',sizingMethod='scale');
}
.events #maskBar {
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader 
 (src='/media_navigation/maskBar_events.png',sizingMethod='scale');
}
.gastro #maskBar {
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader 
 (src='/media_navigation/maskBar_gastro.png',sizingMethod='scale');
}
.ipunkt #maskBar,
.ueberUns #maskBar {
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader 
 (src='/media_navigation/maskBar_ipunkt.png',sizingMethod='scale');
}
.kongresse #maskBar {
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader 
 (src='/media_navigation/maskBar_kongresse.png',sizingMethod='scale');
}
html>body #maskBar{ 
 background-repeat: no-repeat;
 background-position: bottom;
 }
 
html>body .stadt #maskBar,
html>body .home #maskBar{ 
 background: url(/media_navigation/maskBar_stadt.png);
 }
 
html>body .freizeit #maskBar{ 
 background: url(/media_navigation/maskBar_freizeit.png);
 }
html>body .events #maskBar{ 
 background: url(/media_navigation/maskBar_events.png);
 }
 
html>body .gastro #maskBar{ 
 background: url(/media_navigation/maskBar_gastro.png);
 }  
 
html>body .ipunkt #maskBar,
html>body .ueberUns #maskBar { 
 background: url(/media_navigation/maskBar_ipunkt.png);
 }
 
html>body .kongresse #maskBar{ 
 background: url(/media_navigation/maskBar_kongresse.png);
 }
 
 
/* #bottomBar */
#bottomBar {
 height: 20px;
 background: transparent url(/media_navigation/bg_bottomBar.gif) no-repeat left bottom;
}

/* #content */
#content {
 height: 100%;
 margin: 0px;
 padding: 0px;
 /*border: 1px solid aqua;*/
}

/* #leftCol */
#leftCol {
 width: 176px;
 height: 100%;
 padding: 0px;
 margin: 0px;
 background-color: #F3F1E9;
 background-image: url(/media_navigation/bg_leftCol.gif);
 background-repeat: repeat-y;
 background-position: right;
 border-bottom: 1px solid #fff;
 font-size: 0.71em;
 text-align: left;
 float: left;
}
#middleCol {
 width: 470px !important; /* Breite alle Browser */
 width /**/:490px; /* Breite PC IE 5 und 5.5 */
 height: 100%;
 margin: 0px 20px 0px 0px;
 padding: 6px 0px 0px 20px;
 background-color: #fff;
 /*font-size: 0.9em;*/
 text-align: left ! important;
 font-weight: normal;
 overflow: hidden;
 float: left;
 /*border: 1px solid aqua;*/
}
/* #rightCol */
#rightCol {
 width: 240px;
 height: 100%;
 background-color: #fff;
 font-size: 1.0em;
 text-align: left;
 float: left;
}
#homeanc {
    display: block;
    width: 100%;
    height: 94px;
    background: url(/media_navigation/logo.jpg) no-repeat left bottom;
    text-indent: -9999px;
    outline: none;
}
/* #search */
#search {
 
 width: 164px !important; /* Breite alle Browser */
 width /**/:176px; /* Breite PC IE 5 und 5.5 */
 
 height: 32px;
 padding: 0 0 0 11px;
 margin: 0px;
 background-color: #F0EFC6;
 background-image: url(/media_navigation/bg_searchbox.jpg);
 background-repeat: repeat-y;
 background-position: right;
}

/* #navSearchExt */
#navSearchExt {
 
 width: 170px !important; /* Breite alle Browser */
 width /**/:182px; /* Breite PC IE 5 und 5.5 */
 display: none;
 height: 120px;
 padding: 0 0 0 5px;
 margin: 0px;
 background-color: #F0EFC6;
 background-image: url(/media_navigation/bg_searchbox.jpg);
 background-repeat: repeat-y;
 background-position: right;
}
#navSearchExt label {  
 margin-left: -2px;
 line-height: 20px;
 padding-bottom: 5px;
    
}

/* #service */
#service {
 padding: 0px;
 margin: 0px;
}
/* #caBox1, #caBox2, #caBox3 (ContentAds) */
#caBox1, #caBox2, #caBox3, #caBox4 {
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
    width: 240px;
    height: auto;
    display: none;        
}
#caBox1 .infoBox, #caBox2 .infoBox, #caBox3 .infoBox, #caBox4 .infoBox {
    margin-bottom: 0;
}
/* #skyBox (Skyscraper) */
#skyBox {
   margin: 20px 0 0 10px;
   padding: 0;
   width: 120px;
   height: 600px;
   background-color: transparent;
   float: right;
   display: none;
}
/* #layerBox (AdLayer, 400x200px) */
#layerBox {
    background-color: transparent;
    position: absolute;
    top: 235px;
    left: 50%;
    right: 50%;
    margin-left: -220px;
    /*display: none;*/
 }
/* #footer */
#footer{
 padding: 2px 0 2px 5px;
 margin: 0px;
 _margin: 0 0 -18px 0;
 font-size: 0.6em;
 /*background-image: url(/media_navigation/bg_leftCol.gif);
 background-repeat: repeat-y;
 background-position: left;*/
 border-top: 1px solid #D8D2B8;
 background-color: #fff;
 clear: both;
}
 
#reddot {
 color: red;
 font-size: 12px;
 font-weight: bold;   
}
/* Breadcrum */
#breadcrum {
 margin: 0px 0px 11px 0px;
 color: #827648;
 font-size: 0.7em;
}
#breadcrum a {
 text-decoration: underline;
}
#breadcrum a:hover, #breadcrum a:focus {
 color: #333;
}
/* Tagcloud */
#tagcloud {
 margin: 0px 0px 7px 0px;
 padding: 0px 0px 45px 0px;
 background: transparent url(<img src="/media_navigation/bg_teaserbottom.gif">) no-repeat center bottom;
 text-align: center;
 font-size: 0.9em;
 color: #8F8350;
}
#tagcloud a {
 margin: 0px 5px 0px 0px;
}
#tagcloud a:hover, #tagcloud a:focus { 
 margin: 0px 5px 0px 0px;
 cursor: pointer;
 color: #333;
 text-decoration: none;
}
#tagcloud .tag1 {
 font-size: 0.6em;
}
#tagcloud .tag2 {
 font-size: 0.8em;
}
#tagcloud .tag3 {
 font-size: 1em;
}
#tagcloud .tag4 {
 font-size: 1.2em;
}
#tagcloud .tag5 {
 font-size: 1.5em;
}