﻿/*Flex keuze UI*/
.flexKeuzeRow{
    display:flex;
    justify-content:center;
    flex-direction:row;
    flex-wrap:wrap;
    margin-top:20px;
}

.keuzeAnchor:hover{
    text-decoration-color:white;
}

.voorbeeldAnchor:hover{
    text-decoration-color:black;
}

.flexKeuzeBox, .flexVoorbeeldBox {
    border: 1px solid black;
    margin-bottom: 20px;
    box-sizing:border-box;
}

.flexKeuzeBox{
    background-color: rgb(233, 136, 0);
    color:white;
}

.flexVoorbeeldBox {
    background-color: rgb(217,217,217);
    color: black;
}

.flexKeuzeBox > div, .flexVoorbeeldBox > div {
    padding: 5px;
    display: flex;/*Helpt image horizontaal en verticaal centreren in de div*/
}

.flexKeuzeBox > div:first-child, .flexVoorbeeldBox > div:first-child {
    background-color: white;
    height:210px;
}

.flexKeuzeBox > div:first-child > img, .flexVoorbeeldBox > div:first-child > img {
    margin: auto;
    max-height: 200px;
    max-width: 50%;
}

.flexKeuzeBox > div:nth-child(2), .flexVoorbeeldBox > div:nth-child(2) {
    height: 75px;
}

@media screen and (max-width: 1199px) {
    .flexKeuzeBox > div:nth-child(2), .flexVoorbeeldBox > div:nth-child(2) {
        height: 90px;
    }
}