Oceanbound Theme

Link to article: Oceanbound Theme.

@import url(https://scp-wiki.wdfiles.com/local--code/theme%3Aoceanbound/1);

```
display: none
```
```
font-family:var(--UI-font)
```

(none)

[[module css]]
@import url(https://scp-wiki.wdfiles.com/local--code/theme%3Aoceanbound/1);
[[/module]]
[[include :scp-wiki:component:interwiki-style
| priority=1
| theme=https://scp-wiki.wdfiles.com/local--code/theme%3Aoceanbound/1
]]

[[iftags +theme]]

[[div style="display: none"]]
[[include component:image-block name= https://scp-wiki.wikidot.com/local--files/theme:oceanbound/orcadia.png|caption=.]]
[[/div]]

[[>]]
[[module rate]]
[[/>]]

This is a theme for the [[[seas-of-orcadia-hub|Orcadia]]] canon, made by [[*user EstrellaYoshte]]  for [[*user DrBleep]].

To use the theme, insert the following:

> {{@@[[include :scp-wiki:theme:oceanbound]]@@}}

------

[[include component:image-block name= https://scp-wiki.wdfiles.com/local--files/scp-6700/Mither.jpeg|caption=Image.|width=270px]]

An ornamental horizontal rule can be created with 5 hyphens "- - - - -" as above.

Titles can be created by putting between one and six plus "+" at the start of the line.
@@ @@

[[collapsible show="+ Collapsible - Click me" hide="- Collapsible - Click me"]]
+ First Title

++ Second Title

+++ Third Title

++++ Fourth Title

+++++ Fifth Title

++++++ Sixth Title
[[/collapsible]]

@@ @@

[[tabview]]
[[tab Tabulator]]
This is a tab view.
[[/tab]]
[[tab Tabulation]]
Hey look, more text here.

How quaint.
[[/tab]]
[[tab Long Tab]]
This is a long tab. It contains a lot of text.[[footnote]] This is a footnote. [[/footnote]]

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.
[[/tab]]

[[tab Longer Tab]]
This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.
[[/tab]]

[[tab Empty Tab]]
[[/tab]]
[[/tabview]]

@@ @@

> This is a blockquote, created by putting "> " at the start of each line.
>
> More text
> -----
> That's a horizontal rule
>
>> Nested blockquotes

@@ @@

||~ This is a ||~ table ||
||You should know || how to make these ||
||||already ||

@@ @@

[[footnoteblock]]

-----

[[=]]
+++* Header font is Grenze Gotisch.
Body font is Inter.
{{Monospace font is Space Mono.}}
[[span style="font-family:var(--UI-font)"]]UI and heading font is Space Grotesk.[[/span]]
[[/=]]

++* Page Source
[[collapsible]]
[[code type="css"]]
/*
    Oceanbound Theme
    [2022 Wikidot Theme]
    By EstrellaYoshte
    Based on:
       Penumbra Theme by EstrellaYoshte
       Paperstack Theme by EstrellaYoshte
       Newspaper Theme by EstrellaYoshte
*/


@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Grenze+Gotisch:wght@400;700&display=swap');
@import url('https://rsms.me/inter/inter.css');

:root {
    --header-font: 'Grenze Gotisch', 'Century Gothic', 'Arial', sans-serif;
    --UI-font: 'Space Grotesk', 'Nanum Gothic', sans-serif;
    --mono-font: 'Space Mono', 'Nanum Gothic Coding', monospace;
    --body-font: 'Inter', 'Arial', sans-serif;

    --side-bar-width: 14.5rem;
    --header-height: 14.25rem;
    --top-bar-height: 2.75rem;
    --header-image: url("https://scp-wiki.wdfiles.com/local--files/theme%3Aoceanbound/orkn.jpg");
    --title-image: url("https://scp-wiki.wikidot.com/local--files/theme:oceanbound/orcadia.png");

    --dark-depth: 38,48,54;
    --ocean-depth: 44,123,149;
    --foamy-white: 250,253,255;
    --undersea-tone: 20,47,70;
    --lagoon-hue: 14,173,172;
    --hazy-sky: 242,250,253;

    --search-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E");
    --deco-size: 3rem;
    --deco-mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='575.57' height='575.85'%3E%3Cpath d='M18.42 574.13a27.07 27.07 0 0 1-16.69-35.2c2.03-5.47 4.45-8.09 46.8-50.57l44.67-44.81-4.8-6.55c-26.2-35.76-41.84-75.08-47.87-120.31-.74-5.55-1.35-11.3-1.36-12.79l-.02-2.7 57.84.35c55.25.33 58.26.44 67.22 2.44 16.23 3.63 30.9 9.35 44.13 17.2l4.56 2.7 18-18 18-18-17.96-17.97-17.97-17.97-3.63 2.16a154.53 154.53 0 0 1-28.44 13.13c-20.27 6.73-18.08 6.54-82.95 6.95l-58.8.36.02-2.7c.01-1.47.64-7.32 1.39-12.98 5.77-43.37 21.2-83.04 45.08-115.94 3.25-4.5 6.28-8.75 6.71-9.46.57-.94-11.77-13.91-43.84-46.08C6.18 44.93 3.76 42.3 1.73 36.85A27.15 27.15 0 0 1 19.6 1.25C24-.03 33.31-.17 89.75.15c61.42.36 65.6.49 74.24 2.36 25.35 5.5 46 16.04 65.85 33.62 8.72 7.72 8.78 7.76 12.55 6.91 21.48-4.82 63.1-5 87.62-.36l7.17 1.36 4.83-4.64c19.58-18.8 39.52-29.68 66.74-36.43l10.08-2.5L484.9.14c57.7-.3 66.72-.15 71.22 1.15a27.14 27.14 0 0 1 17.73 35.57c-2.02 5.46-4.45 8.08-46.75 50.52l-44.63 44.76 6.58 9.22c21.22 29.7 35.46 62.31 42.6 97.58 2.17 10.67 4.73 28.42 4.76 32.94l.02 2.7-57.84-.4c-53.97-.35-58.45-.51-67-2.36a151.98 151.98 0 0 1-44.35-17.22l-4.55-2.7-18 18-18.01 18 17.97 17.96 17.96 17.97 3.63-2.16a154.53 154.53 0 0 1 28.45-13.13c20.26-6.73 18.08-6.54 82.94-6.95l58.8-.36-.02 2.7c-.03 4.5-2.6 22.26-4.75 32.93a247.83 247.83 0 0 1-41.74 96 394.17 394.17 0 0 0-6.68 9.46c-.58.93 11.68 13.82 43.84 46.07 42.32 42.46 44.75 45.08 46.77 50.55a27.12 27.12 0 0 1-17.76 35.56c-4.52 1.32-13.3 1.46-70.25 1.14-63.16-.35-65.37-.42-74.59-2.5-25.6-5.77-45.73-16.07-65.5-33.52-8.72-7.69-8.79-7.73-12.55-6.88-21.84 4.9-67.96 4.84-90.36-.12l-4.16-.93-6.82 6.32c-17.28 16-35.4 26.39-56.87 32.6-17.3 5.01-21.79 5.28-89.28 5.25-57.05-.02-62.82-.17-67.29-1.72zm138.8-15.95c44.48-7.68 81.53-39.59 95.08-81.89a116.26 116.26 0 0 0 5.8-37.68c-.01-20.01-3.87-36.45-12.79-54.56l-4.88-9.9-8.57 8.56-8.56 8.56 2.96 5.86c10.23 20.27 11.98 49.2 4.35 71.98-8.75 26.12-26.85 46.63-51.44 58.25-12.16 5.75-21.14 8.08-35.38 9.19-13.76 1.07-88.32 1.24-88.32.2 0-.38 14.48-15.17 32.17-32.87l32.17-32.18-7.95-7.9-7.94-7.9-43.9 43.93-43.9 43.94v4.52c0 3.64.54 5.14 2.8 7.66l2.8 3.14 29.11.48c51.08.84 96.94.24 106.4-1.4zm399.45-2.23c2.26-2.52 2.8-4.02 2.8-7.67v-4.53l-85.19-85.21c-46.86-46.87-85.56-85.21-86-85.21-1.12 0-13.09 11.57-14.29 13.8-.84 1.59 8.52 11.31 72.58 75.37 40.45 40.45 73.54 73.86 73.54 74.24 0 1.04-77.59.87-89.58-.2-5.72-.5-13.7-1.83-17.76-2.94-6.92-1.91-23.44-9.3-29.12-13.01-2.48-1.63-2.84-1.57-15.05 2.55-9.82 3.3-12.3 4.48-11.5 5.45 1.86 2.24 14.58 11.4 21.41 15.4 8.4 4.94 19.2 9.27 31.12 12.5 8.98 2.42 10.15 2.5 47.6 3.02 21.12.3 51.5.32 67.52.06l29.12-.48zM157.3 518.52a109.45 109.45 0 0 0 13.44-4.78l6.18-2.8-5.28-2.96c-14.73-8.26-21.46-12.42-30.12-18.64l-9.48-6.8-19.32 19.38L93.4 521.3l28.32-.4c24.83-.35 29.22-.64 35.58-2.38zm164.25-.26c37.13-5.45 74.47-20.67 103.52-42.2l6.9-5.12-8.06-8.06-8.06-8.05-10.77 7.2c-36.94 24.67-83.19 37.8-125.89 35.7-7.11-.35-13.89-.87-15.06-1.17-1.75-.44-2.48.18-4.23 3.64a152.08 152.08 0 0 1-6.26 10.61c-2.29 3.55-3.84 6.65-3.46 6.88.71.44 15.97 2.23 24.66 2.9 9.35.7 34.6-.55 46.7-2.33zm141.26-16.48-19.39-19.4-3.65 2.69c-8 5.88-27.08 18.29-33.77 21.96l-7.09 3.89 3.66 1.87c13.15 6.75 22.47 8.18 53.71 8.29l25.92.09zM198.2 493.9c3.08-3.37 6.35-7.42 7.26-8.98l1.65-2.84-10.78-5.27c-53.43-26.09-92.77-72.27-109.76-128.85a204 204 0 0 1-2.29-7.92c0-.8 53.7-.2 62.32.68 11.35 1.17 23.67 4.52 31.95 8.7l5.86 2.96 8.53-8.53 8.53-8.52-7.51-4a139.42 139.42 0 0 0-17.55-7.36c-17.92-5.99-21.8-6.32-73.4-6.32H56.7l1.82 10.32c11.34 63.98 47.02 118.42 101.11 154.27 9.88 6.55 30.17 17.8 32.1 17.8.47 0 3.38-2.76 6.46-6.14zm105.22-12.7 4.37-.6-1.3-4.43c-3.45-11.82-4.7-21.91-4.73-38.52-.03-12.7.39-18.8 1.7-24.96a157.1 157.1 0 0 1 18.12-46.36l2.16-3.63-17.97-17.96-17.97-17.97-18 18-18 18.01 2.7 4.55c18.77 31.65 24.68 71.44 15.64 105.3-1.93 7.23-2 8.18-.66 8.54 2.46.66 29.18.69 33.94.04zm37.76-6.6 4.9-1.4-2.22-7.68c-4.91-16.97-4.85-37.08.16-54.4 11.02-38 44.84-66.32 84-70.32 7.85-.8 63.3-1.5 63.3-.8a218.68 218.68 0 0 1-29.44 65.25l-7.14 10.68 8.08 8.08 8.07 8.07 5.51-7.54c20.39-27.86 34.31-60.93 40.66-96.57l1.84-10.32-40.43-.11c-48.9-.14-50.84-.09-60.84 1.63-50.18 8.64-89.7 48.3-98.66 99.03-3.13 17.73-1.2 43.72 4.33 58.27l.88 2.3 6.05-1.38a252.7 252.7 0 0 0 10.95-2.8zm-125.05-12.71c5.04-18.04 4.33-37.07-1.97-52.81l-2.48-6.18-19.96 19.95c-10.98 10.97-19.76 20.3-19.5 20.72 1.87 3.02 38.26 23.84 41.68 23.84.38 0 1.38-2.49 2.23-5.52zm156.6.35c10.24-4.86 27.96-15.57 30.16-18.21.74-.9-4.05-6.24-18.98-21.16l-19.98-19.96-2.55 6.89c-3.12 8.4-5.42 21.06-5.42 29.8 0 8.76 3.72 27.8 5.43 27.8.26 0 5.37-2.32 11.34-5.16zM268.36 307.33l-7.9-7.94-58.76 58.75-58.75 58.74 2.9 3.42c1.59 1.89 5.13 5.46 7.86 7.94l4.96 4.51 58.8-58.74 58.79-58.74zm-100.78 54.6c-9.73-4.34-20.5-5.86-41.85-5.87l-19.5-.01.63 2.16c2.36 8.05 14.58 30.68 22.33 41.36l3.37 4.65 20.05-20 20.04-20.01zm283.43 30.97c5.39-8.31 16.21-29.51 17.72-34.7l.63-2.15h-18.18c-20.25 0-30.47 1.33-41.48 5.41l-6.88 2.55L422.78 384c14.92 14.93 20.26 19.72 21.15 18.98.67-.55 3.85-5.08 7.08-10.07zM341.6 341.5l7.82-7.83-53.7-53.7-53.7-53.7-7.92 7.91-7.92 7.92 53.61 53.61a11119.5 11119.5 0 0 0 53.8 53.62c.1 0 3.7-3.53 8-7.83zm89.05-185.1c-1.13-1.34-4.69-4.9-7.9-7.93l-5.83-5.5-58.79 58.77-58.79 58.76 7.9 7.94 7.9 7.94 58.78-58.77 58.79-58.78zM157.7 256.58c57.55-9.45 100.37-60.2 100.4-119 .02-14.32-2.17-28.69-5.82-38.28l-.87-2.3-6.06 1.38a260.4 260.4 0 0 0-10.95 2.8l-4.9 1.4 2.23 7.68c4.91 16.96 4.85 37.07-.17 54.38-11.05 38.14-45.28 66.69-84.34 70.33-8.55.8-62.96 1.5-62.96.8 0-.19 1.03-3.77 2.29-7.96a218.68 218.68 0 0 1 27.15-57.28l7.13-10.67-7.96-8.02-7.97-8.02-2.22 2.67c-4 4.82-16.12 23.63-20.6 31.96-10.54 19.64-18.31 41.97-22.7 65.28l-2.63 13.92 40.4.48c45.2.53 48.37.45 60.55-1.55zm359.34-8.77c-12.9-72.44-57.84-133.63-122.64-167l-10.8-5.56-5.91 6.36c-3.25 3.5-6.64 7.64-7.54 9.2l-1.64 2.82 12.89 6.43A209.6 209.6 0 0 1 489.03 227.8a204 204 0 0 1 2.28 7.92c0 .75-53.23.18-61.86-.66-11.55-1.13-21.41-3.73-31.12-8.21l-7.26-3.36-8.51 8.51-8.5 8.51 9.9 4.88a153.26 153.26 0 0 0 18 7.4c15.68 4.88 19.2 5.15 69.78 5.24l47.15.09zm-211-17.06 17.74-17.77-2.7-4.55c-18.78-31.64-24.69-71.38-15.64-105.27l2.17-8.1-2-.53c-2.72-.73-28.05-.7-33.45.03l-4.36.6 1.3 4.44c3.45 11.82 4.69 21.92 4.72 38.53.03 12.7-.38 18.79-1.7 24.96a157.1 157.1 0 0 1-18.1 46.34l-2.16 3.63 17.7 17.73c9.75 9.76 17.95 17.74 18.22 17.74.28 0 8.49-8 18.25-17.78zm-151.7-12.87c2.38-.58 7.5-2.2 11.38-3.58l7.06-2.52-19.97-19.99c-14.93-14.94-20.27-19.73-21.17-18.99-4.2 3.49-22.3 36.18-24.83 44.88l-.67 2.28 21.94-.51c12.07-.28 23.89-.99 26.26-1.57zm314.38-.31c-2.48-8.54-21.77-43.11-25.25-45.26-.42-.26-9.74 8.5-20.7 19.47l-19.93 19.95 5.11 2.17c10.25 4.35 19.87 5.69 41.42 5.76l19.98.07-.63-2.16zm-274.36-21.12c3.44-3.3 6.69-6.82 7.22-7.82.85-1.58-8.52-11.3-72.57-75.36-40.45-40.45-73.55-73.86-73.55-74.24 0-1.05 77.66-.87 89.76.21 5.81.52 13.8 1.84 17.76 2.93 6.75 1.86 23.25 9.28 28.94 13.01 2.48 1.63 2.85 1.57 15.2-2.57l12.65-4.24-3.67-3.22c-15.58-13.65-37.06-23.76-58.39-27.48-8.2-1.43-17.59-1.56-106.42-1.49l-28.66.03-3.26 3.26c-2.82 2.81-3.27 3.9-3.27 7.9v4.65l85.2 85.21c46.85 46.87 85.55 85.22 86 85.22.44 0 3.62-2.7 7.06-6zm154.96-17.81c-9.75-19.3-11.84-46.45-5.32-68.95a97.93 97.93 0 0 1 52.4-61.28c12.17-5.75 21.14-8.08 35.38-9.19 13.77-1.07 88.32-1.24 88.32-.2 0 .38-14.47 15.18-32.17 32.87l-32.16 32.18 7.94 7.9 7.95 7.91 43.9-43.94L559.47 32v-4.63c0-4-.45-5.09-3.26-7.9l-3.27-3.26-28.17-.02c-98.83-.05-98.12-.06-106.58 1.42-44.46 7.79-81.37 39.63-94.9 81.87a116.26 116.26 0 0 0-5.8 37.69c.01 20 3.87 36.44 12.79 54.55l4.88 9.9 8.56-8.56 8.57-8.56zm-132.37-21.31c2.84-10.4 2.86-31.25.06-41.11-1.1-3.87-2.22-7.25-2.49-7.52-1.41-1.41-29.66 13.82-39.88 21.5l-3.22 2.42 20.02 20.05 20.02 20.04 1.77-4.1c.96-2.24 2.64-7.32 3.72-11.28zm186.41-25.13c-2.11-3.42-40.71-25.1-42.14-23.67-1.5 1.5-4.5 17.13-4.95 25.76-.6 11.34 1.52 24.29 5.46 33.45l2.2 5.1 19.95-19.93c10.98-10.97 19.74-20.29 19.48-20.71zm-233.03-18.31c27.89-18.58 56.42-29.38 91.05-34.45 9.3-1.36 41.58-1.75 48.22-.57 4.04.7 4.06.7 6.13-3.38 1.13-2.25 3.93-6.99 6.22-10.53 2.28-3.55 3.85-6.64 3.47-6.87-.37-.22-4.57-.86-9.32-1.41-30.04-3.5-56.42-1.77-85.92 5.6-27.46 6.85-56.33 20.37-79.05 37l-7.52 5.5 7.98 8.04a308.5 308.5 0 0 0 8.14 8.03c.09 0 4.86-3.14 10.6-6.96zM139.47 88.2c8.28-6.27 17.18-12.05 28.26-18.37l8.99-5.11-6.03-2.8c-13.14-6.12-16.94-6.67-48.5-7.07l-28.8-.36 19.2 19.25C123.14 84.34 132.08 93 132.45 93c.38 0 3.53-2.16 7.02-4.8zM463 73.74l19.2-19.27-28.33.4c-31 .44-35.6 1.1-49 7.14l-6.18 2.79 10.07 5.62c10 5.59 22.86 13.92 30.23 19.58 2.11 1.63 4.06 2.96 4.33 2.98.27.01 9.13-8.65 19.68-19.24z' style='fill:%23000;stroke-width:.95999998'/%3E%3C/svg%3E");
    --heading-mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 12 12'%3E%3Cpath d='M1 6a5 5 0 0 0 5-5 5 5 0 0 0 5 5 5 5 0 0 0-5 5 5 5 0 0 0-5-5z' style='fill:none;stroke:%23000;stroke-width:.6;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-opacity:1;stroke-dasharray:none'/%3E%3C/svg%3E");
    --hr-icon-mask: var(--heading-mask);
}

body, li, p {
    line-height: 1.5;
}

body {
    font-family: var(--body-font);
    color: rgb(var(--dark-depth));
    background-color: rgb(var(--foamy-white));
    font-size: 0.925rem;
}


::selection {
    background-color: rgb(var(--ocean-depth),0.875);
    color: rgb(var(--foamy-white));
}

/*-------------------------------------*/
/*-------------HEADER---------------*/
/*-------------------------------------*/

div#container-wrap, #header { background: none; }
#header h1 a, #header h2 span {
    color: #00000000;
    text-shadow: none;
    user-select: none;
}

#header {
    height: calc(var(--header-height) + var(--top-bar-height));
    padding: 0;
}
#extra-div-1 {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: calc(var(--header-height) + var(--top-bar-height));
    background-image: var(--header-image);
    background-size: cover;
    background-position: right center;
    overflow: hidden;
    isolation: isolate;
    border-bottom-right-radius: min(calc(1.5rem + 4vw), 7.5rem);
}
#extra-div-2 {
    width: min(calc(1.5rem + 4vw), 7.5rem);
    aspect-ratio: 1;
    position: absolute;
    top: calc(var(--header-height) + var(--top-bar-height));
    left: 0;
    background-color: rgb(var(--undersea-tone));
    z-index: -1;
}
#extra-div-2::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 102%; height: 102%;
    background-color: rgb(var(--foamy-white));
    border-top-left-radius: min(calc(1.5rem + 4vw), 7.5rem);
}

#extra-div-1::before, #extra-div-1::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: min(36rem, 100%);
    height: 100%;
    background-image: linear-gradient(90deg, rgb(var(--undersea-tone)) 12.5%, transparent);
}
#extra-div-1::after {
    background-image: var(--title-image);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    height: calc(100% - var(--top-bar-height)/1.5);
}
#header h1 {
    float: none; margin: 0; max-height: unset;
    position: absolute;
    top: 0; left: 0;
    display: block;
    width: min(26rem, 100%);
    height: calc(100% - var(--top-bar-height));
}
#header h1 a {
    width: 100%;
    height: 100%;
    padding: 0;
    max-height: unset;
}

