* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

body {
    background-color: #d9dcd6;
}

.header {
    padding: 20px;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    background-color: #2a607c;
    color: #ffffff;
}

.header h1 {
    display: inline-block;
    font-size: 48px;
}

.header h1 .seo {
    color: #d9dcd6;
}

/* The next 3 classes had to be renamed with 'nav' in place of 'div' because I changed the div to nav in html */
.header nav {
    padding-top: 15px;
    margin-right: 20px;
    float: right;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 20px;
}

.header nav ul {
    list-style-type: none;
}

.header nav ul li {
    display: inline-block;
    margin-left: 25px;
} 

a {
    color: #ffffff;
    text-decoration: none;
}

p {
    font-size: 16px;
}

.hero {
    height: 800px;
    width: 100%;
    margin-bottom: 25px;
    background-image: url("../images/digital-marketing-meeting.jpg");
    background-size: cover;
    background-position: center;
}

.float-left {
    float: left;
    margin-right: 25px;
}

.float-right {
    float: right;
    margin-left: 25px;
}

.main {
    width: 75%;
    display: inline-block;
    margin-left: 20px;
}

/* Change class name from 'benefits' to 'aside-benefits'*/
.aside {
    margin-right: 20px;
    padding: 20px;
    clear: both;
    float: right;
    width: 20%;
    height: 100%;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    background-color: #2589bd;
}

/* Consolidate separate classes in aside's benefits for same styling, name it .aside div */
.aside div {
    margin-bottom: 32px;
    color: #ffffff;
}

/* Consolidate benefits h3 styling into one class name based on child h3 tag in aside, so that 
any future h3 tages are unaffected by this specific class design in the aside */
.aside h3 {
    margin-bottom: 10px;
    text-align: center;
}

/* Consolidate aside benefits images to one class */
.benefits-img {
    display: block;
    margin: 10px auto;
    max-width: 150px;
}

/* Consolidate 3 main sections classes into one common styling class named '.main service' */
.main section {
    margin-bottom: 20px;
    padding: 50px;
    height: 300px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    background-color: #0072bb;
    color: #ffffff;
}

/* Consolidate 3 main section im classes into one named '.main section img' */
.main section img {
    max-height: 200px;
}

/* Consolidate 3 main section h2 classes into one named '.main section h2' */
.main section h2 {
    margin-bottom: 20px;
    font-size: 36px;
}

.footer {
    padding: 30px;
    clear: both;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    text-align: center;
}

.footer h2 {
    font-size: 20px;
}
