Skip to content

Instantly share code, notes, and snippets.

@pinkwhales
Created June 3, 2017 20:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pinkwhales/76c5213af912f7295d13a425cadfff8d to your computer and use it in GitHub Desktop.
Save pinkwhales/76c5213af912f7295d13a425cadfff8d to your computer and use it in GitHub Desktop.
AMBIENCE
<div style="width:963px;border:1px solid #e2e2e2;margin:0px 0px 0px -16px;font-family:verdana;font-size:5.5px;color:#000;text-align:justify;text-transform:uppercase;letter-spacing:1px;line-height:9px;">
<div style="width:963px;height:300px;background-color:#e5f6ff;">&nbsp;</div>
<div style="width:963px;height:300px;margin:-300px 0px 0px 0px;overflow:hidden;">
<div style="margin-top:105px;height:10px;font-family:Helvetica;letter-spacing:2px;font-size:50px;text-align:center;line-height:52px;"><b><i>Ambience</i></b></div>
<div style="margin:-10px 0px 0px 3px;height:10px;color:#fff;font-family:Helvetica;letter-spacing:2px;font-size:50px;text-align:center;line-height:52px;"><b><i>Ambience</i></b></div>
<div style="margin-top:38px;text-align:center;letter-spacing:2px;">a particular environment or surrounding influence</div>
</div>
<div style="width:893px;height:10px;background-color:#fff;padding:35px;font-family:futura;font-size:10px;line-height:12px;text-align:center;"><a href="http://link.com" rel="nofollow" style="color:#000000;"><span style="padding:0px 20px 0px 20px;">request form</span></a> <a href="http://link" rel="nofollow" style="color:#000000;"><span style="padding:0px 20px 0px 20px;">staff form</span></a> <a href="http://link" rel="nofollow" style="color:#000000;"><span style="padding:0px 20px 0px 20px;">archive</span></a> <a href="http://link" rel="nofollow" style="color:#000000;"><span style="padding:0px 20px 0px 20px;">tumblr</span></a> <a href="http://link" rel="nofollow" style="color:#000000;"><span style="padding:0px 20px 0px 20px;">ask.fm</span></a></div>
<div style="width:913px;height:350px;padding:25px;background-color:#e5f6ff;">
<div style="width:250px;height:350px;">
<div style="text-align:center;font-family:futura;font-size:20px;background-color:#fff;padding:20px;line-height:26px;">currently open &amp; accepting!</div>
<div style="margin-top:20px;">
<div>welcome to ambience! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse euismod purus sit amet risus bibendum, ac venenatis justo tincidunt. Morbi libero nunc, commodo quis lacus a, sollicitudin mollis lectus. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.&nbsp;</div>
</div>
<div style="margin-top:10px;border-bottom:1px dotted #000;padding:3px;">established : 01 june 2017</div>
<div style="border-bottom:1px dotted #000;padding:3px;">00 requests at the moment</div>
<div style="border-bottom:1px dotted #000;padding:3px;">we are currently hiring staff!</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div><strong>update (00/00)</strong> : NULLAM ET LEO ODIO. PRAESENT SOLLICITUDIN URNA IN ELIT SEMPER, SIT AMET FEUGIAT AUGUE VESTIBULUM. SED PHARETRA SOLLICITUDIN ENIM, AT ULTRICES AUGUE MATTIS HENDRERIT. IN VIVERRA, ARCU NEC GRAVIDA CONSECTETUR, METUS DOLOR PLACERAT AUGUE, EGET PLACERAT ERAT NISL UT DOLOR.</div>
</div>
<div style="width:368px;height:318px;padding:15px;margin:-350px 0px 0px 270px;border:1px solid #000;">
<div style="height:25px;text-align:center;font-family:futura;font-size:14px;line-height:16px;">guidelines &amp; tips to success!</div>
<div style="width:368px;height:293px;overflow:hidden;">
<div style="width:385px;height:293px;overflow:auto;">
<div style="width:368px;">
<div><strong>one : Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong></div>
<div>Suspendisse euismod purus sit amet risus bibendum, ac venenatis justo tincidunt. Morbi libero nunc, commodo quis lacus a, sollicitudin mollis lectus. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div>&nbsp;</div>
<div>
<div><strong>two : Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong></div>
<div>Suspendisse euismod purus sit amet risus bibendum, ac venenatis justo tincidunt. Morbi libero nunc, commodo quis lacus a, sollicitudin mollis lectus. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div>&nbsp;</div>
<div>
<div><strong>three : Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong></div>
<div>Suspendisse euismod purus sit amet risus bibendum, ac venenatis justo tincidunt. Morbi libero nunc, commodo quis lacus a, sollicitudin mollis lectus. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div>&nbsp;</div>
<div>
<div><strong>four : Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong></div>
<div>Suspendisse euismod purus sit amet risus bibendum, ac venenatis justo tincidunt. Morbi libero nunc, commodo quis lacus a, sollicitudin mollis lectus. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div>&nbsp;</div>
<div>
<div><strong>five : Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong></div>
<div>Suspendisse euismod purus sit amet risus bibendum, ac venenatis justo tincidunt. Morbi libero nunc, commodo quis lacus a, sollicitudin mollis lectus. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div>&nbsp;</div>
<div>
<div><strong>six : Lorem ipsum dolor sit amet, consectetur adipiscing elit. </strong></div>
<div>Suspendisse euismod purus sit amet risus bibendum, ac venenatis justo tincidunt. Morbi libero nunc, commodo quis lacus a, sollicitudin mollis lectus. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="width:220px;height:350px;margin:-350px 0px 0px 690px;">
<div style="height:25px;text-align:center;font-family:futura;font-size:14px;line-height:16px;">meet our team!</div>
<div style="width:220px;height:325px;overflow:hidden;">
<div style="width:237px;height:325px;overflow:auto;">
<div style="width:226px;">
<div><img alt="" src="https://68.media.tumblr.com/f91ebd8617b81b909a171ca3c20dbf60/tumblr_nwcn2hqfF21ucc5t5o1_250.jpg" style="width:60px;height:60px;border-radius:100%;float:left;" /></div>
<div style="margin:5px 0px 0px 10px;padding:0px 0px 0px 10px;overflow:hidden;">
<div><strong>name</strong> : pinkwhale</div>
<div><strong>status</strong> : open &amp; available</div>
<div><strong>experience</strong> : 1 year</div>
<div><strong>About</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
</div>
<div>&nbsp;</div>
<div style="clear:left;"><img alt="" src="https://68.media.tumblr.com/f91ebd8617b81b909a171ca3c20dbf60/tumblr_nwcn2hqfF21ucc5t5o1_250.jpg" style="width:60px;height:60px;border-radius:100%;float:left;" /></div>
<div style="margin:5px 0px 0px 10px;padding:0px 0px 0px 10px;overflow:hidden;">
<div><strong>name</strong> : name</div>
<div><strong>status</strong> : open &amp; available</div>
<div><strong>experience</strong> : 123 years</div>
<div><strong>About</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
</div>
<div>&nbsp;</div>
<div><img alt="" src="https://68.media.tumblr.com/f91ebd8617b81b909a171ca3c20dbf60/tumblr_nwcn2hqfF21ucc5t5o1_250.jpg" style="width:60px;height:60px;border-radius:100%;float:left;" /></div>
<div style="margin:5px 0px 0px 10px;padding:0px 0px 0px 10px;overflow:hidden;">
<div><strong>name</strong> : pinkwhale</div>
<div><strong>status</strong> : open &amp; available</div>
<div><strong>experience</strong> : 1 year</div>
<div><strong>About</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
</div>
<div>&nbsp;</div>
<div style="clear:left;"><img alt="" src="https://68.media.tumblr.com/f91ebd8617b81b909a171ca3c20dbf60/tumblr_nwcn2hqfF21ucc5t5o1_250.jpg" style="width:60px;height:60px;border-radius:100%;float:left;" /></div>
<div style="margin:5px 0px 0px 10px;padding:0px 0px 0px 10px;overflow:hidden;">
<div><strong>name</strong> : name</div>
<div><strong>status</strong> : open &amp; available</div>
<div><strong>experience</strong> : 123 years</div>
<div><strong>About</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="width:912px;height:300px;padding:25px;background-color:#fff;">
<div style="width:600px;height:300px;">
<div style="height:25px;text-align:center;font-family:futura;font-size:14px;line-height:16px;">sample graphics</div>
<div style="width:600px;height:275px;overflow:hidden;">
<div style="width:617px;height:275px;overflow:auto;">
<div style="width:600px;text-align:center;">
<div><img alt="" src="https://i.imgur.com/RD69v9m.jpg?1" style="height:200px;width:143px;" /><img alt="" src="http://i.imgur.com/h4pjRhn.png?1" style="height:200px;width:143px;" /><img alt="" src="https://i.imgur.com/RD69v9m.jpg?1" style="width:143px;height:200px;" /><img alt="" src="http://i.imgur.com/h4pjRhn.png?1" style="height:200px;width:143px;" /></div>
<div><img alt="" src="http://i.imgur.com/h4pjRhn.png?1" style="height:200px;width:143px;" /><img alt="" src="https://i.imgur.com/RD69v9m.jpg?1" style="width:143px;height:200px;" /><img alt="" src="http://i.imgur.com/h4pjRhn.png?1" style="height:200px;width:143px;" /><img alt="" src="https://i.imgur.com/RD69v9m.jpg?1" style="width:143px;height:200px;" /></div>
</div>
</div>
</div>
</div>
<div style="width:300px;height:300px;margin:-300px 0px 0px 615px;text-align:center;">
<div style="text-align:center;font-family:futura;font-size:14px;line-height:16px;">support banner</div>
<div>&nbsp;</div>
<div><img alt="" src="https://i.imgur.com/RD69v9m.jpg?1" style="width:200px;height:75px;" /></div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div style="text-align:center;font-family:futura;font-size:14px;line-height:16px;">featured story</div>
<div>&nbsp;</div>
<div><img alt="" src="https://i.imgur.com/RD69v9m.jpg?1" style="width:107px;height:150px;" /></div>
</div>
</div>
<div style="width:913px;height:350px;padding:25px;background-color:#e5f6ff;">
<div style="width:416px;height:310px;padding:20px;">
<div style="height:25px;text-align:center;font-family:futura;font-size:16px;line-height:18px;">requestors</div>
<div style="width:416px;height:285px;overflow:hidden;">
<div style="width:433px;height:285px;overflow:auto;">
<div style="width:416px;">
<div style="margin-top:2px;font-size:6px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span> <strong>Designer : pinkwhale</strong></div>
<div style="margin-top:3px;"><strong>status</strong> : 50 % complete</div>
<div><strong>notes</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div>
<div style="margin-top:2px;font-size:6px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span> <strong>Designer : pinkwhale</strong></div>
<div style="margin-top:3px;"><strong>status</strong> : 50 % complete</div>
<div><strong>notes</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div>
<div style="margin-top:2px;font-size:6px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span> <strong>Designer : pinkwhale</strong></div>
<div style="margin-top:3px;"><strong>status</strong> : 50 % complete</div>
<div><strong>notes</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div>
<div style="margin-top:2px;font-size:6px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span> <strong>Designer : pinkwhale</strong></div>
<div style="margin-top:3px;"><strong>status</strong> : 50 % complete</div>
<div><strong>notes</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div>
<div style="margin-top:2px;font-size:6px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span> <strong>Designer : pinkwhale</strong></div>
<div style="margin-top:3px;"><strong>status</strong> : 50 % complete</div>
<div><strong>notes</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div>
<div style="margin-top:2px;font-size:6px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span> <strong>Designer : pinkwhale</strong></div>
<div style="margin-top:3px;"><strong>status</strong> : 50 % complete</div>
<div><strong>notes</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique.</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="width:416px;height:310px;padding:20px;margin:-350px 0px 0px 456px;">
<div style="height:25px;text-align:center;font-family:futura;font-size:16px;line-height:18px;">blacklist</div>
<div style="width:416px;height:285px;overflow:hidden;">
<div style="width:433px;height:285px;overflow:auto;">
<div style="width:416px;">
<div style="margin-top:2px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span>&nbsp;</div>
<div style="margin-top:3px;"><strong>reason</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div style="margin-top:3px;">&nbsp;</div>
<div style="margin-top:3px;">
<div style="margin-top:2px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span>&nbsp;</div>
<div style="margin-top:3px;"><strong>reason</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div style="margin-top:3px;">&nbsp;</div>
<div style="margin-top:3px;">
<div style="margin-top:2px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span>&nbsp;</div>
<div style="margin-top:3px;"><strong>reason</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div style="margin-top:3px;">&nbsp;</div>
<div style="margin-top:3px;">
<div style="margin-top:2px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span>&nbsp;</div>
<div style="margin-top:3px;"><strong>reason</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div style="margin-top:3px;">&nbsp;</div>
<div style="margin-top:3px;">
<div style="margin-top:2px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span>&nbsp;</div>
<div style="margin-top:3px;"><strong>reason</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
<div style="margin-top:3px;">&nbsp;</div>
<div style="margin-top:3px;">
<div style="margin-top:2px;"><span style="font-family:futura;font-size:10px;background-color:#fff;padding:3px 7px 3px 7px;line-height:14px;">username</span>&nbsp;</div>
<div style="margin-top:3px;"><strong>reason</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pharetra nec lectus sit amet lacinia. In accumsan laoreet suscipit. Nam molestie ultrices ligula eu tristique. In et lorem at mi blandit placerat. Duis varius dapibus justo a viverra. Suspendisse sapien tellus, consequat sed malesuada ac, iaculis non mi.</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="width:913px;height:10px;background-color:#fff;padding:25px;text-align:center;"><a href="http://www.asianfanfics.com/story/view/1215378/" style="color:#000000;">layout provided by delineate</a></div>
</div>
<div style="width:903px;padding:30px;border:1px solid #e2e2e2;margin:0px 0px 0px -16px;font-family:verdana;font-size:5.5px;color:#000;text-align:justify;text-transform:uppercase;letter-spacing:1px;line-height:9px;background-color:#fff;">
<div style="width:430px;float:left;overflow:hidden;">
<div style="margin-top:10px;height:10px;font-family:Helvetica;letter-spacing:2px;font-size:30px;text-align:center;line-height:32px;"><b><i>story title</i></b></div>
<div style="margin:-10px 0px 0px 3px;height:10px;color:#e5f6ff;font-family:Helvetica;letter-spacing:2px;font-size:30px;text-align:center;line-height:32px;"><b><i>story title</i></b></div>
<div style="margin-top:20px;">
<div style="text-align:center;"><strong>requested by pinkwhale</strong></div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div><strong>designer</strong> : pinkwhale</div>
<div><strong>posted</strong> : june 33 2017</div>
<div><strong>notes</strong> : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sit amet ullamcorper justo, nec lobortis massa. Fusce sed sapien neque. Mauris vehicula, ipsum ac placerat varius, eros ex tempor nisi, in interdum lectus metus nec est. Vivamus quis auctor nunc. Aliquam malesuada est eget diam bibendum ornare. Nunc eleifend urna in odio pretium, suscipit elementum libero pharetra. Morbi gravida sapien in nisi ullamcorper sollicitudin. Mauris nulla est, dictum id cursus et, lobortis a eros. Integer posuere eros vel risus placerat sagittis.</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div style="width:70%;margin-left:15%;padding:5px;background-color:#e5f6ff;text-align:center;"><strong>main poster</strong></div>
<div style="margin-top:5px;width:70%;margin-left:15%;padding:5px;background-color:#e5f6ff;text-align:center;"><strong>banner</strong></div>
<div style="margin-top:5px;width:70%;margin-left:15%;padding:5px;background-color:#e5f6ff;text-align:center;"><strong>background</strong></div>
<div style="margin-top:5px;width:70%;margin-left:15%;padding:5px;background-color:#e5f6ff;text-align:center;"><strong>trailer</strong></div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div style="text-align:center;font-family:futura;font-size:11px;line-height:13px;">support us!</div>
<div>&nbsp;</div>
<div style="text-align:center;"><img alt="" src="https://i.imgur.com/RD69v9m.jpg?1" style="width:200px;height:75px;" /></div>
<div>&nbsp;</div>
<div style="text-align:center;"><a href="http://www.asianfanfics.com/story/view/1215378/" style="color:#000000;">layout provided by delineate</a></div>
</div>
</div>
<div style="width:450px;margin:0px 0px 0px 10px;padding:0px 0px 0px 20px;overflow:hidden;"><img alt="" src="https://i.imgur.com/RD69v9m.jpg" style="width:400px;height:560px;border:15px solid #e5f6ff;padding:10px;" /></div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment