@font-face {
	font-family: 'kaushan';
	/*src:url('aAbrigyThink.otf');*/
	src:url('KaushanScript-Regular.ttf');
	font-weight: normal;
	font-style: normal;
}

:root{
    --rot: #882947;
    --grau: #69675C;
}

@keyframes example {
  0%   {color: var(--rot);transform: rotate(-15deg) scale(1);}
  50%  {color: var(--grau);transform: rotate(-17deg) scale(1.1);}
  100% {color: var(--rot);transform: rotate(-15deg) scale(1);}
}

*{
    font-size:14px;
    font-family:Verdana;
    margin:0px;
    padding:0px;
    text-decoration:none;
    box-sizing: border-box;
    color:#000;
}
html,body{
    background: #FFFFFF;
}
body > header{
    background: #FFFFFF;
    display:block;
    height:190px;
    width:100%;
    box-shadow:0px 0px 7px #333333;
    border-bottom:1px solid var(--rot);
    text-align:center;
    position: fixed;
    top:0px;
    left:0px;
    z-index:1000;
}
body > header#loginheader{
    position: sticky;
    top:calc(-100vH + 190px);
    height:100vH;
    padding-top:50vH;
}
body > header > span{
    position: absolute;
    top:150px;
    left: 51%;
    z-index:1001;
    display: inline-block;
    font-size:70px;
    font-family:kaushan;
    color:  var(--rot);
    font-weight:bold;
    transform:rotate(-15deg);
    text-shadow:0px 0px 4px #C0C0C0;
    animation-name: example;
    animation-duration: 2s;
    animation-delay: 1s;
    animation-iteration-count: 1;
}

body > section{
    display:block;
    width:95%;
    margin:auto;
    padding-top:200px;
}
h2,a{
    color:inherit;
}
a{
    cursor:pointer;
    font-size:inherit;
}

section > fieldset{
    margin:30px auto;
    border-radius:15px;
    padding:20px;
    max-width:80%;
}

section > fieldset > legend{
    padding:10px;
    font-size:1.1em;
    font-weight:bold;
}

menu{
    display:block;
    position:fixed;
    top:0px;
    left:-110vW;
    width:100%;
    height:100vH;
    background-color: rgba(0,0,0,0.8);
    z-index: 11000;
    list-style-type: none;
    transition:all 0.7s;
    padding-top:90px;
    padding-bottom:40px;
    overflow:auto;
}
menu.aktiv{
    left:0px;
}
menu li{
    line-height:40px;
    border-bottom:1px solid #fff;
    color:#fff;
    transition:all 0.5s;
}
menu li a{
    display:block;
    padding-left:15px;
    font-weight:inherit;
    transition:all 0.5s;
}
menu li:hover{
    background-color: var(--rot);
}
menu li:hover a{
    font-size: 1.2em;
}
input[type=submit]{
    background: radial-gradient(ellipse at center,  rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%);
}
form{
    width:90%;
    margin:20px auto;
    line-height:34px;
}
form label{
    display: inline-block;
    width:130px;
    vertical-align: top;
}
form input,form textarea,form select{
    display: inline-block;
    width: calc(100% - 150px);
    vertical-align: top;
    padding:5px 8px;
    border-radius:6px;
    border:1px solid var(--grau);
    resize: none;
}
form input[type=radio],form input[type=checkbox]{
    width:auto;
    vertical-align: middle;
}
input[type=password]{
    position:relative;
}
[contenteditable] {
  outline: 1px solid var(--rot);
  border-radius:4px;
}
footer{
    display:block;
    width:100%;
    height:30px;
    line-height:30px;
    text-align:right;
    padding:0px 15px;
    position:fixed;
    bottom:0px;
    left:0px;
    z-index:1000;
    background-color:var(--grau);
    color:#fff;
    font-size:0.8em;
    border-top:1px solid var(--rot);
}
footer a{
    display:inline-block;
    margin-right:15px;
    color:#fff;
}
/* -------------------------- [+] IDs ------------------------------------------------ */

#logo{
    display:block;
    width:310px;
    height:160px;
    position: fixed;
    top:0px;
    padding-top:20px;
    left: calc(50% - 155px);
    background-color:#fff;
    z-index:1001;
}

