[codes] Tables
#1
[html]<h3>Usage Rules</h3>
<ul><li>Please only use my table codes that are posted here. Other tables you see me posting are likely my own personal ones, that i would strongly prefer aren't used as templates.</li>
<li>If using all or parts of one of my templates, please credit/leave the credit in place, so that others may find these templates more easily!</li></ul>

<hr><br>

<div class="Temp1"> <div class="Temp1-name">Character Name</div> <div class="Temp1-in">

<div class="ooc">➧➧ Out of Character text</div>

<div class="Temp1-notes" style="float:right;">
⟿ Word Count: <b>[242]</b> <BR>
⟿ Date: <b>21st Sep</b> <BR>
⟿ Time: <b>1pm</b> <BR>
⟿ Form: <b>Optime</b></div>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tincidunt nunc. Maecenas nec convallis ipsum. Aliquam at purus convallis, scelerisque urna a, congue sapien. Nam elementum mauris felis, non accumsan tortor pharetra vel. Vestibulum fringilla volutpat odio, non rhoncus erat aliquam sed. Fusce scelerisque molestie nisl, non rutrum ante congue vel. Etiam scelerisque turpis vel turpis porta, ut facilisis nunc commodo. Fusce vel ex fermentum, lobortis nibh in, congue neque. Donec quis molestie elit. Nunc aliquet finibus tristique. Morbi nec orci a tortor egestas egestas ut ac ex. Ut vehicula, augue non venenatis auctor, velit arcu eleifend massa, id vulputate mauris nunc a dolor. Phasellus tincidunt eu velit varius elementum.</p>

<p><b>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</b> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

</div>
<div class="Temp1-lyrics">Now some saint got the job of writing down my sins</div></div>

<p class="Kcredit">Template by <a href="http://www.soulsrpg.com/forum/viewtopic.php?f=37&t=16460">Kitty</a>, image by Ales Krivec.</p>

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Cinzel|Cinzel+Decorative|Roboto+Slab');

