so http://is.gd/Q8ACSs

by panchroma

HTML

<header>
    header content here
</header>
<section>
    <div class="dscrp">Section 1</div>
    section 1 content here
</section>
<section>
    <div class="dscrp">Section 2 description</div>
    section 2 content here
</section>
<section>
    <div class="dscrp">Section 3 </div>
    section 3 content here
</section>
<section>
    <div class="dscrp">Section 4 </div>
    section 4 content here
</section>
<section>
    <div class="dscrp">Section 5</div>
    section 5 content here
</section>
<section>
    <div class="dscrp">Section 6</div>
    section 6 content here
</section>
<footer> footer here</footer>

CSS

@import url(http://fonts.googleapis.com/css?family=Signika:600);
@import url(http://fonts.googleapis.com/css?family=Quattrocento+Sans);

header{
    background-color:pink;
}
section{
    background-color:olive;
}
footer{
    background-color:white;
}

. {
font-size:16px;
margin:0;
height:100%;
}

body {
background:#b5dba8;
font-family:'Quattrocento Sans';
color:#35525c;
margin:0;
height:100%;
}

header, section {
padding-left:1rem;
padding-right:1rem;
}

header, section, nav {
position:relative;
}

nav {
height:4rem;
text-align:right;
background-image:url(trgtpttrnweb.png);
}

nav > a {
vertical-align:-2.5rem;
text-decoration:none;
color:#35525c;
margin-right:.5rem;
font-size:1.25rem;
}

header {
padding-top:1.5rem;
margin: 0 auto 0 auto;
max-width:28rem;
}

h1, h2 {
font-family:'Signika';
}

h1 {
font-size:1.5rem;
}

h2 {
font-size:1.25rem;
}

h2 > a, p > a {
color:#35525c;
}

h3 {
display:inline;
font-size:1.0625rem;
}

.logo {
width:7rem;
display:inline;
position:absolute;
left:1.5rem;
bottom:-2rem;
z-index:1;
}

.lead {
display:inline-block;
margin-bottom:0px;
}

section {
padding-bottom:1rem;
margin: 0 auto 0 auto;
max-width:24rem;
    float:left;
}

.dscrp {
margin: 0;
padding: 0;
}

.srvc {
position:relative;
display:block;
width:100%;
text-align:center;
font-family:'Signika';
font-size:1.125rem;
color:#b5dba8;
text-decoration:none;
}

.srvc > span {
display:inline-block;
height:1.5rem;
width:8rem;
background:#35525c;
border:solid 1px;
border-radius:.5rem;
}

footer {
padding-top:1rem;
text-align:center;
background-image:url(trgtpttrnweb.png);
height:4.5rem;
    float:left;
    clear:both;
}

footer > a {
font-family:'Signika';
margin:.5rem;
line-height:2rem;
text-decoration:none;
font-size:1.125rem;
color:#35525c;
}

.cntr {
width:100%;
text-align:center;
}

@media screen and (min-width: 480px) and (max-width: 960px) {
    section {
    max-width:56rem;
    }

    .dscrp {
    display:inline-block;
    }
}