#extra-div-1 span {
    position: absolute;
    top: var(--header-height); left: 0;
    width: 100%;
    height: var(--top-bar-height);
    background-color: rgb(var(--undersea-tone), 67.5%);
    -webkit-backdrop-filter: blur(0.125rem);
    backdrop-filter: blur(0.125rem);
}

#top-bar {
    top: var(--header-height);
    right: 0;
    height: var(--top-bar-height);
    line-height: var(--top-bar-height);
    font-family: var(--UI-font);
}
#top-bar div[class*="top-bar"] > ul > li > ul {
    border: none;
    min-width: 100%;
    box-shadow: none;
}
#top-bar div[class*="top-bar"] > ul > li > a {
    font-size: 0.825em;
    font-weight: normal;
    text-transform: uppercase;
    letter-spacing: 0.115ch;
    border: none;
}
#top-bar ul li a {
    padding: 0 min(.875vw, 1.25em);
    height: var(--top-bar-height);
    line-height: var(--top-bar-height);
}

#top-bar div[class*="top-bar"] > ul > li.sfhover > a,
#top-bar div[class*="top-bar"] ul li:hover a:hover {
    background-color: rgb(var(--lagoon-hue));
    color: rgb(var(--foamy-white));
}

#top-bar ul li ul li a, #top-bar ul li.sfhover ul li a, #top-bar ul li:hover ul li a {
    box-sizing: border-box;
    min-width: 100%;
    padding: 0.475em;
    color: rgb(var(--lagoon-hue));
    background-color: rgb(var(--hazy-sky));
}

/* mobile top bar */

#top-bar .mobile-top-bar {
    left: 0;
    width: 100%;
}
#top-bar .mobile-top-bar > ul {
    float: none;
    display: flex;
    justify-content: center;
    border: none;
}
#top-bar .mobile-top-bar > ul > li { flex-grow: 1; }

#login-status {
    color: rgb(var(--foamy-white));
    background-color: rgb(var(--undersea-tone), 0.5);
    backdrop-filter: blur(0.125rem);
    font-family: var(--UI-font);
    padding: 0.25rem 0.475rem;
    box-sizing: border-box;
    top: 0;
}
a#account-topbutton {
    background: transparent;
    color: rgb(var(--lagoon-hue));
    border: none;
}
#account-options {
    background: rgb(var(--undersea-tone));
    border: none;
    text-align: end;
}
#login-status ul a {
    color: rgb(var(--lagoon-hue));
    padding: 0.5em;
}
#login-status ul a:is(:hover, :focus) {
    color: rgb(var(--foamy-white));
    background-color: rgb(var(--lagoon-hue));
}
@media (max-width: 768px) {
    #login-status span.printuser {
        font-size: 0;
    }
    #login-status span.printuser img {
        transform: translate(6px, 5px);
    }
    #my-account { display: none; }
}

/* ---- SEARCH ---- */
div#search-top-box {
    top: 2.25rem;
    right: 0.825rem;
    width: 1.6rem;
}
 
