#programTheorie
{
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;

    __align-items: center;
    
    z-index: 99 !important;
    
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

#programTheorie .content
{
    display: block;
    position: fixed;

    align-items: center;
    
    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);
    
    width:350px;
    margin:30px auto;
    background:white;
    border-radius:35px;
    overflow:hidden;
    box-shadow:0 5px 15px rgba(0,0,0,.2);
    
  
    background:#b8d8f5;
    font-family:Arial,Helvetica,sans-serif;
}

#programTheorie .header
{
    background:#061b77;
    color:white;
    text-align:center;
    font-size:48px;
    font-weight:bold;
    padding:35px;
}

#programTheorie #programTheorieHide
{
    position: absolute;

    left: 85%;
    top: 20px;
}

#programTheorie .body
{
    padding: 20px;
}

#programTheorie .body .appointment
{
    display:flex;
    align-items:center;
    gap:25px;
    padding:25px 0;
    border-bottom:4px dotted #D5FFFF;
}

#programTheorie .appointment:last-child
{
    border-bottom:none;
}

#programTheorie .icon img
{
    width:70px;
}

#programTheorie .info
{
    flex:1;
}

#programTheorie .date
{
    font-size: 20px;
    font-weight: bold;
    color: black;
    margin-bottom: 10px;
}

#programTheorie .time
{
    font-size:24px;
    color:#2446a5;
}