Edit in JSFiddle

<div id = "container">
    <div class = "sub-title row-pad">
        <span>teach yourself</span>
    </div>
    <div class = "main-title row-pad">
        <h1>life at 50 - for men</h1>
    </div>
    <div class="clear"></div>
    <div class = "goal row-pad">
        <p>goal</p>
        <p>new opportunities</p>
    </div>
    <div class = "cat row-pad">
        <p>category</p>
        <p>psychology</p>
    </div>
     <div class="clear"></div>
    <div class = "content row-pad">
        <p>content</p>
        <ul>
            <li>take new challenges</li>
            <li>overhaul your career</li>
            <li>develop new intrests</li>
    </div>
    <div class="clear"></div>
    <div class = "foot row-pad">
        <h2>be where you want to be with <span class="bold">teach yourself</span></h2>
    </div>
</div>

body {
font: 100% tahoma, verdana, arial, helvetica, sans-serif;
background: #F7F7F7;
}

.row-pad {
padding-top:10px;
padding-bottom:10px;

}

/*foundations*/

#container {
    margin:10% auto;
    width:70%;
    height:100%;
    border-radius:15px;
    border: solid 1px #333;
    background: rgba(255,255,255,0.2);
    background: -webkit-linear-gradient(90deg, rgba(205,255,205, 0.2) 30%,      rgba(255,255,255, 0.8) 100%);
    box-shadow:0 0 1px #000;
    border-top:1px solid #fff;
    border-bottom:1px solid #999;
    border-right:1px solid #fff;
    border-left:1px solid #fff;

}

.sub-title {
    width:19%;
    height:20%;
    float:left;
    border-right: 1px solid #333;
    text-align:center;
    border-top-left-radius: 15px 15px;
    background:yellow;
}

.main-title {
    width:79%;
    height:20%;
    float:right;
}

.goal {
    width:59%;
    height:20%;
    float:left;
    border-right: solid 1px #333;
}

.cat {
    width:40%;
    height:20%;
    float:left;
}

.content {
    width:100%;
    height:20%;
    float:left;
}

.foot {
    width:100%;
    height:20%;
    border-radius: 0px 0px 15px 15px;
    background: yellow;
}

.clear {
    clear:both;
    border-bottom: solid 1px #333;
}

/*typography*/

h1 {
   font-size: 1.4em;
   padding: 0.3em 0 0 0.5em;
    letter-spacing:0.1em;
}

p {
    font-size:0.8em;

}

.sub-title > span {
    font-size:0.7em;
    padding-right:15px;
    font-weight:bold;
    
}

p,
h2,
ul {
    padding:0 0 5px 20px;
    
}

h1,
h2 span.bold {
   font-weight:bold;

}

.cat p:last-child,
.goal p:last-child {
    font-weight:bold;

}

ul {
    font-size: 0.9em;
    font-weight:900;
    list-style-type:square;
    margin: 0 0 0 20px;
}