<?xml version="1.0" encoding="UTF-8"?>
<feed xmlns="http://www.w3.org/2005/Atom" xmlns:dw="https://www.dreamwidth.org">
  <id>tag:dreamwidth.org,2020-01-14:3603504</id>
  <title>Real Isopod Hours</title>
  <subtitle>Real Isopod Hours</subtitle>
  <author>
    <name>Real Isopod Hours</name>
  </author>
  <link rel="alternate" type="text/html" href="https://isopods.dreamwidth.org/"/>
  <link rel="self" type="text/xml" href="https://isopods.dreamwidth.org/data/atom"/>
  <updated>2024-06-21T20:41:12Z</updated>
  <dw:journal username="isopods" type="community"/>
  <entry>
    <id>tag:dreamwidth.org,2020-01-14:3603504:9160</id>
    <author>
      <name>Everett</name>
    </author>
    <dw:poster user="loupnoir"/>
    <link rel="alternate" type="text/html" href="https://isopods.dreamwidth.org/9160.html"/>
    <link rel="self" type="text/xml" href="https://isopods.dreamwidth.org/data/atom/?itemid=9160"/>
    <title>[10] - info; details galore</title>
    <published>2023-09-08T19:49:58Z</published>
    <updated>2023-09-09T03:13:56Z</updated>
    <category term="*code"/>
    <category term="misc"/>
    <category term="info"/>
    <dw:security>public</dw:security>
    <dw:reply-count>0</dw:reply-count>
    <content type="html">Posted by: &lt;span lj:user='loupnoir' style='white-space: nowrap;' class='ljuser'&gt;&lt;a href='https://loupnoir.dreamwidth.org/profile'&gt;&lt;img src='https://www.dreamwidth.org/img/silk/identity/user.png' alt='[personal profile] ' width='17' height='17' style='vertical-align: text-bottom; border: 0; padding-right: 1px;' /&gt;&lt;/a&gt;&lt;a href='https://loupnoir.dreamwidth.org/'&gt;&lt;b&gt;loupnoir&lt;/b&gt;&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;center&gt;

&lt;div style="width: 700px; font-family: Lucida Console; font-size: 12px;  --dropdownHeader: #719250;"&gt;
 
 &lt;div class="condensed_details_header" style="text-transform: lowercase; font-weight: bold; font-family: &amp;#39;Lucida Console&amp;#39;; font-size: 30px; text-align: left; padding: 15px; border-radius: 15px; color: white; background: #000000;"&gt;
  ▶ lieutenant columbo
 &lt;/div&gt;
 

 
 &lt;div class="condensed_details_content" style="width: 700px; display: flex; align-items: flex-start;"&gt;
   
   &lt;div style="width: 250px; margin: 10px; position: sticky; display: inline-block;  top: 30px;"&gt;


&lt;center&gt;
&lt;img src="https://i.imgur.com/fBDxb1w.png" style="border-width: 10px 10px 50px 10px;             width: 200px;             border-style: solid;             border-color: white;             transform: rotate(4deg);             object-fit: cover;             object-position: center top;             margin-left: 10px;             margin-right: 10px;             box-shadow: 5px 5px rgba(0, 0, 0, 0.5);"&gt;
&lt;/center&gt;

          
 


&lt;details open="open"&gt;
       &lt;summary class="condensed_summary" style="margin-top: 3px; color: white; background: var(--dropdownHeader); text-align: center; padding: 2px; font-weight: bold; border-radius: 3px; margin-top: 2px;"&gt;

           INFO

       &lt;/summary&gt;
       &lt;div class="condensed_details" style="padding: 6px; text-align: left;"&gt;            
           &lt;b&gt;name:&lt;/b&gt; lieutenant columbo &lt;br /&gt;
           &lt;b&gt;age:&lt;/b&gt; 43 &lt;br /&gt;
           &lt;b&gt;birthday:&lt;/b&gt; ???? &lt;br /&gt;
           &lt;b&gt;gender:&lt;/b&gt; male &lt;br /&gt;
           &lt;b&gt;sexuality:&lt;/b&gt; loves his wife &lt;br /&gt;
       &lt;/div&gt;
       &lt;/details&gt;




&lt;details&gt;
       &lt;summary class="condensed_summary" style="margin-top: 3px; color: white; background: var(--dropdownHeader); text-align: center; padding: 2px; font-weight: bold; border-radius: 3px; margin-top: 2px;"&gt;

           TRAITS

       &lt;/summary&gt;
       &lt;div class="condensed_details" style="padding: 6px; text-align: left;"&gt;            
           • amicable&lt;br /&gt;
• determined&lt;br /&gt;
• caring&lt;br /&gt;
• shrewd&lt;br /&gt;
• etc etc. &lt;br /&gt;
       &lt;/div&gt;
       &lt;/details&gt;






&lt;small&gt;&lt;a href="https://isopods.dreamwidth.org/9160.html" style="text-decoration: none;"&gt;&amp;lt; isopods &amp;gt;&lt;/a&gt;&lt;/small&gt;

&lt;/div&gt;

   
  
  &lt;div style="display: inline-block; width: 500px; padding: 5px;"&gt;

   
    &lt;details open="open"&gt;
        &lt;summary class="condensed_summary" style="margin-top: 3px; color: white; background: var(--dropdownHeader); text-align: center; padding: 2px; font-weight: bold; border-radius: 3px; margin-top: 2px;"&gt;SUMMARY&lt;/summary&gt;
        &lt;div class="condensed_details" style="padding: 6px; text-align: left;"&gt;
       
         One of the basic pieces of furniture, a chair is a type of seat. Its primary features are two pieces of a durable material, attached as back and seat to one another at a 90° or slightly greater angle, with usually the four corners of the horizontal seat attached in turn to four legs—or other parts of the seat's underside attached to three legs or to a shaft about which a four-arm turnstile on rollers can turn—strong enough to support the weight of a person who sits on the seat (usually wide and broad enough to hold the lower body from the buttocks almost to the knees) and leans against the vertical back (usually high and wide enough to support the back to the shoulder blades). The legs are typically high enough for the seated person's thighs and knees to form a 90° or lesser angle. 

        &lt;/div&gt;
    &lt;/details&gt;
   


    &lt;details open="open"&gt;
        &lt;summary class="condensed_summary" style="margin-top: 3px; color: white; background: var(--dropdownHeader); text-align: center; padding: 2px; font-weight: bold; border-radius: 3px; margin-top: 2px;"&gt;ABILITIES&lt;/summary&gt;
        &lt;div class="condensed_details" style="padding: 6px; text-align: left;"&gt;
       
         Bacon ipsum dolor amet short loin t-bone swine boudin. Flank corned beef kielbasa doner. Andouille short ribs ground round jerky, kevin prosciutto meatball beef tail ribeye chislic sausage hamburger. Shank bacon pastrami, burgdoggen chuck turducken jowl tenderloin salami venison flank fatback frankfurter. Sirloin ball tip meatball turducken porchetta doner ground round chislic kevin chuck ribeye short loin landjaeger capicola salami.&lt;br /&gt;&lt;br /&gt;

Swine kielbasa sirloin turducken, tenderloin prosciutto frankfurter filet mignon ham. Pastrami chislic biltong, sirloin venison ground round fatback t-bone hamburger andouille tongue frankfurter meatball. Beef chuck andouille ham hock ground round drumstick. 

        &lt;/div&gt;
    &lt;/details&gt;
   


    &lt;details&gt;
        &lt;summary class="condensed_summary" style="margin-top: 3px; color: white; background: var(--dropdownHeader); text-align: center; padding: 2px; font-weight: bold; border-radius: 3px; margin-top: 2px;"&gt;RELATIONSHIPS&lt;/summary&gt;
        &lt;div class="condensed_details" style="padding: 6px; text-align: left;"&gt;
       
         Spicy jalapeno bacon ipsum dolor amet tri-tip strip steak flank short loin, pork belly porchetta ball tip brisket ham. Prosciutto andouille pastrami venison burgdoggen meatball meatloaf chislic jowl buffalo landjaeger shankle. Kevin corned beef biltong, turkey ground round pig shank short loin pork chop ball tip meatball pastrami buffalo tenderloin. Burgdoggen tail leberkas alcatra meatball ground round.&lt;br /&gt;&lt;br /&gt;

