/*
    
## ## ## ## ##  ##              ## ## ## ## ##  ## ## ## ## ##  ## ## ## ## ##  ##          ##  ## ## ## ## ##  ## ## ## ## ##
##              ##              ##          ##  ##          ##  ##          ##  ## ##       ##  ##                    ##
##              ##              ##          ##  ##          ##  ##          ##  ##  ##      ##  ##                    ##
##    ## ## ##  ##              ##          ##  ## ## ## ##     ##          ##  ##    ##    ##  ## ## ## ## ##        ##
##          ##  ##              ##          ##  ##          ##  ##          ##  ##      ##  ##  ##                    ##
##          ##  ##              ##          ##  ##          ##  ##          ##  ##        ##    ##                    ##
## ## ## ## ##  ## ## ## ## ##  ## ## ## ## ##  ## ## ## ## ##  ## ## ## ## ##  ##          ##  ## ## ## ## ##        ##

/* BURGER MENU */
@media all and (max-width: 1600px) {
    .bottommenu nav {
        visibility: hidden;
        display: flex;
        flex-direction: column;
        align-items: start;
        position: absolute;
        width: 100%;
        padding: 2rem 0;
        top: 10rem;
        right: 0;
        opacity: 1;
    }
    #nav{
        align-items: start;
    }
    .menuitem {
        flex-direction: column;
        align-items: flex-start;
        padding: .8rem 2rem;
    }
    #burgermenu {
        display: block;
    }
    .dropdown {
        position: relative;
        font-size: smaller;
        margin: 0;
        top: 0.5rem;
        padding: 0;
        background: #04793d;
    }
    .dropdown a{
        color: #ffffff;
    }
    #nav{
        background-color: #04793d;
    }
    #nav a{
        color:#ffffff;
    }
    #nav  li i{
        color: #ffffff;
    }

}

/* DESKTOP */
@media all and (max-width: 1600px) {
    #topfooter {
        padding: 5rem;
    }
    #bottomfooter {
        padding: .5rem 5rem;
    }
    .content {
        padding: calc(1rem + 5vw);
    }
}
/* LAPTOP */
@media all and (max-width: 1300px) {
    #hero h1 {
        width: 100%;
    }
    .content.flex {
        gap: 3em;
    }
}
/* TABLET */
@media all and (max-width: 1000px) {
    #topfooter {
        padding: 3rem;
    }
    #bottomfooter {
        padding: .5rem 3rem;
    }
    #bottomfooter div {
        flex-direction: column;
    }
    .info.flex {
        flex-direction: row;
    }
    .flex {
        flex-direction: column;
        gap: 1em;
    }
    .teaser {
        padding: 3rem 2rem;
    }
    .select {
        flex-direction: row;
    }
    .left,
    .right,
    #linkblock,
    .bottomtext {
        width: 100%;
    }
    .icon {
        grid-row-start: 1;
        grid-row-end: 1;
        text-align: center;
    }
    .text {
        grid-row-start: 2;
        grid-row-end: 2;
        text-align: center;
    }
    .button {
        grid-row-start: 3;
        grid-row-end: 3;
        text-align: center;
    }
    .box:nth-child(1) {
        grid-row-start: 1;
        grid-row-end: 1;
    }
    .box:nth-child(2) {
        grid-row-start: 2;
        grid-row-end: 2;
    }
    .box:nth-child(3) {
        grid-row-start: 3;
        grid-row-end: 3;
    }
    .first span,
    .first .menuitem a{
        display: none;
    }
}
/* SMARTPHONE */
@media all and (max-width: 600px) {
    #topfooter {
        padding: 1.5rem 2.5rem;
    }
    .info.flex {
        flex-direction: column;
    }
    input {
        padding: .5rem 0rem;
        text-align: center;
    }
    textarea::placeholder {
        text-align: center;
    }
    nav,
    .menuitem a {
        transition: none;
    }
    .topmenu {
        display: none;
    }
    #bottomfooter {
        padding: .5rem 1rem;
    }
    .bottommenu nav {
        top: 7.5rem;
    }
}
/* MOBILE */
@media all and (max-width: 400px) {
    .bottommenu {
        flex-direction: column;
        justify-content: center;
        gap: 1rem;
    }
    header {
        padding: 1rem;
        box-sizing: border-box;
    }
    .select.flex {
        flex-direction: column;
    }
    #popup {
        padding: 1rem;
    }
    .bottommenu nav {
        top: 9rem;
    }
}