<body>
    <div id="wrap">
        <header id="header">
            <div class="container"></div>
        </header>
        <nav id="nav">
            <div class="container"></div>

        </nav>
        <main id="main">
            <div class="contents container">
                <div class="cont1"></div>
                <div class="cont2"></div>
                <div class="cont3"></div>
                <div class="cont4"></div>
            </div>

        </main>
        <footer id="footer">
            <div class="container"></div>

        </footer>
    </div>
</body>
<style>
        *{
            margin: 0;
        }
        #wrap {
            
        }
        #header {
            height: 100px;
            background-color: #EEEBE9;
        }
        #nav {
            height: 100px;
            background-color: #B9AAA5;
        }
        #main {
            height: 780px;
            background-color: #886F65;
        }
        #footer {
            height: 100px;
            background-color: #4E342E;
        }
        .container{
            width: 1200px;
            height: inherit;
            margin: 0 auto;
            background-color: rgba(0,0,0,0.3);
        }
        .contents{
            display: grid;
            grid-template-areas: 
            "cont1 cont1"
            "cont2 cont2"
            "cont3 cont4"
            ;
            grid-template-columns: 50% 50% ;
            grid-template-rows: 100px 200px 480px ;
        }
        .contents .cont1{
            background-color: #74574A;
            grid-area: cont1;
        }
        .contents .cont2{
            background-color: #684D43;
            grid-area: cont2;
        }
        .contents .cont3{
            background-color: #594139;
            grid-area: cont3;
        }
        .contents .cont4{
            background-color: #4A352F;
            grid-area: cont4;
        }
    </style>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.