delightful: winter revamp

re: winter

---

delightful :  layout gallery
all things pastel

"winter"
designed and coded
by lisett

---

reminders:
- do not remove the credit
- comment when using
- do not copy, steal or redistribute this code
and claim it as your own
- do not use as base code or use snippets

you may:
- tweak the layout's colors, images, etc.

---

if you have any other questions, please message me through this link:
http://www.asianfanfics.com/profile/view/664800

re: winter - main

<div style="width:965px;margin:auto;">
<div style="width:905px;padding:30px;float:left;background-color:#F9F9F9;">
<div style="width:903px;height:601px;float:left;border:1px solid #EEE;">
<div style="width:900px;float:left;"><img alt="" src="http://i.imgur.com/FKy1Le0.gif" style="width:900px;height:600px;float:left;" /></div>

<div style="width:900px;float:left;margin-top:-600px;">
<div style="width:778px;height:10px;float:left;background-color:#FFF;padding:15px 15px 15px 110px;">
<div style="font-family:calibri;font-size:8px;letter-spacing:2px;color:#333;text-transform:uppercase;line-height:10px;"><strong>update/status: Lorem ipsum dolor sit amet</strong></div>

<div style="font-family:calibri;font-size:8px;letter-spacing:2px;color:#333;text-align:right;text-transform:uppercase;line-height:10px;margin-top:-10px;"><strong>✕</strong></div>
</div>

<div style="width:903px;height:561px;float:left;overflow:hidden;">
<div style="width:917px;height:561px;float:left;overflow:auto;">
<div style="width:900px;float:left;">
<div style="width:700px;height:560px;padding:100px;float:left;">
<p style="text-align:center;"><img alt="MzO6AZh.png" src="http://i.imgur.com/MzO6AZh.png" style="height:79px;width:260px;margin-top:120px;" /></p>

<div style="font-family:calibri;font-size:8px;letter-spacing:2px;color:#DE4848;text-transform:uppercase;line-height:10px;margin-top:-30px;margin-left:350px;"><strong>Lorem ipsum</strong></div>
</div>

<div style="width:900px;height:560px;float:left;border-top:1px solid #EEE;">
<div style="width:900px;height:149px;background-color:#FFF;opacity:.5;float:left;">&nbsp;</div>

<div style="width:900px;height:149px;opacity:.99;float:left;margin-top:-150px;">
<p style="text-align:center;"><img alt="MzO6AZh.png" src="http://i.imgur.com/MzO6AZh.png" style="height:55px;margin-top:50px;" /></p>

<div style="font-family:calibri;font-size:6px;letter-spacing:2px;color:#DE4848;text-transform:uppercase;line-height:10px;margin-top:-25px;margin-left:450px;"><strong>Lorem ipsum</strong></div>
</div>

<div style="width:900px;height:410px;float:left;opacity:.99;">
<div style="width:750px;height:409px;background-color:#F9F9F9;float:left;border-top:1px solid #EEE;padding:0px 75px;">
<div style="width:200px;height:410px;float:left;">
<div style="width:200px;margin-top:-50px;float:left;">
<div style="width:68px;height:68px;float:left;background-color:#FFF;border:1px solid #EEE;padding:15px;margin-right:10px;"><img alt="" src="http://i.imgur.com/YTwxB4j.png" style="width:68px;height:68px;float:left;" /></div>

<div style="height:10px;padding:5px 8px;float:left;background-color:#DE4848;margin-top:40px;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>Username</strong></div>
</div>

<div style="height:10px;padding:5px 8px;float:left;background-color:#DE4848;margin-top:4px;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>exp: 00 years</strong></div>
</div>
</div>

<div style="width:168px;float:left;background-color:#FFF;border:1px solid #EEE;padding:15px;margin-top:20px;">
<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:10px;text-transform:uppercase;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.</p>
</div>
</div>

<div style="width:178px;padding:10px;float:left;border:1px solid #EEE;margin-top:20px;background-color:#FFF;">
<div style="width:168px;padding:0px 5px 8px;border-bottom:1px solid #EEE;float:left;">
<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>Home</strong></div>
</div>

