@font-face {
  font-family: roboto;
    src: url("roboto.woff2") format("woff2"),
          url("roboto.woff") format("woff"),
          url("roboto.ttf") format("truetype");
}

@font-face { font-family:"roboto";
  src: url("Roboto-Regular.ttf") format("truetype");
  font-weight:bold;
}
a:link {color:#000000; text-decoration:none; border:none;}
a:visited {color:#000000; text-decoration:none; border:none;}
a:hover {color:#636363; text-decoration:none; border:none;}
a:active {color:#000000; text-decoration:none; border:none;}
a:focus {color:#000000; text-decoration:none; border:none;}

td {
   text-transform:none;
   vertical-align:top;padding:5px;
 }
.linie {height:10px;}
.linies {height:3px;}
        input[type="text"]{
font-family: roboto;
font-size: 16px;
border-radius:0px;
margin:2px;
padding:10px;
border:0;
border-bottom:1px solid #666;
width:80%;
max-width:400px;
background-color:#ffffff;
color:#000000;
}
input::placeholder{
color:#666;
}
input[type="password"]{
font-family: roboto;
font-size: 16px;
border-radius:0px;
margin:2px;
padding:10px;
border:0;
border-bottom:1px solid #666;
width:80%;
max-width:400px;
background-color:#ffffff;
color:#393939;
}

.text{
background-color:#f4f4f4;
padding:10px;
text-align:left;
font-size:12px;
width:80%;
max-width:400px;
}
textarea{
font-family: roboto;
font-size: 14px;
border-radius:8px;
margin:2px;
padding:5px;
border:0px;
background-color:#f4f4f4;
color:#393939;
}
button {
position: relative;
margin: 5px;
padding: 0px;
width:80%;
height:50px;
background: transparent;
color: #000000;
border: 1px solid #000000;
border-radius: 3px;
cursor: pointer;
text-transform:uppercase;
}
button:hover,
button:active {
outline: none;
background: #3c3c3c;
color: #ffffff;
}

button.oben {
position: relative;
display:inline;
width: 50px;
padding-top:0px;
padding-bottom:8px;
padding-right:20px;
padding-left:20px;
background: transparent;
white-space:nowrap;
color:white;
border: 0px solid #ffffff;
border-radius: 3px;
text-transform:uppercase;
cursor:pointer;
font-family: roboto;
}
.ueberschriftklein{
border-radius:0px;background-color:#3c3c3c;font-family: roboto; font-weight:600;font-size:18px; line-height:30px; color:#ffffff;}


.boxhg1{
position:fixed;
width:100%;
height:100%;
background-color:rgba(0,0,0,0.5);

top:40px;
left:0;
z-index:122;
display:none;
}
.boxhg1:target{
display:block;
}

.box1_formular{
position:fixed;
width:100%;
height:100%;
padding-top:0px;
top:40px;
left:0;
background-color:#ffffff;
color:black;
font-family: roboto;
z-index:25;
text-align:center;
border:0;
overflow:scroll;
}
.box1_formular:target{
display:block;
}
.box1_formular_ueberschrift{
position:fixed;
width:100%;
top:40px;
left:0;
background-color:black;
font-family: roboto;
text-transform:uppercase;
font-weight:600;
font-size:16px;
line-height:40px;
color:white;
z-index:10;
}

.box1_formular_leisteunten{
position:fixed;
width:60px;
top:40px;
left:0px;
background-color:black;
font-family: roboto;
text-transform:none;
font-weight:600;
font-size:16px;
height:39px;
color:white;
border:0;
z-index:25;
}
a.closebutton{
color:#ffffff;
font-size:25px;
font-family: roboto;
background:transparent;
padding-left:10px;
padding-right:10px;
border:1px solid black;
border-radius:2px;
}
.close_button{
position:absolute;
right:5px;
top:0px;
}

.buttons_blanko {
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 8px;
    padding-right: 8px;
    background: transparent;
    color: black;
    border-radius: 20px;
    cursor:pointer;
    font-size:16px;
    font-family:roboto;
    text-transform:uppercase;
    white-space:nowrap;
    border:1px solid #ccc;
}
.buttons_blanko:hover{
    border:1px solid #666;
    transition:none;
}
.buttons_blanko:active{
    border:1px solid black;
    transition:none;
}
.buttons_blanko.aktiv{
  font-weight:bold;
  background:#1d1d1d;
  border: 1px solid #000;
  color:#f2f2f2;
}
.buttons_blanko.aktiv:hover{
  font-weight:bold;
  background:#1d1d1d;
  color:#f2f2f2;
}
.buttons {
position: relative;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 8px;
padding-right: 8px;
background: transparent;
color: black;
border: 1px solid #666;
border-radius: 30px;
cursor:pointer;
font-size:16px;
font-family:roboto,Arial,FreeSans;
text-transform:uppercase;
white-space:nowrap;
width:80%;
max-width:400px;
}

a.buttons_v2 {
position: relative;
background: transparent;
color: black;
border-bottom: 1px dashed #666;
cursor:pointer;
font-family:roboto,Arial,FreeSans;
text-transform:none;
white-space:nowrap;
}
a.buttons_v2:hover, a.buttons_v2:active, a.buttons_v2:focus, a.buttons_v2:visited
{
}
.klein{
font-size:12px;
}
.mittel{
font-size:14px;
}
.jshow_logo_claim{
width:200px;
border:0px;
opacity:1;
padding:30px;
}
body{
background-color:#ffffff;
font-family: roboto;
font-size: 16px;
color:black;
overscroll-behavior-y: contain;
}
.button-checked{
  height:30px;
  position:relative;
  top:-4px;
  left:-200%;
  padding-left:20px;
  padding-right:30px;
  z-index:500;
}
.cookies-infotext{
  position:relative;
  width:80%;
  margin:20px;
  text-align:justify;
  font-size:14px;
}
.container{
  width:calc(100% - 10px);
  max-width:calc(100% - 10px);
  text-align:center;
  left: 0px;
  position: relative;
  padding-top:70px;
  padding-bottom:50px;
}
.trenner{
  width:100%;
  opacity:0.2;
}
.plat-logo{
  max-width:calc(100% - 50px);
  max-height:25px;
  position: relative;
  left: -10px;
  padding:10px;
  padding-top:20px;
  padding-bottom:20px;
}
.dock{
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  height:50px;
  background-color:white;
  z-index:99;
  text-align: center;
  overflow:hidden;
  box-shadow: 0px 0px 40px 0px;
}

.jshow-logo{
  height: 40px;
  padding-top: 5px;
  vertical-align:middle;
  position:relative;

}

.jshow-circle{
  height: 33px;
  padding-top: 8px;
  vertical-align:middle;
  position:relative;
}

.dock-button-links{
  position:fixed;
  left:0px;
  top:0px;
  z-index:100;
}
.dock-button-rechts{
  position:fixed;
  right:0px;
  top:0px;
  z-index:100;
}
.logout-button{
  width:20px;
  height:20px;
  padding:15px;
}
.profil-button{
  width:20px;
  height:20px;
  padding:15px;
}


.spinner {
  margin: 250px auto;
  width: 40px;
  height: 40px;
  position: relative;
  text-align: center;

  -webkit-animation: sk-rotate 2.0s infinite linear;
  animation: sk-rotate 2.0s infinite linear;
}

.dot1, .dot2 {
  width: 60%;
  height: 60%;
  display: inline-block;
  position: absolute;
  top: 0;
  background-color: black;
  border-radius: 100%;

  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.dot2 {
  top: auto;
  bottom: 0;
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-rotate { 100% { -webkit-transform: rotate(360deg) }}
@keyframes sk-rotate { 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg) }}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% {
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% {
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}
.spinner_wrapper_i{
  position:fixed;
  left:0px;
  top:0px;
  margin-top:50px;
  width:100%;
  height:100%;
  z-index:9999999999;
  background-color:rgba(255,255,255,0);
    backdrop-filter:blur(1px);
    -webkit-backdrop-filter:blur(1px);
}

.spinner_wrapper_o{
  display:none;
}

.icon-checkbox{
  position:relative;
  top:2px;
  height:16px;
  width:16px;
}

.icon-download{
  position:relative;
  height:24px;
  width:24px;
}

.zeile-logo{
  width:100%;
  height:60px;
  display:flex;
}
.zeile-logo-links{
  padding-left: 10px;
  text-align: left;
  width: calc(100% - 50px);
}
.zeile-logo-rechts{
  width: 40px;
  padding-top:20px;
}
.zeile-abstand{
  width:100%;
  height:50px;
}
.zeile-abstand-klein{
  width:100%;
  height:20px;
}
.zeile-show{
  margin-top:10px;
  padding: 5px;
  white-space: nowrap;
  width:100%;
  display:flex;
}
.zeile-show-wochentag{
  width:30px;
}
.zeile-show-rest{
  text-align:left;
  width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

.auswahl_icon{
  width:20px;
  height:20px;
}

.check_auswahl0{
  position: relative;
  top:-1px;
  padding-top:2px;
  right: 15px;
  width: 20px;
  height: 20px;
}
.check_auswahl1{
  position: relative;
  top:-1px;
  padding-top:2px;
  right: 10px;
  width: 20px;
  height: 20px;
}
.check_auswahl2{
  position: relative;
  top:-1px;
  padding-top:2px;
  right: 5px;
  width: 20px;
  height: 20px;
}
.check_auswahl3{
  position: relative;
  top:-1px;
  padding-top:2px;
  right: 0px;
  width: 20px;
  height: 20px;
}

  .chevron-klein{
    height:25px;
  }
  .chevron-klein-down{
    animation-name:chevron-down;
    animation-delay:0.5s;
    animation-duration:0.2s;
    animation-timing-function:ease-in-out;
    animation-fill-mode: backwards;
  }
  .chevron-klein-up{
    animation-name:chevron-up;
    animation-delay:0.5s;
    animation-duration:0.2s;
    animation-timing-function:ease-in-out;
    animation-fill-mode: forwards;
  }

  @keyframes chevron-down {
    0% {
      transform:scale(1,-1);
    }
    100% {
      transform:scale(1,1);
    }
  }

  @keyframes chevron-up {
    0% {
      transform:scale(1,1);
    }
    100% {
      transform:scale(1,-1);
    }
  }

  .body-ani-oben{
    position:absolute;
    top:0px;
    width:calc(100% - 16px);
    max-width:calc(100% - 16px);
    animation-name:body-hoch;
    animation-delay:0s;
    animation-duration:0.8s;
    animation-timing-function:ease-in-out;
  }
  .body-ani-unten{
    position:absolute;
    top:calc(100% + 50px);
    width:calc(100% - 16px);
    max-width:calc(100% - 16px);
    animation-name:body-runter;
    animation-delay:0s;
    animation-duration:0.8s;
    animation-timing-function:ease-in-out;
  }

  @keyframes body-runter {
    0% {
      top:0px;
    }
    100% {
      top:100%;
    }
    
  }

  @keyframes body-hoch {
    0% {
      top:100%;
    }
    100% {
      top:0px;
    }
    
  }


  .chevron {
    position:absolute;
    right:0px;
    bottom:-3px;
    height:50px;
    width:50px;
    background:transparent;
    animation-fill-mode: backwards;
    animation-name:chevron;
    animation-delay:0.6s;
    animation-duration:0.1s;
    animation-timing-function:ease-in;
  }
  .chevron-start {
    position:absolute;
    right:0px;
    bottom:-3px;
    height:50px;
    width:50px;
    background:transparent;
  }

  @keyframes chevron {
    0% {
      transform:scale(1,-1);
      bottom:2px;
    }
    100% {
      transform:scale(1,1);
      bottom:-3px;
    }
    
  }
  
.zeile-logo-mitte{
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
  width: 100%;
}


@keyframes schriftzug {
    0% {
        position:absolute;
        left:19px;
        top:10px;
        height:56px;
    }
  }

@keyframes schriftzug-klein {
    0% {
        position:absolute;
        left:23px;
        top:10px;
        height:56px;
    }
  }
.schriftzug_ges_start{
    position:absolute;
    left:19px;
    top:10px;
    height:56px;
}
.schriftzug_ges_klein{
    position:absolute;
    left:19px;
    top:10px;
        height:56px;
    animation-fill-mode: backwards;
    animation-name:schriftzug-klein;
    animation-delay:0s;
    animation-duration:0.8s;
    animation-timing-function:ease-in-out;
}
.schriftzug_ges_gross{
    position:absolute;
    left:23px;
    top:10px;
        height:56px;
    animation-fill-mode: backwards;
    animation-name:schriftzug;
    animation-delay:0s;
    animation-duration:0.8s;
    animation-timing-function:ease-in-out;
}

@keyframes schriftzug_rest_klein {
    0% {
        position:absolute;
        left:62px;
        top:10px;
        height:56px;
    }
  }
@keyframes schriftzug_rest_gross {
    0% {
        position:absolute;
        left:62px;
        top:10px;
        height:56px;
    }
  }
.schriftzug_ges_rest_start{
    position:absolute;
    left:62px;
    top:20px;
    height:56px;
}
.schriftzug_ges_rest_klein{
    position:absolute;
    left:62px;
    top:20px;
        height:56px;
    animation-fill-mode: backwards;
    animation-name:schriftzug_rest_klein;
    animation-delay:0.7s;
    animation-duration:0.2s;
    animation-timing-function:linear;
}
.schriftzug_ges_rest_gross{
    position:absolute;
    left:62px;
    top:10px;
        height:56px;
    animation-fill-mode: backwards;
    animation-name:schriftzug_rest_gross;
    animation-delay:0.1s;
    animation-duration:0.2s;
    animation-timing-function:linear;
}

.plat-logo-mitte{
  max-width:calc(100% - 50px);
  max-height:25px;
  position: relative;
  left: 0px;
  padding:10px;
  padding-top:30px;
  padding-bottom:30px;
}