/* schriften */
html {
  overflow-y: scroll;
}
body {
  font-size: 70%;
  line-height: 150%;
}
@media screen {
  div {
    font-size: 100%;
  }
}
#mainmenue {
  font-size: 100%;
}
#submenu {
  font-size: 100%;
}
.infobox {
  font-size: 90%;
}
.detail{
  font-size: 90%;
}
.infobox h3 {
  font-size: 100%;
}
#search h3 {
  font-size: 90%;
}
.global a:link, .global a:visited {
  font-size: 80%;
}
#footer a:link, #footer a:visited {
  font-size: 90%;
}
.footer a:link, .footer a:visited {
  font-size: 90%;
}
#search a:link, #search a:visited {
  font-size: 80%;
}
@media screen {
  .linkDownload h3 {
    font-size: 100%;
    font-weight: bold;
  }
}
.linkDownload a:link, .linkDownload a:visited {
  font-size: 100%;
  font-weight: normal;
}
/* farben */
body {
  color: #4F4F4F;
}
h1 {
  color: #4F4F4F;
}
h2 {
  color: #4F4F4F;
}
h3 {
  color: #4F4F4F;
}
.linkDownload h3 {
  color: #4F4F4F;
}
.spitzmarke {
  color: #4F4F4F;
}
.date {
  color: #4F4F4F;
}
.intro {
  color: #4F4F4F;
}
.infobox h3 {
  color: #4F4F4F;
}
.termine h3 {
  color: #FFFFFF;
}
@media screen {
  .global {
    color: #4F4F4F;
  }
  .global a:link, .global a:visited {
    padding: 0;
    color: #4F4F4F;
    text-decoration: none;
  }
  .global a:hover, .global a:active {
    color: #4F4F4F;
    text-decoration: underline;
  }
  a:link.more, a:visited.more {
    text-decoration: underline !important;
  }
  #footer {
    color: #505050;
  }
  #footer a:link, #footer a:visited {
    padding: 0 7px 0 7px;
    color: #505050;
    text-decoration: none;
  }
  #footer a:hover, #footer a:active {
    color: #505050;
    text-decoration: underline;
  }
  .footer a:link, .footer a:visited {
    color: #4F4F4F;
    font-weight: bold;
    text-decoration: none;
  }
  .footer a:hover, .footer a:active {
    color: #4F4F4F;
    text-decoration: underline;
  }
  #search a:link, #search a:visited {
    margin: 0 0 0 55px;
    padding-left: 17px;
    text-decoration: underline;
    background: url(/theater/img/pfeil_right.gif) no-repeat 0 0.1em;
  }
  a:link.internal, a:visited.internal {
    background-image: url(/theater/img/pfeil_intern.gif);
    background-repeat: no-repeat;
    background-position: 0 0.2em;
    padding-left: 15px;
  }
  a:link.external, a:visited.external {
    background-image: url(/theater/img/pfeil_extern.gif);
    background-repeat: no-repeat;
    background-position: 0 0.3em;
    padding-left: 15px;
  }
  .infobox a:link, .infobox a:visited {
    text-decoration: underline;
  }
  .termine a:link, .termine a:visited {
    text-decoration: underline;
    color: #FFFFFF;
  }
}