Strip steak venison tenderloin chicken, beef salami pork loin kielbasa porchetta hamburger shankle picanha. Picanha shankle kevin pancetta pork sausage jerky hamburger frankfurter prosciutto pork chop brisket meatloaf tenderloin. Tri-tip kielbasa cow, ham porchetta filet mignon biltong t-bone picanha shank prosciutto fatback spare ribs tail. Capicola doner picanha, shoulder cow ribeye ground round tail jowl sausage burgdoggen meatloaf pork loin. 

        &lt;/div&gt;
    &lt;/details&gt;
   


    &lt;details&gt;
        &lt;summary class="condensed_summary" style="margin-top: 3px; color: white; background: var(--dropdownHeader); text-align: center; padding: 2px; font-weight: bold; border-radius: 3px; margin-top: 2px;"&gt;INVENTORY&lt;/summary&gt;
        &lt;div class="condensed_details" style="padding: 6px; text-align: left;"&gt;
       
• notebook&lt;br /&gt;
• drawing of his fursona&lt;br /&gt;
• worm on a string&lt;br /&gt;
• or maybe put traits here&lt;br /&gt;
• do what you want

        &lt;/div&gt;
    &lt;/details&gt;
   

  &lt;/div&gt;
  
 &lt;/div&gt;
 

&lt;/div&gt;

&lt;/center&gt;
&lt;br /&gt;

&lt;center&gt;
&lt;span style="font-family: MS Gothic; font-size: 24px;"&gt;DETAILS GALORE&lt;/span&gt;
&lt;div style="max-width:500px;"&gt;
&lt;span style="font-family: MS Gothic;"&gt;So many summary/detail tags on this one! Similar to &lt;a href="https://isopods.dreamwidth.org/5355.html"&gt;At A Glance,&lt;/a&gt; in terms of having a polaroid picture and two columns. The left column is sticky and scrolls with you as you open the dropdowns!&lt;/span&gt;&lt;/div&gt;&lt;/center&gt;&lt;br /&gt;

&lt;span class="cut-wrapper"&gt;&lt;span style="display: none;" id="span-cuttag___1" class="cuttag"&gt;&lt;/span&gt;&lt;b class="cut-open"&gt;(&amp;nbsp;&lt;/b&gt;&lt;b class="cut-text"&gt;&lt;a href="https://isopods.dreamwidth.org/9160.html#cutid1"&gt;Instructions and code below the cut!&lt;/a&gt;&lt;/b&gt;&lt;b class="cut-close"&gt;&amp;nbsp;)&lt;/b&gt;&lt;/span&gt;&lt;div style="display: none;" id="div-cuttag___1" aria-live="assertive"&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;img src="https://www.dreamwidth.org/tools/commentcount?user=isopods&amp;ditemid=9160" width="30" height="12" alt="comment count unavailable" style="vertical-align: middle;"/&gt; comments</content>
  </entry>
  <entry>
    <id>tag:dreamwidth.org,2020-01-14:3603504:8408</id>
    <author>
      <name>Everett</name>
    </author>
    <dw:poster user="loupnoir"/>
    <link rel="alternate" type="text/html" href="https://isopods.dreamwidth.org/8408.html"/>
    <link rel="self" type="text/xml" href="https://isopods.dreamwidth.org/data/atom/?itemid=8408"/>
    <title>[09] - misc; speech bubbles</title>
    <published>2023-09-08T15:39:01Z</published>
    <updated>2024-06-21T20:39:13Z</updated>
    <category term="misc"/>
    <category term="mobile friendly"/>
    <category term="*code"/>
    <dw:security>public</dw:security>
    <dw:reply-count>3</dw:reply-count>
    <content type="html">Posted by: &lt;span lj:user='loupnoir' style='white-space: nowrap;' class='ljuser'&gt;&lt;a href='https://loupnoir.dreamwidth.org/profile'&gt;&lt;img src='https://www.dreamwidth.org/img/silk/identity/user.png' alt='[personal profile] ' width='17' height='17' style='vertical-align: text-bottom; border: 0; padding-right: 1px;' /&gt;&lt;/a&gt;&lt;a href='https://loupnoir.dreamwidth.org/'&gt;&lt;b&gt;loupnoir&lt;/b&gt;&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;center&gt;

&lt;table style="border: 0px; width: 100%; margin-top: 10px; margin-bottom: 10px;"&gt;
   &lt;tbody&gt;


   &lt;tr style="margin-top: 10px; margin-bottom: 10px;"&gt;

      &lt;td style="vertical-align: top;"&gt;

         &lt;div style="margin-right: -10px; margin-top: 25px; width: 0px; height: 0px; float: right; border-top: 10px solid transparent;          border-left: 20px solid #cccccc; border-bottom: 10px solid transparent; position: relative; z-index: 25;"&gt;&lt;/div&gt;

         &lt;div style="margin-right: 9px; margin-top: -45px; padding: 20px; width: 100%; height: auto; float: right; background-color: #cccccc; color: #000; position: relative; border-radius: 20px;         font-family: Georgia; font-size: 1.1em;"&gt;

&lt;em&gt; What is this strange feeling I keep having? This cold... even now? &lt;/em&gt;

        &lt;/div&gt;
      &lt;/td&gt;

           &lt;td style="vertical-align: top; width: 110px;"&gt;


 &lt;img src="https://loupnoir.dreamwidth.org/file/5140.png" style="float: right; border-radius: 20px; width: 100px;"&gt;


      &lt;/td&gt;
   &lt;/tr&gt;







&lt;/tbody&gt;
&lt;/table&gt;



&lt;table style="border: 0px; width: 100%; margin-top: 10px; margin-bottom: 10px;"&gt;
   &lt;tbody&gt;


   &lt;tr style="margin-top: 10px; margin-bottom: 10px;"&gt;
      &lt;td style="vertical-align: top; width: 110px;"&gt;


 &lt;img src="https://loupnoir.dreamwidth.org/file/4988.png" style="float: left; border-radius: 20px; width: 100px;"&gt;


      &lt;/td&gt;

      &lt;td style="vertical-align: top;"&gt;

         &lt;div style="margin-left: -10px; margin-top: 25px; width: 0px; height: 0px; float: left; border-top: 10px solid transparent;          border-right: 20px solid #de6e8c; border-bottom: 10px solid transparent; position: relative; z-index: 25;"&gt;&lt;/div&gt;

         &lt;div style="margin-left: 9px; margin-top: -45px; padding: 20px; width: 100%; height: auto; float: left; background-color: #de6e8c; color: #000; position: relative; border-radius: 20px;         font-family: Georgia; font-size: 1.1em;"&gt;

&lt;em&gt;I AM LA REVACHOLIÈRE. I AM THE CITY.&lt;/em&gt;

        &lt;/div&gt;
      &lt;/td&gt;
   &lt;/tr&gt;








&lt;/tbody&gt;
&lt;/table&gt;



&lt;table style="border: 0px; width: 100%; margin-top: 10px; margin-bottom: 10px;"&gt;
   &lt;tbody&gt;


   &lt;tr style="margin-top: 10px; margin-bottom: 10px;"&gt;

      &lt;td style="vertical-align: top;"&gt;

         &lt;div style="margin-right: -10px; margin-top: 25px; width: 0px; height: 0px; float: right; border-top: 10px solid transparent;          border-left: 20px solid #cccccc; border-bottom: 10px solid transparent; position: relative; z-index: 25;"&gt;&lt;/div&gt;

         &lt;div style="margin-right: 9px; margin-top: -45px; padding: 20px; width: 100%; height: auto; float: right; background-color: #cccccc; color: #000; position: relative; border-radius: 20px;         font-family: Georgia; font-size: 1.1em;"&gt;

&lt;em&gt; What do you mean, you are the city? &lt;/em&gt;

        &lt;/div&gt;
      &lt;/td&gt;

           &lt;td style="vertical-align: top; width: 110px;"&gt;


 &lt;img src="https://loupnoir.dreamwidth.org/file/5140.png" style="float: right; border-radius: 20px; width: 100px;"&gt;


      &lt;/td&gt;
   &lt;/tr&gt;







&lt;/tbody&gt;
&lt;/table&gt;




&lt;table style="border: 0px; width: 100%; margin-top: 10px; margin-bottom: 10px;"&gt;
   &lt;tbody&gt;


   &lt;tr style="margin-top: 10px; margin-bottom: 10px;"&gt;
      &lt;td style="vertical-align: top; width: 110px;"&gt;


 &lt;img src="https://loupnoir.dreamwidth.org/file/4988.png" style="float: left; border-radius: 20px; width: 100px;"&gt;


      &lt;/td&gt;

      &lt;td style="vertical-align: top;"&gt;

         &lt;div style="margin-left: -10px; margin-top: 25px; width: 0px; height: 0px; float: left; border-top: 10px solid transparent;          border-right: 20px solid #de6e8c; border-bottom: 10px solid transparent; position: relative; z-index: 25;"&gt;&lt;/div&gt;

         &lt;div style="margin-left: 9px; margin-top: -45px; padding: 20px; width: 100%; height: auto; float: left; background-color: #de6e8c; color: #000; position: relative; border-radius: 20px;         font-family: Georgia; font-size: 1.1em;"&gt;

