html, body {
    margin: 0px;
    padding: 15px;
    background-color: cadetblue;
    height: calc(100% - 30px);
}
main {
    padding: 15px;
    background-color: rgb(26, 69, 119);
    display: flex;
    height: calc(100% - 30px);
    gap: 15px;
}
.color {
    background-color: rgb(241, 144, 201);
}
.box-100 {
    width: 100%;
    display: flex;
    gap: 15px;
}
.box-50 {
    width: 50%;
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    align-items: stretch;
    height: 100%;
}
.dostercios-altura , .untercio-altura {
    width: 100%;
}
.dostercios-altura {
    height: 65%;
}
.untercio-altura {
    height: 33%;
}
.alt-20 {
    height: 19%;
}
.alt-40 {
    height: 39%;
}
.alt-60 {
    height: 37%;
}
.altura-especial {
    height: 62%;
}
.alt-80 {
    height: 79%;
}