#logo img{
    max-width:100%;
    max-height:100%;
}
#burger{
    display:block;
    width:60px;
    height:54px;
    position: fixed;
    top:20px;
    right:40px;
    cursor:pointer;
}
#burger span{
    display:block;
    height:10px;
    background-color:var(--rot);
    margin-top:6px;
    border-radius:5px;
    transition:all 0.5s;
}
#burger span:nth-of-type(2){
    width:75%;
}
#burger span:nth-of-type(3){
    width:50%;
}
#burger:hover span{
    width:100%;
}
#closemenu{
    position: absolute;
    top:20px;
    right:40px;
}
#progressbar{
    display:inline-block;
    height:6px;
    border-radius:3px;
    border:1px solid var(--grau);
}
#progressbar span{
    display:block;
    background-color:#000;
    width:0%;
    height:100%;
}
#hinweis ul{
    margin-left:25px;
}
/* -------------------------- [-] IDs ------------------------------------------------ */

/* -------------------------- [+] Klassen -------------------------------------------- */
.icon-login{
    position: absolute;
    top:350px;
    left: calc(50% - 70px);
    display: block;
}
.icon{
    display:inline-block;
    width:120px;
    height:120px;
    border:1px solid var(--rot);
    border-radius:7px;
    line-height:120px;
    font-weight:bold;
    font-size:40px;
    color: var(--rot);
    background: radial-gradient(ellipse at center,  rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%);
    box-shadow:2px 2px 7px #808080;
    transition:all 0.7s;
    text-align:center;
}
.adminicon{
    border:1px solid #FF6600;
}
.dozicon{
    border:1px solid var(--grau);
}
.close{
    display:block;
    width:50px;
    height:50px;
    line-height:50px;
    border-radius:50%;
    text-align:center;
    font-size:20px;
    background-color: var(--rot);
    color:#fff;
    font-weight:bold;
    cursor:pointer;
    position:relative;
    border:1px solid var(--grau);
}
.close span{
    display:block;
    height:6px;
    width:70%;
    position:absolute;
    top:8px;
    left:7px;
    border-radius:5px;
    margin-top:8px;
    background-color:#fff;
    transition:all 0.4s;
}
.close span:nth-of-type(2){
    top:17px;
}
.close:hover span{
    transform: rotate(-135deg);
    top:13px;
}
.close:hover span:nth-of-type(2){
    transform: rotate(135deg);
    top:13px;
}
.kaushan{
    font-family:kaushan;
    font-weight:bold;
    color:var(--rot);
}
.labeled{
    position: relative;
    overflow:hidden;
    margin:15px;
}
.labeled span{
    display:block;
    width:100%;
    height:100%;
    max-height:100%;
    position: absolute;
    top:100%;
    left:0px;
    text-align:center;
    transition:all 0.6s;
    background-color: rgba(0,0,0,0.7);
    color:#fff;
    font-weight:bold;
    border-radius:7px;
}
.labeled:hover span{
    top:0px;
}
.hide{
    display:none;
}
.fehler{
    color:#FF6600;
}
.erfolg{
    color:#339966;
}
.linebreak{
    display:block;
}
figure.dozent{
    display:inline-block;
    width:170px;
    height:180px;
    margin:5px;
    border-radius:5px;
    background: radial-gradient(ellipse at center,  rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%);
    background-position:center center;
    background-size:cover;
    border:1px solid var(--rot);
    box-shadow:2px 2px 7px #808080;
    transition:all 0.7s;
    text-align:center;
}
figure.dozent span{
    display:block;
    width:100%;
    height:100%;
    position: absolute;
    top:0%;
    left:0px;
    text-align:center;
    transition:all 0.6s;
    background-color: rgba(0,0,0,0.6);
    color:#fff;
    font-weight:normal;
    border-radius:7px;
    padding-top:15px;
}
figure.dozent span .link{
    font-size:1.4em;
    display:inline-block;
    margin:8px;
}
.ui-dialog{
    z-index:10005 !important;
}
.ui-dialog *{
    background-size:cover;
    background-position: center center;
    background-repeat: no-repeat;
    max-height:90%;
}
.ui-widget-overlay{
    background: rgba(0,0,0,0.7) !important;
    opacity:0.9 !important;
}
.ui-dialog-content{
    overflow:auto !important;
}
.grid12{
    display:grid;
    width:100%;
    min-height:350px;
    grid-template-columns: 300px 1fr;
    grid-template-rows: 50px 1fr;
    gap: 15px 15px;
    grid-template-areas:
        "links rechtsoben"
        "links rechtsunten";
        overflow:auto;
}
.grid3,.grid4,.grid5{
    display:grid;
    width:100%;
    grid-template-columns: 80px 1fr 100px;
    grid-auto-columns: auto;
    grid-auto-flow: row dense;
    gap: 10px 5px;
    margin: auto;
}
.grid3 > *,.grid4 > *{
    padding:3px 5px;
}
.grid4{
    grid-template-columns: 1fr repeat(3,50px);
}
.grid5{
    grid-template-columns: 150px 1fr repeat(3,50px);
}
.grid2{
    display:grid;
    grid-template-columns: 80px 1fr;
    grid-auto-columns: auto;
    grid-auto-flow: row dense;
    gap: 10px 5px;
    margin: auto;
}
.grid2.hover:hover,.grid3.hover:hover,.grid4.hover:hover,.grid5.hover:hover{
    background: rgba(0,0,0,0.1);
    border-radius:5px;
}/*
.fc-axis{
    display:none;
}*/
.fc-event{
    inset: 0.399994px 0% -38.8px !important;
}
.fc-title{
    color:#fff;
}
.ui-tooltip {
    z-index: 10000 !important;
}
.acc-content div{
    display:grid;
    grid-template-columns: repeat(3,1fr);
    grid-auto-columns: auto;
    grid-auto-flow: row dense;
    gap: 10px 5px;
    margin: auto;
    border-left:1px solid var(--grau);
    border-right:1px solid var(--grau);
    padding:10px 15px;
    background-color:rgba(0,0,0,0.1);
    min-height: 0px;
    width: 100%;
}
.acc-content div:nth-of-type(2n){
    background-color:rgba(0,0,0,0.2);
}
.acc-content div.hover:hover{
    background: rgba(0,0,0,0.6);
    color:#fff;
}
.acc-content div:last-of-type{
    border-bottom:1px solid var(--grau);
    margin-bottom:10px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}