/* Formatierung */
a:link, a:visited {
  text-decoration: underline;
}
a:active, a:hover {
  text-decoration: underline;
}
@media screen {
  .global {
    position: absolute;
    top: 72px;
    left: 2px;
    z-index: 99;
  }
  .global a:link, .global a:visited {
    padding: 0;
  }
}
@media screen {
  /* Hauptmenue live */
  #mainmenue {
    position: absolute;
    top: 237px;
    right: 15px;
    height: 47px;
    font-weight: bold;
    overflow: hidden;
  }
  #mainmenue ul {
    position: relative;
    margin: 0;
    padding: 0;
  }
  #mainmenue li {
    position: relative;
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
  }
  #mainmenue ul li.m0 {
    width: 103px;
  }
  #mainmenue ul li.m1 {
    width: 135px;
  }
  #mainmenue ul li.m2 {
    width: 187px;
  }
  #mainmenue ul li.m3 {
    width: 160px;
  }
  #mainmenue ul li.m0 a:link, #mainmenue ul li.m0 a:visited {
    display: block;
    width: 103px;
    height: 47px;
    background: url(/theater/img/m0_0.gif) no-repeat;
  }
  #mainmenue ul li.m0 a:active, #mainmenue ul li.m0 a:hover {
    background: url(/theater/img/m0_1.gif) no-repeat;
  }
  #mainmenue ul li.m0 a.active {
    background: url(/theater/img/m0_1.gif) no-repeat !important;
  }
  #mainmenue ul li.m1 a:link, #mainmenue ul li.m1 a:visited {
    display: block;
    width: 135px;
    height: 47px;
    background: url(/theater/img/m1_0.gif) no-repeat;
  }
  #mainmenue ul li.m1 a:active, #mainmenue ul li.m1 a:hover {
    background: url(/theater/img/m1_1.gif) no-repeat;
  }
  #mainmenue ul li.m1 a.active {
    background: url(/theater/img/m1_1.gif) no-repeat !important;
  }
  #mainmenue ul li.m2 a:link, #mainmenue ul li.m2 a:visited {
    display: block;
    width: 187px;
    height: 47px;
    background: url(/theater/img/m2_0.gif) no-repeat;
  }
  #mainmenue ul li.m2 a:active, #mainmenue ul li.m2 a:hover {
    background: url(/theater/img/m2_1.gif) no-repeat;
  }
  #mainmenue ul li.m2 a.active {
    background: url(/theater/img/m2_1.gif) no-repeat !important;
  }
  #mainmenue ul li.m3 a:link, #mainmenue ul li.m3 a:visited {
    display: block;
    width: 160px;
    height: 47px;
    background: url(/theater/img/m3_0.gif) no-repeat;
  }
  #mainmenue ul li.m3 a:active, #mainmenue ul li.m3 a:hover {
    background: url(/theater/img/m3_1.gif) no-repeat;
  }
  #mainmenue ul li.m3 a.active {
    background: url(/theater/img/m3_1.gif) no-repeat !important;
  }
}
@media screen {
  #body {
    position: relative;
    width: 980px;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    text-align: left;
    background-color: #FFFFFF;
  }
  #head {
    position: relative;
    padding: 0;
    margin: 0 15px;
    background-color: #FFFFFF;
  }
  #main {
    position: relative;
    width: 980px;
    margin: 0;
    padding: 0;
  }
  #content {
    position: relative;
    width: 639px;
    margin: 0;
    padding: 0 30px 0 15px;
    float: left;
  }
  .home #content {
    margin-top: 68px;
  }
  .special #content {
    width: 521px;
    margin-top: 65px;
    padding: 0 80px 0 83px;
  }
  .content #content {
    width: 395px;
    padding: 0 30px 20px 30px;
    margin-top: 120px;
  }
  #illu {
    margin: 0;
    padding: 15px 15px 0 15px;
    height: 222px;
  }
  #leftcolumn {
    position: relative;
    width: 214px;
    margin: 120px 0 0 0;
    padding: 0 0 0 15px;
    float: left;
  }
  #rightcolumn {
    position: relative;
    width: 281px;
    margin: 0;
    padding: 0;
    float: left;
  }
  .home #rightcolumn {
    margin-top: 116px;
  }
  .special #rightcolumn {
    margin-top: 120px;
  }
  .content #rightcolumn {
    margin-top: 120px;
  }
  #footer {
    position: relative;
    float: right;
    padding: 0.3em 0 0.4em 0;
    margin: 3em 0 0 0;
  }
}

@media screen {
  .txtHeadline {
    position: relative;
    width: 212px;
    height: 46px;
    padding: 70px 0 0 15px;
    margin: 0;
  }
  .special .txtHeadline {
    height: 81px;
    left: -68px;
  }
}

@media screen {
  .overview {
    position: relative;
    width: 639px;
    margin: 0 0 25px 0 !important;
    background-color: #8B8B8B;
    height: 35px;
  }
  .overview .tab {
    position: relative;
    float: left;
    width: 172px;
  }
  .overview h2 {
    font-size: 115%;
    color: #FFFFFF;
    padding: 10px 0 0 14px;
    margin: 0;
  }
  .overview .selection {
    position: relative;
    height: 26px;
    float: right;
    text-align: right;
    width: 460px;
    padding: 0;
    margin: 0;
    border-bottom: 2px solid #FFFFFF;
    border-left: 2px solid #FFFFFF;
    background-color: #DDDDDD;
  }
}

@media screen {
  .infobox {
    padding: 0 0 5px 0;
    margin: 0 0 15px 0;
    width: 281px;
    background-color: #ECECEA; 
  }
  .infobox h2 {
    position: relative;
    height: 30px;
    margin: 0;
    padding: 0;
    background-color: #8B8B8B;
    border-bottom: 2px solid #FFFFFF;
  }
  .infobox h3 {
    position: relative;
    margin: 0;
    padding: 0.6em 0 1em 20px;
  }
  .infobox p {
    margin: 0 20px 0 20px;
  }
  .infobox div {
    padding: 0 0 0.5em 20px;
  }
  .infobox ul {
    padding: 10px 20px 0 0;
    margin: 0 0 0 5px;
    list-style: none;
  }
  .infobox li {
    padding: 0;
  }
  .infobox li.linkList {
    padding: 0;
    margin-left: 15px;
  }
}

