
.block-selection {
    padding-bottom: 16px;
    padding-left: 16px;
    padding-right: 16px;
    margin-bottom: 16px;
    box-sizing: border-box;
    display: flex;
    border-bottom: 1px solid lightgrey;
}

.block-selection .block-selector {
    display: inline-block;
    flex: 1 1 auto;
    background: rgb(245, 245, 245);
    padding: 26px;
    text-align: center;
    min-width: 10%;
    box-sizing: border-box;
    font-weight: bold;
    border: 1px solid rgb(225, 225, 225);
    transition: 0.3s background-color ease-in-out;
}

.block-selector:hover {
    background: darkslategray;
}

.block-selector.active {
    background-color: slategray;
    color: white;
}

.block-selection:before {
    display: none;
}

@media (min-width: 0px) {
    .block-selection {
        width: 100%;
    }

    /*.block-selection:before {*/
    /*    display: block;*/
    /*    content: "Kategorier";*/
    /*    font-size: 1.25rem;*/
    /*    margin-top: 8px;*/
    /*    margin-bottom: 8px;*/
    /*    width: 100%;*/
    /*}*/
    .block-selection .block-selector {
        width: 100%;
        padding: 16px;
    }
}

@media (min-width: 430px) {
    .block-selection {
        width: 100%;
        flex-wrap: wrap;
    }

    .block-selection .block-selector {
        float: left;
        width: auto;
        padding: 16px;
    }
}

@media (min-width: 1080px) {
    .block-selection {
        width: 80%;
        flex-wrap: nowrap;
        padding-bottom: 16px;
        padding-left: 16px;
        padding-right: 16px;
        margin-bottom: 16px;
    }

    .block-selection:before {
        display: none;
    }

    .block-selection .block-selector {
        display: inline-block;
        flex: 1 1 auto;
        background: rgb(245, 245, 245);
        padding: 26px;
        text-align: center;
        min-width: 10%;
        box-sizing: border-box;
        width: auto;
        font-weight: bold;
        border: 1px solid rgb(225, 225, 225);
        transition: 0.2s all ease-in-out;
    }

    .block-selector:hover {
        background: slategray;
        color: white;
    }

    .block-selector.active {
        background-color: slategray;
        color: white;
    }


}