<div style="width:168px;padding:8px 5px;border-bottom:1px solid #EEE;float:left;">
<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong><a href="https://url" style="color:#333;">Archive</a></strong></div>
</div>

<div style="width:168px;padding:8px 5px;border-bottom:1px solid #EEE;float:left;">
<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong><a href="https://url" style="color:#333;">Portfolio</a></strong></div>
</div>

<div style="width:168px;padding:8px 5px 0px;float:left;">
<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong><a href="https://url" style="color:#333;">Link</a></strong></div>
</div>
</div>
</div>

<div style="width:350px;height:410px;float:left;overflow:hidden;">
<div style="width:370px;height:410px;float:left;overflow:auto;">
<div style="width:310px;float:left;overflow:hidden;padding:20px;">
<div style="width:268px;float:left;background-color:#FFF;border:1px solid #EEE;padding:20px;">
<div style="float:left;margin-left:-30px;margin-right:15px;">
<div style="height:10px;padding:10px 15px;float:left;background-color:#DE4848;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>the Rules</strong></div>
</div>

<div style="width:15px;float:left;">
<div style="width:0;height:0;border-top:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>

<div style="width:0;height:0;border-bottom:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>
</div>
</div>

<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:10px;text-transform:uppercase;">
<p><span style="color:#DE4848;"><em><strong>01.</strong> Lorem ipsum dolor sit amet, consectetuer adipiscing elit..</em></span> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>

<p><span style="color:#DE4848;"><em><strong>02.</strong> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</em></span> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>

<p><span style="color:#DE4848;"><em><strong>03.</strong> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</em></span>&nbsp;Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec.</p>

<p><span style="color:#DE4848;"><em><strong>04.</strong> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</em></span> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>

<p><span style="color:#DE4848;"><em><strong>05.</strong> Lorem ipsum dolor sit amet.</em></span> Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>
</div>
</div>

<div style="width:268px;float:left;background-color:#FFF;border:1px solid #EEE;padding:20px;margin-top:20px;">
<div style="float:left;margin-left:-30px;margin-right:15px;">
<div style="height:10px;padding:10px 15px;float:left;background-color:#DE4848;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>requests</strong></div>
</div>

<div style="width:15px;float:left;">
<div style="width:0;height:0;border-top:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>

<div style="width:0;height:0;border-bottom:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>
</div>
</div>

<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:10px;text-transform:uppercase;">
<p style="color:#de4848;"><b><i>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</i></b> Aenean commodo ligula eget dolor.</p>

<p><span style="color:#DE4848;"><strong><em>01: username</em></strong><em>.</em></span>&nbsp;type / status<br />
<span style="color:#DE4848;"><strong><em>02: username</em></strong><em>.</em></span>&nbsp;type / status<br />
<span style="color:#DE4848;"><strong><em>03: username</em></strong><em>.</em></span>&nbsp;type / status<br />
<span style="color:#DE4848;"><strong><em>04: username</em></strong><em>.</em></span>&nbsp;type / status<br />
<span style="color:#DE4848;"><strong><em>05: username</em></strong><em>.</em></span>&nbsp;type / status<br />
<span style="color:#DE4848;"><strong><em>06: username</em></strong><em>.</em></span>&nbsp;type / status</p>
</div>
</div>

<div style="width:268px;float:left;background-color:#FFF;border:1px solid #EEE;padding:20px;margin-top:20px;">
<div style="float:left;margin-left:-30px;margin-right:15px;margin-bottom:10px;">
<div style="height:10px;padding:10px 15px;float:left;background-color:#DE4848;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>also visit</strong></div>
</div>

<div style="width:15px;float:left;">
<div style="width:0;height:0;border-top:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>

<div style="width:0;height:0;border-bottom:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>
</div>
</div>

<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:10px;text-transform:uppercase;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>
</div>
</div>

<div style="width:268px;float:left;background-color:#FFF;border:1px solid #EEE;padding:20px;margin-top:20px;">
<div style="float:left;margin-left:-30px;margin-right:15px;">
<div style="height:10px;padding:10px 15px;float:left;background-color:#DE4848;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>q &amp; a</strong></div>
</div>

