body {
    margin: 0;
    padding: 0;
    background-color: #f4f4f4;
}

.parent {
    display: grid;
    grid-template-columns: .5fr 2fr .5fr;
    grid-template-rows: repeat(2, .5fr) 3fr repeat(2, .5fr); 
    grid-column-gap: 0px; 
    grid-row-gap: 0px;
    height: 100vh; 
}

.header {
    grid-column: 1 / -1; 
    grid-row: 1; 
    background-color: rgba(255, 99, 71, 0.3); 
    padding: 20px; 
}

.nav {
    grid-column: 1 / -1; 
    grid-row: 2; 
    background-color: rgba(70, 130, 180, 0.3); 
}

.margin-left {
    grid-column: 1; 
    grid-row: 3 / -1; 
    background-color: rgba(60, 179, 113, 0.3); 
}

.main-content {
    grid-column: 2; 
    grid-row: 3 / -1;
    background-color: rgba(255, 215, 0, 0.3); 
}

.margin-right {
    grid-column: 3; 
    grid-row: 3 / -1; 
    background-color: rgba(255, 105, 180, 0.3);
}

.footer {
    grid-column: 1 / -1; 
    grid-row: 5;
    background-color: rgba(138, 43, 226, 0.3); 
    padding: 20px; 
}