[PURPLE AND YELLOW]

Code:: <div class="fondficheparto"> <div class="imglogo" style="text-align:center;"><img src="https://imgur.com/2qia8tX.png"/><b>forum</b></div><div class="liensutiles"> <div class="linku"><a href="/">Concept</a></div><div class="linku"><a href="/">Les groupes</a></div><div class="linku"><a href="/">Règlement</a></div><div class="linku"><a href="/">Partenariat</a></div></div><div class="blok1"><img src="http://via.placeholder.com/280x450"></div><div class="blok2"> <div class="imgrond" style="text-align:center;margin:20px;"><img src="http://via.placeholder.com/80x80"></div></br> <div class="cadre">J'aime les stats <div class="owi"><img src="https://imgur.com/yLfMhuM.png"/></div></div><div class="linkstat">xx membres</div><div class="linkstat">xx sujets</div><div class="linkstat">xx messages</div><div class="cadre">Vive les predef'<div class="owi"><img src="https://imgur.com/yLfMhuM.png"/></div></div><center><div class="predou"><a href="/"><img src="http://via.placeholder.com/50x50"></a></div><div class="predou"><a href="/"><img src="http://via.placeholder.com/50x50"></a></div><div class="predou"><a href="/"><img src="http://via.placeholder.com/50x50"></a></div><div class="predou"><a href="/"><img src="http://via.placeholder.com/50x50"></a></div></center> </div><div class="contexte"><span>contexte</span></br> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis diam vel nisi viverra porttitor a eu urna. Nam luctus, libero sit amet ultrices porttitor, urna ante tristique lectus, vel blandit nunc sapien a erat. Mauris congue, elit sagittis ultricies vestibulum, dui nibh mattis nisi, nec sodales enim augue id erat. Vivamus quis magna vitae tellus dignissim viverra ac quis justo. Donec non pretium eros. Quisque porta blandit leo, et hendrerit nibh lobortis eu. Etiam vitae tempor velit. Donec tincidunt volutpat blandit. Cras condimentum mi id ullamcorper sollicitudin. Ut massa ante, cursus eget ante vitae, vehicula pharetra dui. Sed vehicula arcu nisi, at efficitur quam maximus ut. Curabitur nec turpis sed lacus pretium tincidunt. Phasellus hendrerit turpis vel tortor mattis interdum.Cras porttitor, nisi in dignissim hendrerit, dui turpis finibus justo, eu tempor sem mi nec felis. Curabitur a est scelerisque neque bibendum auctor a in ligula. Proin vitae ex leo. Mauris pulvinar eget dui vitae pretium. Praesent ultricies erat non nisl aliquam ullamcorper. Aenean eros augue, varius id suscipit non, sollicitudin sed ipsum. Nullam elementum luctus ex, a vestibulum turpis interdum id. Curabitur congue lectus vel facilisis porta. Praesent sit amet venenatis lectus, quis feugiat diam. Aliquam dictum tristique velit a vestibulum. </div></div><div class="credit"><a target="_blank" href="http://epsilon-ls.forumactif.com/">e p s i l o n</a></div><style>@font-face{font-family: 'LemonTuesday'; src: url('http://vanessaskins.b1.jcink.com/uploads/vanessaskins/LemonTuesdaye.eot'); src: url('http://vanessaskins.b1.jcink.com/uploads/vanessaskins/LemonTuesday.eot?#iefix') format('embedded-opentype'), url('http://vanessaskins.b1.jcink.com/uploads/vanessaskins/LemonTuesday.woff') format('woff'), url('http://vanessaskins.b1.jcink.com/uploads/vanessaskins/LemonTuesday.ttf') format('truetype'), url('http://vanessaskins.b1.jcink.com/uploads/vanessaskins/LemonTuesday.svg') format('svg'); font-weight: normal; font-style: normal;}.fondficheparto{width:480px; height:1000px; margin:0 auto; background:#ccc; background-image: url(https://imgur.com/Is8C2Ze.png); border: 20px solid black;}.imglogo b{color: #762dcf; font-size: 100px; transition: all 800ms; font-family: LemonTuesday; text-shadow: 2px 2px 0px #c5a459, 0px 1px #c5a459, 1px 0px #c5a459, -1px 0px #c5a459, 0px -1px #c5a459; text-decoration: none; transform: rotate(-8deg); position: relative; top: -220px;}.imglogo b:hover{font-size:102px; transition:all 800ms; text-shadow: 2px 2px 0px #762dcf, 0px 1px #762dcf, 1px 0px #762dcf, -1px 0px #762dcf, 0px -1px #762dcf; color:#ffa500;}.liensutiles{text-align:center; margin-top:-150px;}.linku{display:inline-block; margin:15px;}.linku a{text-decoration:none; font-weight:800; color:#ccc; text-transform:uppercase; font-size:12px; font-family:calibri; border-bottom:1px solid #ccc; transition:all 800ms;}.linku a:hover{transition:all 800ms; color:#ffa500; border-bottom:1px solid #ffa500;}.blok1{display:inline-block; width:280px; margin:10px; height:450px; vertical-align:top;}.blok2{display:inline-block; width:156px; background:rgba(100, 100, 100, 0.5); margin:10px; height:450px; vertical-align:top;}.imgrond img{border-radius:100%;}.cadre{text-align:left; padding:15px; width:110px; margin:0 auto; color:#ffa500; font-size:10px; font-family:calibri; background-color:#762dcf; position:relative; text-transform:uppercase;}.owi img{position:absolute; margin-top:-28px; margin-left:85px; width:42px; height:42px;}.linkstat{color:#ccc; text-align:center; font-family:calbri; font-size:12px; margin-top:10px; position:relative; bottom:5px;}.predou{display:inline-block; margin:5px; position:relative; top:20px;}.predou img{transition:all 800ms; width:50px; height:50px;}.predou img:hover{-webkit-filter: grayscale(100%); filter: grayscale(100%) contrast(200%); opacity: 0.9; transition: .7s;}.contexte{padding:10px; width:420px; height:190px; margin:0 auto; overflow:auto; color:#ccc; font-family:calibri; text-align:justify; font-size:12px;}.contexte span{font-family:lemontuesday; font-size:20px; color:#ffa500;}.contexte::-webkit-scrollbar{width: 2px; height: 10px; background: #762dcf;}.contexte::-webkit-scrollbar-thumb:vertical{height: 30px; -webkit-border-radius: 2px; background-color: #c88309;}.contexte::-webkit-scrollbar-thumb:horizontal{height: 30px; -webkit-border-radius: 2px; background-color: #c88309;}.credit{text-align:center;}.credit a{font:9px calibri; text-transform:uppercase; color:black; letter-spacing:2px;}</style>