.acc-header{
    transition:all 0.5s;
}
.acc-header.aktiv{
    background-color:var(--rot) !important;
    color:#fff;
    border:1px solid var(--grau);
    border-radius:0px !important;
    border-bottom:0px solid var(--grau);
    margin-top:5px;
}
.acc-header.aktiv *,.acc-content span{
    color:inherit;
}
.icon-chevron-right{
    transition:all 0.3s;
}
.hover.aktiv .icon-chevron-right{
    transform:rotate(90deg);
}
.acc-content div:nth-of-type(2n){
    background-color:rgba(0,0,0,0.2);
}

.highlighted div{
    padding:10px 15px;
}
.highlighted div:nth-of-type(2n){
    background-color:rgba(0,0,0,0.2);
}
.highlighted div.hover:hover{
    background: rgba(0,0,0,0.6);
    color:#fff;
}
.highlighted div.hover:hover *{
    color:inherit;
}
/* -------------------------- [-] Klassen -------------------------------------------- */

/* -------------------------- [+] Cookiehinweis -------------------------------------- */
#cookiehinweis{
    position:fixed;
    bottom:0px;
    left:0px;
    min-height:calc(100vH - 285px);
    width:100%;
    border-top:4px solid var(--rot);
    background-color:rgba(0,0,0,0.6);
    z-index:10000;
    padding:20px 50px;
    padding-left:30px;
    padding-bottom:50px;
    transition:all 1s;
     display: flex;
     flex-direction: column;
     flex-wrap: nowrap;
     justify-content: space-evenly;
     align-items: center;
     align-content: center;
}

#cookiehinweis .flex-item {
     flex: 0 1 auto;
}

#cookiehinweis .flex-item:nth-child(1) {
     flex-grow: 0;
     flex-shrink: 1;
     flex-basis: auto;
     color:#fff;
     line-height:1.8em;
}

#cookiehinweis .flex-item:nth-child(2) {
     flex-grow: 0;
     flex-shrink: 1;
     flex-basis: auto;
}


#cookiehinweis.accept{
    bottom:-100vH;
}
#cookiehinweis button{
    background: radial-gradient(ellipse at center,  rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%);
    border:1px solid var(--rot);
    padding:10px 20px;
    border-radius:10px;
    cursor:pointer;
}
/* -------------------------- [-] Cookiehinweis -------------------------------------- */

