body {
    margin: 0;
}
.container {
    margin-top: 3%;
    box-sizing: border-box;
    border: 5px black solid;
    background-color: white;
    height: 500px;
    width: 400px;
}
.box1 {
    background-color: red;
    width: 22%;
    height: 32%;
    float: left;
    border: 5px solid black;
    box-sizing: border-box;
}
.box2 {
    background-color: dodgerblue;
    width: 33%;
    height: 22%;
    border: 5px solid black;
    float: left;
    box-sizing: border-box;
}
.box3 {
    background-color: white;
    width: 45%;
    height: 22%;
    border: 5px solid black;
    float: right;
    box-sizing: border-box;
}
.box4 {
    background-color: yellow;
    width: 55%;
    height: 32%;
    border: 5px solid black;
    float: left;
    box-sizing: border-box;
}
.box5 {
    background-color: dodgerblue;
    width: 23%;
    height: 22%;
    border: 5px solid black;
    float: right;
    box-sizing: border-box;
}
.box6 {
    background-color: red;
    width: 23%;
    height: 42%;
    border: 5px solid black;
    float: right;
    box-sizing: border-box;
}
.box7 {
    background-color: dodgerblue;
    width: 22%;
    height: 40%;
    border: 5px solid black;
    float: right;
    box-sizing: border-box;
}
.box8 {
    background-color: dodgerblue;
    width: 12%;
    height: 42%;
    border: 5px solid black;
    float: left;
    margin-top: -28%;
    box-sizing: border-box;
}
.box9 {
    background-color: red;
    width: 10%;
    height: 22.3%;
    border: 5px solid black;
    float: left;
    margin-top: -28%;
    box-sizing: border-box;
}
.box10 {
    background-color: white;
    width: 43%;
    height: 37%;
    border: 5px solid black;
    float: right;
    box-sizing: border-box;
}
.box11 {
    background-color: white;
    width: 12%;
    height: 26.4%;
    border: 5px solid black;
    float: left;
    box-sizing: border-box;
}
.box12 {
    background-color: yellow;
    width: 43%;
    height: 9%;
    border: 5px solid black;
    float: right;
    box-sizing: border-box;
}
.box13 {
    background-color: yellow;
    width: 23%;
    height: 14.3%;
    border: 5px solid black;
    float: right;
    margin-top: -18%;
    box-sizing: border-box;
}
.box14 {
    background-color: red;
    width: 22%;
    height: 6.2%;
    border: 5px solid black;
    float: right;
    margin-top: -7.8%;
    margin-right: 23%;
    box-sizing: border-box;
}