Wrote Fig article

7 files changed, 222 insertions, 4 deletions

diff --git a/britons.css b/britons.css
index 6e26d15..b64e713 100644
--- a/britons.css
+++ b/britons.css
@@ -10,7 +10,7 @@ body {
 	font-family: "Liberation Serif", "Times New Roman";
 	display: block;
 	background-color: whitesmoke;
-	width: 80%;
+	width: 70%;
 	padding: 2%;
 	padding-top: 1%;
 	margin: 2%;
@@ -68,7 +68,7 @@ header i {
 	opacity: 0.5;
 	transition: opacity 0.25s ease-in;
 	z-index: -1;
-	width: 17%;
+	width: 25%;
 }
 
 .fig:hover {
diff --git a/britons.css~ b/britons.css~
new file mode 100644
index 0000000..b64e713
--- /dev/null
+++ b/britons.css~
@@ -0,0 +1,77 @@
+:root {
+	--main-fg-color: #003400;
+	--main-ac-color: #007400;
+background-image: url(media/bg.gif);
+}
+
+body {
+	
+	font-size: 100%;
+	font-family: "Liberation Serif", "Times New Roman";
+	display: block;
+	background-color: whitesmoke;
+	width: 70%;
+	padding: 2%;
+	padding-top: 1%;
+	margin: 2%;
+	border-style: dotted;
+	border-color: var(--main-fg-color);
+}
+
+.title {
+
+	font-size: 250%;
+	color: var(--main-fg-color);
+	font-weight: bold;
+	
+}
+
+header i {
+	margin-left: 5%;
+	font-size: 125%;
+}
+
+.navbar {
+	display: flex;
+	justify-content: space-evenly; ;
+	margin-top: 1%;
+
+}
+
+.content {
+	width: 80%;
+	background-color: whitesmoke;
+}
+
+.content figcaption {
+	font-style: italic;
+	text-align: center;
+}
+
+.content figcaption a {
+	text-align: center;
+	font-style: normal;
+}
+
+.content img {
+	display: block;
+	margin: auto;
+	max-width: 35%;
+	padding: 1%;
+	
+}
+
+.fig {
+	position: fixed;
+	bottom: 0%;
+	right: -2%;
+	opacity: 0.5;
+	transition: opacity 0.25s ease-in;
+	z-index: -1;
+	width: 25%;
+}
+
+.fig:hover {
+	opacity: 1;
+}
+
diff --git a/fig.html b/fig.html
index 08e0e64..a145c3c 100644
--- a/fig.html
+++ b/fig.html
@@ -24,7 +24,41 @@
 		
 		<hr>
 		
-		<h2>Fig</h2>	
+		<h2>A Complete Accident</h2>
+		<p>On the 21st of January, 2026, I worked up the courage to draw for /hmofa/. Practice makes perfect after all.
+		I couldn't get the eyes right, and this was before I bought a <a href="https://www.derwentart.us/" title="Derwent Art store page"> proper set of pencils</a> 
+		<img src="icons/globe--arrow.png" alt="Outgoing Link">, so it smudged everywhere.
+		This gave her permanent bags under her sharp eyes, and combined with thick eyebrows, made her look like a stereotypical cougar.
+		The way I draw hair makes it look thin if I don't color it in, which only added to her age.
+		</p>
+		<p>
+		I thought a bathrobe would go well with her disheveled hair, giving her a comfortable and honest appearance. She knows what she likes, and it's (you).
+		One thing I always associate with bathrobes, apart from sexy older women, are exhibitionists. Combinining all of these factors gets you a nudist.
+		</p>
+		<p>Her main quirk, smoking, is explained by me liking the smell of cigarette smoke, and finding the act as <b>pure sex</b>. You also never see young women smoke.
+		I looked around for cigarette stereotypes and found that Parliament would suit her well, although Pall Mall isn't a bad pick.
+		I always draw her with a cigarette, and people have remembered that when they make art.
+		</p>
+	
+		<a href="media/fig.jpeg" title="The original Fig drawing"> <img style="max-width: 15%" src="media/fig.webp" alt="The original Fig drawing"></a>
+
+		
+		<h2>Why Make Her English?</h2>
+		Nudity is something you can only comfortably practice in places with mild temperatures, like Europe or some places of the United States. 
+		It also has to be somewhere it's less likely to get you thrown in jail, ruling out the USA. 
+		By now I was thinking of writing something with her, and the only place that would make sense for an American protagonist is the <b>United Kingdom</b>.
+		I had to look for a place that is:
+		<ul>
+			<li>In Northern England,</li>
+			<li>Populated enough,</li>
+			<li>Laid back,</li>
+			<li>Close to the shore,</li>
+			<li>And retains its own customs.</li>		
+		</ul> 
+		These filters left me with <strong>Beverly, East Riding of Yorkshire</strong>. The shoreline it's close to actually has a nudist beach.
+		<br>
+		I looked up what the accent sounded like because it gets more unintelligible the further you go north. 
+		It would be funny to give our protagonist the worst case of culture shock.
 
 		<a title="Oh, you're a cute one ain'tcha, Anonie?" href="media/figsmoke.png"><img src="media/smoke.webp" alt="Fig" class="fig"></a>
 </body>
diff --git a/fig.html~ b/fig.html~
new file mode 100644
index 0000000..a145c3c
--- /dev/null
+++ b/fig.html~
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+	
+		<link rel="stylesheet" href="britons.css">
+		<meta http-equiv="content-type" content="text/html; charset=windows-1252">
+		<meta name="author" content="Jodian Buenaventura" >
+		<meta name="keywords" content="/hmofa/, hmofa, tech, writing, index, british, furry">
+		<meta name="description" content="Showcasing Fig's origin.">
+		<title>El Arriero</title>
+		
+	</head>
+	
+	<body>
+	
+		<header role="banner">
+			<a class="title" href="index.html" title="The Muleteer">El Arriero</a> 
+			<i class="tagline">Home of the Britishly Mediocre</i>
+			<div class="navbar" role="navigation">
+				<a href="contact.html">Contact</a>
+				<a href="https://wiki.elarriero.org/">Wiki</a>	
+			</div>
+		</header>
+		
+		<hr>
+		
+		<h2>A Complete Accident</h2>
+		<p>On the 21st of January, 2026, I worked up the courage to draw for /hmofa/. Practice makes perfect after all.
+		I couldn't get the eyes right, and this was before I bought a <a href="https://www.derwentart.us/" title="Derwent Art store page"> proper set of pencils</a> 
+		<img src="icons/globe--arrow.png" alt="Outgoing Link">, so it smudged everywhere.
+		This gave her permanent bags under her sharp eyes, and combined with thick eyebrows, made her look like a stereotypical cougar.
+		The way I draw hair makes it look thin if I don't color it in, which only added to her age.
+		</p>
+		<p>
+		I thought a bathrobe would go well with her disheveled hair, giving her a comfortable and honest appearance. She knows what she likes, and it's (you).
+		One thing I always associate with bathrobes, apart from sexy older women, are exhibitionists. Combinining all of these factors gets you a nudist.
+		</p>
+		<p>Her main quirk, smoking, is explained by me liking the smell of cigarette smoke, and finding the act as <b>pure sex</b>. You also never see young women smoke.
+		I looked around for cigarette stereotypes and found that Parliament would suit her well, although Pall Mall isn't a bad pick.
+		I always draw her with a cigarette, and people have remembered that when they make art.
+		</p>
+	
+		<a href="media/fig.jpeg" title="The original Fig drawing"> <img style="max-width: 15%" src="media/fig.webp" alt="The original Fig drawing"></a>
+
+		
+		<h2>Why Make Her English?</h2>
+		Nudity is something you can only comfortably practice in places with mild temperatures, like Europe or some places of the United States. 
+		It also has to be somewhere it's less likely to get you thrown in jail, ruling out the USA. 
+		By now I was thinking of writing something with her, and the only place that would make sense for an American protagonist is the <b>United Kingdom</b>.
+		I had to look for a place that is:
+		<ul>
+			<li>In Northern England,</li>
+			<li>Populated enough,</li>
+			<li>Laid back,</li>
+			<li>Close to the shore,</li>
+			<li>And retains its own customs.</li>		
+		</ul> 
+		These filters left me with <strong>Beverly, East Riding of Yorkshire</strong>. The shoreline it's close to actually has a nudist beach.
+		<br>
+		I looked up what the accent sounded like because it gets more unintelligible the further you go north. 
+		It would be funny to give our protagonist the worst case of culture shock.
+
+		<a title="Oh, you're a cute one ain'tcha, Anonie?" href="media/figsmoke.png"><img src="media/smoke.webp" alt="Fig" class="fig"></a>
+</body>
+</html>
+
diff --git a/index.html b/index.html
index 3a00aef..1715a1e 100644
--- a/index.html
+++ b/index.html
@@ -26,7 +26,7 @@
 		
 		<h2>"The Most Britishly Mediocre Thing Ever"</h2>
 		<ul>
-			<li><a href="fig.html">"How Fig came to be"</a> - Showing how, what, when, and why I made Fig.</li>
+			<li><a href="fig.html">"How Fig came to be"</a> - Showing how, when, and why I made Fig.</li>
 		</ul>	
 		
 		<h2>Interesting HMOFA</h2>
diff --git a/index.html~ b/index.html~
new file mode 100644
index 0000000..3a00aef
--- /dev/null
+++ b/index.html~
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+	
+		<link rel="stylesheet" href="britons.css">
+		<meta http-equiv="content-type" content="text/html; charset=windows-1252">
+		<meta name="author" content="Jodian Buenaventura" >
+		<meta name="keywords" content="/hmofa/, hmofa, tech, writing, index, british, furry">
+		<meta name="description" content="Main page, showing off waifurs and my interest in British culture.">
+		<title>El Arriero</title>
+		
+	</head>
+	
+	<body>
+	
+		<header role="banner">
+			<a class="title" href="index.html" title="The Muleteer">El Arriero</a> 
+			<i class="tagline">Home of the Britishly Mediocre</i>
+			<div class="navbar" role="navigation">
+				<a href="contact.html">Contact</a>
+				<a href="https://wiki.elarriero.org/">Wiki</a>	
+			</div>
+		</header>
+		
+		<hr>
+		
+		<h2>"The Most Britishly Mediocre Thing Ever"</h2>
+		<ul>
+			<li><a href="fig.html">"How Fig came to be"</a> - Showing how, what, when, and why I made Fig.</li>
+		</ul>	
+		
+		<h2>Interesting HMOFA</h2>
+		<ul>
+			<li>Story Masterbin of /hmofa/ - <a href="https://rentry.org/hmofa">(Sorted by Author)</a> <img src="icons/globe--arrow.png" alt="Outgoing Link"> 
+			<a href="https://hmofa.neocities.org/"> (Organized with Tags)</a> <img src="icons/globe--arrow.png" alt="Outgoing Link"></li>
+
+		</ul>		
+		<a title="Oh, you're a cute one ain'tcha, Anonie?" href="media/figsmoke.png"><img src="media/smoke.webp" alt="Fig" class="fig"></a>
+</body>
+</html>
+
diff --git a/media/we_won.png b/media/we_won.png
new file mode 100644
index 0000000..1c8eb8c
--- /dev/null
+++ b/media/we_won.png