&lt;em&gt; I AM A FRAGMENT OF THE WORLD SPIRIT, THE GENIUS LOCI OF REVACHOL. MY HEART IS THE WIND CORRIDOR. THE BOTTOM OF MY AIR IS RED. I HAVE A HUNDRED THOUSAND LUMINOUS ARMS. COME MORNING, I CARRY INDUSTRIAL DUST AND LET IT SETTLE ON TREE LEAVES. I SHAKE THE DUST FROM THOSE LEAVES AND ONTO YOUR COAT. I'VE SEEN YOU, I'VE SEEN YOU! I'VE SEEN YOU WITH HER — AND I'VE SEEN YOU WITHOUT HER. I'VE SEEN YOU ON THE CRESCENT OF THE HILL. &lt;/em&gt;

        &lt;/div&gt;
      &lt;/td&gt;
   &lt;/tr&gt;





   &lt;tr style="margin-top: 10px; margin-bottom: 10px;"&gt;
      &lt;td style="vertical-align: top; width: 110px;"&gt;


 &lt;img src="https://loupnoir.dreamwidth.org/file/5536.png" style="float: left; border-radius: 20px; width: 100px;"&gt;


      &lt;/td&gt;

      &lt;td style="vertical-align: top;"&gt;

         &lt;div style="margin-left: -10px; margin-top: 25px; width: 0px; height: 0px; float: left; border-top: 10px solid transparent;          border-right: 20px solid #fcdd55; border-bottom: 10px solid transparent; position: relative; z-index: 25;"&gt;&lt;/div&gt;

         &lt;div style="margin-left: 9px; margin-top: -45px; padding: 20px; width: 100%; height: auto; float: left; background-color: #fcdd55; color: #000; position: relative; border-radius: 20px;         font-family: Georgia; font-size: 1.1em;"&gt;

&lt;em&gt; She's speaking fast because she is afraid. &lt;/em&gt;

        &lt;/div&gt;
      &lt;/td&gt;
   &lt;/tr&gt;




&lt;/tbody&gt;
&lt;/table&gt;


&lt;span style="padding: 5px; margin-right: 10px; color: white; font-size: 10px;"&gt;&lt;a style="text-decoration: none;" href="https://isopods.dreamwidth.org/8408.html"&gt;&amp;lt; isopods &amp;gt;&lt;/a&gt;&lt;/span&gt;
&lt;/center&gt;&lt;br /&gt;


&lt;center&gt;
&lt;span style="font-family: MS Gothic; font-size: 24px;"&gt;SPEECH BUBBLES&lt;/span&gt;
&lt;div style="max-width:500px;"&gt;
&lt;span style="font-family: MS Gothic;"&gt;Simple speech bubbles for NPC dialogue, instant messaging, etc. This is kind of an old template that uses tables, so it might be a little janky in places. Feel free to modify and make it better (or worse?)&lt;/span&gt;&lt;/div&gt;&lt;/center&gt;&lt;br /&gt;

&lt;span class="cut-wrapper"&gt;&lt;span style="display: none;" id="span-cuttag___1" class="cuttag"&gt;&lt;/span&gt;&lt;b class="cut-open"&gt;(&amp;nbsp;&lt;/b&gt;&lt;b class="cut-text"&gt;&lt;a href="https://isopods.dreamwidth.org/8408.html#cutid1"&gt;Instructions and code below the cut!&lt;/a&gt;&lt;/b&gt;&lt;b class="cut-close"&gt;&amp;nbsp;)&lt;/b&gt;&lt;/span&gt;&lt;div style="display: none;" id="div-cuttag___1" aria-live="assertive"&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;img src="https://www.dreamwidth.org/tools/commentcount?user=isopods&amp;ditemid=8408" width="30" height="12" alt="comment count unavailable" style="vertical-align: middle;"/&gt; comments</content>
  </entry>
  <entry>
    <id>tag:dreamwidth.org,2020-01-14:3603504:7577</id>
    <author>
      <name>Everett</name>
    </author>
    <dw:poster user="loupnoir"/>
    <link rel="alternate" type="text/html" href="https://isopods.dreamwidth.org/7577.html"/>
    <link rel="self" type="text/xml" href="https://isopods.dreamwidth.org/data/atom/?itemid=7577"/>
    <title>[08] - info; employee badge</title>
    <published>2023-09-07T20:15:34Z</published>
    <updated>2024-06-21T20:41:12Z</updated>
    <category term="misc"/>
    <category term="info"/>
    <category term="mobile friendly"/>
    <category term="*code"/>
    <dw:security>public</dw:security>
    <dw:reply-count>0</dw:reply-count>
    <content type="html">Posted by: &lt;span lj:user='loupnoir' style='white-space: nowrap;' class='ljuser'&gt;&lt;a href='https://loupnoir.dreamwidth.org/profile'&gt;&lt;img src='https://www.dreamwidth.org/img/silk/identity/user.png' alt='[personal profile] ' width='17' height='17' style='vertical-align: text-bottom; border: 0; padding-right: 1px;' /&gt;&lt;/a&gt;&lt;a href='https://loupnoir.dreamwidth.org/'&gt;&lt;b&gt;loupnoir&lt;/b&gt;&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;center&gt;

&lt;div style="  display: inline-block;  margin: auto;  font-family: &amp;#39;MS Gothic&amp;#39;;   --borderColor: #ffe36a;  --backgroundColor: #343a40;  background: var(--backgroundColor);  box-shadow: 8px 8px rgba(0, 0, 0, 0.5);"&gt;

&lt;div style="display: flex; flex-direction: row-reverse; flex-wrap: wrap; justify-content: center; align-items: flex-start;"&gt;



&lt;div style="padding-bottom: 10px;"&gt;
&lt;div style="display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; background-color: var(--borderColor); min-width: 400px; min-height: 50px;"&gt;

&lt;img src="https://laughingkaiju.com/images/zone_screenshots/assets/logo.png" style="width: 35px; margin: 10px;"&gt;
&lt;div style="text-transform: uppercase; font-size: 24px; color: var(--backgroundColor); padding-right: 15px;"&gt;

federal bureau of coherence
&lt;/div&gt;
&lt;/div&gt;


&lt;div style="margin: 10px 10px 0px 10px;color: white;border: 2px dotted var(--borderColor);"&gt;

&lt;div style="font-size: 24px;font-weight: 800;padding: 5px;border-bottom: 2px dotted var(--borderColor);"&gt;
THE DETECTIVE
&lt;/div&gt;

&lt;div style="display: flex;flex-direction: row; justify-content: space-evenly;font-size: 14px;padding: 5px;border-bottom: 2px dotted var(--borderColor);"&gt;
&lt;div style="width: 50%; border-right: 2px dotted var(--borderColor);"&gt;
&lt;b&gt;NAME:&lt;/b&gt; NICK VERGHESE
&lt;/div&gt;

&lt;div style="width: 50%;"&gt;
&lt;b&gt;PRONOUNS:&lt;/b&gt; HE/HIM
&lt;/div&gt;
&lt;/div&gt;


&lt;div style="display: flex;flex-direction: row; justify-content: space-evenly;font-size: 14px;padding: 5px;border-bottom: 2px dotted var(--borderColor);"&gt;
&lt;div style="width: 50%; border-right: 2px dotted var(--borderColor);"&gt;
&lt;b&gt;HEIGHT:&lt;/b&gt; 5'-06"
&lt;/div&gt;

&lt;div style="width: 50%;"&gt;
&lt;b&gt;EYES:&lt;/b&gt; BROWN
&lt;/div&gt;
&lt;/div&gt;


&lt;div style="display: flex;flex-direction: row; justify-content: space-evenly;font-size: 14px;padding: 5px;"&gt;
&lt;div style="width: 50%; border-right: 2px dotted var(--borderColor);"&gt;
&lt;b&gt;DOB:&lt;/b&gt; 1/2/199X
&lt;/div&gt;

&lt;div style="width: 50%;"&gt;
&lt;b&gt;ID:&lt;/b&gt; E14-3923489723
&lt;/div&gt;
&lt;/div&gt;

&lt;/div&gt;

&lt;/div&gt;



&lt;div style="display: flex;align-items: center;justify-content: center;padding: 10px;background-color: var(--borderColor);"&gt;

&lt;img src="https://loupnoir.dreamwidth.org/file/5642.png" width="200px"&gt;

