<link href="https://fonts.googleapis.com/css?family=Roboto|Work+Sans:800" rel="stylesheet"><style>.wrap-dual {width: 400px;height: 500px;margin:0 auto 10px;position: relative;}.dual-img {border: 1px solid #ccc;position: absolute;}.dual-img img {margin: 3px}.wrap-dual h2 {width: 360px;margin: 0;left: 0;-webkit-transform: rotate(-90deg);-ms-transform: rotate(-90deg);transform: rotate(-90deg);bottom: -35px;height: 60px;position: absolute;transform-origin: 0 0;font:900 25px 'Work Sans', sans-serif;letter-spacing: -1px;line-height: 100%;}.dual-patt {height: 365px;width: 52px;position: absolute;background-image: url(http://subtlepatterns2015.subtlepatterns.netdna-cdn.com/patterns/mochaGrunge.png);left: 55px;top: 111px;}.dual-txt {border: 1px solid #ccc;background: #fff;height: 475px;width: 287px;position: absolute;right: 0;overflow: hidden;}.dual-txt-scroll {overflow-x: hidden;overflow-y: scroll;height:100%;width:110%;}.dual-txt-content {width: 287px;height: 100%;padding: 20px;box-sizing: border-box;font: 11px/100% 'Roboto', sans-serif;text-align: justify;}.dual-bot {height: 20px;width: 1px;}.dual-note {border: 1px solid #ccc;background: #fff;height: 18px;width: 344px;position: absolute;right: 0;bottom: 0;font: 10px/18px 'Roboto', sans-serif;text-align: center;letter-spacing: 1px;color: #ccc;}.dual-credit {position: absolute;width: 400px;text-align: center;bottom: -12px;}.dual-credit a {color: #ccc!important;font: 8px 'Roboto', sans-serif;text-decoration: none;letter-spacing: 1px;}</style><div class="wrap-dual"><!--
--><div class="dual-img"><img src="http://placehold.it/100x100" alt="" /></div><!--
--><h2>Despair is a narcotic, it lulls the mind into indifference</h2><!--
--><div class="dual-patt"></div><!--
--><div class="dual-txt"><!--
--><div class="dual-txt-scroll"><!--
--><div class="dual-txt-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vitae neque ultricies, tempor dui a, luctus lacus. Etiam tristique lorem id ante gravida, eget vestibulum nisi posuere. Donec sagittis luctus elit id dictum. Nullam ut diam sollicitudin, ornare elit sed, vulputate velit. Quisque vulputate, urna non interdum tincidunt, odio odio malesuada nisl, vel viverra leo urna eu ligula. Nulla nec convallis nisi. Phasellus sed tempus urna, sit amet ultricies leo. Quisque at est consectetur, faucibus risus nec, pharetra enim. Ut a ornare nisl. Maecenas interdum sem nec ex feugiat aliquet. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus tempus nulla sed nunc pellentesque, sed consequat orci cursus.
Aenean et accumsan magna, ut cursus dolor. Vestibulum tincidunt, nibh quis viverra rutrum, velit quam accumsan sem, et vestibulum leo massa vel dolor. In dignissim sed felis eu sagittis. Curabitur id mi vitae orci tristique hendrerit. Aliquam vel malesuada tortor. Donec quam neque, rutrum non ligula et, condimentum aliquet erat. Phasellus tincidunt tellus dui, sit amet accumsan velit dapibus non. Cras vitae cursus tellus. Nunc ullamcorper nulla at risus consectetur, ut faucibus sem sollicitudin. Nam gravida turpis id sapien fermentum sagittis. Pellentesque interdum ex sit amet ante eleifend, a vehicula est dignissim. Nunc turpis diam, lobortis vel lectus consequat, sollicitudin molestie sem. Sed arcu urna, dignissim in tincidunt non, interdum quis dui. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam elementum mauris sem, id mollis urna interdum sed. Nulla ac hendrerit mi.
Aenean tincidunt sodales mi, ut aliquet justo efficitur id. Donec in tortor porttitor, hendrerit nulla ac, semper turpis. Fusce dignissim iaculis rutrum. Maecenas turpis urna, eleifend quis ipsum et, fermentum hendrerit odio. Donec eget gravida nisi. Donec feugiat sodales lobortis. Pellentesque tempus velit eu erat sagittis dignissim. Cras id commodo urna. Nulla orci purus, finibus facilisis aliquam condimentum, gravida at diam. Curabitur nunc nisi, efficitur tincidunt accumsan nec, posuere vel elit. Aenean eget leo imperdiet, accumsan massa vehicula, ullamcorper magna.
Ut congue ante vitae turpis placerat, eget bibendum justo sagittis. Donec facilisis lacus et iaculis sodales. Duis laoreet, lorem sed scelerisque interdum, lorem eros semper tortor, vitae luctus nibh eros at elit. Proin vestibulum leo at tortor rhoncus rutrum. Aenean tincidunt arcu lacus, at efficitur justo cursus ac. In augue est, efficitur vel tortor vitae, ultricies bibendum massa. Etiam porttitor congue sem, a tempor ante bibendum a. Suspendisse orci sem, scelerisque sit amet tortor consectetur, finibus eleifend ipsum. Donec non ligula efficitur tellus viverra ultrices.
Nulla facilisi. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse finibus tortor tristique velit sollicitudin pharetra. Morbi nisl massa, hendrerit in interdum sed, dapibus non nulla. Vestibulum felis tellus, mattis sed ante rutrum, mollis laoreet lorem. Proin scelerisque eros eu urna mattis, eget suscipit justo porttitor. Donec sed vulputate tellus, sed ornare ante. Mauris varius gravida urna, vitae malesuada dui luctus sit amet. Cras vulputate auctor mauris nec blandit.
<div class="dual-bot"></div><!--
--></div><!--
--></div><!--
--></div><!--
--><div class="dual-note">Feat alias 1 and alias 2</div><!--
--><div class="dual-credit"><a href="#"></> awful</a></div><!--
--></div>
Accueil 