@media screen {
  .termine {
    padding: 0 0 15px 20px;
    margin: 0;
    width: 261px;
    color: #FFFFFF;
    background-color: #A5A5A5;
  }
  .spielplan .termine {
    padding: 0 0 0 20px;
  }
  .termine div {
    vertical-align: middle;
    padding: 0 0 0.1em 0;
  }
  .termine h3 {
    position: relative;
    margin: 0;
    padding: 0.6em 0 1em 0;
  }
  .spielplan .termine h3 {
    position: relative;
    margin: 0;
    padding: 0.3em 0 0.3em 0;
  }
  .termine img {
    position: relative;
    padding: 0 0 0 5px;
    margin: 0;
  }
  .termine form {
    margin: 0 0 0 5px;
    padding: 0 0 0 20px;
    float: left;
    background: url(/theater/img/pfeil_extern.gif) no-repeat 3px 0.2em;
  }
  .termine input {
    width: 36px;
    height: 11px;
    padding: 0;
    margin: 0;
    border: none;
  }
  .termine span {
    float: left;
  }
  .legende {
    border-right: 1px solid #A5A5A5;
    border-left: 1px solid #A5A5A5;
    border-bottom: 1px solid #A5A5A5;
    margin: 0 0 15px 0;
    font-size: 90%;
    padding: 10px 15px 5px 15px;
  }
  .legende img {
    position: relative;
    padding: 0 5px 0 0;
    top: 0.2em;
  }
  .legende p {
    padding: 0;
    margin: 0 0 0.5em;
  }
}

@media screen {
  .detail {
    padding: 0 0 20px 0;
    margin: 0;
    width: 212px;
    background-color: #ECECEA;
  }
  .detail p {
    padding: 10px 0 0 20px;
    margin: 0;
  }
}


@media screen {
  #search {
    position: absolute;
    right: 112px;
    top: 355px;
    z-index: 99;
  }
  #search h3 {
    margin: 0 0 0.2em 0;
  }
  #search input {
    width: 143px;
    margin: 0 2px 0 0;
    padding: 2px 0 2px 2px;
    font-size: 100%;
    color: #636362;
    border: 1px solid #B1B1B1;
  }
  #search .btn-search {
    position: relative;
    width: 30px;
    height: 20px;
    margin: 0;
    padding: 0;
    border: 0;
    background: url(/theater/img/btn_search.gif) no-repeat center;
    cursor: pointer;
  }
  #search div {
    margin: 0.4em 0 0 0;
  }
}

@media screen {
  .footer {
    display: block;
    clear: both;
    position: relative;
    margin: 1em 0 1em 0 !important;
    padding: 0 0 0.5em 0;
    float: left;
  }
  .up {
    float: right;
    margin: 0;
    padding: 0 15px 0 0;
    text-align: right;
    background: url(/theater/img/symbol_up.gif) no-repeat center right;
  }
  .print {
    float: left;
    margin: 0;
    padding: 0 15px 0 15px;
    background: url(/theater/img/symbol_print.gif) no-repeat 0 0.3em;
  }
  div.ilink {
    position: absolute;
    top: 285px;
    right: 19px;
    margin-top: 0.38em;
    z-index: 999;
  }
}

@media screen {
  #submenu ul li a:link, #submenu ul li a:visited, #submenu ul li a:active, #submenu ul li a:hover {
    text-decoration: none;
  }
  #submenu {
    position: absolute;
    height: 4em;
    right: 15px;
    top: 285px;
    margin: 0;
    width: 575px;
    z-index: 99;
  }
  #submenu ul {
    width: 574px;
    position: absolute;
    left: 0;
    margin: 0;
    padding: 0;
    background-color: #8A8A8A;
  }
  #submenu ul ul {
    position: absolute;
    top: 2em !important;
    background-color: #FFFFFF;
  }
  #submenu li {
    display: inline;
    padding: 0;
    float: left;
    line-height: 2em;
    white-space: nowrap;
    list-style: none;
  }
  #submenu li a:link, #submenu li a:visited {
    color: #FFFFFF;
    padding: 0 12px 0 12px;
    margin: 0.2em 0 0.2em 0;
    border-right: 1px solid #FFFFFF;
  }
  #submenu li li a:link, #submenu li li a:visited {
    font-size: 90%;
    color: #595C52;
    padding: 0 12px 0 12px;
    margin: 0.2em 0 0.2em 0;
    border-right: 1px solid #595C52;
  }
  #submenu li.last a:link, #submenu li.last a:visited {
    border-right: none;
  }
  #submenu li.active {
    font-weight: bold;
  }
  #submenu li li {
    font-weight: normal;
  }
  #submenu li li.active {
    font-weight: bold !important;
  }
}
