body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 15pt !important;
}

#band2 {
    color: #ddd;
    background-color: #666;
    padding: 0rem 5% 0 5%;
    height: 44px;
    }

#band3 {
    color: #666;
    background-color: #eee;
    padding: 0.4rem 5% 0 5%;
    border-bottom: 1px dotted #666;
    height: 2rem;
}

#graz-logo {
    float: left;
    padding-top: 8px;
}

#ksg-logo {
    float: right;
    padding-top: 8px;
}

#suche {
    float: right;
    cursor: pointer;
    /* Lupe-rechts 🔎 */
}

a {
    text-decoration: none;
    color: #00518C;
    cursor: auto;
}

#content {
    padding: 2rem 5% 1rem 5%;
    padding-bottom: 2rem;
}

#footer {
    border-top: 1px solid;
    margin: 0 5% 0 5%;
    padding: 0.3rem 0 1rem 0;
    font-size: smaller;
    height: 2rem;
}

#copyright {
    float: left;
}

#geaendert {
    float: right;
    font-size: small;
}

#hinweise {
    display: block;
    xborder: 1px dotted;
    xbackground-color: #eee;
    padding: 2rem 5% 2rem 5%;
    background: linear-gradient(
    to bottom,
    #eee,
    #fff)
}

.selected>a {
    background-color: #ccc;
}

span.dots {
    color: #ccc;
}

span.match {
    background-color: yellow;
}

.navbar .nav-item .dropdown-menu{ display: none; }
.navbar .nav-item:hover .nav-link{   }
.navbar .nav-item:hover .dropdown-menu{ display: block; }
.navbar .nav-item .dropdown-menu{ margin-top:0; }

a.nolink {
    text-decoration: none;
    color: black;
}

a.nolink:hover {
    text-decoration: none;
    color: black;
}

.navbar {
    margin-top: -1.3rem;
    margin-left: -1.3rem;
    margin-right: -.8rem;   
}

.dropdown-item {
    padding: .1rem 1rem;
}

.wbox, .box {
    border: 1px dotted;
    font-size: 1rem;
    padding: 1rem;
    width: 12rem;
}

.box {
    display: inline-block;
    vertical-align: top;
    background: linear-gradient(
        to bottom,
        #ddd,
        #fff)
    
}

.wbox {
    width: 100%;
    border: 0;
}

.ibox {
    display: inline-block;
    vertical-align: bottom;
    border: none;
    font-size: 1rem;
    font-weight: 600;
    padding: 1rem;
    width: 15rem;
    min-height: 9rem;
    text-align: left;
}

.boxheader {
    font-weight: bold;
    font-size: 1.15rem;
    padding-bottom: 0.2rem;
}

input, button {
    border: 1px solid;
    height: 2rem;
    font-size: 1rem;
}

button {
    height: 2rem;
    width: 2rem;  
    font-weight: bold;
    border-radius: 50%;
    background-color: #4CAF50;
    color: white;
    text-align: center;
    cursor: pointer;
}

.circle, .circle1, .circle2 {
    height: 4rem;
    width: 4rem;  
    font-weight: bold;
    font-size: 2.6rem;
    border-radius: 50%;
    background-color: #4CAF50;
    color: white;
    text-align: center;
    cursor: pointer;
}

.circle1 {
    background-image: url('./what_01.png');
    background-repeat: no-repeat;
    background-position: center; 
}

.circle2 {
    background-image: url('./what_02.png');
    background-repeat: no-repeat;
    background-position: center; 
}