:root{
    --main-color: #e94b4f;
}

html, body{
    font-family: Arial;
    margin: 0;
    height: 100%;
}

#map {
    height: 100%;
}

#panel{
    visibility: hidden;
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1000;
    background-color: #ffffff;
    padding: 1rem;
}

.btn{
    border-radius: .25rem;
}

.btn-check:checked + .btn{
    background-color: var(--main-color);
    border-color: var(--main-color);
}

.btn-outline-primary{
    color: var(--main-color);
    border-color: var(--main-color);
}
.btn-check + .btn:hover{
    color: var(--main-color);
    border-color: var(--main-color);
}

.btn-check:checked + .btn:hover{
    color: #ffffff;
}

@media(max-width: 800px){
    #panel{
        flex-direction: column;
    }

    #bus-panel{
        margin-bottom: .5rem;
    }
}