&lt;/div&gt;


&lt;/div&gt;





&lt;div style="            color: white;            margin: 15px 10px 0px 10px;            padding: 10px;            text-align: left;            border: 1px solid var(--borderColor);            max-width: 575px;            font-size: 14px;"&gt;

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;br /&gt;&lt;br /&gt;

Diam vulputate ut pharetra sit amet aliquam id diam maecenas. Consequat ac felis donec et odio pellentesque diam volutpat commodo. Hendrerit dolor magna eget est lorem. Nascetur ridiculus mus mauris vitae. A arcu cursus vitae congue mauris rhoncus. Nec nam aliquam sem et tortor consequat id porta. 

&lt;/div&gt;




&lt;span style="float: right; padding: 5px; margin-right: 10px; color: white; font-size: 10px;"&gt;&lt;a style="text-decoration: none; color: var(--borderColor)" href="https://isopods.dreamwidth.org/7577.html"&gt;&amp;lt; isopods &amp;gt;&lt;/a&gt;
        &lt;/span&gt;

&lt;/div&gt;

&lt;/center&gt;&lt;br /&gt;&lt;br /&gt;

&lt;center&gt;
&lt;span style="font-family: MS Gothic; font-size: 24px;"&gt;EMPLOYEE BADGE&lt;/span&gt;
&lt;div style="max-width:500px;"&gt;
&lt;span style="font-family: MS Gothic;"&gt;A simple info page for a character.&lt;br /&gt;
Feel free to modify for your own needs!&lt;/span&gt;&lt;/div&gt;&lt;/center&gt;&lt;br /&gt;

&lt;span class="cut-wrapper"&gt;&lt;span style="display: none;" id="span-cuttag___1" class="cuttag"&gt;&lt;/span&gt;&lt;b class="cut-open"&gt;(&amp;nbsp;&lt;/b&gt;&lt;b class="cut-text"&gt;&lt;a href="https://isopods.dreamwidth.org/7577.html#cutid1"&gt;Instructions and code below the cut!&lt;/a&gt;&lt;/b&gt;&lt;b class="cut-close"&gt;&amp;nbsp;)&lt;/b&gt;&lt;/span&gt;&lt;div style="display: none;" id="div-cuttag___1" aria-live="assertive"&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;img src="https://www.dreamwidth.org/tools/commentcount?user=isopods&amp;ditemid=7577" width="30" height="12" alt="comment count unavailable" style="vertical-align: middle;"/&gt; comments</content>
  </entry>
  <entry>
    <id>tag:dreamwidth.org,2020-01-14:3603504:5355</id>
    <author>
      <name>Everett</name>
    </author>
    <dw:poster user="loupnoir"/>
    <link rel="alternate" type="text/html" href="https://isopods.dreamwidth.org/5355.html"/>
    <link rel="self" type="text/xml" href="https://isopods.dreamwidth.org/data/atom/?itemid=5355"/>
    <title>[07] - info; at a glance</title>
    <published>2022-10-02T22:24:49Z</published>
    <updated>2022-10-03T00:55:34Z</updated>
    <category term="*code"/>
    <category term="mobile friendly"/>
    <category term="misc"/>
    <category term="info"/>
    <dw:security>public</dw:security>
    <dw:reply-count>12</dw:reply-count>
    <content type="html">Posted by: &lt;span lj:user='loupnoir' style='white-space: nowrap;' class='ljuser'&gt;&lt;a href='https://loupnoir.dreamwidth.org/profile'&gt;&lt;img src='https://www.dreamwidth.org/img/silk/identity/user.png' alt='[personal profile] ' width='17' height='17' style='vertical-align: text-bottom; border: 0; padding-right: 1px;' /&gt;&lt;/a&gt;&lt;a href='https://loupnoir.dreamwidth.org/'&gt;&lt;b&gt;loupnoir&lt;/b&gt;&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;

&lt;center&gt;
&lt;div style="margin: auto; background-image: url(&amp;#39;https://i.imgur.com/q0EJgyi.jpg&amp;#39;); background-size: cover; background-position: center center; margin: auto; color: white; border-radius: 5px; font-family: MS Gothic; display: inline-block;"&gt;


&lt;div style="display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 10px;"&gt;


&lt;div style="max-width: 250px; margin: 10px;"&gt;


&lt;center&gt;
&lt;img src="https://f2.toyhou.se/file/f2-toyhou-se/thumbnails/53252205_bxY.jpg" style="border-width: 10px 10px 50px 10px;             border-style: solid;             border-color: white;             transform: rotate(4deg);             object-fit: cover;             object-position: center top;             margin: 10px;             box-shadow: 5px 5px rgba(0, 0, 0, 0.5);"&gt;

&lt;/center&gt;

          
 
&lt;div style="padding: 15px; text-align: left; background-color: rgba(0,0,0,0.6); border-radius: 15px;"&gt;

&lt;div style="font-family: Mistral; text-align: center; font-size: 2em; text-transform: uppercase; font-weight: 800; margin: 5px;"&gt;

Nick Verghese

&lt;/div&gt;

&lt;div style="font-family: Courier New; padding: 5px; margin: auto;"&gt;

&lt;b&gt;GENDER:&lt;/b&gt; male [he/him]&lt;br /&gt;
&lt;b&gt;SEXUALITY:&lt;/b&gt; bisexual&lt;br /&gt;
&lt;b&gt;AGE:&lt;/b&gt; 29 [january 2nd]&lt;br /&gt;
&lt;b&gt;HEIGHT:&lt;/b&gt; 5'6" [1.67 m]&lt;br /&gt;
&lt;b&gt;OCCUPATION:&lt;/b&gt; private investigator

&lt;/div&gt;
          

&lt;/div&gt;



&lt;small&gt;&amp;lt; code by &lt;a href="https://isopods.dreamwidth.org/5355.html" style="color: #f9d277;"&gt;isopods&lt;/a&gt; &amp;gt;&lt;/small&gt;

&lt;/div&gt;



&lt;div style="max-width: 500px; margin: 10px;"&gt;
&lt;div style="max-height: 500px; overflow: auto; padding: 15px; text-align: justify; background-color: rgba(0,0,0,0.6);  border-radius: 15px;"&gt;

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Aliquet risus feugiat in ante metus dictum at tempor commodo. Ornare aenean euismod elementum nisi quis eleifend quam adipiscing. Venenatis urna cursus eget nunc scelerisque viverra mauris in aliquam. In nibh mauris cursus mattis molestie a iaculis at. Volutpat consequat mauris nunc congue nisi vitae. Varius sit amet mattis vulputate. Aliquam nulla facilisi cras fermentum odio eu. Nibh mauris cursus mattis molestie a iaculis. Dictum sit amet justo donec enim diam.&lt;br /&gt;&lt;br /&gt;

Posuere morbi leo urna molestie at elementum eu facilisis. Eget mi proin sed libero enim sed. Rhoncus aenean vel elit scelerisque mauris pellentesque pulvinar. Integer eget aliquet nibh praesent. Tempor id eu nisl nunc mi. Pharetra pharetra massa massa ultricies. Lacus vestibulum sed arcu non odio euismod. Justo donec enim diam vulputate ut pharetra sit amet aliquam. Amet luctus venenatis lectus magna fringilla urna porttitor. Vitae tortor condimentum lacinia quis vel eros donec ac odio.&lt;br /&gt;&lt;br /&gt;

In vitae turpis massa sed elementum tempus egestas. Felis imperdiet proin fermentum leo vel orci. Penatibus et magnis dis parturient montes nascetur. Mauris nunc congue nisi vitae suscipit tellus mauris a diam. Turpis cursus in hac habitasse platea dictumst quisque. Eget arcu dictum varius duis at consectetur lorem donec. Mattis ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget. Gravida cum sociis natoque penatibus et. Urna neque viverra justo nec ultrices dui. Ut morbi tincidunt augue interdum velit euismod in.&lt;br /&gt;&lt;br /&gt;

Eget est lorem ipsum dolor sit. Lectus sit amet est placerat in egestas erat imperdiet. Erat nam at lectus urna. Sed id semper risus in hendrerit gravida. Cras tincidunt lobortis feugiat vivamus at augue eget arcu dictum. Venenatis cras sed felis eget velit aliquet sagittis id. Aenean pharetra magna ac placerat. Vel fringilla est ullamcorper eget nulla facilisi. Quam nulla porttitor massa id neque aliquam vestibulum. Aliquet eget sit amet tellus cras adipiscing. Sociis natoque penatibus et magnis dis parturient montes. Eu nisl nunc mi ipsum faucibus vitae. Dui sapien eget mi proin sed. Et ligula ullamcorper malesuada proin libero nunc consequat interdum. Nulla at volutpat diam ut venenatis tellus in metus. Sociis natoque penatibus et magnis dis.&lt;br /&gt;&lt;br /&gt;

