diff --git a/downloads/f.boniface_ed25519.pub b/downloads/f.boniface_ed25519.pub
new file mode 100644
index 0000000..eac1b2c
--- /dev/null
+++ b/downloads/f.boniface_ed25519.pub
@@ -0,0 +1 @@
+ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIKQad6se97C/WF58JCRcLCbSPSci/5m1au8f0wkxI2eq Fred Boniface
diff --git a/favicon.ico b/favicon.ico
index 8e9f970..731116e 100644
Binary files a/favicon.ico and b/favicon.ico differ
diff --git a/gpg.php b/gpg.php
deleted file mode 100644
index 34ce0f9..0000000
--- a/gpg.php
+++ /dev/null
@@ -1,31 +0,0 @@
-
-
-
-
-
-
-
- PGP stand for 'Pretty Good Privacy', GPG stands for 'GNU Privacy Guard'
- , for the scope of this website they are interchangable.
-
-
-
- My public GPG keys will be published below. You can use my public key to
- confirm that a signed email came from me, to verify signed files, and
- to verify commits and downloads from my
- gitea server.
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/images/favicon.png b/images/favicon.png
index 2799ef6..fd37e27 100644
Binary files a/images/favicon.png and b/images/favicon.png differ
diff --git a/images/headers/index/1024.jpg b/images/headers/index/1024.jpg
new file mode 100644
index 0000000..1d5fa87
Binary files /dev/null and b/images/headers/index/1024.jpg differ
diff --git a/images/headers/index/1024.jxl b/images/headers/index/1024.jxl
new file mode 100644
index 0000000..2495479
Binary files /dev/null and b/images/headers/index/1024.jxl differ
diff --git a/images/headers/index/1024.webp b/images/headers/index/1024.webp
new file mode 100644
index 0000000..34833d9
Binary files /dev/null and b/images/headers/index/1024.webp differ
diff --git a/images/headers/index/1920.jpg b/images/headers/index/1920.jpg
new file mode 100644
index 0000000..5dae712
Binary files /dev/null and b/images/headers/index/1920.jpg differ
diff --git a/images/headers/index/1920.jxl b/images/headers/index/1920.jxl
new file mode 100644
index 0000000..f17e1ac
Binary files /dev/null and b/images/headers/index/1920.jxl differ
diff --git a/images/headers/index/1920.webp b/images/headers/index/1920.webp
new file mode 100644
index 0000000..0387bad
Binary files /dev/null and b/images/headers/index/1920.webp differ
diff --git a/images/headers/index/2800.jpg b/images/headers/index/2800.jpg
new file mode 100644
index 0000000..963eae1
Binary files /dev/null and b/images/headers/index/2800.jpg differ
diff --git a/images/headers/index/2800.jxl b/images/headers/index/2800.jxl
new file mode 100644
index 0000000..14eb486
Binary files /dev/null and b/images/headers/index/2800.jxl differ
diff --git a/images/headers/index/2800.webp b/images/headers/index/2800.webp
new file mode 100644
index 0000000..a0eee30
Binary files /dev/null and b/images/headers/index/2800.webp differ
diff --git a/images/headers/index/300.jpg b/images/headers/index/300.jpg
new file mode 100644
index 0000000..9bd167a
Binary files /dev/null and b/images/headers/index/300.jpg differ
diff --git a/images/headers/index/300.jxl b/images/headers/index/300.jxl
new file mode 100644
index 0000000..bb568a8
Binary files /dev/null and b/images/headers/index/300.jxl differ
diff --git a/images/headers/index/300.webp b/images/headers/index/300.webp
new file mode 100644
index 0000000..aca8bfa
Binary files /dev/null and b/images/headers/index/300.webp differ
diff --git a/images/headers/index/4096.jpg b/images/headers/index/4096.jpg
new file mode 100644
index 0000000..9d8307f
Binary files /dev/null and b/images/headers/index/4096.jpg differ
diff --git a/images/headers/index/4096.jxl b/images/headers/index/4096.jxl
new file mode 100644
index 0000000..a1c3969
Binary files /dev/null and b/images/headers/index/4096.jxl differ
diff --git a/images/headers/index/4096.webp b/images/headers/index/4096.webp
new file mode 100644
index 0000000..96ff307
Binary files /dev/null and b/images/headers/index/4096.webp differ
diff --git a/images/headers/index/500.jpg b/images/headers/index/500.jpg
new file mode 100644
index 0000000..94dc8ca
Binary files /dev/null and b/images/headers/index/500.jpg differ
diff --git a/images/headers/index/500.jxl b/images/headers/index/500.jxl
new file mode 100644
index 0000000..7b18219
Binary files /dev/null and b/images/headers/index/500.jxl differ
diff --git a/images/headers/index/500.webp b/images/headers/index/500.webp
new file mode 100644
index 0000000..69af17b
Binary files /dev/null and b/images/headers/index/500.webp differ
diff --git a/images/headers/index/800.jpg b/images/headers/index/800.jpg
new file mode 100644
index 0000000..f40918a
Binary files /dev/null and b/images/headers/index/800.jpg differ
diff --git a/images/headers/index/800.jxl b/images/headers/index/800.jxl
new file mode 100644
index 0000000..89e92ee
Binary files /dev/null and b/images/headers/index/800.jxl differ
diff --git a/images/headers/index/800.webp b/images/headers/index/800.webp
new file mode 100644
index 0000000..d5f9f56
Binary files /dev/null and b/images/headers/index/800.webp differ
diff --git a/images/headers/index/face-100.webp b/images/headers/index/face-100.webp
new file mode 100644
index 0000000..49fa9fd
Binary files /dev/null and b/images/headers/index/face-100.webp differ
diff --git a/images/headers/index/face-150.webp b/images/headers/index/face-150.webp
new file mode 100644
index 0000000..5b02690
Binary files /dev/null and b/images/headers/index/face-150.webp differ
diff --git a/images/headers/index/face-600.webp b/images/headers/index/face-600.webp
new file mode 100644
index 0000000..b9614ff
Binary files /dev/null and b/images/headers/index/face-600.webp differ
diff --git a/images/headers/index/full.jpg b/images/headers/index/full.jpg
new file mode 100644
index 0000000..737de09
Binary files /dev/null and b/images/headers/index/full.jpg differ
diff --git a/images/headers/readme.txt b/images/headers/readme.txt
new file mode 100644
index 0000000..ef0867d
--- /dev/null
+++ b/images/headers/readme.txt
@@ -0,0 +1,9 @@
+ Each set of header images should contain the following image widths. The minimum height should be 275px.
+
+ - 4096
+ - 2800
+ - 1920
+ - 1024
+ - 800
+ - 500
+ - 300
diff --git a/images/logo/favicon.xcf b/images/logo/favicon.xcf
new file mode 100644
index 0000000..331cdce
Binary files /dev/null and b/images/logo/favicon.xcf differ
diff --git a/images/logo/full-20.jxl b/images/logo/full-20.jxl
new file mode 100644
index 0000000..fa781ba
Binary files /dev/null and b/images/logo/full-20.jxl differ
diff --git a/images/logo/full-20.png b/images/logo/full-20.png
new file mode 100644
index 0000000..0e7e492
Binary files /dev/null and b/images/logo/full-20.png differ
diff --git a/images/logo/full-20.webp b/images/logo/full-20.webp
new file mode 100644
index 0000000..cdf3d29
Binary files /dev/null and b/images/logo/full-20.webp differ
diff --git a/images/logo/full-40.jxl b/images/logo/full-40.jxl
new file mode 100644
index 0000000..451072d
Binary files /dev/null and b/images/logo/full-40.jxl differ
diff --git a/images/logo/full-40.png b/images/logo/full-40.png
new file mode 100644
index 0000000..b704a27
Binary files /dev/null and b/images/logo/full-40.png differ
diff --git a/images/logo/full-40.webp b/images/logo/full-40.webp
new file mode 100644
index 0000000..3a2914c
Binary files /dev/null and b/images/logo/full-40.webp differ
diff --git a/images/logo/full-60.jxl b/images/logo/full-60.jxl
new file mode 100644
index 0000000..bc33f0a
Binary files /dev/null and b/images/logo/full-60.jxl differ
diff --git a/images/logo/full-60.png b/images/logo/full-60.png
new file mode 100644
index 0000000..f5b1209
Binary files /dev/null and b/images/logo/full-60.png differ
diff --git a/images/logo/full-60.webp b/images/logo/full-60.webp
new file mode 100644
index 0000000..38174ef
Binary files /dev/null and b/images/logo/full-60.webp differ
diff --git a/images/logo/full-95.jxl b/images/logo/full-95.jxl
new file mode 100644
index 0000000..4e6b1a2
Binary files /dev/null and b/images/logo/full-95.jxl differ
diff --git a/images/logo/full-95.png b/images/logo/full-95.png
new file mode 100644
index 0000000..686be3d
Binary files /dev/null and b/images/logo/full-95.png differ
diff --git a/images/logo/full-95.webp b/images/logo/full-95.webp
new file mode 100644
index 0000000..13c37e5
Binary files /dev/null and b/images/logo/full-95.webp differ
diff --git a/images/logo/full.xcf b/images/logo/full.xcf
new file mode 100644
index 0000000..9619225
Binary files /dev/null and b/images/logo/full.xcf differ
diff --git a/images/logo/short-20.jxl b/images/logo/short-20.jxl
new file mode 100644
index 0000000..2e0b859
Binary files /dev/null and b/images/logo/short-20.jxl differ
diff --git a/images/logo/short-20.png b/images/logo/short-20.png
new file mode 100644
index 0000000..505caf7
Binary files /dev/null and b/images/logo/short-20.png differ
diff --git a/images/logo/short-40.jxl b/images/logo/short-40.jxl
new file mode 100644
index 0000000..b708ffe
Binary files /dev/null and b/images/logo/short-40.jxl differ
diff --git a/images/logo/short-40.png b/images/logo/short-40.png
new file mode 100644
index 0000000..1fee670
Binary files /dev/null and b/images/logo/short-40.png differ
diff --git a/images/logo/short-60.jxl b/images/logo/short-60.jxl
new file mode 100644
index 0000000..628a5de
Binary files /dev/null and b/images/logo/short-60.jxl differ
diff --git a/images/logo/short-60.png b/images/logo/short-60.png
new file mode 100644
index 0000000..7da86d5
Binary files /dev/null and b/images/logo/short-60.png differ
diff --git a/images/logo/short-95.jxl b/images/logo/short-95.jxl
new file mode 100644
index 0000000..005290d
Binary files /dev/null and b/images/logo/short-95.jxl differ
diff --git a/images/logo/short-95.png b/images/logo/short-95.png
new file mode 100644
index 0000000..93df18e
Binary files /dev/null and b/images/logo/short-95.png differ
diff --git a/images/logo/short.xcf b/images/logo/short.xcf
new file mode 100644
index 0000000..0f67d54
Binary files /dev/null and b/images/logo/short.xcf differ
diff --git a/js/navbar.js b/js/navbar.js
index 7788096..fc4a01e 100644
--- a/js/navbar.js
+++ b/js/navbar.js
@@ -4,4 +4,18 @@ function inflateSidebar() {
function collapseSidebar() {
document.getElementById("sidebar").style.width = "0px";
+}
+
+function sidebarOpen() {
+ document.getElementById("sidebar").style.width = "50%";
+ document.getElementById("sidebar_open_short").style.display = "none";
+ document.getElementById("sidebar_close_short").style.display = "block";
+ document.getElementById("sidebar_social").style.display = "flex";
+}
+
+function sidebarClose() {
+ document.getElementById("sidebar").style.width = "0%"
+ document.getElementById("sidebar_open_short").style.display = "block";
+ document.getElementById("sidebar_close_short").style.display = "none";
+ document.getElementById("sidebar_social").style.display = "none";
}
\ No newline at end of file
diff --git a/keys.php b/keys.php
new file mode 100644
index 0000000..118e564
--- /dev/null
+++ b/keys.php
@@ -0,0 +1,23 @@
+
+
+
+
+
+
+
+ This website cannot correctly render on a screen this narrow,
+ Please resize your window or visit on a larger device.
+
+
+
+
Lorem
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ut eros leo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Cras tempus, leo sit amet placerat sollicitudin, magna massa vehicula nisi, sed malesuada odio velit iaculis est. Cras egestas nec lectus ac ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse cursus odio et massa finibus consequat non sed dolor. Suspendisse eu leo ut nunc tincidunt lacinia. Sed faucibus eu enim sit amet commodo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Quisque commodo laoreet odio, ac sollicitudin odio.
+
Sed volutpat, dolor quis dignissim varius, risus urna tincidunt nulla, non bibendum urna ante eget enim. Pellentesque sit amet neque lobortis, auctor nulla sagittis, bibendum nisl. Proin fermentum tristique dolor, in vehicula mi efficitur et. Fusce ac justo nulla. In eget odio felis. Suspendisse et tellus tincidunt, consequat mi eu, gravida neque. In elementum lacus ut convallis ornare. Mauris elementum lorem felis, et tincidunt massa consectetur in. Suspendisse ut augue blandit, efficitur augue nec, pellentesque odio. Nulla aliquet arcu vitae vehicula ultricies.
+
Ispum
+
Sed eleifend massa sed sagittis malesuada. Phasellus velit urna, congue sit amet felis dictum, congue ornare tortor. Donec consequat lectus sit amet iaculis ornare. Pellentesque luctus, orci a sagittis efficitur, dolor justo convallis dolor, vitae aliquam dolor eros a nunc. Sed suscipit volutpat est ac ultrices. Cras tempus tellus est, eu tristique est gravida eget. Nulla turpis odio, aliquam id vehicula non, dignissim egestas orci. Suspendisse pulvinar enim eu tortor tincidunt, vel luctus purus pellentesque. Curabitur efficitur mollis est, at imperdiet dui auctor a. Ut malesuada lacus ac nulla tempor sollicitudin. Pellentesque enim elit, eleifend eget ligula sit amet, sagittis efficitur elit. Donec blandit tellus ut vestibulum iaculis. Fusce vel ipsum non felis bibendum porttitor a ut dui. Donec ornare augue augue, a elementum justo ornare quis. Praesent ante tellus, blandit in ultricies id, bibendum sit amet mi. Suspendisse tristique ornare erat.
+
Praesent malesuada sit amet libero eu volutpat. Duis lacinia turpis sit amet malesuada bibendum. Pellentesque ut velit at turpis placerat consequat id sed augue. Cras eleifend augue sem, sed hendrerit nibh feugiat eu. Nam cursus lectus fermentum quam feugiat porttitor. Sed bibendum a enim ut commodo. Maecenas lacinia dolor ante, vel bibendum nulla venenatis aliquam. Aenean ultricies felis eros, quis cursus arcu dictum vitae.
+
Ut magna urna, pretium tincidunt congue id, sodales sed lacus. Suspendisse potenti. Aenean nec quam ultrices, dignissim velit sit amet, cursus nisl. Duis nec risus a nisl porta fringilla. Phasellus vel fermentum justo, a malesuada ex. Nullam eu metus quis arcu sodales vestibulum. Maecenas efficitur gravida risus vitae pretium. Donec non nulla sodales, consectetur est ut, tristique nisl. Phasellus sed dui sed erat efficitur cursus. Vestibulum eget est purus. Aliquam mi ante, hendrerit ac ornare ac, imperdiet et diam. Nunc fermentum nunc faucibus massa finibus mattis.
+
+
diff --git a/projects.php b/projects.php
index ec46ad2..4784f69 100644
--- a/projects.php
+++ b/projects.php
@@ -13,6 +13,7 @@
Projects
Sorry, there's nothing here yet
+
In the meantime check out my Gitea or Social Links
diff --git a/style/fonts/indie-flower/OFL.txt b/style/fonts/indie-flower/OFL.txt
new file mode 100644
index 0000000..f19b48e
--- /dev/null
+++ b/style/fonts/indie-flower/OFL.txt
@@ -0,0 +1,93 @@
+Copyright (c) 2010, Kimberly Geswein (kimberlygeswein.com)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/style/fonts/indie-flower/indie-flower.ttf b/style/fonts/indie-flower/indie-flower.ttf
new file mode 100644
index 0000000..3774ef5
Binary files /dev/null and b/style/fonts/indie-flower/indie-flower.ttf differ
diff --git a/style/fonts/indie-flower/indie-flower.woff b/style/fonts/indie-flower/indie-flower.woff
new file mode 100644
index 0000000..8367770
Binary files /dev/null and b/style/fonts/indie-flower/indie-flower.woff differ
diff --git a/style/fonts/indie-flower/indie-flower.woff2 b/style/fonts/indie-flower/indie-flower.woff2
new file mode 100644
index 0000000..b4ea531
Binary files /dev/null and b/style/fonts/indie-flower/indie-flower.woff2 differ
diff --git a/style/new_style.css b/style/new_style.css
new file mode 100644
index 0000000..ef852de
--- /dev/null
+++ b/style/new_style.css
@@ -0,0 +1,234 @@
+/* COLOR VARS */
+:root {
+ --main-bg-color: lightslategrey;
+ --accent-color: darkslategrey;
+ --overlay-color: #2f4f4fb8;
+ --main-text-color: azure;
+ --link-color: cyan;
+}
+/* FONTS */
+@font-face {
+ font-family: 'indie-flower';
+ src: url('/style/fonts/indie-flower/indie-flower.woff2') format('woff2'),
+ url('/style/fonts/indie-flower/indie-flower.woff') format('woff'),
+ url('/style/fonts/indie-flower/indie-flower.ttf') format('truetype');
+ font-weight: normal;
+ font-style: normal;
+}
+@font-face {
+ font-family: 'oxygen';
+ src: url('/style/fonts/oxygen/oxygen-regular.woff2') format('woff2'),
+ url('/style/fonts/oxygen/oxygen-regular.woff') format('woff'),
+ url('/style/fonts/oxygen/oxygen-regular.ttf') format('truetype');
+ font-weight: normal;
+ font-style: normal;
+}
+@font-face {
+ font-family: 'oxygen';
+ src: url('/style/fonts/oxygen/oxygen-bold.woff2') format('woff2'),
+ url('/style/fonts/oxygen/oxygen-bold.woff') format('woff'),
+ url('/style/fonts/oxygen/oxygen-bold.ttf') format('truetype');
+ font-weight: 700;
+ font-style: normal;
+}
+@font-face {
+ font-family: 'oxygen';
+ src: url('/style/fonts/oxygen/oxygen-light.woff2') format('woff2'),
+ url('/style/fonts/oxygen/oxygen-light.woff') format('woff'),
+ url('/style/fonts/oxygen/oxygen-light.ttf') format('truetype');
+ font-weight: 300;
+ font-style: normal;
+}
+/* HTML & BODY */
+html {height: 100%;}
+body {
+ width: 100%;
+ margin: auto;
+ background-color: var(--main-bg-color);
+}
+/* PAGE HEADER */
+.header_image {
+ background-repeat: no-repeat;
+ background-position: top;
+ background-size: cover;
+ height: 273px;
+ min-width: 100%;
+ max-width: 100%;
+ margin: auto;
+ margin-top: 40px;
+ position: sticky;
+ top: -145px;
+}
+#header_index{background-color: #a04911} /* Try using image-set() here to offer different formats */
+@media(min-width: 50px){#header_index{background-image:url("/images/headers/index/300.webp")}}
+@media(min-width: 301px){#header_index{background-image:url("/images/headers/index/500.webp")}}
+@media(min-width: 501px){#header_index{background-image:url("/images/headers/index/800.webp")}}
+@media(min-width: 801px){#header_index{background-image:url("/images/headers/index/1024.webp")}}
+@media(min-width:1025px){#header_index{background-image:url("/images/headers/index/1920.webp")}}
+@media(min-width:1921px){#header_index{background-image:url("/images/headers/index/2800.webp")}}
+@media(min-width:2801px){#header_index{background-image:url("/images/headers/index/4096.webp")}}
+#header_face {
+ display: flex;
+ position: absolute;
+ top: -184px;
+ width: 100%;
+ height: 185px;
+ text-align: center;
+}
+#header_face img {
+ margin: auto;
+ border-radius: 40px;
+ border-style: solid;
+ border-color: var(--accent-color);
+ border-width: 3px;
+ max-height: 150px;
+ height: 30vw;
+}
+@media(min-width:400px){#header_face img{border-radius:50px;}}
+@media(min-width:540px){#header_face img{border-radius:55px;}}
+#page_title { /* This may be best floating above content div rather than inside header div */
+ background-color: var(--overlay-color);
+ font-family: indie-flower, cursive;
+ font-size: large;
+ width: 100%;
+ height: 90px;
+ text-align: center;
+ position: absolute;
+ bottom: 0;
+ color: var(--main-text-color);
+}
+#menubar {
+ background-color: var(--accent-color);
+ color: var(--main-text-color);
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 40px;
+}
+#menubar_logo img { /* Logo file is controlled by media="" in