Заставить колонки работать?

Я пытаюсь иметь 4 столбца, пытаясь заставить изображение сидеть над секцией "около".

Он должен гласить:

Колонка 1: Img и О нас

Столбец 2: Контакт

Столбец 3: Новости 1

Столбец 4: Новости 2

Но, как вы можете видеть из этой скрипки, она не работает. Код ниже.

<section id="about">
<div id="profile" class="column">
<div class="thumb"><img width="240" height="350" src="http://www.lottanieminen.com/wordpress/wp-content/uploads/lottanieminen_NEWS_portrait.jpg" alt="Lotta Nieminen"/>
</div>
</div>
<div id="about-page" class="column">
<h2>About Us</h2>
Lotta Nieminen is an illustrator, graphic designer and art director from Helsinki, Finland. She has studied graphic design and illustration at the University of Art and Design Helsinki and the Rhode Island School of Design, and has worked as a freelancer in both fields since 2006. After working for fashion magazine Trendi, Pentagram Design and RoAndCo Studio, 
</div>
<div id="contacts" class="column">
<h2>Contact</h2>
Lotta Nieminen is an illustrator, graphic designer and art director from Helsinki, Finland. She has studied graphic design and illustration at the University of Art and Design Helsinki and the Rhode Island School of Design, and has worked as a freelancer in both fields since 2006. After working for fashion magazine Trendi, Pentagram Design and RoAndCo Studio, Lotta now runs her own New York-based studio.
</div>
</section>
<section id="news">
<div class="news--1 column clearfix">
<h2>News 1</h2>
Lotta Nieminen is an illustrator, graphic designer and art director from Helsinki, Finland. She has studied graphic design and illustration at the University of Art and Design Helsinki and the Rhode Island School of Design, and has worked as a freelancer in both fields since 2006. After working for fashion magazine Trendi, Pentagram Design and RoAndCo Studio, Lotta now runs her own New York-based studio.
</div>
<div class="news--2 column clearfix">
<h2>News 2</h2>
Lotta Nieminen is an illustrator, graphic designer and art director from Helsinki, Finland. She has studied graphic design and illustration at the University of Art and Design Helsinki and the Rhode Island School of Design, and has worked as a freelancer in both fields since 2006. After working for fashion magazine Trendi, Pentagram Design and RoAndCo Studio, Lotta now runs her own New York-based studio.
</div>
</section>

CSS

/* !Meta */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { list-style-type:none; color:inherit; text-decoration:none; margin:0; padding:0; border:0; font-weight:inherit; font-style:inherit; font-size:100%; vertical-align:baseline; outline:none; border-collapse:collapse; table-layout:fixed; }
.clearfix:after { content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0; }
.clearfix { display:inline-block; }
html[xmlns] .clearfix { display:block; }
* html .clearfix { height:1%; }

/* !Basics  */
html { width:100%; height:100%; position:relative; }
body { width:100%; height:100%; position:relative; }
body { color: #131313; font-family: Caslon540BT-Regular; font-size:13px; }


.column {width: 42%; margin-left: 4%; margin-right: 4%; float:left; }
.thumb img {width:100%!important; height:auto!important; margin-bottom:30px; }
#news {float: right; width: 50%;}
#about {padding-bottom: 60px; float:left; display:inline-block; width: 50%;}
#profile {float: left; clear: left;}
#contacts {float:left;}