Nunc id cursus metus aliquam. Elit duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Cras adipiscing enim eu turpis. Et netus et malesuada fames ac turpis egestas sed tempus. Aliquam sem et tortor consequat id porta nibh. Pellentesque eu tincidunt tortor aliquam nulla facilisi cras fermentum odio. Lobortis elementum nibh tellus molestie. Sit amet volutpat consequat mauris nunc congue. Scelerisque felis imperdiet proin fermentum leo vel orci porta non. Mattis ullamcorper velit sed ullamcorper morbi tincidunt ornare massa. Vulputate odio ut enim blandit volutpat maecenas volutpat blandit. Tincidunt vitae semper quis lectus nulla at. Dapibus ultrices in iaculis nunc sed augue. Suspendisse in est ante in nibh. Nibh tortor id aliquet lectus proin nibh. Libero volutpat sed cras ornare arcu dui vivamus arcu felis. Faucibus interdum posuere lorem ipsum. Dignissim enim sit amet venenatis urna cursus.

&lt;/div&gt;
&lt;/div&gt;


&lt;/div&gt;


&lt;/div&gt;

&lt;/center&gt;


&lt;br /&gt;
&lt;center&gt;
&lt;span style="font-family: MS Gothic; font-size: 24px;"&gt;AT A GLANCE&lt;/span&gt;
&lt;div style="max-width:500px;"&gt;
&lt;span style="font-family: MS Gothic;"&gt;A simple template to jot down information about a character. I made this to give people an overview of my original character without overloading people with too much info, but feel free to use this for whatever you'd like! I'll make another version for maximalists sometime....&lt;/span&gt;&lt;/div&gt;&lt;/center&gt;&lt;br /&gt;

&lt;span class="cut-wrapper"&gt;&lt;span style="display: none;" id="span-cuttag___1" class="cuttag"&gt;&lt;/span&gt;&lt;b class="cut-open"&gt;(&amp;nbsp;&lt;/b&gt;&lt;b class="cut-text"&gt;&lt;a href="https://isopods.dreamwidth.org/5355.html#cutid1"&gt;Instructions and code below the cut!&lt;/a&gt;&lt;/b&gt;&lt;b class="cut-close"&gt;&amp;nbsp;)&lt;/b&gt;&lt;/span&gt;&lt;div style="display: none;" id="div-cuttag___1" aria-live="assertive"&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;img src="https://www.dreamwidth.org/tools/commentcount?user=isopods&amp;ditemid=5355" width="30" height="12" alt="comment count unavailable" style="vertical-align: middle;"/&gt; comments</content>
  </entry>
  <entry>
    <id>tag:dreamwidth.org,2020-01-14:3603504:4204</id>
    <author>
      <name>Everett</name>
    </author>
    <dw:poster user="loupnoir"/>
    <link rel="alternate" type="text/html" href="https://isopods.dreamwidth.org/4204.html"/>
    <link rel="self" type="text/xml" href="https://isopods.dreamwidth.org/data/atom/?itemid=4204"/>
    <title>[05] info; id card profile</title>
    <published>2021-07-12T03:25:25Z</published>
    <updated>2021-07-12T15:59:09Z</updated>
    <category term="misc"/>
    <category term="info"/>
    <category term="*code"/>
    <dw:security>public</dw:security>
    <dw:reply-count>0</dw:reply-count>
    <content type="html">Posted by: &lt;span lj:user='loupnoir' style='white-space: nowrap;' class='ljuser'&gt;&lt;a href='https://loupnoir.dreamwidth.org/profile'&gt;&lt;img src='https://www.dreamwidth.org/img/silk/identity/user.png' alt='[personal profile] ' width='17' height='17' style='vertical-align: text-bottom; border: 0; padding-right: 1px;' /&gt;&lt;/a&gt;&lt;a href='https://loupnoir.dreamwidth.org/'&gt;&lt;b&gt;loupnoir&lt;/b&gt;&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;span class="cut-wrapper"&gt;&lt;span style="display: none;" id="span-cuttag___1" class="cuttag"&gt;&lt;/span&gt;&lt;b class="cut-open"&gt;(&amp;nbsp;&lt;/b&gt;&lt;b class="cut-text"&gt;&lt;a href="https://isopods.dreamwidth.org/4204.html#cutid1"&gt;Live preview, instructions, and code below the cut!&lt;/a&gt;&lt;/b&gt;&lt;b class="cut-close"&gt;&amp;nbsp;)&lt;/b&gt;&lt;/span&gt;&lt;div style="display: none;" id="div-cuttag___1" aria-live="assertive"&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;img src="https://www.dreamwidth.org/tools/commentcount?user=isopods&amp;ditemid=4204" width="30" height="12" alt="comment count unavailable" style="vertical-align: middle;"/&gt; comments</content>
  </entry>
  <entry>
    <id>tag:dreamwidth.org,2020-01-14:3603504:2311</id>
    <author>
      <name>Everett</name>
    </author>
    <dw:poster user="loupnoir"/>
    <link rel="alternate" type="text/html" href="https://isopods.dreamwidth.org/2311.html"/>
    <link rel="self" type="text/xml" href="https://isopods.dreamwidth.org/data/atom/?itemid=2311"/>
    <title>[04] misc; AIM template</title>
    <published>2020-05-27T01:59:23Z</published>
    <updated>2022-08-02T17:40:37Z</updated>
    <category term="misc"/>
    <category term="*code"/>
    <dw:security>public</dw:security>
    <dw:reply-count>5</dw:reply-count>
    <content type="html">Posted by: &lt;span lj:user='loupnoir' style='white-space: nowrap;' class='ljuser'&gt;&lt;a href='https://loupnoir.dreamwidth.org/profile'&gt;&lt;img src='https://www.dreamwidth.org/img/silk/identity/user.png' alt='[personal profile] ' width='17' height='17' style='vertical-align: text-bottom; border: 0; padding-right: 1px;' /&gt;&lt;/a&gt;&lt;a href='https://loupnoir.dreamwidth.org/'&gt;&lt;b&gt;loupnoir&lt;/b&gt;&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;

&lt;div class="aolcontainer" style="   width: 500px;   margin: auto;   border-width: 3px 3px 3px 3px;   border-style: solid;   border-color: #0166fb;   border-radius: 3px;"&gt;
    &lt;div class="aolheader" style="   width: 100%;   background: linear-gradient(#0054e8, #0166fb);   display: inline-block;"&gt;
       &lt;div class="aolheadertext" style="   font-family: &amp;#39;MS Gothic&amp;#39;;   color: white;   vertical-align: middle;   padding: 5px;   font-weight: bold;   display: inline-block;"&gt;
          boomstick69 - Instant Message
       &lt;/div&gt;
       &lt;div class="aolheaderbutton_container" style="   display: inline-block;   float: right;   vertical-align: middle;   margin: 2px;"&gt;
       &lt;div class="aolheaderbutton" style="font-family: Arial;   color: white;   font-size: 16px;   height: 20px;   width: 20px;   border: 2px solid white;   border-radius: 4px;   display: inline-block;   text-align: center; background: linear-gradient(#7fa1fe, #0054e8)"&gt;
           -
       &lt;/div&gt;
       &lt;div class="aolheaderbutton" style="font-family: Arial;   color: white;   font-size: 16px;   height: 20px;   width: 20px;   border: 2px solid white;   border-radius: 4px;   display: inline-block;   text-align: center; background: linear-gradient(#7fa1fe, #0054e8)"&gt;
           □
       &lt;/div&gt;
       &lt;div class="aolheaderbutton" style="font-family: Arial;   color: white;   font-size: 16px;   height: 20px;   width: 20px;   border: 2px solid white;   border-radius: 4px;   display: inline-block;   text-align: center; background: linear-gradient(#ec948b, #e4422a);"&gt;
           X
       &lt;/div&gt;
       &lt;/div&gt;
    &lt;/div&gt;


    &lt;div class="aolchat_container" style="background: #ece9d8; width: 100%;"&gt;

       &lt;div class="aolchat_options_header" style="margin-top: 3px; display: inline-block;"&gt;
         &lt;div class="aolchat_options_button" style="color: black;   font-family: &amp;#39;MS Gothic&amp;#39;;   font-size: 12px;   margin-right: 10px;   display: inline-block;   text-align: left; margin-left: 5px;"&gt;&lt;u&gt;F&lt;/u&gt;ile&lt;/div&gt;
         &lt;div class="aolchat_options_button" style="color: black;   font-family: &amp;#39;MS Gothic&amp;#39;;   font-size: 12px;   margin-right: 10px;   display: inline-block;   text-align: left;"&gt;&lt;u&gt;E&lt;/u&gt;dit&lt;/div&gt;
         &lt;div class="aolchat_options_button" style="color: black;   font-family: &amp;#39;MS Gothic&amp;#39;;   font-size: 12px;   margin-right: 10px;   display: inline-block;   text-align: left;"&gt;I&lt;u&gt;n&lt;/u&gt;sert&lt;/div&gt;
         &lt;div class="aolchat_options_button" style="color: black;   font-family: &amp;#39;MS Gothic&amp;#39;;   font-size: 12px;   margin-right: 10px;   display: inline-block;   text-align: left;"&gt;&lt;u&gt;P&lt;/u&gt;eople&lt;/div&gt;
       &lt;/div&gt;
      &lt;div class="aolchat_options_button" style="color: black;   font-family: &amp;#39;MS Gothic&amp;#39;;   font-size: 12px;   margin-right: 10px;   display: inline-block;   text-align: left; float: right; margin-top: 5px;"&gt;boomstick69 Warning Level: 45%&lt;/div&gt;

     &lt;div class="aolchat_messages" style="background: white;   color: black;   font-family: Times New Roman;   font-size: 14px;   border-width: 2px 0px 0px 2px;   border-color: #aca899;   border-style: solid;   border-radius: 1px;   text-align: left;   overflow: auto;   height: 200px;   margin: 5px;   padding: 5px;"&gt;