<div style="width:15px;float:left;">
<div style="width:0;height:0;border-top:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>

<div style="width:0;height:0;border-bottom:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>
</div>
</div>

<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:10px;text-transform:uppercase;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>
</div>
</div>
</div>
</div>
</div>

<div style="width:200px;height:410px;float:left;">
<div style="width:168px;float:left;background-color:#FFF;border:1px solid #EEE;margin-top:-50px;padding:15px;">
<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:10px;text-transform:uppercase;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis.</p>
</div>
</div>

<div style="width:168px;float:left;background-color:#FFF;border:1px solid #EEE;margin-top:15px;padding:15px;">
<div style="float:left;margin-left:-25px;margin-right:25px;">
<div style="height:10px;padding:10px 15px;float:left;background-color:#DE4848;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>Heading: lorem ipsum!</strong></div>
</div>

<div style="width:15px;float:left;">
<div style="width:0;height:0;border-top:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>

<div style="width:0;height:0;border-bottom:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>
</div>
</div>

<div style="width:168px;float:left;">
<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:10px;text-transform:uppercase;margin-top:10px;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>

<div style="float:right;margin-right:-20px;margin-top:10px;">
<div style="width:11px;float:left;">
<div style="width:0;height:0;border-top:11px solid #DE4848;border-left:11px solid transparent;float:left;">&nbsp;</div>

<div style="width:0;height:0;border-bottom:11px solid #DE4848;border-left:11px solid transparent;float:left;">&nbsp;</div>
</div>

<div style="height:10px;padding:6px 8px;float:left;background-color:#DE4848;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong><a href="https://www.asianfanfics.com/story/view/1198939/shangri-la-a-creative-coding-agency-please-welcome-our-team-roleplay-tutorial-layouts-gallery-layout-layoutgallery" style="color:#FFF;">Check out</a></strong></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<div style="width:70px;float:left;margin:-601px 0px 0px 20px;opacity:.99;">
<div style="width:40px;background-color:#DE4848;float:left;padding:50px 15px 15px 15px;">
<div style="font-family:calibri;font-size:8px;letter-spacing:1px;color:#FFF;text-transform:uppercase;line-height:10px;"><strong>Hello,<br />
!</strong></div>
</div>

<div style="width:0;height:0;border-top:30px solid #DE4848;border-right:35px solid transparent;float:left;">&nbsp;</div>

<div style="width:0;height:0;border-top:30px solid #DE4848;border-left:35px solid transparent;float:left;">&nbsp;</div>
</div>
</div>
</div>

<div style="width:100%;margin-top:10px;float:left;">
<div style="font-family:calibri;font-size:8px;color:#999;text-align:center;letter-spacing:1px;text-transform:uppercase;line-height:10px;"><a href="https://www.asianfanfics.com/story/view/912018" style="color:#999;"><strong>Delightful 2017 : Layout coded by lisett</strong></a></div>
</div>
</div>

re: winter - note

<div style="width:310px;margin:100px auto;">
<div style="width:268px;float:left;background-color:#FFF;border:1px solid #EEE;padding:20px;">
<div style="float:left;margin-left:-30px;margin-right:15px;">
<div style="height:10px;padding:10px 15px;float:left;background-color:#DE4848;">
<div style="font-family:calibri;font-size:8px;color:#FFF;text-align:left;letter-spacing:1px;line-height:8px;text-transform:uppercase;"><strong>Heading: lorem ipsum!</strong></div>
</div>

<div style="width:15px;float:left;">
<div style="width:0;height:0;border-top:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>

<div style="width:0;height:0;border-bottom:15px solid #DE4848;border-right:15px solid transparent;float:left;">&nbsp;</div>
</div>
</div>

<div style="width:268px;float:left;margin-top:10px;">
<div style="font-family:calibri;font-size:8px;color:#333;text-align:left;letter-spacing:1px;line-height:10px;text-transform:uppercase;">
<p><strong>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</strong></p>

<p><strong>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.</strong></p>

<p style="text-align:right;"><b>&mdash; Username</b></p>
</div>
</div>
</div>
</div>