div#search-top-box::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0; right: 0.1rem;
    background-color: rgb(var(--lagoon-hue));
    pointer-events: none;
    z-index: 2;
    -webkit-mask-image: var(--search-mask);
            mask-image: var(--search-mask);
    -webkit-mask-size: 1rem;
            mask-size: 1rem;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    transition: opacity 0.25s ease;
}
div#search-top-box:is(:hover,:focus-within)::before { background-color: rgb(var(--undersea-tone)); }
 
div#search-top-box form {
    display: flex;
    justify-content: flex-end;
}
 
div#search-top-box form input[type="text"]:not(:focus),
div#search-top-box form input[type="text"]:not(:focus):not(:hover) {
    position: relative;
    color: transparent;
    cursor: pointer;
    display: none;
    font-family: var(--body-font);
    width: 1.6rem;
    height: 1.6rem;
    padding: 0.1em 0.5em;
    box-sizing: border-box;
    border-radius: 0;
    border: none;
}
 
div#search-top-box form input[type="text"],
div#search-top-box form input[type="text"]:hover,
div#search-top-box form input[type="text"]:focus {
    background-color: rgb(var(--foamy-white))!important;
    color: rgb(var(--dark-depth));
    display: inline-block;
    border: none;
    height: 1.6rem;
    width: 9rem;
    transition: width .25s;
    outline: none;
    box-shadow: none;
    padding: 0.1em 0.5em;
    box-sizing: border-box;
    border-radius: 0;
}
 
