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

/*header*/

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


/* Body and format features*/

body {
    background-color: #d9dcd6;
}

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

p {
    font-size: 16px;
}




/* Navigation*/

    /*specs for links at the top*/
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;
}
    /* horizontal links*/
header nav ul li {
	display: inline-block;
	margin-left: 25px;
}
    /* Links' font size*/
.header h1 {
    display: inline-block;
    font-size: 48px;
}


    /*top image */

div.hero {
    margin-bottom: 25px;
}

div.hero img {
    height: 800px;
    width: 100%;
}



/*Main Content -> SEO, ORM, SMM */


    /* This section keeps the right side of the document in the desired place */
.content {
    width: 75%;
    display: inline-block;
    margin-left: 20px;
} 
    /* This section controls the heading format on content*/
article h2 {
	margin-bottom: 20px;
	font-size: 36px;
}

    /* This section controls the features of the blue squares on the main content */
article {
    margin-bottom: 20px;
    padding: 50px;
    height: 300px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    background-color: #0072bb;
    color: #ffffff;
} 
  
    /*Images specs*/
article img {
    max-height: 200px;
} 

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

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



/*side bar details*/

    /*blue background box*/
.benefits {
    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;
} 
    /* Font Colour*/
div.benefit {
    margin-bottom: 32px;
    color: #ffffff;
}

    /* Image specs*/
div.benefit img{
    display: block;
    margin: 10px auto;
    max-width: 150px;
}
    /*side bar headers*/
.benefits h2 {
    margin-bottom: 20px;
    text-align: center;
}



/* Footer */
footer h3{
    padding: 0px;
    margin-top: 20px;
    clear: both;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    text-align: center;
    
}

footer p {
    font-size: 15px;
    text-align: center;
}