.container {
    margin-top: 25px;
    border-color: black;
    border-style: solid;
    height: 500px;
    width: 500px;
    background-color: yellow;
}

.red_vierkant {
    background-color: red;
    float: left;
    height: 100px;
    width: 60px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
}

.blue_vierkant {
    background-color: blue;
    float: left;
    height: 60px;
    width: 200px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
}

.white_vierkant1 {
    background-color: white;
    float: left;
    height: 40px;
    width: 400px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
    color: black;
}

.white_vierkant2 {
    background-color: lightblue;
    float: left;
    height: 300px;
    width: 400px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
    color: black;
}

.green_vierkant {
    background-color: green;
    float: left;
    height: 300px;
    width: 60px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
}

.yellow_vierkant {
    border-style: solid;
    border-color: black;
    float: left;
    width: 240px;
    box-sizing: border-box;
    height: 60px;
    color: yellow;
}

.red_vierkant2 {
    background-color: red;
    float: right;
    height: 100px;
    width: 40px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
}

.blue_vierkant2 {
    background-color: blue;
    float: right;
    height: 200px;
    width: 40px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
}

.white_vierkant3 {
    background-color: white;
    float: right;
    height: 40px;
    width: 40px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
}

.cibe10 {
    float: left;
    height: 100px;
    width: 500px;
    box-sizing: border-box;
    border-color: black;
    border-style: solid;
}