body {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: large;
    background: linear-gradient(black, #8000ff);
}
.container-grid {
    display: grid;
    grid-template-columns: 400px auto 400px;
    grid-template-rows: 200px auto 200px;
    grid-gap: 10px;
}
.title {
    text-align: center;
}
.section-1 {
    grid-column: 1;
    grid-row: 1;
    text-align: center;
    background: linear-gradient(to right, #000040, #000);
    color: cyan;
    border: blue 5px outset;
    padding: 5px;
}
.section-2 {
    grid-column: 2;
    grid-row: 1;
    background: linear-gradient(to bottom right, blue, cyan);
    border: #0080ff 5px groove;
    text-align: center;
    text-shadow: 5px 5px 5px darkblue;
    padding: auto;
}
.section-3 {
    grid-column: 3;
    grid-row: 1 / 3;
    text-align: right;
    background: linear-gradient(to bottom right, #002040, #0080ff);
    border: cyan 5px outset;
    color: #fff;
    padding: 5px;
}
.section-4 {
    grid-column: 1;
    grid-row: 2;
    background: linear-gradient(to right, #000040, #000);
    color: cyan;
    border: blue 5px outset;
    padding: 5px;
}
.section-5 {
    grid-column: 2;
    grid-row: 2;
    background-color: #000;
    border: #0080ff 5px ridge;
    border-radius: 5px;
    color: #0080ff;
    padding: 5px;
}
.section-6 {
    grid-column: 1;
    grid-row: 3;
    text-align: center;
    background: linear-gradient(to right, #000040, #000);
    color: cyan;
    border: blue 5px outset;
    padding: 5px;
}
.section-7 {
    grid-column: 2;
    grid-row: 3;
    background-color: #000;
    border: #0080ff 5px ridge;
    border-radius: 5px;
    color: #0080ff;
    padding: 5px;
}
.section-8 {
    grid-column: 3;
    grid-row: 3;
    background: linear-gradient(to bottom right, #002040, #0080ff);
    border: cyan 5px outset;
    color: #fff;
    padding: 5px;
}