div#search-top-box form input[type="submit"].button {
    display: block;
    height: 1.6rem;
    width: 1.6rem;
    border: none;
    border-radius: 0;
    color: transparent;
    text-shadow: none;
    box-shadow: none;
    background: rgb(var(--undersea-tone));
    appearance: none;
}
div#search-top-box form input[type="submit"].button:is(:hover, :focus) {
    background: rgb(var(--lagoon-hue));
}

/*-------------------------------------*/
/*-------------LAYOUT---------------*/
/*-------------------------------------*/

#container {
    display: flex;
    flex-direction: column;
}

#content-wrap {
    width: 100%;
    max-width: 68rem;
    margin-top: 0;
    display: grid;
    grid-template-areas:
        "deco deco"
        "side main";
    grid-template-rows: var(--deco-size) auto;
    grid-template-columns: var(--side-bar-width) minmax(0, 1fr);
    grid-gap: 1.125rem 2.5rem;
    padding: 1.125rem 2.5em;
    box-sizing: border-box;
}

#content-wrap::before, #content-wrap::after {
    content: "";
    display: block;
    width: 100%;
    height: var(--deco-size);
    grid-area: deco;
    background-color: rgb(var(--lagoon-hue));
}
#content-wrap::before {
    height: 0.1rem;
    border-radius: 1rem;
    align-self: center;
    -webkit-mask-image: linear-gradient(90deg, transparent, black calc(50% - var(--deco-size)/2 - 0.125rem), transparent calc(50% - var(--deco-size)/2 - 0.125rem), transparent calc(50% + var(--deco-size)/2 + 0.125rem), black calc(50% + var(--deco-size)/2 + 0.125rem), transparent);
    mask-image: linear-gradient(90deg, transparent, black calc(50% - var(--deco-size)/2 - 0.125rem), transparent calc(50% - var(--deco-size)/2 - 0.125rem), transparent calc(50% + var(--deco-size)/2 + 0.125rem), black calc(50% + var(--deco-size)/2 + 0.125rem), transparent);
}
#content-wrap::after {
    width: var(--deco-size);
    justify-self: center;
    -webkit-mask-image: var(--deco-mask);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    mask-image: var(--deco-mask);
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}

#side-bar {
    position: relative;
    width: var(--side-bar-width);
    top: 0; left: 0;
    margin: 0;
    grid-area: side;
}

#main-content {
    margin: 0; padding: 0;
    max-width: unset;
    grid-area: main;
}

@media only screen and (max-width:768px) {
    #content-wrap {
        grid-template-areas:
            "deco deco"
            "main main";
    }
    #side-bar {
        position: fixed;
        left: calc(var(--side-bar-width)*-1.15);
        overflow-x: hidden;
    }
    #side-bar, #side-bar:target {
        border: none; 
        width: var(--side-bar-width);
    }
}

/*--------------------------------------*/
/*-------------SIDEBAR---------------*/
/*--------------------------------------*/

#side-bar {
    box-sizing: border-box;
}

:is(#side-bar, #interwiki) a {
    color: rgb(var(--lagoon-hue));
}

:is(#side-bar, #interwiki) .side-block {
    border: none;
    box-shadow: none;
    border-radius: 0;
    background: rgb(var(--foamy-white));
    font-family: var(--UI-font);
}
#side-bar .side-block.media { background-color: rgb(var(--foamy-white)); }
#side-bar .side-block.resources { background-color: rgb(var(--hazy-sky)); }

:is(#side-bar, #interwiki) .heading {
    display: flex;
    align-items: center;
    column-gap: 0.125em;
    color: rgb(var(--undersea-tone));
    font-family: var(--header-font);
    font-size: 1.125rem;
    border-color: currentColor;
    padding: 0;
}
:is(#side-bar, #interwiki) .heading::before {
    content: "";
    display: inline-block;
    width: 1em; height: 1em;
    background-color: currentColor;
    -webkit-mask-image: var(--heading-mask);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    mask-image: var(--heading-mask);
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}
@media only screen and (max-width:768px) {
    #side-bar {
        background-color: rgb(var(--foamy-white));
        padding: 0;
    }
    #side-bar .side-block { margin: 0; }
}

:is(#side-bar, #interwiki) .menu-item img {
    display: none;
}

#top-bar .open-menu a {
    border: none;
    color: rgb(var(--lagoon-hue));
    background-color: rgb(var(--undersea-tone));
    border-radius: 0;
    padding: 0.125rem;
}

/*--------------------------------------*/
/* -------- PAGE ELEMENTS -------- */
/*--------------------------------------*/

