Tools!

This is the tool I used to help build & maintain my website: https://www.11ty.dev/docs

Content Panels:

These are the panels that can be used for layouts.

Single Row Panel with Title
Body Content in Here. . .
Two Columns Split 50/50
Body Content in Here. . .
More can be added with equal split
Body Content in Here. . .
1/3rd
Body Content in Here. . .
2-3rds
Body Content in Here. . .
Panels with Split Colours
For a middle content div
Body Content in Here. . .
Body Content in Here. . .
Panel with Images
Body Content
Body Content
Split Panels with Images
Body Content
Split Panels with Images
Body Content
Icon Row: 5
This is where the icons can be described
World Map World Map World Map World Map World Map
Panel with a Flow Icon Row
Subheading
Explainer of Icons. Note that icons will stay the same size, so if this is indented too much it could look bad.
Affinities
Basic Affinities
Fire Fire
Loss Loss
Time Time
Force Force
Structure Structure
Earth Earth
Water Water
Life Life
Nature Nature
Wind Wind
Light Light
Knowledge Knowledge

Compound Affinities - Ruby
Fire Fire
Loss Loss
Time Time
Compound Affinities - Topaz
Fire Fire
Loss Loss
Time Time

Compound Affinities - Emerald
Fire Fire
Loss Loss
Time Time
Fire Fire
Loss Loss
Time Time
Compound Affinities - Sapphire
Fire Fire
Loss Loss
Time Time
Fire Fire
Loss Loss
Time Time
Icons

Icons have been gotten from: https://fontawesome.com/ For Heading colours, use fill="#F5DEB3"

Home
Post
Tool
Link
Glossary
Site
Chat
World
Map
Location
User
Gear
Plus
Minus
Cross
Expand
Contract
Pop
Left
Down
Right
Refresh
FAQ
Search
Sort
Filter
Heart
Like
Star
Download
Quill
WIP

CSS Reference

I've used multiple classes to help keep my files adjustible.

Font Details

Font Blocks:
title: Title Block
Heading - 1
b1 b-flow - Normal Body Background
b1 bg4 b-flow - Alternate Body Background
Ending - 1

Heading - 2
b2 b-flow - Normal Body Background
b2 bg4 b-flow - Alternate Body Background
Ending - 2
h3 - Heading 3, in line line adjustment.

Font Styles:

f-title: Title
f-subtitle: Subtitle
f-h1: Heading 1
f-h2: Heading 2
f-h3: Heading 3
f-h4: Heading 4
f-body: Body
f-small: Small Font - 0.9em

ff1: Font Family 1 - Verdana, Geneva, sans-serif;

Heading
fc-black: Default Font Colour - Black
fc-heading: For Headings & Menus - Wheat
fc-link1: for Content Links - Dark Blue
fc-link2: for Icon Links - DarkGoldenRod
fc-hover: Colour to change font on hover - Brown
fc-active: Colour to change on link selection - Gold

Background Colours
bg0. - Full Background Preload
bg1 - Background Colour & Heading Colour
bg2 - Headings & Sidebar2
bg3 - Main Content
bg4 - Content Variant & Dropdown Hover
bg5 - Dropdown Menu Background
bg6 - Heading Menu Hover
bg7 - Heading Menu Active

Wouldn't it be funny if I forgot this was here?