﻿body { font-size:10px;height:100%;background-color:#eee;font-family:Helvetica;}
html,form {height:100%;}

a {text-decoration:none;color:#3d3d3d;}

@media screen and (max-width: 1280px) {
body { font-size: 9px; }
}

.header {height:12em;background-color:white;padding-left:10px;}
.logo {float:left;width:35em;}
.logo img {max-width:100%;}
.logo img.logo-mobile {display:none;max-width:100%;}
.header-right {float:left;width:calc(100% - 37em);height:100%;position:relative;}
.sub-menu {color:#3d3d3d;font-size:1.2em;padding-top:10px;}
.logotext {float:right;padding-right:10px;}
.logotext>span {font-size:3em;color:#3d3d3d;}

@media screen and (max-width: 960px) {
    .logo {width:12em;}
    .logo img:first-child {display:none;}
    .logo img.logo-mobile {display:block;}
    .header-right {float: left;width: calc(100% - 13em); }
}



.content {background-color:#eee;width:100%;height:calc(100% - 12em);}

.toc                {width:35em;height:calc(100% - 4em);color:#3D3D3D;overflow:auto;float:left;}
.toc-header         {height:4em;padding-left:30px;padding-top:10px;}
.toc-header>span    {font-size:1.8em;}
.mobiletoc          {position:absolute;background-color:white;display:none;right:0;top:7.3em;z-index:100;width:95%;text-align:left;padding:.5em;border:solid 1px #808080;overflow-y:auto;word-break:break-word;}

.mobile-toc-icon {display:none;float:right;cursor:pointer;}
.mobile-toc-icon img {width:3em;margin-left:10px;}

/*inhaltsverzeichnis*/
.toc-list ul {list-style-image:none;list-style-type:none;padding-top:9px;padding-bottom:2px;}
.toc-list >ul  {border-top:1px white solid;padding-left:30px;}
.toc-list >ul >li {font-weight:bold;font-size:1.3em;}
.toc-list >ul >ul li   {padding-bottom:9px;}
.toc-list >ul >ul li>a {text-decoration:none;color:#3d3d3d;font-size:1.2em;}

.register {width:100%;position:absolute;bottom:2px;}
.register .live {cursor:pointer; padding:5px;float:left;min-width:22%;background-color:#9D9D9D;margin-right:5px;background-image:url(/images/ico_live_on.png);background-repeat:no-repeat; background-position:right;background-size:28px 25px;}
.register .gebaerden {cursor:pointer; padding:5px;float:left;min-width:22%;background-color:#9D9D9D;margin-right:5px; background-image:url(/images/ico_live_on.png);background-repeat:no-repeat; background-position:right;background-size:28px 25px;}
.register .tv {cursor:pointer;padding:5px;float:left;min-width:22%;background-color:#9D9D9D;margin-right:5px;text-align:right;padding-right:45px;background-image:url(/images/ico_tv_off.png);background-repeat:no-repeat; background-position:right;}
.register .txt {cursor:pointer;padding:5px;float:left;min-width:22%;background-color:#9D9D9D;text-align:right;padding-right:45px;background-image:url(/images/ico_txt_off.png);background-repeat:no-repeat; background-position:right;}

@media screen and (max-width: 400px) {
    .register .live { background-size:23px 20px;}
    .register .tv   { background-size:23px 20px;}
    .register .txt  { background-size:23px 20px;}
}

.register .live> span a {font-size:1.8em;color:white;}
.register .gebaerden> span a {font-size:1.8em;color:white;}
.register .tv> span a   {font-size:1.8em;color:white;}
.register .txt> span a  {font-size:1.8em;color:white;}


.register .is-register-active {background-color:#eee;}
.register .is-register-active span a {color:#3d3d3d;font-weight:bold;}


.content-detail {float:left;margin-left:10px;margin-top:5px;width:calc(100% - 37em);height:calc(100% - 4em);}
/*für schmale höhen, zb iphone quer soll die höhe nicht gesetzt werden*/
@media screen and (max-height: 500px) {
    .content {height:inherit;}
    .content-detail {height:100%;}
}


@media screen and (max-width: 800px) {
    .toc {display:none;}
    .content-detail {width: calc(100%);margin-left:0;}
    .mobile-toc-icon {display:block;}
    .logotext>span {font-size:2.5em;}
}
@media screen and (max-width: 550px) {
    .logotext {padding-top:20px;}
}

@media screen and (max-width: 380px) {
     .logo {width:7em;}
     .header-right {width: calc(100% - 7em); }
}

.slides,.slidesContainer {height:100%;}

#swiperBig {display:block;height:100%;}
#swiperSmall{display:none;}

.swiper-slide>div {white-space: nowrap;}

.is-mobiletoc-visible {display:block;position:absolute;background-color:#d3d3d3;top:70px;right:0px;z-index:99;height:calc(85%);}