.Temp1 {width:580px; background: #1d1216 url("https://image.ibb.co/bTdPTa/Temp1.png") no-repeat top center; padding:200px 20px 10px 20px; margin:0px auto; text-align:justify; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; color:#000; outline:1px solid #000; border:2px solid #9ea8a9;}
.Temp1 b {color:#394651;}
.Temp1 p {text-indent:50px; font:13px 'Roboto Slab', serif;}
.Temp1-in {padding:10px 20px 10px 20px; margin:0px auto; background-color:rgba(255, 255, 255, 0.7); border:2px solid #9ea8a9;}
.Temp1-name {font: 60px/55px 'Cinzel Decorative', cursive; color:#e4f0f1; text-align:center; text-shadow: 2px 2px 2px rgba(16, 9, 10, 1);}
.Temp1-lyrics {font: 18px/16px 'Cinzel', cursive; color:#e4f0f1; letter-spacing:1px; text-align:center; text-shadow: 2px 2px 2px rgba(16, 9, 10, 1); padding-top:10px;}
.Temp1-notes {text-align:left; width:100px; padding:10px; float:right; margin:12px; background-color:rgba(255, 255, 255, 0.3); font-size:10px; border:2px solid#848d91; -webkit-border-radius: 25px;-moz-border-radius: 25px;border-radius: 25px;}
.Temp1 .ooc {opacity:0.7; text-indent:0px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.Temp1.ooc + p {padding:0px 5px;}
p.Kcredit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;}
.notice {display:none;}</style>
[/html]


Code:
[html]<div class="Temp1"> <div class="Temp1-name">Character Name</div> <div class="Temp1-in">  

<div class="ooc">➧➧  Out of Character text</div>

<div class="Temp1-notes" style="float:right;">
⟿ Word Count: <b>[242]</b> <BR>
⟿ Date: <b>21st Sep</b> <BR>
⟿ Time: <b>1pm</b> <BR>
⟿ Form: <b>Optime</b></div>

<p>POST. <B>"Speech"</b>. <i>Thinking</i>.</p>

</div>
<div class="Temp1-lyrics">Now some saint got the job of writing down my sins</div></div>

<p class="Kcredit">Template by <a href="http://www.soulsrpg.com/forum/viewtopic.php?f=37&t=16460">Kitty</a>, image by Nitish Meena.</p>

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Cinzel|Cinzel+Decorative|Roboto+Slab');

.Temp1 {width:580px; background: #1d1216 url("https://image.ibb.co/bTdPTa/Temp1.png") no-repeat top center;  padding:200px 20px 10px 20px; margin:0px auto; text-align:justify; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; color:#000; outline:1px solid #000; border:2px solid #9ea8a9;}
.Temp1 b {color:#394651;}
.Temp1 p {text-indent:50px; font:13px 'Roboto Slab', serif;}
.Temp1-in {padding:10px 20px 10px 20px; margin:0px auto; background-color:rgba(255, 255, 255, 0.7); border:2px solid #9ea8a9;}
.Temp1-name {font: 60px/55px 'Cinzel Decorative', cursive; color:#e4f0f1; text-align:center; text-shadow: 2px 2px 2px rgba(16, 9, 10, 1);}
.Temp1-lyrics {font: 18px/16px 'Cinzel', cursive; color:#e4f0f1; letter-spacing:1px; text-align:center; text-shadow: 2px 2px 2px rgba(16, 9, 10, 1); padding-top:10px;}
.Temp1-notes {text-align:left; width:100px; padding:10px; float:right; margin:12px; background-color:rgba(255, 255, 255, 0.3); font-size:10px; border:2px solid#848d91; -webkit-border-radius: 25px;-moz-border-radius: 25px;border-radius: 25px;}
.Temp1 .ooc {opacity:0.7; text-indent:0px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.Temp1.ooc + p {padding:0px 5px;}
p.Kcredit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;}
.notice {display:none;}</style>[/html]

[html]<hr><br>

<table cellpadding="0" cellspacing="0" class="Temp2">
<tr>
<td class="Temp2top" colspan="4">
<div class="Temp2name">Character Name
<div class="Temp2lyrics">With the lights out, it's less dangerous</div></div>
</td>
</tr>
<tr>
<td class="Temp2post" colspan="4">

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In eu sem sagittis, commodo sapien quis, consectetur odio. Maecenas sapien enim, iaculis eget dui hendrerit, malesuada rutrum augue. Quisque pulvinar vitae purus id tincidunt. Etiam ullamcorper pulvinar sem. Vestibulum luctus eros in est molestie, vel accumsan augue scelerisque. Morbi faucibus est magna, pretium pulvinar massa ultricies in. Aenean blandit libero neque, tempus auctor ex condimentum et. Vivamus quam metus, interdum in risus eget, mattis tincidunt augue. Morbi quam ipsum, volutpat malesuada dolor sit amet, maximus tristique odio. Vivamus auctor non nunc non eleifend. Morbi quam justo, sollicitudin feugiat mauris ut, cursus ullamcorper metus. Curabitur bibendum mattis nulla vitae rhoncus. Nullam semper diam vel pretium vestibulum. Morbi gravida, tellus a faucibus pellentesque, elit velit egestas leo, rhoncus sollicitudin metus nibh et tellus.</p>

<p><b>"Etiam vitae hendrerit lacus. Integer eget justo aliquam, tincidunt tellus eget, rhoncus odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam ac efficitur urna."</b> Morbi neque tellus, lacinia nec tellus pellentesque, finibus scelerisque ligula. Nunc eu elit eget arcu aliquam imperdiet. Etiam nec pellentesque tortor, at mattis nibh. Quisque venenatis lacinia odio, ac egestas dui pellentesque eget. Morbi tristique massa a porttitor euismod. Curabitur cursus facilisis mauris, eget feugiat purus elementum accumsan. Curabitur suscipit dui eget sapien sagittis dictum. Suspendisse potenti. Phasellus ultricies enim purus, eget pretium augue semper a. Sed imperdiet scelerisque odio, quis eleifend ante posuere non. Etiam porta metus vitae diam imperdiet malesuada. Cras ultricies rutrum justo ut iaculis.</p>

</td></tr>
<tr class="Temp2notes">
<td>Word Count: <strong>[000]</strong></td>
<td>Form: <strong>Optime</strong></td>
<td>Date: <strong>DD/MM/YY</strong></td>
<td>Time: <strong>00 AM/PM</strong></td>
</tr>
</table>

<p class="Temp2credit">Table by <a href="http://www.soulsrpg.com/forum/memberlist.php?mode=viewprofile&u=1766">Kitty</a>. Image Credits: <a href="http://lovehardtwihard.deviantart.com/art/Golden-Forest-Texture-Pack-663050954">By Lovehardtwihard</a></p>

<style>
@import url('https://fonts.googleapis.com/css?family=Libre+Baskerville|Poiret+One');

.Temp2 {border-collapse:collapse; width:650px; margin:10px auto; outline:1px solid #000; border:2px solid #4c3828; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; background: #1b1b16 url("https://i.imgbox.com/sQmEMgHx.png") no-repeat top center;}
.Temp2 td {background-color:transparent;}
.Temp2 td p {text-indent:50px; color:#8e8a7e; font-size:13px; vertical-align:top; margin:0px; padding-top:8px;}
.Temp2 td b {color:#bfb287; }
.Temp2 .Temp2top {padding-top:190px; padding-bottom:0px;}
tr.Temp2notes td {width:25%; text-align:center; font-size:10px; color:#000; padding:3px; border:1px solid #000; background-color:#5d5942;}
.Temp2 .Temp2post {background-color:transparent; padding:10px 35px 15px 35px; border:0px;}
.Temp2name {font: 70px/20px 'Poiret One', cursive; color:#bfb287; letter-spacing:4px; text-align:left; text-shadow: 2px 2px 2px rgba(0, 0, 0, 1); border:0px; padding-left:40px;}
.Temp2lyrics {font: 12px/15px 'Libre Baskerville', serif; color:#FFF; letter-spacing:3px; word-spacing:1px; text-align:left; text-shadow:#000 1px 1px 2px; border:0px; padding-top:25px; padding-left:190px;}
p.Temp2credit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;}
</style>[/html]

Code:
[html]<table cellpadding="0" cellspacing="0" class="Temp2">
         <tr>
         <td class="Temp2top" colspan="4">
         <div class="Temp2name">Character Name
         <div class="Temp2lyrics">With the lights out, it's less dangerous</div></div>
         </td>
          </tr>      
<tr>
          <td class="Temp2post" colspan="4">

<p>POST. <B>"Speech"</b>. <i>Thinking</i>.</p>

</td></tr>
          <tr class="Temp2notes">
                      <td>Word Count: <strong>[000]</strong></td>
                      <td>Form:  <strong>Optime</strong></td>
                      <td>Date: <strong>DD/MM/YY</strong></td>
                      <td>Time:  <strong>00 AM/PM</strong></td>
          </tr>
</table>

<p class="Temp2credit">Table by <a href="http://www.soulsrpg.com/forum/memberlist.php?mode=viewprofile&u=1766">Kitty</a>. Image Credits: <a href="http://lovehardtwihard.deviantart.com/art/Golden-Forest-Texture-Pack-663050954">By Lovehardtwihard</a></p>  

<style>
@import url('https://fonts.googleapis.com/css?family=Libre+Baskerville|Poiret+One');

.Temp2 {border-collapse:collapse; width:650px; margin:10px auto; outline:1px solid #000; border:2px solid #4c3828; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; background: #1b1b16 url("https://i.imgbox.com/sQmEMgHx.png") no-repeat top center;}
.Temp2 td {background-color:transparent;}
.Temp2 td p {text-indent:50px;  color:#8e8a7e; font-size:13px; vertical-align:top;  margin:0px; padding-top:8px;}  
.Temp2 td b {color:#bfb287; }  
.Temp2 .Temp2top {padding-top:190px; padding-bottom:0px;}
tr.Temp2notes td {width:25%; text-align:center; font-size:10px; color:#000; padding:3px; border:1px solid #000; background-color:#5d5942;}
.Temp2 .Temp2post {background-color:transparent; padding:10px 35px 15px 35px; border:0px;}
.Temp2name {font: 70px/20px 'Poiret One', cursive; color:#bfb287; letter-spacing:4px; text-align:left; text-shadow: 2px 2px 2px rgba(0, 0, 0, 1); border:0px; padding-left:40px;}
.Temp2lyrics {font: 12px/15px 'Libre Baskerville', serif; color:#FFF; letter-spacing:3px; word-spacing:1px; text-align:left;  text-shadow:#000 1px 1px 2px; border:0px; padding-top:25px; padding-left:190px;}
p.Temp2credit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;}
</style>[/html]

[html]<hr><br>

<div class="Temp3"> <div class="Temp3-name">Character Name</div> <div class="Temp3-in">

<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tincidunt nunc. Maecenas nec convallis ipsum. Aliquam at purus convallis, scelerisque urna a, congue sapien. Nam elementum mauris felis, non accumsan tortor pharetra vel. Vestibulum fringilla volutpat odio, non rhoncus erat aliquam sed. Fusce scelerisque molestie nisl, non rutrum ante congue vel. Etiam scelerisque turpis vel turpis porta, ut facilisis nunc commodo. Fusce vel ex fermentum, lobortis nibh in, congue neque. Donec quis molestie elit. Nunc aliquet finibus tristique. Morbi nec orci a tortor egestas egestas ut ac ex. Ut vehicula, augue non venenatis auctor, velit arcu eleifend massa, id vulputate mauris nunc a dolor. Phasellus tincidunt eu velit varius elementum.</p>

<p><b>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</b> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

</div>
<div class="Temp3-lyrics">Now some saint got the job of writing down my sins</div></div>

<p class="Kcredit">Template by <a href="http://www.soulsrpg.com/forum/viewtopic.php?f=37&t=16460">Kitty</a>, image by Fazel Mehrad.</p>

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|PT+Sans|Roboto+Slab');

.Temp3 {width:580px; background: #ba744e url("https://image.ibb.co/ho1m8a/Temp2.png") no-repeat top center; padding:180px 20px 10px 20px; margin:0px auto; text-align:justify; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; color:#000; outline:1px solid #000; border:2px solid #f3f1dc;}
.Temp3 b {color:#480324;}
.Temp3 p {text-indent:50px; font:13px 'Roboto Slab', serif;}
.Temp3-in {padding:10px 20px 10px 20px; margin:0px auto; background-color:rgba(235, 231, 196, 0.6); border:1px solid#000;}
.Temp3-name {font: 60px/55px 'Open Sans Condensed', sans-serif; color:#f3f1dc; text-align:left; text-shadow: 2px 2px 2px rgba(127, 59, 66, 0.9);}
.Temp3-lyrics {font: small-caps 16px/14px 'PT Sans', sans-serif; color:#f3f1dc; letter-spacing:5px; text-align:center; text-shadow: 2px 2px 2px rgba(127, 59, 66, 0.9); padding-top:7px;}
.Temp3 .ooc {opacity:0.7; text-indent:0px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.Temp3 .ooc + p {padding:0px 5px;}
.Temp3 .wc {text-transform: uppercase; font-weight:bold; color:#480324;}
p.Kcredit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;} </style>
[/html]

Code:
[html]<div class="Temp3"> <div class="Temp3-name">Character Name</div> <div class="Temp3-in">  

<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>

<p>POST. <B>"Speech"</b>. <i>Thinking</i>.</p>    

</div>
<div class="Temp3-lyrics">Now some saint got the job of writing down my sins</div></div>

<p class="Kcredit">Template by <a href="http://www.soulsrpg.com/forum/viewtopic.php?f=37&t=16460">Kitty</a>, image by Fazel Mehrad.</p>

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|PT+Sans|Roboto+Slab');

.Temp3 {width:580px; background: #ba744e url("https://image.ibb.co/ho1m8a/Temp2.png") no-repeat top center;  padding:180px 20px 10px 20px; margin:0px auto; text-align:justify; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; color:#000; outline:1px solid #000; border:2px solid #f3f1dc;}
.Temp3 b {color:#480324;}
.Temp3 p {text-indent:50px; font:13px 'Roboto Slab', serif;}
.Temp3-in {padding:10px 20px 10px 20px; margin:0px auto; background-color:rgba(235, 231, 196, 0.6); border:1px solid#000;}
.Temp3-name {font: 60px/55px 'Open Sans Condensed', sans-serif; color:#f3f1dc; text-align:left; text-shadow: 2px 2px 2px rgba(127, 59, 66, 0.9);}
.Temp3-lyrics {font: small-caps 16px/14px 'PT Sans', sans-serif; color:#f3f1dc; letter-spacing:5px; text-align:center; text-shadow: 2px 2px 2px rgba(127, 59, 66, 0.9); padding-top:7px;}
.Temp3 .ooc {opacity:0.7; text-indent:0px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.Temp3 .ooc + p {padding:0px 5px;}
.Temp3 .wc {text-transform: uppercase; font-weight:bold; color:#480324;}
p.Kcredit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;} </style>
[/html]

[html]<hr><br>

<div class="Temp4"> <div class="Temp4-name">Character Name</div> <div class="Temp4-in">

<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tincidunt nunc. Maecenas nec convallis ipsum. Aliquam at purus convallis, scelerisque urna a, congue sapien. Nam elementum mauris felis, non accumsan tortor pharetra vel. Vestibulum fringilla volutpat odio, non rhoncus erat aliquam sed. Fusce scelerisque molestie nisl, non rutrum ante congue vel. Etiam scelerisque turpis vel turpis porta, ut facilisis nunc commodo. Fusce vel ex fermentum, lobortis nibh in, congue neque. Donec quis molestie elit. Nunc aliquet finibus tristique. Morbi nec orci a tortor egestas egestas ut ac ex. Ut vehicula, augue non venenatis auctor, velit arcu eleifend massa, id vulputate mauris nunc a dolor. Phasellus tincidunt eu velit varius elementum.</p>

<p><b>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</b> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

</div>
<div class="Temp4-lyrics">Now some saint got the job of writing down my sins</div></div>

<p class="Kcredit">Template by <a href="http://www.soulsrpg.com/forum/viewtopic.php?f=37&t=16460">Kitty</a>, image by Ales Krivec.</p>

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|PT+Sans|Roboto+Slab');

.Temp4 {width:580px; background: #968c8d url("https://image.ibb.co/nnNOMv/Temp4.png") no-repeat top center; padding:180px 20px 10px 20px; margin:0px auto; text-align:justify; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; color:#e1e3ec; outline:1px solid #000; border:2px solid #f3f1dc;}
.Temp4 b {color:#9cc2f2;}
.Temp4 p {text-indent:50px; font:13px 'Roboto Slab', serif;}
.Temp4-in {padding:10px 20px 10px 20px; margin:0px auto; background-color:rgba(44, 57, 75, 0.9); border:1px dotted #e1e3ec;}
.Temp4-name {font: 60px/55px 'Open Sans Condensed', sans-serif; color:#f3f1dc; text-align:left; text-shadow: 2px 2px 2px rgba(44, 57, 75, 0.9);}
.Temp4-lyrics {font: small-caps 16px/14px 'PT Sans', sans-serif; color:#f3f1dc; letter-spacing:5px; text-align:center; text-shadow: 2px 2px 2px rgba(44, 57, 75, 0.9); padding-top:7px;}
.Temp4 .ooc {opacity:0.7; text-indent:0px; padding:0px; border-bottom:2px dashed #e1e3ec; margin-bottom:10px;}
.Temp4 .ooc + p {padding:0px 5px;}
.Temp4 .wc {text-transform: uppercase; font-weight:bold; color:#9cc2f2;}
p.Kcredit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;} </style>
[/html]

Code:
[html]<div class="Temp4"> <div class="Temp4-name">Character Name</div> <div class="Temp4-in">  

<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>

<p>POST. <B>"Speech"</b>. <i>Thinking</i>.</p>      

</div>
<div class="Temp4-lyrics">Now some saint got the job of writing down my sins</div></div>

<p class="Kcredit">Template by <a href="http://www.soulsrpg.com/forum/viewtopic.php?f=37&t=16460">Kitty</a>, image by Ales Krivec.</p>

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|PT+Sans|Roboto+Slab');

.Temp4 {width:580px; background: #968c8d url("https://image.ibb.co/nnNOMv/Temp4.png") no-repeat top center;  padding:180px 20px 10px 20px; margin:0px auto; text-align:justify; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; color:#e1e3ec; outline:1px solid #000; border:2px solid #f3f1dc;}
.Temp4 b {color:#9cc2f2;}
.Temp4 p {text-indent:50px; font:13px 'Roboto Slab', serif;}
.Temp4-in {padding:10px 20px 10px 20px; margin:0px auto; background-color:rgba(44, 57, 75, 0.9); border:1px dotted #e1e3ec;}
.Temp4-name {font: 60px/55px 'Open Sans Condensed', sans-serif; color:#f3f1dc; text-align:left; text-shadow: 2px 2px 2px rgba(44, 57, 75, 0.9);}
.Temp4-lyrics {font: small-caps 16px/14px 'PT Sans', sans-serif; color:#f3f1dc; letter-spacing:5px; text-align:center; text-shadow: 2px 2px 2px rgba(44, 57, 75, 0.9); padding-top:7px;}
.Temp4 .ooc {opacity:0.7; text-indent:0px; padding:0px; border-bottom:2px dashed #e1e3ec; margin-bottom:10px;}
.Temp4 .ooc + p {padding:0px 5px;}
.Temp4 .wc {text-transform: uppercase; font-weight:bold; color:#9cc2f2;}
p.Kcredit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;} </style>
[/html]

[html] <hr> <br>

<div class="Temp5">
<div class="L1">Now some saint got the job of writing down my sins</div>
<div class="Temp5-img"> </div>
<div class="L2">
<div class="ooc"><span class="wc">Word Count &rarr; 000</span> :: OOC Text </div></div>

<div class="Temp5-in">

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tincidunt nunc. Maecenas nec convallis ipsum. Aliquam at purus convallis, scelerisque urna a, congue sapien. Nam elementum mauris felis, non accumsan tortor pharetra vel. Vestibulum fringilla volutpat odio, non rhoncus erat aliquam sed. Fusce scelerisque molestie nisl, non rutrum ante congue vel. Etiam scelerisque turpis vel turpis porta, ut facilisis nunc commodo. Fusce vel ex fermentum, lobortis nibh in, congue neque. Donec quis molestie elit. Nunc aliquet finibus tristique. Morbi nec orci a tortor egestas egestas ut ac ex. Ut vehicula, augue non venenatis auctor, velit arcu eleifend massa, id vulputate mauris nunc a dolor. Phasellus tincidunt eu velit varius elementum.</p>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec. <B>Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est.</b> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

</div></div>
<p class="Kcredit">Template by <a href="http://www.soulsrpg.com/forum/viewtopic.php?f=37&t=16460">Kitty</a>.</p>

<style type="text/css">

@import url('https://fonts.googleapis.com/css?family=IM+Fell+Great+Primer:400i|Roboto+Slab');

.Temp5 {width:600px; padding:0px; margin:0px auto; text-align:justify; background-color:#d0eef0; color:#000; font-size:14px; font-family: 'Roboto Slab', serif; box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; color:#000; outline:1px solid #000; border:2px solid #abd6d9;}
.Temp5 p {text-indent:50px; padding-top:8px; text-align:justify; margin:0px auto;}
.Temp5 p:first-letter {font-size:2em; color:#2f4569; font-weight:bold;}
.Temp5 b:before { content:open-quote; }
.Temp5 b:after { content:close-quote; }
.Temp5 .L1 {border-top:20px solid #2e3b4e; border-bottom:20px solid #2e3b4e; background-color:#2e3b4e; text-align:center; padding:0px; font-size:20px; line-height:15px; font-family: 'IM Fell Great Primer', serif; color:#FFF; text-shadow:#2B2B2B 0 0 4px; letter-spacing:3px;}
.Temp5 .L2 {text-indent:20px; border-top:10px solid #69aab6; border-bottom:10px solid #69aab6; background-color:#69aab6; padding:0px; color:#FFF; }
.Temp5-img {height:140px; background-image:url('https://image.ibb.co/fL1sya/Temp4.png'); background-position:center; background-repeat:no-repeat; border:0px; margin 0px auto;}
.Temp5 .ooc {opacity:0.7;}
.Temp5 .ooc + p {padding:0px 5px;}
.Temp5 .wc {text-transform: uppercase; font-weight:bold; }
.Temp5-in {padding:20px; margin:0px auto; background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); }
p.Kcredit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;}</style>
[/html]

Code:
[html]
<div class="Temp5">
<div class="L1">Now some saint got the job of writing down my sins</div>
<div class="Temp5-img"> </div>
<div class="L2">  
<div class="ooc"><span class="wc">Word Count &rarr; 000</span> :: OOC Text  </div></div>

<div class="Temp5-in">  


<p>POST. <B>Speech</b>. <i>Thinking</i>.</p>

</div></div>  
<p class="Kcredit">Template by <a href="http://www.soulsrpg.com/forum/viewtopic.php?f=37&t=16460">Kitty</a>.</p>

<style type="text/css">  

@import url('https://fonts.googleapis.com/css?family=IM+Fell+Great+Primer:400i|Roboto+Slab');  

.Temp5 {width:600px; padding:0px; margin:0px auto; text-align:justify; background-color:#d0eef0; color:#000; font-size:14px; font-family: 'Roboto Slab', serif;  box-shadow:2px 2px 3px #1d1d1d; -moz-box-shadow:2px 2px 3px #1d1d1d; -webkit-box-shadow:2px 2px 3px #1d1d1d; color:#000; outline:1px solid #000; border:2px solid #abd6d9;}
.Temp5 p {text-indent:50px;  padding-top:8px; text-align:justify; margin:0px auto;}  
.Temp5 p:first-letter {font-size:2em; color:#2f4569; font-weight:bold;}
.Temp5 b:before { content:open-quote; }
.Temp5 b:after { content:close-quote; }
.Temp5 .L1 {border-top:20px solid #2e3b4e; border-bottom:20px solid #2e3b4e;  background-color:#2e3b4e; text-align:center; padding:0px; font-size:20px; line-height:15px; font-family: 'IM Fell Great Primer', serif; color:#FFF;  text-shadow:#2B2B2B 0 0 4px; letter-spacing:3px;}
.Temp5 .L2 {text-indent:20px; border-top:10px solid #69aab6; border-bottom:10px solid #69aab6; background-color:#69aab6; padding:0px; color:#FFF; }
.Temp5-img {height:140px; background-image:url('https://image.ibb.co/fL1sya/Temp4.png'); background-position:center; background-repeat:no-repeat; border:0px; margin 0px auto;}
.Temp5 .ooc {opacity:0.7;}
.Temp5 .ooc + p {padding:0px 5px;}
.Temp5 .wc {text-transform: uppercase; font-weight:bold; }
.Temp5-in {padding:20px; margin:0px auto;  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );  }  
p.Kcredit {text-indent:0px; text-align:center; font-size:10px; width:425px; text-align:center; margin:0px auto;}</style>
[/html]
[html]<div class="NivosusSigIcons">
<div class="Nivosussigtextbox">
<div class="NivosusSigname">By the grace of the fire and the flames</div>
<div class="NivosusSigname2">YOU'RE THE FACE OF THE FUTURE, THE BLOOD IN MY VEINS</div>
</div>

<div class="Nivosussigicons" id="signature-icons">
<a href="https://wiki.soulsrpg.com/index.php?n=Players.Kitty" target="_blank" title="PLAYER WIKI" class="player-wiki"></a>
<a href="https://www.soulsrpg.com/forum/viewtopic.php?f=13&t=16051" target="_blank" title="POST LOG" class="post-log"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Players.KittyAdoptions" class="adoptables-available" title="ADOPTABLES available!"></a>
<a href="https://fav.me/d9waoqh" class="commissions" title="COMMISSIONS"></a>
<a href="#" title="I will roleplay mature material." class="will-mature"></a>
<a href="#" class="reply-medium" title="REPLY SPEED: MEDIUM"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Characters.Nivosus%20Moineau" target="_blank" title="CHARACTER WIKI" class="character-wiki"></a>
<a href="https://imgur.com/a/Ol8m2" target="_blank" title="CHARACTER GALLERY &amp; CREDITS" class="ic-gallery"></a>
<a href="#" class="optime-preference" title="OPTIME unless otherwise stated."></a>
<a href="#" class="mature-character" title="MATURE CHARACTER. Sensitive viewers beware."></a>
<a href="#" class="strong-prejudice" title="Nivosus has a strong prejudice against non-luperci."></a>
<a href="#!" class="skill-stealth" title="Nivosus is skilled in stealth."></a>
<a href="#!" class="skill-social" title="Nivosus is skilled in social skills."></a>
</div>
</div>

<div class="Nivbuttonblock">
<a href="https://wiki.soulsrpg.com/index.php?n=Players.KittyAdoptions"><img src="http://pile.randimg.net/0/144/36029/KittyAdopts.png"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Packs.SapientAdoptables#toc4"><img src="http://pile.randimg.net/0/144/36028/SapientAdopts.png"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Packs.SapientAdoptables#toc4"><img src="https://sapient.soulsrpg.com/public/adoptables/Featured_Adoptable_Small.png"></a>
<a href="https://sapient.soulsrpg.com/policies/joining/"><img src="https://sapient.soulsrpg.com/public/Pride/Pride1.png"></a></div>

<style type="text/css">
@import url('/images/icons/postsig/signature-icons.css');
@import url('https://fonts.googleapis.com/css?family=Eagle+Lake|Oswald');

.NivosusSigIcons .NivosusSigname {text-align:center; padding:25px 0 2px 0; font-size:28px; line-height:22px; font-family: 'Eagle Lake', cursive; text-shadow: rgba(255,255,255,.1) -1px -1px 1px,rgba(0,0,0,.5) 1px 1px 1px; letter-spacing:-1px; -webkit-opacity: 0.6; -moz-opacity: 0.6; opacity: 0.6;}
.NivosusSigIcons .NivosusSigname2 {text-align:center; padding:0px 0 2px 0;font-size:16px; line-height:16px; letter-spacing:4px; font-family: 'Oswald', sans-serif; text-shadow:#2B2B2B 0 0 4px; text-transform:uppercase;}

.NivosusSigIcons {max-width: 99%; margin:0px auto;}
.NivosusSigIcons #signature-icon {margin:0px auto; text-align:center;}
.NivosusSigIcons .Nivosussigicons { text-align:center; margin:0px auto; line-height:1em; padding:2px;}
.NivosusSigIcons .Nivosussigtextbox {text-align:center; margin:0px auto; padding:0px;}
.NivosusSigIcons a {-webkit-opacity: 0.45; -moz-opacity: 0.45; opacity: 0.45; -webkit-transition: all .5s ease;
-moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border:3px solid #8395ae; }
.NivosusSigIcons a:hover { -webkit-opacity: 1; -moz-opacity: 1; opacity: 1;}

.Nivbuttonblock { margin:0px auto; text-align:center; }
.Nivbuttonblock a {-webkit-opacity: 0.65; -moz-opacity: 0.65; opacity: 0.65; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
.Nivbuttonblock a:hover { -webkit-opacity: 1; -moz-opacity: 1; opacity: 1;}
</style>
[/html]
  Reply
#2
*walks in, shakes butt, takes code, leaves*
i use this now
  Reply
#3
This template is amaZing! And I am going to use it. BP it's so cool I cannot say anything else.
[html]<style>
@import url('http://fonts.googleapis.com/css?family=Alegreya+SC');
@import url('/images/icons/postsig/signature-icons.css');
.KhyrenSig {width: 400px; margin: 0 auto; text-align: center; background-image:url('https://i.imgur.com/KQuKGE7.png'); background-repeat: no-repeat; background-size:75%;background-position: top center; padding-top: 110px;padding-bottom:15px;}
.KhyrenSig .name {font-family: 'Alegreya SC'; font-size: 28px; text-shadow: 0 0 5px #fff; margin-bottom: -40px;}
.KhyrenSig .border {border-bottom: 1px solid black; margin-bottom: 5px; margin-top: -6px;}
.KhyrenSig a {background-repeat: no-repeat;display:inline-block;position:relative; margin:0;opacity:.35; filter:alpha(opacity=35%);transition:200ms linear all;-moz-transition:200ms linear all;border-bottom: 3px solid transparent;}
.KhyrenSig a:hover, a:active, a:focus {opacity:1;filter:alpha(opacity=100%); border-bottom: 3px solid #00FF00;} </style>

<div class="KhyrenSig"> <span class="name">Khyren</span>
<div class="border"></div>
<div id="signature-icons"> <a href="http://wiki.soulsrpg.com/index.php?n=Players.Ben" target="_blank" title="Ben's Wiki" class="player-wiki"></a><a href="http://wiki.soulsrpg.com/index.php?n=Characters.Khyren" target="_blank" title="Khyren's Wiki" class="character-wiki"></a><a href="http://soulsrpg.com/forum/memberlist.php?mode=viewprofile&un=Khyren" title="OPEN FOR THREADS!" class="open-for-threads"></a><a href="#" class="reply-medium" title="Reply speed: medium"></a><a href="#" class="apparel-accessories" title="Khyren usually her bow, and arrows within a quiver."></a><a href="#" class="character-typical-location" title="Khyren is usually found in Casa Di Cavalieri or in neutral territories near Casa Di Cavalieri"</a><a href="#!" class="strong-prejudice" title="Khyren has a strong prejudice against coyotes."></a></a><a href="#" class="accompaniment" title="Khyren is usually accompanied by Kotori, her great horned owl."></a><a href="#!" class="skill-fighting" title="Khyren is a skilled fighter with a bow and knives."></a><a href="#" class="optime-preference" title="Khyren will be in Optime unless otherwise stated."></a> </div></div> [/html]
  Reply
#4
Updated the old template (cleaned it up some) and added some varieties to show ways you can adapt the coding :3
[html]<div class="NivosusSigIcons">
<div class="Nivosussigtextbox">
<div class="NivosusSigname">By the grace of the fire and the flames</div>
<div class="NivosusSigname2">YOU'RE THE FACE OF THE FUTURE, THE BLOOD IN MY VEINS</div>
</div>

<div class="Nivosussigicons" id="signature-icons">
<a href="https://wiki.soulsrpg.com/index.php?n=Players.Kitty" target="_blank" title="PLAYER WIKI" class="player-wiki"></a>
<a href="https://www.soulsrpg.com/forum/viewtopic.php?f=13&t=16051" target="_blank" title="POST LOG" class="post-log"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Players.KittyAdoptions" class="adoptables-available" title="ADOPTABLES available!"></a>
<a href="https://fav.me/d9waoqh" class="commissions" title="COMMISSIONS"></a>
<a href="#" title="I will roleplay mature material." class="will-mature"></a>
<a href="#" class="reply-medium" title="REPLY SPEED: MEDIUM"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Characters.Nivosus%20Moineau" target="_blank" title="CHARACTER WIKI" class="character-wiki"></a>
<a href="https://imgur.com/a/Ol8m2" target="_blank" title="CHARACTER GALLERY &amp; CREDITS" class="ic-gallery"></a>
<a href="#" class="optime-preference" title="OPTIME unless otherwise stated."></a>
<a href="#" class="mature-character" title="MATURE CHARACTER. Sensitive viewers beware."></a>
<a href="#" class="strong-prejudice" title="Nivosus has a strong prejudice against non-luperci."></a>
<a href="#!" class="skill-stealth" title="Nivosus is skilled in stealth."></a>
<a href="#!" class="skill-social" title="Nivosus is skilled in social skills."></a>
</div>
</div>

<div class="Nivbuttonblock">
<a href="https://wiki.soulsrpg.com/index.php?n=Players.KittyAdoptions"><img src="http://pile.randimg.net/0/144/36029/KittyAdopts.png"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Packs.SapientAdoptables#toc4"><img src="http://pile.randimg.net/0/144/36028/SapientAdopts.png"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Packs.SapientAdoptables#toc4"><img src="https://sapient.soulsrpg.com/public/adoptables/Featured_Adoptable_Small.png"></a>
<a href="https://sapient.soulsrpg.com/policies/joining/"><img src="https://sapient.soulsrpg.com/public/Pride/Pride1.png"></a></div>

<style type="text/css">
@import url('/images/icons/postsig/signature-icons.css');
@import url('https://fonts.googleapis.com/css?family=Eagle+Lake|Oswald');

.NivosusSigIcons .NivosusSigname {text-align:center; padding:25px 0 2px 0; font-size:28px; line-height:22px; font-family: 'Eagle Lake', cursive; text-shadow: rgba(255,255,255,.1) -1px -1px 1px,rgba(0,0,0,.5) 1px 1px 1px; letter-spacing:-1px; -webkit-opacity: 0.6; -moz-opacity: 0.6; opacity: 0.6;}
.NivosusSigIcons .NivosusSigname2 {text-align:center; padding:0px 0 2px 0;font-size:16px; line-height:16px; letter-spacing:4px; font-family: 'Oswald', sans-serif; text-shadow:#2B2B2B 0 0 4px; text-transform:uppercase;}

.NivosusSigIcons {max-width: 99%; margin:0px auto;}
.NivosusSigIcons #signature-icon {margin:0px auto; text-align:center;}
.NivosusSigIcons .Nivosussigicons { text-align:center; margin:0px auto; line-height:1em; padding:2px;}
.NivosusSigIcons .Nivosussigtextbox {text-align:center; margin:0px auto; padding:0px;}
.NivosusSigIcons a {-webkit-opacity: 0.45; -moz-opacity: 0.45; opacity: 0.45; -webkit-transition: all .5s ease;
-moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border:3px solid #8395ae; }
.NivosusSigIcons a:hover { -webkit-opacity: 1; -moz-opacity: 1; opacity: 1;}

.Nivbuttonblock { margin:0px auto; text-align:center; }
.Nivbuttonblock a {-webkit-opacity: 0.65; -moz-opacity: 0.65; opacity: 0.65; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
.Nivbuttonblock a:hover { -webkit-opacity: 1; -moz-opacity: 1; opacity: 1;}
</style>
[/html]
  Reply
#5
I always love your tables! They're so pretty!
Grabs codes
[html]
<div class="Avisig2"><div class="bottom"><div id="signature-icons" class="iconblock" style="padding-top:0px; margin:0px; float:left;"> <a href="http://wiki.soulsrpg.com/index.php?n=Players.Silverfrost" target="_blank" title="PLAYER WIKI" class="player-wiki"></a> <a href="http://wiki.soulsrpg.com/index.php?n=Players.SilverfrostAdoptions" class="adoptables-available" title="ADOPTABLES available!"></a> <a href="LINK" title="OPEN FOR THREADS!" class="open-for-threads"></a> <a href="#!" class="reply-medium" title="REPLY SPEED: MEDIUM"></a> <a href="#!" title="I will roleplay LASKY." class="will-lasky"></a> <a href="#!" title="I will roleplay mature material." class="will-mature"></a><br>
<a href="http://wiki.soulsrpg.com/index.php?n=Characters.Avinalora" target="_blank" title="CHARACTER WIKI" class="character-wiki"></a> <a href="http://imgur.com/a/D2STM" target="_blank" title="CHARACTER GALLERY &amp; CREDITS" class="ic-gallery"></a> <a href="#!" class="secui-preference" title="Uses all forms equally equally. Refer to thread for details."></a> <a href="LINK" class="permanent-disability" title="Avinalora is nearly blind and has a lame leg"></a><a href="https://soulsrpg.com/forum/viewtopic.php?p=270615#p270615" target="_blank" title="POST LOG" class="post-log"></a><a href="#!" class="mature-character" title="Avinalora swears a lot. Sensitive viewers beware."></a><br><a href="#!" class="apparel-accessories" title="Avinalora can be seen in clothing a lot. Check thread for details"></a><a href="#!" class="references-okay" title="OOC references okay."></a>
<a href="#!" class="character-typical-location" title="Avinalora is typically found in Anathema or within 60 miles of the territory"></a>
<a href="#!" class="skill-medic" title="Avinalora is a skilled medic."></a>
<a href="#!" class="skill-scholar" title="Avinalora is skilled at reading and writing."></a><a href="#!" class="skill-animals" title="Avinalora is skilled with owls, cats, and corvids"></a></div>
<div class="buttonblock" style="margin:0px; float:left;padding-right:201px;"><center> <a href="http://wiki.soulsrpg.com"><img src="http://soulsrpg.com/images/pride/promo/wiki_88x31.png" style="border:0px;" title="Check out the 'Souls Wiki!" title="Check out the 'Souls Wiki!" /></a> <br><a href="http://anathema.soulsrpg.com/joining"><img src="http://anathema.soulsrpg.com/public/images/pride/anathema_88x31c.png" style="border:0px;" title="Join Anathema!"></a></center></div> </div> </div> <style> @import url('/images/icons/postsig/signature-icons.css'); @import url('http://sleepyglow.net/rp/icons/signature-icons.css'); </style> <style type="text/css">
#signature-icons a.permanent-disability { background-image: url('http://i.imgur.com/XVMFfdB.png'); }
.Avisig2 {width:290px;margin:0px auto; background-image:url('https://i.imgur.com/Ja51G8X.png'); background-position:top right; background-repeat:no-repeat; background-size:288px; height:198px;padding-right:161px;}
.Avisig2 .title {margin:0px auto;text-align:left;padding:5px; font-family:'Merriweather', serif;font-size:11.8px;letter-spacing:-.6px;text-transform:lowercase;opacity:0.7; } .Avisig2 .buttonblock a {opacity:.85; filter:alpha(opacity=80%); transition:200ms linear all; -moz-transition:200ms linear all;}
.Avisig2 .buttonblock {margin:5px;width:230px;float:left;padding-right:197px;}
.Avisig2 .buttonblock a:hover, .Avisig2 .buttonblock a:active, .Avisig2 .buttonblock a:focus { opacity:1; filter:alpha(opacity=100%); }
.Avisig2 .iconblock { font-size:0; margin:0 auto;}
.Avisig2 .iconblock { font-size:0; margin:0 auto; }
.Avisig2 #signature-icons a:hover,
.Avisig2 #signature-icons a:focus,
.Avisig2 #signature-icons a:active {opacity:1;filter:alpha(opacity=100%);}
.Avisig2 .iconblock a { opacity:.65; filter:alpha(opacity=90%); transition:200ms linear all; -moz-transition:200ms linear all; border-radius: 50%; border: 1px solid grey; } .Avisig2 .iconblock a:hover, .Avisig2 .iconblock a:active, .Avisig2 .iconblock a:focus { opacity: 1; filter:alpha(opacity=100%); box-shadow: 0px 0px 2px #000;border:#30712d 1px solid; }
</style> <link href='http://fonts.googleapis.com/css?family=Merriweather:400,400italic' rel='stylesheet' type='text/css'> [/html]
  Reply
#6
[html]<div class="MVHawk">
<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>
<img src="https://i.imgur.com/taf0qbJ.png" class="cawcaw">

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tincidunt nunc. Maecenas nec convallis ipsum. Aliquam at purus convallis, scelerisque urna a, congue sapien. Nam elementum mauris felis, non accumsan tortor pharetra vel. Vestibulum fringilla volutpat odio, non rhoncus erat aliquam sed. Fusce scelerisque molestie nisl, non rutrum ante congue vel. Etiam scelerisque turpis vel turpis porta, ut facilisis nunc commodo. Fusce vel ex fermentum, lobortis nibh in, congue neque. Donec quis molestie elit. Nunc aliquet finibus tristique. Morbi nec orci a tortor egestas egestas ut ac ex. Ut vehicula, augue non venenatis auctor, velit arcu eleifend massa, id vulputate mauris nunc a dolor. Phasellus tincidunt eu velit varius elementum.</p>

<p><B>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</B> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

<p><npc>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</npc> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

</div>
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
.MVHawk {width:90%; margin:15px;}
.MVHawk p {font:14px 'Roboto Slab', serif; line-height:180%; text-indent:50px; text-align:justify; }
.MVHawk NPC {font-weight: bold; filter:alpha(opacity=55%); opacity:.55; }
.MVHawk .ooc {opacity:0.7; text-indent:15px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.MVHawk .ooc + p {padding:0px 5px;}
.MVHawk .wc {text-transform: uppercase; font-weight:bold;}
.cawcaw {width:250px; padding:25px; float:right;}
</style>[/html]

Code:
[html]<div class="MVHawk">
<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>
<img src="https://i.imgur.com/taf0qbJ.png" class="cawcaw">

<p>POST</p>

</div>
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
.MVHawk {width:90%; margin:15px;}
.MVHawk p {font:14px 'Roboto Slab', serif; line-height:180%; text-indent:50px; text-align:justify; }
.MVHawk NPC {font-weight: bold; filter:alpha(opacity=55%); opacity:.55; }
.MVHawk .ooc {opacity:0.7; text-indent:15px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.MVHawk .ooc + p {padding:0px 5px;}
.MVHawk .wc {text-transform: uppercase; font-weight:bold;}
.cawcaw {width:250px; padding:25px; float:right;}
</style>[/html]


[html]<div class="MVBear">
<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>
<img src="https://i.imgur.com/mEEbuCT.png" class="rawriguess">

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tincidunt nunc. Maecenas nec convallis ipsum. Aliquam at purus convallis, scelerisque urna a, congue sapien. Nam elementum mauris felis, non accumsan tortor pharetra vel. Vestibulum fringilla volutpat odio, non rhoncus erat aliquam sed. Fusce scelerisque molestie nisl, non rutrum ante congue vel. Etiam scelerisque turpis vel turpis porta, ut facilisis nunc commodo. Fusce vel ex fermentum, lobortis nibh in, congue neque. Donec quis molestie elit. Nunc aliquet finibus tristique. Morbi nec orci a tortor egestas egestas ut ac ex. Ut vehicula, augue non venenatis auctor, velit arcu eleifend massa, id vulputate mauris nunc a dolor. Phasellus tincidunt eu velit varius elementum.</p>

<p><B>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</B> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

<p><npc>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</npc> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

</div>
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
.MVBear {width:90%; margin:15px;}
.MVBear p {font:14px 'Roboto Slab', serif; line-height:180%; text-indent:50px; text-align:justify; }
.MVBear NPC {font-weight: bold; filter:alpha(opacity=55%); opacity:.55; }
.MVBear .ooc {opacity:0.7; text-indent:15px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.MVBear .ooc + p {padding:0px 5px;}
.MVBear .wc {text-transform: uppercase; font-weight:bold;}
.rawriguess {width:250px; padding:25px; float:right;}
</style>[/html]

Code:
[html]<div class="MVBear">
<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>
<img src="https://i.imgur.com/mEEbuCT.png" class="rawriguess">

<p>POST</p>

</div>
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
.MVBear {width:90%; margin:15px;}
.MVBear p {font:14px 'Roboto Slab', serif; line-height:180%; text-indent:50px; text-align:justify; }
.MVBear NPC {font-weight: bold; filter:alpha(opacity=55%); opacity:.55; }
.MVBear .ooc {opacity:0.7; text-indent:15px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.MVBear .ooc + p {padding:0px 5px;}
.MVBear .wc {text-transform: uppercase; font-weight:bold;}
.rawriguess {width:250px; padding:25px; float:right;}
</style>[/html]

[html]<div class="MVElk">
<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>
<img src="https://i.imgur.com/NwkMMPT.png" class="whatdidtheelksay">

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tincidunt nunc. Maecenas nec convallis ipsum. Aliquam at purus convallis, scelerisque urna a, congue sapien. Nam elementum mauris felis, non accumsan tortor pharetra vel. Vestibulum fringilla volutpat odio, non rhoncus erat aliquam sed. Fusce scelerisque molestie nisl, non rutrum ante congue vel. Etiam scelerisque turpis vel turpis porta, ut facilisis nunc commodo. Fusce vel ex fermentum, lobortis nibh in, congue neque. Donec quis molestie elit. Nunc aliquet finibus tristique. Morbi nec orci a tortor egestas egestas ut ac ex. Ut vehicula, augue non venenatis auctor, velit arcu eleifend massa, id vulputate mauris nunc a dolor. Phasellus tincidunt eu velit varius elementum.</p>

<p><B>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</B> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

<p><npc>"Donec purus ipsum, tincidunt vitae tincidunt et, ornare sit amet dolor. Donec eget aliquam est."</npc> Praesent aliquet pretium pellentesque. Quisque nec imperdiet quam. Etiam consequat aliquam aliquet. Sed hendrerit risus vitae velit vulputate laoreet. Nunc ullamcorper placerat ultrices. Duis congue nisl eu turpis mollis mollis a sed felis. Suspendisse eu porttitor felis, cursus placerat eros. Integer sit amet ultricies massa. Duis rutrum at augue id accumsan. Nunc sit amet lectus quis erat ultrices tristique.</p>

</div>
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
.MVElk {width:90%; margin:15px;}
.MVElk p {font:14px 'Roboto Slab', serif; line-height:180%; text-indent:50px; text-align:justify; }
.MVElk NPC {font-weight: bold; filter:alpha(opacity=55%); opacity:.55; }
.MVElk .ooc {opacity:0.7; text-indent:15px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.MVElk .ooc + p {padding:0px 5px;}
.MVElk .wc {text-transform: uppercase; font-weight:bold;}
.whatdidtheelksay {width:250px; padding:25px; float:right;}
</style>[/html]

Code:
[html]<div class="MVElk">
<div class="ooc"><span class="wc">Word Count &rarr; 310</span> :: Out of Character text</div>
<img src="https://i.imgur.com/NwkMMPT.png" class="whatdidtheelksay">

<p>POST</p>

</div>
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
.MVElk {width:90%; margin:15px;}
.MVElk p {font:14px 'Roboto Slab', serif; line-height:180%; text-indent:50px; text-align:justify; }
.MVElk NPC {font-weight: bold; filter:alpha(opacity=55%); opacity:.55; }
.MVElk .ooc {opacity:0.7; text-indent:15px; padding:0px; border-bottom:1px dotted #000; margin-bottom:10px;}
.MVElk .ooc + p {padding:0px 5px;}
.MVElk .wc {text-transform: uppercase; font-weight:bold;}
.whatdidtheelksay {width:250px; padding:25px; float:right;}
</style>[/html]
[html]<div class="NivosusSigIcons">
<div class="Nivosussigtextbox">
<div class="NivosusSigname">By the grace of the fire and the flames</div>
<div class="NivosusSigname2">YOU'RE THE FACE OF THE FUTURE, THE BLOOD IN MY VEINS</div>
</div>

<div class="Nivosussigicons" id="signature-icons">
<a href="https://wiki.soulsrpg.com/index.php?n=Players.Kitty" target="_blank" title="PLAYER WIKI" class="player-wiki"></a>
<a href="https://www.soulsrpg.com/forum/viewtopic.php?f=13&t=16051" target="_blank" title="POST LOG" class="post-log"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Players.KittyAdoptions" class="adoptables-available" title="ADOPTABLES available!"></a>
<a href="https://fav.me/d9waoqh" class="commissions" title="COMMISSIONS"></a>
<a href="#" title="I will roleplay mature material." class="will-mature"></a>
<a href="#" class="reply-medium" title="REPLY SPEED: MEDIUM"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Characters.Nivosus%20Moineau" target="_blank" title="CHARACTER WIKI" class="character-wiki"></a>
<a href="https://imgur.com/a/Ol8m2" target="_blank" title="CHARACTER GALLERY &amp; CREDITS" class="ic-gallery"></a>
<a href="#" class="optime-preference" title="OPTIME unless otherwise stated."></a>
<a href="#" class="mature-character" title="MATURE CHARACTER. Sensitive viewers beware."></a>
<a href="#" class="strong-prejudice" title="Nivosus has a strong prejudice against non-luperci."></a>
<a href="#!" class="skill-stealth" title="Nivosus is skilled in stealth."></a>
<a href="#!" class="skill-social" title="Nivosus is skilled in social skills."></a>
</div>
</div>

<div class="Nivbuttonblock">
<a href="https://wiki.soulsrpg.com/index.php?n=Players.KittyAdoptions"><img src="http://pile.randimg.net/0/144/36029/KittyAdopts.png"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Packs.SapientAdoptables#toc4"><img src="http://pile.randimg.net/0/144/36028/SapientAdopts.png"></a>
<a href="https://wiki.soulsrpg.com/index.php?n=Packs.SapientAdoptables#toc4"><img src="https://sapient.soulsrpg.com/public/adoptables/Featured_Adoptable_Small.png"></a>
<a href="https://sapient.soulsrpg.com/policies/joining/"><img src="https://sapient.soulsrpg.com/public/Pride/Pride1.png"></a></div>

<style type="text/css">
@import url('/images/icons/postsig/signature-icons.css');
@import url('https://fonts.googleapis.com/css?family=Eagle+Lake|Oswald');

.NivosusSigIcons .NivosusSigname {text-align:center; padding:25px 0 2px 0; font-size:28px; line-height:22px; font-family: 'Eagle Lake', cursive; text-shadow: rgba(255,255,255,.1) -1px -1px 1px,rgba(0,0,0,.5) 1px 1px 1px; letter-spacing:-1px; -webkit-opacity: 0.6; -moz-opacity: 0.6; opacity: 0.6;}
.NivosusSigIcons .NivosusSigname2 {text-align:center; padding:0px 0 2px 0;font-size:16px; line-height:16px; letter-spacing:4px; font-family: 'Oswald', sans-serif; text-shadow:#2B2B2B 0 0 4px; text-transform:uppercase;}

.NivosusSigIcons {max-width: 99%; margin:0px auto;}
.NivosusSigIcons #signature-icon {margin:0px auto; text-align:center;}
.NivosusSigIcons .Nivosussigicons { text-align:center; margin:0px auto; line-height:1em; padding:2px;}
.NivosusSigIcons .Nivosussigtextbox {text-align:center; margin:0px auto; padding:0px;}
.NivosusSigIcons a {-webkit-opacity: 0.45; -moz-opacity: 0.45; opacity: 0.45; -webkit-transition: all .5s ease;
-moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border:3px solid #8395ae; }
.NivosusSigIcons a:hover { -webkit-opacity: 1; -moz-opacity: 1; opacity: 1;}

.Nivbuttonblock { margin:0px auto; text-align:center; }
.Nivbuttonblock a {-webkit-opacity: 0.65; -moz-opacity: 0.65; opacity: 0.65; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
.Nivbuttonblock a:hover { -webkit-opacity: 1; -moz-opacity: 1; opacity: 1;}
</style>
[/html]
  Reply
#7
O: yay! awesome!
  Reply
#8
YAS Bahahahahahahahaha!

Kitty you be skilled.
  Reply
#9
O:

So pretty!! I will definitely be using some of these for Saavik's posts :3
  Reply


Forum Jump: