thebloodwoods | CODE 009 } midnight (bio/nav simple edition)

Character Name

canon - age - etc

“When we love, we always strive to become better than we are. When we strive to become better than we are, everything around us becomes better too.”
― Paulo Coelho, The Alchemist

Basics

Name: Sample Title(s): Sample Age: Sample Date of Birth: Sample Gender: Sample Species: Sample Marital Status: Sample Family: Sample Religion: Sample Occupation: Sample Education Level: Sample PB: Sample Player: Sample Timezone: Sample Game: Sample

Personality

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.

Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.

Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.

Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet.

Abilities

Ability

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.

History

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.

Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.

Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.

Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet.

Visuals

code

Information

I'm a fan of bios, personally, but also a fan of pretty things. :) This one doubles well as a nav post if you wish. There's a complex version with more clickable sections in the previous post.

⤷ One - You can add sections, or remove them as you see fit. This could also be used for other things if you wish.

⤷ Two - The seconds collapse! :) if you want them to be collapsed by default remove where it says "open" at the end of the < details > tag. Likewise, if you want them open, add the open just before the >.

⤷ Three - All sections can be changed to your liking, basics can have more or less cells, visuals more or less images. It's up to you.

⤷ Four - Feel free to change the colours, the images, etc.

⤷ Five - Please comment if you use it! I'd love to see.

<raw-code>
	
<div style="width: 900px; margin: 0 auto;background-color: #fff;
background-image: url(https://i.postimg.cc/brf0BFZv/black-paper-floral-seamless-pattern-vector-583192.jpg);">	
	
<details style=" color:#ececec;font-family:helvetica,arial,sans-serif;font-size:15px; margin: 0px auto;" >
	<summary style="cursor:pointer;color:transparent;font-size:0px;height: 400px; background-image: url(https://i.postimg.cc/FzYTwsXV/pexels-photo-212410.jpg); background-size: cover; background-position: center center;">
		<div style="width: 900px; height: 100%; overflow: hidden;background: linear-gradient(90deg, rgba(0,0,0,0.72) 0%, rgba(236,236,236,0) 56%);">
		<div style="color:#fff;font-family: Book Antiqua, Palatino, Palatino Linotype, Palatino LT STD, Georgia, serif; font-size:40px;font-style: italic;letter-spacing: 1px;text-align: center; text-shadow: 1px 1px 2px rgba(0,0,0,0.7); margin-top: 130px; margin-left: 20px; width: 400px;">Character Name</div>
<div style="color:#fff;font-family: Book Antiqua, Palatino, Palatino Linotype, Palatino LT STD, Georgia, serif; font-size:14px;font-style: italic;letter-spacing: 1px;text-align: center; text-shadow: 1px 1px 2px rgba(0,0,0,0.7); margin-top: 0px; margin-left: 20px; width: 400px;">canon - age - etc</div>
<div style="color:#fff;font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size:12px;letter-spacing: 1px;text-shadow: 1px 1px 1px rgba(0,0,0,0.7); margin-top: 0px; margin-left: 20px;  height: 130px; width: 400px; padding: 10px; overflow: auto; text-align: justify;"> “When we love, we always strive to become better than we are. When we strive to become better than we are, everything around us becomes better too.” <br>
― Paulo Coelho, The Alchemist </div>		
		</div>	
	</summary>
	<div style="margin-top:0px;padding:20px;background:rgba(0, 0, 0, 0.60);">

<div style="color:#fff;font-family: Book Antiqua, Palatino, Palatino Linotype, Palatino LT STD, Georgia, serif; font-size:35px;font-style: italic;letter-spacing: 1px;text-align: center; text-shadow: 1px 1px 2px rgba(0,0,0,0.7); margin-top: 20px; ">Basics</div>			
		
<div style="max-width:95%;margin:10px auto 0 auto;letter-spacing:1px;text-align:center;display:flex;flex-wrap:wrap;justify-content:center;font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size:14px;  font-weight:normal; ">
		<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Name:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Title(s):</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Age:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Date of Birth:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Gender:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Species:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Marital Status:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Family:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Religion:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Occupation:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Education Level:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">PB:</b> Sample</span>		
		
					<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Player:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Timezone:</b> Sample</span>
			<span style="color:#fff;background:rgba(21,21,21,0.8);width:250px;padding:5px 0;margin:3px;text-decoration:none;"><b style="color: #fff;">Game:</b> <a href="https://thebloodwoods.dreamwidth.org/" target="_blank"  style="text-decoration: none;"><span style=" color: #858585;">Sample</span></a></span>	</div>
		
	
<div style="color:#fff;font-family: Book Antiqua, Palatino, Palatino Linotype, Palatino LT STD, Georgia, serif; font-size:35px;font-style: italic;letter-spacing: 1px;text-align: center; text-shadow: 1px 1px 2px rgba(0,0,0,0.7); margin-top: 50px; ">Personality</div>

<div style="padding: 10px 60px; text-align: justify;">		
	 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.</p>

<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>

<p>Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</p>

<p>Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.</p>

<div style="padding: 10px 40px; text-align: justify;">		
	 <details open style="background:#;color:#fff;padding:10px;">
	<summary style="cursor:pointer; text-shadow:1px 1px 1px rgba(79,79,79,1); font-family: Book Antiqua, Palatino, Palatino Linotype, Palatino LT STD, Georgia, serif; font-style: italic; color:transparent; letter-spacing:1pt; word-spacing:2pt; font-size:25px; text-align:left;  line-height:1.5;"><span style="color: #fff;">Ability</span></summary>
	<div style="margin:10px 50px;padding:20px;background:rgba(21,21,21,0.8);">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.</p>
	</div>
</details>
	</div>

<div style="padding: 10px 60px; text-align: justify;">		
	 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.</p>

<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>

<p>Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</p>

<p>Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.</p>

<p>Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet.</p>	</div>		
		
		
<div style="color:#fff;font-family: Book Antiqua, Palatino, Palatino Linotype, Palatino LT STD, Georgia, serif; font-size:35px;font-style: italic;letter-spacing: 1px;text-align: center; text-shadow: 1px 1px 2px rgba(0,0,0,0.7); margin-top: 50px; ">Visuals</div>				
<div style="width: 85%; margin: 20px auto;">		
<div style="background: url(https://i.postimg.cc/WbMGzJ8J/pexels-photo-112352.jpg); background-position: center center; background-size: cover; height: 170px; width: 170px; float: left; margin: 10px; "></div>
			
<div style="background: url(https://i.postimg.cc/rmmjtFs2/pexels-photo-414144.jpg); background-position: center center; background-size: cover; height: 170px; width: 170px; float: left; margin: 5px; "></div>	
			
<div style="background: url(https://i.postimg.cc/qq6Gjb2m/pexels-photo-878979.jpg); background-position: center center; background-size: cover; height: 170px; width: 170px; float: left; margin: 5px; "></div>
			
<div style="background: url(https://i.postimg.cc/gcw9CGD7/pexels-photo-573294.jpg); background-position: center center; background-size: cover; height: 170px; width: 170px; float: left; margin: 5px; "></div>

</div></details>

</div>	
		<div style="text-align: center; padding: 10px;"><a href="https://thebloodwoods.dreamwidth.org/" target="_blank"  style="text-decoration: none;"><span style="font-size:12px; letter-spacing: 2px; color: #494949;">code</span></a></div>	
</raw-code>

CODE 009 } midnight (bio/nav simple edition)

no subject

no subject