&lt;span class="aolchat_them" style="font-weight: bold; color: blue;"&gt;boomstick69:&lt;/span&gt; what's up? &lt;br /&gt;

&lt;span class="aolchat_you" style="font-weight: bold; color: red;"&gt;unknown_user:&lt;/span&gt; hey &lt;br /&gt;

&lt;span class="aolchat_them" style="font-weight: bold; color: blue;"&gt;boomstick69:&lt;/span&gt; i can show you my boomstick if you'd like ;) &lt;br /&gt;

&lt;span class="aolchat_you" style="font-weight: bold; color: red;"&gt;unknown_user:&lt;/span&gt; no thanks &lt;br /&gt;

&lt;span class="aolchat_you" style="font-weight: bold; color: red;"&gt;unknown_user has blocked boomstick69!&lt;/span&gt; &lt;br /&gt;
&lt;hr&gt;
&lt;span class="aolchat_you" style="font-weight: bold; color: red;"&gt;unknown_user:&lt;/span&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consectetur aliquam imperdiet. Nullam congue scelerisque leo rutrum pulvinar. &lt;br /&gt;

&lt;span class="aolchat_you" style="font-weight: bold; color: red;"&gt;unknown_user:&lt;/span&gt; Donec lobortis justo vitae metus semper laoreet. Phasellus feugiat metus sit amet risus suscipit, id lacinia diam fermentum. Aliquam lobortis lacus dui, non pretium enim tincidunt non.&lt;br /&gt;

&lt;span class="aolchat_you" style="font-weight: bold; color: red;"&gt;unknown_user:&lt;/span&gt; Sed consequat commodo augue eu hendrerit. Nulla id mauris eu erat luctus iaculis auctor ut leo. Curabitur euismod interdum ex, sed pulvinar augue. Sed eget nunc faucibus, varius eros pretium, maximus quam.

     &lt;/div&gt;

     &lt;center&gt;&lt;img src="https://i.imgur.com/fymVUtj.png" style="vertical-align: middle"&gt;&lt;/center&gt;

     &lt;div class="aolchat_messages" style="background: white;   color: black;   font-family: Times New Roman;   font-size: 16px;   border-width: 2px 0px 0px 2px;   border-color: #aca899;   border-style: solid;   border-radius: 1px;   text-align: left;   overflow: auto;   margin: 5px;   padding: 5px;   height: 75px;"&gt;&lt;/div&gt;

     &lt;center&gt;&lt;img src="https://i.imgur.com/OhrtMA5.png" style="margin: 5px; width: 480px;"&gt;&lt;/center&gt;

    &lt;/div&gt;
&lt;/div&gt;&lt;br /&gt;
&lt;span style="float: right; font-family: &amp;#39;MS Gothic&amp;#39;; font-size: 10px;"&gt;&lt;a href="https://isopods.dreamwidth.org/2311.html"&gt;code&lt;/a&gt; @ &lt;span style='white-space: nowrap;'&gt;&lt;a href='https://isopods.dreamwidth.org/profile'&gt;&lt;img src='https://www.dreamwidth.org/img/silk/identity/community.png' alt='[community profile] ' width='16' height='16' style='vertical-align: text-bottom; border: 0; padding-right: 1px;' /&gt;&lt;/a&gt;&lt;a href='https://isopods.dreamwidth.org/'&gt;&lt;b&gt;isopods&lt;/b&gt;&lt;/a&gt;&lt;/span&gt;&lt;/span&gt;
&lt;br /&gt;&lt;center&gt;&lt;span style="font-family: MS Gothic; font-size: 24px;"&gt;AOL Instant Messaging Template&lt;/span&gt;&lt;br /&gt;&lt;div style="max-width:500px;"&gt;&lt;span style="font-family: MS Gothic;"&gt;Pretend like it's the '90s by using this extremely cool and modern AOL Instant Messaging template. I have no idea what you would use this for, but feel free to take this code and modify it to your whims.&lt;/span&gt;&lt;/div&gt;&lt;/center&gt;&lt;br /&gt;&lt;span class="cut-wrapper"&gt;&lt;span style="display: none;" id="span-cuttag___1" class="cuttag"&gt;&lt;/span&gt;&lt;b class="cut-open"&gt;(&amp;nbsp;&lt;/b&gt;&lt;b class="cut-text"&gt;&lt;a href="https://isopods.dreamwidth.org/2311.html#cutid1"&gt;Instructions and code below the cut!&lt;/a&gt;&lt;/b&gt;&lt;b class="cut-close"&gt;&amp;nbsp;)&lt;/b&gt;&lt;/span&gt;&lt;div style="display: none;" id="div-cuttag___1" aria-live="assertive"&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;img src="https://www.dreamwidth.org/tools/commentcount?user=isopods&amp;ditemid=2311" width="30" height="12" alt="comment count unavailable" style="vertical-align: middle;"/&gt; comments</content>
  </entry>
  <entry>
    <id>tag:dreamwidth.org,2020-01-14:3603504:2284</id>
    <author>
      <name>Everett</name>
    </author>
    <dw:poster user="loupnoir"/>
    <link rel="alternate" type="text/html" href="https://isopods.dreamwidth.org/2284.html"/>
    <link rel="self" type="text/xml" href="https://isopods.dreamwidth.org/data/atom/?itemid=2284"/>
    <title>[03] navigation; tabbed (terminal &amp; folder)</title>
    <published>2020-05-02T20:57:41Z</published>
    <updated>2020-05-03T19:27:18Z</updated>
    <category term="*code"/>
    <category term="navigation"/>
    <category term="misc"/>
    <dw:security>public</dw:security>
    <dw:reply-count>10</dw:reply-count>
    <content type="html">Posted by: &lt;span lj:user='loupnoir' style='white-space: nowrap;' class='ljuser'&gt;&lt;a href='https://loupnoir.dreamwidth.org/profile'&gt;&lt;img src='https://www.dreamwidth.org/img/silk/identity/user.png' alt='[personal profile] ' width='17' height='17' style='vertical-align: text-bottom; border: 0; padding-right: 1px;' /&gt;&lt;/a&gt;&lt;a href='https://loupnoir.dreamwidth.org/'&gt;&lt;b&gt;loupnoir&lt;/b&gt;&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;


&lt;div style="display: block;   height: 400px;   width: 600px;   background: linear-gradient(to bottom, #000000 0%, #006600 100%);   border: 5px solid #32d932;   border-radius: 2px;   overflow: hidden;   margin: auto;"&gt;


&lt;div style="display: block;   height: 400px;   width: 600px;"&gt;


&lt;a name="MAIN"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 29px;"&gt;

&lt;div style="color: #000000;  font-family: Courier New;  font-size: 20px;  background-color: #32d932;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
HOME
&lt;/div&gt;

&lt;a href="#PAGE2" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 2
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE3" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 3
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE4" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 4
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE5" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 5
&lt;/div&gt;
&lt;/a&gt;

