body {
    font-family: Ariel, Helvetica, sans-serif;
    background: biege;
    color: blue;
    }
    
.header {
padding: 80px;
text-align: center;
background: #1abc9c;
color: white;
}

.header h1 {
font-size: 40px;
}

/* style the navigation bar */
.navbar {
overflow: hidden;
background-color: #333;
}

/*style the navigation bar links */
.navbar a {
float: left;
display: block;
color: white;
text-align: center;
padding: 14px 20px;
text-decoration: none;
}

/* right aligned link */
.navbar a.right {
float: right;
}

/* change color on hover/mouse-over */
.navbar a:hover {
background-color: #ddd;
color: black;
}

/*main content*/
*{
box-sizing: border-box;
}

/* column container*/
.row {
display: flex;
flex-wrap: wrap;
}

/* to unequal columns that sit next to each other */
/* side bar/left column */
.side {
flex: 30%;
background-color: #f1f1f1;
padding: 20px;
}

/* main column */
.main {
flex: 70%;
background-color: white;
padding: 20px;
}

/* footer */
.footer{
padding: 20px;
text-align: center;
background: #ddd;
}