body {
    padding: 0;
    margin: 0;
    font-family: sans-serif;

    display: grid;
    grid-template-columns: repeat(12, 10%);
    grid-template-rows: 25% 25% 25% 25%;

}



.box {
    /* background-color: #757373c4; */
    padding: 1rem;
    margin: 0.5rem;
}



.grid-one {

grid-column: 1 / 6;
grid-row: 1 / 4;

z-index: 1;
background-image: url('../images/CupcakeA.jpg');
background-size: cover;

font-size: 40pt;
text-align: center;
}

.grid-two {
    
grid-column: 1 / 13;
grid-row: 1 / 12;
z-index: 1;
background-color: #d8dcbc56;
background-size: cover;

font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-size: 40pt;

}

.grid-three {
    border: 6px solid #952473e7;
    background-color: #311f6b;
}

.grid-four {
    border: 6px solid #8e5909;
}

.grid-five {
    
    grid-column: 6 / 12;
    grid-row: 2 / 8;

    z-index: 1;
    background-image: url('../images/CupcakeB.jpg');

    font-size: 20pt;
text-align: left;



}

.grid-six {
    border: 6px solid #311f6b;
}

img {
    width: 20%;
}