/* 
    Document   : howitworks
    Created on : 19.06.2012
    Author     : theluk
*/
.journal {
	white-space: normal;
       color:#5e09a6;
}
.howitworksCircleHeader {
    font-size:16px;
    position: relative;
}

.howitworksCircleHeader .lfteaser {
    position: absolute;
    left:.8em;
    top:4em;
    color:#5e09a6;
    font-size:2em;
    line-height:1em;
    background:url("/img/howitworks/babybauch.jpg") no-repeat 0 1.2em;
    width:200px;
    padding-bottom:180px;
    text-align:center;
}
.howitworksCircleHeader .lfteaser + .lfteaser {
    left:auto;
    right:.8em;
    padding-top: 180px;
    padding-bottom:0px;
    text-align:right;
    background-image:url("/img/howitworks/babyaufbauch.jpg");
}

.howitworksCircleHeader ul {
    margin:0 auto;
    width:600px;
    height:570px;
    position: relative;
    background: url("/img/howitworks/back-circle-arrows.png") no-repeat;
}

.howitworksCircleHeader ul li {
    position: absolute;
}

.howitworksCircleHeader ul li .listnumber {
    font-family: journal;
    font-size: 3em;
    width: .9em;
    border-radius: .5em;
    background-color: #9DA60A;
    display: block;
    text-indent: .3em;
    line-height: .9em;
    float: left;
    font-weight: bold;
    color: white;    
}

.howitworksCircleHeader ul li div {
    overflow:hidden;
    padding-left:10px;
    max-width:152px;
}
.howitworksCircleHeader ul li div p {
    padding-bottom:10px;
}

.howitworksCircleHeader ul li.p1 {
top: 94px;
left: 77px;
}
.howitworksCircleHeader ul li.p2 {
top: 130px;
left: 340px;
}
.howitworksCircleHeader ul li.p3 {
top: 283px;
left: 390px;
}
.howitworksCircleHeader ul li.p4 {
top: 365px;
left: 185px;
}
.howitworksCircleHeader ul li.p5 {
top: 260px;
left: 0px;
}
.howitworksCircleHeader .register {
    margin-top:-100px;
}
.divider .register {
    position: static;
    margin-top:0;
}

.unfolder .journal {
    text-align:center;
    padding:20px 0;
}

.unfolder figure img {
    max-width:220px;
    border:1px solid #999;
}