&lt;/div&gt;
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 350px;  margin: auto;  border: 2px solid #32d932;  color: #FFFFFF;  font-family: Courier New;  background-color: rgba(0,0,0,0.5);  overflow: auto;"&gt;
&lt;br /&gt;
&lt;center&gt;&lt;img src="https://media2.giphy.com/media/10mgrhuEWNasNO/source.gif" width="250"&gt;&lt;/center&gt;
&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed et aliquam tortor. Morbi iaculis orci ipsum, a rutrum nibh maximus a. Nulla lacus ante, dignissim sit amet lacus ac, lacinia ultrices massa. Vestibulum volutpat, turpis ut tempor tempus, augue enim pharetra eros, et condimentum urna nulla at neque.&lt;br /&gt;&lt;br /&gt;
Maecenas at augue imperdiet, pellentesque augue sed, volutpat metus. Quisque auctor dolor sit amet auctor ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec suscipit est ut libero tempus ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus.&lt;br /&gt;&lt;br /&gt;
&lt;/div&gt;
&lt;/div&gt; 


&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; color: #32d932; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;

&lt;/div&gt; 






&lt;div style="display: block;   height: 400px;   width: 600px;"&gt;


&lt;a name="PAGE2"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 29px;"&gt;

&lt;a href="#MAIN" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
HOME
&lt;/div&gt;
&lt;/a&gt;

&lt;div style="color: #000000;  font-family: Courier New;  font-size: 20px;  background-color: #32d932;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 2
&lt;/div&gt;

&lt;a href="#PAGE3" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 3
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE4" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 4
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE5" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 5
&lt;/div&gt;
&lt;/a&gt;

&lt;/div&gt; 
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 350px;  margin: auto;  border: 2px solid #32d932;  color: #FFFFFF;  font-family: Courier New;  background-color: rgba(0,0,0,0.5);  overflow: auto;"&gt;
&lt;br /&gt;
&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sollicitudin diam nec nisi consectetur, eget volutpat leo varius. Vestibulum malesuada erat felis, eu finibus nibh viverra quis. Maecenas at augue imperdiet, pellentesque augue sed, volutpat metus. Quisque auctor dolor sit amet auctor ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec suscipit est ut libero tempus ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus.&lt;br /&gt;&lt;br /&gt;

Etiam eleifend faucibus ornare. Sed eget vestibulum ipsum, eu pulvinar purus. Donec accumsan, risus ac lobortis scelerisque, nulla lacus porttitor diam, vestibulum fermentum ante diam vel velit. Pellentesque aliquam quam nisl, quis bibendum risus posuere eu. Ut ullamcorper erat ac est dictum cursus. Aliquam erat volutpat. Curabitur quis mauris dui. Duis tempor dolor magna, in interdum magna pharetra vitae. Sed eros ex, interdum vitae pharetra eget, commodo quis turpis. Nam gravida metus finibus massa vehicula, vitae vestibulum leo rhoncus. Donec semper est sagittis ante auctor, a vulputate augue aliquet. 
&lt;/div&gt;
&lt;/div&gt; 


&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; color: #32d932; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;

&lt;/div&gt; 




&lt;div style="display: block;   height: 400px;   width: 600px;"&gt;


&lt;a name="PAGE3"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 29px;"&gt;

&lt;a href="#MAIN" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
HOME
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE2" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 2
&lt;/div&gt;
&lt;/a&gt;

&lt;div style="color: #000000;  font-family: Courier New;  font-size: 20px;  background-color: #32d932;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 3
&lt;/div&gt;

&lt;a href="#PAGE4" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 4
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE5" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 5
&lt;/div&gt;
&lt;/a&gt;

&lt;/div&gt; 
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 350px;  margin: auto;  border: 2px solid #32d932;  color: #FFFFFF;  font-family: Courier New;  background-color: rgba(0,0,0,0.5);  overflow: auto;"&gt;
&lt;br /&gt;
&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
Vestibulum malesuada erat felis, eu finibus nibh viverra quis. Maecenas at augue imperdiet, pellentesque augue sed, volutpat metus. Quisque auctor dolor sit amet auctor ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec suscipit est ut libero tempus ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus.
&lt;/div&gt;
&lt;/div&gt; 


&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; color: #32d932; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;

&lt;/div&gt; 





&lt;div style="display: block;   height: 400px;   width: 600px;"&gt;


&lt;a name="PAGE4"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 29px;"&gt;

&lt;a href="#MAIN" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
HOME
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE2" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 2
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE3" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 3
&lt;/div&gt;
&lt;/a&gt;

&lt;div style="color: #000000;  font-family: Courier New;  font-size: 20px;  background-color: #32d932;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 4
&lt;/div&gt;

&lt;a href="#PAGE5" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 5
&lt;/div&gt;
&lt;/a&gt;

&lt;/div&gt; 
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 350px;  margin: auto;  border: 2px solid #32d932;  color: #FFFFFF;  font-family: Courier New;  background-color: rgba(0,0,0,0.5);  overflow: auto;"&gt;
&lt;br /&gt;
&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
&lt;center&gt;&lt;img src="https://66.media.tumblr.com/e604d454672d62dc316dcbe97e8cbc2b/tumblr_pmui3mN3aw1vih62do1_540.gifv" width="300"&gt;&lt;/center&gt;
&lt;br /&gt;
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vulputate aliquam maximus. Praesent sit amet ex posuere, tincidunt lectus ut, fermentum tortor. Etiam elementum dolor nec imperdiet aliquet. Ut mollis in lorem in laoreet. Donec porttitor eu tortor et placerat.
&lt;/div&gt;
&lt;/div&gt; 


&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; color: #32d932; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;

&lt;/div&gt; 






&lt;div style="display: block;   height: 400px;   width: 600px;"&gt;


&lt;a name="PAGE5"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 29px;"&gt;

&lt;a href="#MAIN" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
HOME
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE2" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 2
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE3" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 3
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#PAGE4" style="text-decoration: none;"&gt;
&lt;div style="color: #32d932;  font-family: Courier New;  font-size: 20px;  background-color: #000000;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 4
&lt;/div&gt;
&lt;/a&gt;

&lt;div style="color: #000000;  font-family: Courier New;  font-size: 20px;  background-color: #32d932;  display: inline-block;  padding-left: 5px;  padding-right: 5px;"&gt;
PAGE 5
&lt;/div&gt;

&lt;/div&gt; 
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 350px;  margin: auto;  border: 2px solid #32d932;  color: #FFFFFF;  font-family: Courier New;  background-color: rgba(0,0,0,0.5);  overflow: auto;"&gt;
&lt;br /&gt;
&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
&lt;center&gt;&lt;img src="https://i.gifer.com/50Ey.gif" width="300"&gt;&lt;/center&gt;
&lt;br /&gt;
idk what to put here
&lt;/div&gt;
&lt;/div&gt; 


&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; color: #32d932; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;

&lt;/div&gt; 

&lt;/div&gt; 






&lt;br /&gt;&lt;br /&gt;








&lt;div style="display: block;   width: 650px;   height: 450px;   overflow: hidden;   background-color: rbga(255,255,255,1);   margin: auto;"&gt;



&lt;div style="display: block;   width: 650px;   height: 450px;"&gt;


&lt;a name="FOLDER"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 31px;"&gt;

&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #d4ceb2;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
INFO
&lt;/div&gt;

&lt;a href="#FOLDER2" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
CR CHART
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER3" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
IMPRESSIONS
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER4" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
VISUALS
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER5" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
THREADS
&lt;/div&gt;
&lt;/a&gt;

&lt;/div&gt;
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 400px;  margin: auto;  border: 2px solid #d4ceb2;  color: #000000;  font-family: Courier New;  background-color: #d4ceb2;"&gt;
&lt;br /&gt;
&lt;div style="   background-image: url(&amp;#39;https://i.imgur.com/uYGlVgk.png&amp;#39;);   background-color: rgba(255, 255, 255);   height: 90%;   width: 90%;   margin: auto;   font-family: &amp;#39;MS Gothic&amp;#39;;   overflow: auto;"&gt;
&lt;br /&gt;

&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
&lt;center&gt;

&lt;div style="border: 1px #000000 solid; width: 120px; height: 140px;"&gt;
&lt;img src="https://v.dreamwidth.org/13546174/3369152" style="border-width: 10px 10px 30px 10px; border-color: #ffffff; border-style: solid;"&gt;
&lt;/div&gt;&lt;/center&gt;

&lt;br /&gt;
Here's some info text, maybe a quote. Blah blah blah. Pretend I'm saying some important stuff here. Juno Steel deserves all the hugs in the world. Lorem ipsum whatever. Ask me how I make a "polaroid" border for icons using only HTML.&lt;br /&gt;&lt;br /&gt;

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam malesuada interdum nisi ut varius.
&lt;/div&gt;