#page-title, .meta-title {
    display: flex;
    align-items: center;
    column-gap: 0.325rem;
    color: rgb(var(--undersea-tone));
    font-family: var(--header-font);
    font-weight: bold;
    font-size: 2.675em;
    line-height: 1;
    padding-bottom: 0;
    border-bottom: none;
    margin-bottom: 0.425em;
}
:is(#page-title, .meta-title)::before,
:is(#page-title, .meta-title)::after {
    content: "";
    display: block;
    height: 0.1rem;
    min-width: 2.5rem;
    flex-grow: 1;
    background: currentColor;
    order: 1;
}
:is(#page-title, .meta-title)::before {
    flex-grow: 0;
    width: 1.75rem;
    min-width: 1.75rem;
    height: 1.75rem;
    -webkit-mask-image: var(--heading-mask);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    mask-image: var(--heading-mask);
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}

.page-source, tt, .code pre, .code p, .code {
    font-family: var(--mono-font);
}

a:any-link:not(.newpage) {
    color: rgb(var(--lagoon-hue));
}
a:visited, :is(#side-bar,#interwiki) a:visited {
    color: rgb(var(--ocean-depth));
}

h1,h2,h3,h4,h5,h6 {
    font-family: var(--UI-font);
    font-weight: bold;
    color: rgb(var(--undersea-tone));
}
h1,h2 { line-height: 1.25; }
h3,h4 { line-height: 1.325; }

hr {
    --hr-icon-size: 1.25rem;
    margin: 2.25rem 0;
    background: transparent;
    height: var(--hr-icon-size);
    display: grid;
    place-items: center;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
}
hr::before, hr::after {
    content: "";
    display: grid;
    grid-column: 1/2;
    grid-row: 1/2;
    background-color: rgb(var(--undersea-tone));
}
hr::before {
    height: 0.05rem;
    width: 100%;
    -webkit-mask-image: linear-gradient(90deg, black calc(50% - var(--hr-icon-size)/2 - 0.125rem), transparent calc(50% - var(--hr-icon-size)/2 - 0.125rem), transparent calc(50% + var(--hr-icon-size)/2 + 0.125rem), black calc(50% + var(--hr-icon-size)/2 + 0.125rem));
    mask-image: linear-gradient(90deg, black calc(50% - var(--hr-icon-size)/2 - 0.125rem), transparent calc(50% - var(--hr-icon-size)/2 - 0.125rem), transparent calc(50% + var(--hr-icon-size)/2 + 0.125rem), black calc(50% + var(--hr-icon-size)/2 + 0.125rem));
}
hr::after {
    width: var(--hr-icon-size);
    height: var(--hr-icon-size);
    -webkit-mask-image: var(--hr-icon-mask);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    mask-image: var(--hr-icon-mask);
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}

/*---- RATE MODULE ----*/
.page-rate-widget-box,
div.creditRate {
    margin-right: 0;
}
.page-rate-widget-box, 
div.rate-box-with-credit-button {
    font-family: var(--UI-font);
    box-shadow: none;
    border: none;
    border-radius: 0;
    background: rgb(var(--hazy-sky));
    border-bottom: solid 0.125em rgb(var(--lagoon-hue));
}
.page-rate-widget-box > span {
    display: inline-block;
}

div.page-rate-widget-box :is(.rate-points,.rateup,.ratedown,.cancel) {
    border-radius: 0;
    border: none;
    background-color: transparent;
    color: inherit;
}
div.page-rate-widget-box span:is(.rate-points,.rateup,.ratedown,.cancel) a {
    border-radius: 0;
    display: inline-block;
    width: 2ex;
    text-align: center;
}
div.page-rate-widget-box span:is(.rate-points,.rateup,.ratedown,.cancel) a:is(:hover,:focus) {
    border-radius: 0;
    color: rgb(var(--foamy-white));
    background-color: rgb(var(--lagoon-hue));
}

div.rate-box-with-credit-button .page-rate-widget-box {
    border-bottom: none;
}
.creditRate .rateBox div.rate-box-with-credit-button p { display: contents; }
div.rate-box-with-credit-button p a { border-left: none; }

#page-content div.modalbox {
    border-radius: 0;
    background: rgb(var(--foamy-white));
    box-shadow: none;
}
.modalbox hr {
    margin: 0.25rem 0.875rem;
}

/*---- BLOCKQUOTE ----*/
blockquote, div.blockquote {
    background-color: rgb(var(--hazy-sky));
    border: none;
    border-inline-start: solid 0.25rem rgb(var(--lagoon-hue));
    padding: 0.25rem 1.125rem;
}

.code, .page-source {
    border: none;
    background-color: rgb(var(--hazy-sky));
}


/*---- IMAGE BLOCK ----*/
.scp-image-block {
    border: none;
    box-shadow: none;
    background-color: rgb(var(--hazy-sky));
    padding: 0.625em;
    border-bottom: solid 0.1rem rgb(var(--undersea-tone));
    box-sizing: border-box;
}
.scp-image-block.block-left { margin-left: 0; }
.scp-image-block.block-right { margin-right: 0; }
.scp-image-block .scp-image-caption {
    border-top: none;
    padding: 0.5em 0.25em 0;
    box-sizing: border-box;
    background-color: transparent;
}

/*---- FOOTNOTES ----*/
bibitems .title, .footnotes-footer .title {
    font-family: var(--UI-font);
    font-size: 1.375em;
}

.hovertip {
    background-color: rgb(var(--foamy-white))!important;
    border-color: rgb(var(--undersea-tone))!important;
    padding: 0.25em 0.125em;
}
.hovertip .content .footnote .f-heading,
.hovertip .content .reference .r-heading {
    font-family: var(--UI-font);
}

/* ---- TABS ---- */
 
/* ---- YUI TAB BASE ---- */
.yui-navset .yui-nav a,.yui-navset .yui-navset-top .yui-nav a{background-color:inherit;background-image:inherit}.yui-navset .yui-nav a:hover,.yui-navset .yui-nav a:focus{background:inherit;text-decoration:inherit}.yui-navset .yui-nav .selected a,.yui-navset .yui-nav .selected a:focus,.yui-navset .yui-nav .selected a:hover{color:inherit;background:inherit}.yui-navset .yui-nav,.yui-navset .yui-navset-top .yui-nav{border-color:inherit}.yui-navset li{line-height:inherit}
 
/* ---- YUI TAB CUSTOMIZATION ----*/
 