&lt;/div&gt;

&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;
&lt;/div&gt; 

&lt;/div&gt; 



&lt;div style="display: block;   height: 450px;   width: 650px;"&gt;


&lt;a name="FOLDER2"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 31px;"&gt;

&lt;a href="#FOLDER" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
INFO
&lt;/div&gt;
&lt;/a&gt;

&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #d4ceb2;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
CR CHART
&lt;/div&gt;


&lt;a href="#FOLDER3" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
IMPRESSIONS
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER4" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
VISUALS
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER5" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
THREADS
&lt;/div&gt;
&lt;/a&gt;

&lt;/div&gt;
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 400px;  margin: auto;  border: 2px solid #d4ceb2;  color: #000000;  font-family: Courier New;  background-color: #d4ceb2;"&gt;
&lt;br /&gt;
&lt;div style="   background-image: url(&amp;#39;https://i.imgur.com/uYGlVgk.png&amp;#39;);   background-color: rgba(255, 255, 255);   height: 90%;   width: 90%;   margin: auto;   font-family: &amp;#39;MS Gothic&amp;#39;;   overflow: auto;"&gt;
&lt;br /&gt;

&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
WOOHOO a cr chart or something goes here idk&lt;br /&gt;&lt;br /&gt;

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin aliquam arcu quis auctor viverra. Nunc volutpat ante a semper tempor. Quisque feugiat elit vitae mauris convallis luctus. Curabitur a orci elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aenean suscipit mi sem. Vestibulum semper elementum lorem non mattis. Maecenas suscipit facilisis luctus. Sed turpis tortor, tempus eu sagittis eu, accumsan vel odio. 
&lt;/div&gt;

&lt;/div&gt;

&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;
&lt;/div&gt; 

&lt;/div&gt; 





&lt;div style="display: block;   height: 450px;   width: 650px;"&gt;


&lt;a name="FOLDER3"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 31px;"&gt;

&lt;a href="#FOLDER" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
INFO
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER2" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
CR CHART
&lt;/div&gt;
&lt;/a&gt;


&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #d4ceb2;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
IMPRESSIONS
&lt;/div&gt;


&lt;a href="#FOLDER4" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
VISUALS
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER5" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
THREADS
&lt;/div&gt;
&lt;/a&gt;

&lt;/div&gt;
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 400px;  margin: auto;  border: 2px solid #d4ceb2;  color: #000000;  font-family: Courier New;  background-color: #d4ceb2;"&gt;
&lt;br /&gt;
&lt;div style="   background-image: url(&amp;#39;https://i.imgur.com/uYGlVgk.png&amp;#39;);   background-color: rgba(255, 255, 255);   height: 90%;   width: 90%;   margin: auto;   font-family: &amp;#39;MS Gothic&amp;#39;;   overflow: auto;"&gt;
&lt;br /&gt;

&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
congrats you made it to page 3
&lt;/div&gt;

&lt;/div&gt;

&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;
&lt;/div&gt; 

&lt;/div&gt; 


&lt;div style="display: block;   height: 450px;   width: 650px;"&gt;


&lt;a name="FOLDER4"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 31px;"&gt;

&lt;a href="#FOLDER" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
INFO
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER2" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
CR CHART
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER3" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
IMPRESSIONS
&lt;/div&gt;
&lt;/a&gt;

&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #d4ceb2;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
VISUALS
&lt;/div&gt;

&lt;a href="#FOLDER5" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
THREADS
&lt;/div&gt;
&lt;/a&gt;

&lt;/div&gt;
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 400px;  margin: auto;  border: 2px solid #d4ceb2;  color: #000000;  font-family: Courier New;  background-color: #d4ceb2;"&gt;
&lt;br /&gt;
&lt;div style="   background-image: url(&amp;#39;https://i.imgur.com/uYGlVgk.png&amp;#39;);   background-color: rgba(255, 255, 255);   height: 90%;   width: 90%;   margin: auto;   font-family: &amp;#39;MS Gothic&amp;#39;;   overflow: auto;"&gt;
&lt;br /&gt;
&lt;center&gt;
&lt;img src="https://assets.rocketstock.com/uploads/2017/10/Bladerunner_Featured-1000x576.jpg" width="300"&gt;
&lt;br /&gt;
&lt;img src="https://66.media.tumblr.com/8335763760cf12cc77303d39026005ae/tumblr_om827ubO9T1s9dl3bo3_1280.jpg" width="300"&gt;
&lt;br /&gt;
&lt;img src="https://66.media.tumblr.com/a11bf479569bd72bb367e8700aebd12a/tumblr_mqgss6XxWG1qh6hioo1_r1_500.jpg" width="300"&gt;
&lt;/center&gt;&lt;br /&gt;
&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
i'm not sure what else to put here. i'm running out of lorem ipsum stuff
&lt;/div&gt;
&lt;br /&gt;
&lt;/div&gt;

&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;
&lt;/div&gt; 

&lt;/div&gt; 



&lt;div style="display: block;   height: 450px;   width: 650px;"&gt;


&lt;a name="FOLDER5"&gt;&lt;/a&gt;
&lt;div style="display: inline-block; width: 100%; margin-left: 31px;"&gt;

&lt;a href="#FOLDER" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
INFO
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER2" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
CR CHART
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER3" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
IMPRESSIONS
&lt;/div&gt;
&lt;/a&gt;

&lt;a href="#FOLDER4" style="text-decoration: none;"&gt;
&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #b0ab94;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
VISUALS
&lt;/div&gt;
&lt;/a&gt;

&lt;div style="font-family: Courier New;  color: #000000;  font-size: 18px;  background-color: #d4ceb2;  display: inline-block;  border-radius: 3px 3px 0px 0px;  padding-left: 5px;  padding-right: 5px;"&gt;
THREADS
&lt;/div&gt;

&lt;/div&gt;
&lt;br /&gt;


&lt;div style="  display: block;  width: 90%;  height: 400px;  margin: auto;  border: 2px solid #d4ceb2;  color: #000000;  font-family: Courier New;  background-color: #d4ceb2;"&gt;
&lt;br /&gt;
&lt;div style="   background-image: url(&amp;#39;https://i.imgur.com/uYGlVgk.png&amp;#39;);   background-color: rgba(255, 255, 255);   height: 90%;   width: 90%;   margin: auto;   font-family: &amp;#39;MS Gothic&amp;#39;;   overflow: auto;"&gt;
&lt;br /&gt;
&lt;div style="max-width: 90%; margin: auto; text-align: left;"&gt;
i guess you could put thread tracking here if you were a madman
&lt;/div&gt;
&lt;br /&gt;
&lt;/div&gt;

&lt;a href="https://isopods.dreamwidth.org/2284.html" style="text-decoration: none; font-family: courier new; font-size: 10px; float: right; padding-right: 8px;"&gt;© isopods&lt;/a&gt;
&lt;/div&gt; 

&lt;/div&gt; 

&lt;/div&gt; 


&lt;br /&gt;&lt;center&gt;&lt;span style="font-family: MS Gothic; font-size: 24px;"&gt;TABBED (TERMINAL &amp; FOLDER)&lt;/span&gt;&lt;br /&gt;&lt;div style="max-width:500px;"&gt;&lt;span style="font-family: MS Gothic;"&gt;A tabbed navigation template that comes in two different flavors! Use this for whatever the hell you want--navigation, game info, whatever. I mostly just made these templates as a way of proving to myself that I could conquer this hellish HTML challenge and be satisfied with myself. If you do decide to use this template, I'd love to see what you use this for!&lt;/span&gt;&lt;/div&gt;&lt;/center&gt;&lt;br /&gt;&lt;span class="cut-wrapper"&gt;&lt;span style="display: none;" id="span-cuttag___1" class="cuttag"&gt;&lt;/span&gt;&lt;b class="cut-open"&gt;(&amp;nbsp;&lt;/b&gt;&lt;b class="cut-text"&gt;&lt;a href="https://isopods.dreamwidth.org/2284.html#cutid1"&gt;Instructions and code below the cut!&lt;/a&gt;&lt;/b&gt;&lt;b class="cut-close"&gt;&amp;nbsp;)&lt;/b&gt;&lt;/span&gt;&lt;div style="display: none;" id="div-cuttag___1" aria-live="assertive"&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;img src="https://www.dreamwidth.org/tools/commentcount?user=isopods&amp;ditemid=2284" width="30" height="12" alt="comment count unavailable" style="vertical-align: middle;"/&gt; comments</content>
  </entry>
</feed>