.yui-navset { clear: both; }

 .yui-navset .yui-nav,
 .yui-navset .yui-navset-top .yui-nav{
     display: flex;
     flex-wrap: wrap;
     margin: 0 auto;
     font-family: var(--UI-font);
     font-weight: bold;
     border-bottom: solid 0.125rem rgb(var(--undersea-tone));
     box-shadow: none;
}
 .yui-navset .yui-nav a, /* ---- Link Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav a{
     color: rgb(var(--undersea-tone));
    /* ---- Tab Background Colour | [UNSELECTED] ---- */
     background-color: rgb(var(--hazy-sky));
     border: unset;
     box-shadow: none;
     box-shadow: none;
}
 .yui-navset .yui-nav a:hover,
 .yui-navset .yui-nav li:not(.selected) a:focus {
     color: rgb(var(--foamy-white));
    /* ---- Tab Background Colour | [HOVER] ---- */
     background-color: rgb(var(--lagoon-hue));
}
 .yui-navset .yui-nav li, /* ---- Listitem Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav li{
     position: relative;
     display: flex;
     flex-grow: 2;
     max-width: 100%;
     margin: 0;
     padding: 0;
     color: rgb(var(--foamy-white));
     background-color: rgb(var(--foamy-white));
     border-color: transparent;
     box-shadow: none;
}
 .yui-navset .yui-nav li a,
 .yui-navset-top .yui-nav li a,
 .yui-navset-bottom .yui-nav li a{
     display: flex;
     align-items: center;
     justify-content: center;
     width: 100%;
}
 .yui-navset .yui-nav li em{
     border: unset;
}
 .yui-navset .yui-nav a em,
 .yui-navset .yui-navset-top .yui-nav a em{
     padding: .35em .75em;
 
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
}
 .yui-navset .yui-nav .selected, /* ---- Selection Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav .selected{
     flex-grow: 2;
     margin: 0;
     padding: 0;
    /* ---- Tab Background Colour | [SELECTED] ---- */
     background-color: rgb(var(--undersea-tone));
}
 .yui-navset .yui-nav .selected a,
 .yui-navset .yui-nav .selected a em{
     border: none;
}
 .yui-navset .yui-nav .selected a{
     width: 100%;
     color: rgb(var(--foamy-white));
}
 .yui-navset .yui-content {
    background-color: rgb(var(--hazy-sky));
}
 .yui-navset .yui-content,
 .yui-navset .yui-navset-top .yui-content{
     padding: 0.25rem .625rem;
     border: none;
}

/* ---- TABLE ---- */

table.wiki-content-table td {
    border-color: rgb(var(--lagoon-hue));
}
table.wiki-content-table th {
    border-color: rgb(var(--undersea-tone));
    background-color: rgb(var(--undersea-tone));
    color: rgb(var(--foamy-white));
}

#page-content .licensebox a.collapsible-block-link {
    color: rgb(var(--ocean-depth));
}

/*--------------------------------------------*/
/*-------------BOTTOM AREA---------------*/
/*--------------------------------------------*/

#extrac-div-1 {
    order: 2;
    background-color: rgb(var(--lagoon-hue));
    height: min(calc(1.5rem + 4vw), 7.5rem);
    border-top-left-radius: min(calc(1.5rem + 4vw), 7.5rem);
    position: relative;
}
#extrac-div-1 span {
    display: block;
    width: min(calc(1.5rem + 4vw), 7.5rem);
    aspect-ratio: 1;
    position: absolute;
    bottom: 100%;
    right: 0;
    background-color: inherit;
    z-index: -1;
}
#extrac-div-1 span::before {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 102%;
    height: 102%;
    background-color: rgb(var(--foamy-white));
    border-bottom-right-radius: min(calc(1.5rem + 4vw), 7.5rem);
}

#footer {
    order: 3;
    display: flex!important;
    flex-wrap: wrap;
    column-gap: 0.5ex;
    align-items: center;
    justify-content: center;
    margin-top: 0;
    color: rgb(var(--ocean-depth));
    background-color: rgb(var(--lagoon-hue));
    padding: 0.5rem;
}
#footer .options {
    float: none;
    width: auto;
    font-size: 0;
    display: flex!important;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 0.5rem;
    padding-right: 0.675rem;
}
#footer .options a {
    font-size: 0.675rem;
}

#footer, #extrac-div-1, #extrac-div-1 span {
    background-image: var(--header-image);
    background-size: 100vmax;
    background-attachment: fixed;
    background-position: bottom;
}

#license-area {
    order: 4;
    position: relative;
    isolation: isolate;
    padding: 0.5rem;
    font-size: 0.75rem;
    color: rgb(var(--foamy-white));
    background-color: rgb(var(--lagoon-hue));
}
#license-area a {
    color: inherit;
    font-weight: bold;
}
[[/code]]
[[/collapsible]]
[[include :scp-wiki:component:license-box-theme]]
=====
> **Filename:** Orkney.png
> **Author:** [[*user EstrellaYoshte]]
> **License:** CC BY-SA 3.0
> **Source Link:** This Page
> **Derivative of:** [https://commons.wikimedia.org/wiki/File:Modern_nautical_compass_rose.svg Modern nautical compass rose.svg] by Mysid, Public Domain

> **Filename:** Celtic-knot-insquare.svg
> **Author:** AnonMoos
> **License:** Public Domain
> **Source Link:** [https://commons.wikimedia.org/wiki/File:Celtic-knot-insquare.svg Wikimedia Commons]

> **Filename:** Four-point cusp.svg
> **Author:** Kwamikagami
> **License:** CC BY-SA 4.0
> **Source Link:** [https://commons.wikimedia.org/wiki/File:Four-point_cusp.svg Wikimedia Commons]

> **Filename:** Orkney Islands by Sentinel-2.jpg
> **Author:** Copernicus Sentinel-2, ESA
> **License:** CC BY-SA 3.0 IGO
> **Source Link:** [https://commons.wikimedia.org/wiki/File:Orkney_Islands_by_Sentinel-2.jpg Wikimedia Commons]

> **Filename:** Mither.jpeg
> **Author:** Mah Ta
> **License:** CC BY 2.0
> **Source Link:** [https://www.flickr.com/photos/mah-ta/5602042481/in/photostream/ Flickr]
=====
[[include :scp-wiki:component:license-box-end]]
[[/iftags]]

Oceanbound Theme

Module Styles

Inline Styles

Includes

CSS Classes

Page Source