html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}body{-webkit-text-size-adjust:none}mark{background-color:transparent;color:inherit}input::-moz-focus-inner{border:0;padding:0}input[type="text"],input[type="email"],select,textarea{-moz-appearance:none;-webkit-appearance:none;-ms-appearance:none;appearance:none}
*, *:before, *:after {
box-sizing: border-box;
}
body {
line-height: 1.0;
min-height: var(--viewport-height);
min-width: 320px;
overflow-x: hidden;
word-wrap: break-word;
background-color: #5BACD2;
}
:root {
--background-height: 100vh;
--site-language-alignment: left;
--site-language-direction: ltr;
--site-language-flex-alignment: flex-start;
--site-language-indent-left: 1;
--site-language-indent-right: 0;
--site-language-margin-left: 0;
--site-language-margin-right: auto;
--viewport-height: 100vh;
}
html {
font-size: 18pt;
}
u {
text-decoration: underline;
}
strong {
color: inherit;
font-weight: bolder;
}
em {
font-style: italic;
}
code {
background-color: rgba(144,144,144,0.25);
border-radius: 0.25em;
font-family: 'Lucida Console', 'Courier New', monospace;
font-size: 0.9em;
font-weight: normal;
letter-spacing: 0;
margin: 0 0.25em;
padding: 0.25em 0.5em;
text-indent: 0;
}
mark {
background-color: rgba(144,144,144,0.25);
}
spoiler-text {
-webkit-text-stroke: 0;
background-color: rgba(32,32,32,0.75);
text-shadow: none;
text-stroke: 0;
color: transparent;
cursor: pointer;
transition: color 0.1s ease-in-out;
}
spoiler-text.active {
color: #fdfeff;
cursor: text;
}
s {
text-decoration: line-through;
}
sub {
font-size: smaller;
vertical-align: sub;
}
sup {
font-size: smaller;
vertical-align: super;
}
a {
color: inherit;
text-decoration: underline;
transition: color 0.25s ease;
}
a[onclick]:not([href]) {
cursor: pointer;
}
deferred-script {
display: none;
}
#wrapper {
 -webkit-overflow-scrolling: touch;
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
min-height: calc(var(--viewport-height) + -40px);
overflow: hidden;
position: relative;
z-index: 2;
}
#main {
--alignment: center;
--flex-alignment: center;
--indent-left: 1;
--indent-right: 1;
--margin-left: auto;
--margin-right: auto;
--border-radius-tl: 0;
--border-radius-tr: 0;
--border-radius-br: 0;
--border-radius-bl: 0;
align-items: center;
display: flex;
flex-grow: 0;
flex-shrink: 0;
justify-content: center;
max-width: 100%;
position: relative;
text-align: var(--alignment);
z-index: 1;
transition: opacity 1s ease-in-out 0s;
}
#main > .inner {
--padding-horizontal: 3rem;
--padding-vertical: 3rem;
--spacing: 1.5rem;
--width: 50rem;
border-radius: var(--border-radius-tl) var(--border-radius-tr) var(--border-radius-br) var(--border-radius-bl);
max-width: 100%;
position: relative;
width: var(--width);
z-index: 1;
padding: var(--padding-vertical) var(--padding-horizontal);
}
#main > .inner > header {
margin-bottom: var(--spacing);
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#main > .inner > footer {
margin-top: var(--spacing);
}
#main > .inner > * > * {
margin-top: var(--spacing);
margin-bottom: var(--spacing);
}
#main > .inner > * > :first-child {
margin-top: 0 !important;
}
#main > .inner > * > :last-child {
margin-bottom: 0 !important;
}
#main > .inner > .full {
margin-left: calc(var(--padding-horizontal) * -1);
max-width: calc(100% + calc(var(--padding-horizontal) * 2) + 0.4725px);
width: calc(100% + calc(var(--padding-horizontal) * 2) + 0.4725px);
}
#main > .inner > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#main > .inner > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#main > .inner > .full.screen {
border-radius: 0 !important;
max-width: 100vw;
position: relative;
width: 100vw;
left: 50%;
margin-left: -50vw;
right: auto;
}
#main > .inner > * > .full {
margin-left: calc(-3rem);
max-width: calc(100% + 6rem + 0.4725px);
width: calc(100% + 6rem + 0.4725px);
}
#main > .inner > * > .full.screen {
border-radius: 0 !important;
max-width: 100vw;
position: relative;
width: 100vw;
left: 50%;
margin-left: -50vw;
right: auto;
}
#main > .inner > header > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
margin-top: -3rem !important;
}
#main > .inner > .active > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
margin-bottom: -3rem !important;
}
#main > .inner > .active {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
body.is-loading #main {
opacity: 0;
}
#main > .inner > section > * {
transition: opacity 1s ease-in-out 0s;
}
body.is-loading #main > .inner > section > * {
opacity: 0;
}
#main > .inner > header, #main > .inner > footer {
transition: opacity 0.25s ease-in-out 0.375s,visibility 0.25s linear 0.375s;
}
#main > .inner > header.hidden, #main > .inner > footer.hidden {
transition: opacity 0.25s ease-in-out, visibility 0.25s;
opacity: 0;
visibility: hidden;
}
#main > .inner > section {
transition: opacity 0.5s ease-in-out 0.25s,min-height 0.25s ease-in-out, max-height 0.25s ease-in-out;
}
#main > .inner > section.inactive {
opacity: 0;
transition: opacity 0.25s ease-in-out;
}
body.is-instant #main, body.is-instant #main > .inner > *,body.is-instant #main > .inner > section > *  {
transition: none !important;
}
body.is-instant:after {
display: none !important;
transition: none !important;
}
@keyframes loading-spinner {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.deferred:before {
content: '';
display: block;
width: 4rem;
height: 4rem;
position: absolute;
top: 50%;
left: 50%;
margin: -2rem 0 0 -2rem;
animation: loading-spinner 1s infinite linear;
transition: opacity 0.25s ease;
transition-delay: 0.5s;
opacity: 0;
z-index: -1;
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iOTZweCIgaGVpZ2h0PSI5NnB4IiB2aWV3Qm94PSIwIDAgOTYgOTYiIHpvb21BbmRQYW49ImRpc2FibGUiPjxzdHlsZT5jaXJjbGUge2ZpbGw6IHRyYW5zcGFyZW50OyBzdHJva2U6ICNmZmY7IHN0cm9rZS13aWR0aDogMS41cHg7IH08L3N0eWxlPjxkZWZzPjxjbGlwUGF0aCBpZD0iY29ybmVyIj48cG9seWdvbiBwb2ludHM9IjAsMCA0OCwwIDQ4LDQ4IDk2LDQ4IDk2LDk2IDAsOTYiIC8+PC9jbGlwUGF0aD48L2RlZnM+PGcgY2xpcC1wYXRoPSJ1cmwoI2Nvcm5lcikiPjxjaXJjbGUgY3g9IjQ4IiBjeT0iNDgiIHI9IjMyIi8+PC9nPjwvc3ZnPg==');
background-position: center;
background-repeat: no-repeat;
background-size: 3rem;
}
.deferred.loading:before {
opacity: 0.35;
z-index: 0;
}
.icons {
display: flex;
flex-wrap: wrap;
justify-content: var(--flex-alignment);
letter-spacing: 0;
padding: 0;
}
.icons li {
position: relative;
z-index: 1;
}
.icons li a {
align-items: center;
display: flex;
justify-content: center;
}
.icons li a svg {
display: block;
position: relative;
}
.icons li a + svg {
display: block;
height: 100%;
left: 0;
pointer-events: none;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.icons li a .label {
display: none;
}
#buttons12 {
--flex-alignment: center;
--alignment: center;
gap: 1rem;
flex-direction: row;
flex-wrap: wrap;
}
#buttons12 li a {
display: inline-flex;
width: 238px;
height: 2.5rem;
line-height: 2.5rem;
padding: 0 0.5rem;
vertical-align: middle;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1.125em;
font-weight: 600;
border-radius: 1.125rem;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#buttons12 li a svg {
display: block;
fill: #5BACD2;
flex-grow: 0;
flex-shrink: 0;
height: 100%;
min-width: 16px;
width: 1em;
margin-left: -0.125em;
margin-right: calc(0.5em + 0rem);
transition: fill 0.25s ease;
}
#buttons12 li a .label {
direction: var(--site-language-direction);
overflow: hidden;
}
#buttons12 .button {
color: #5BACD2;
border: solid 2px #5BACD2;
}
#buttons12 .button:hover {
border-color: #5BACD2 !important;
color: #5BACD2 !important;
}
#buttons12 .button:hover svg {
fill: #5BACD2 !important;
}
#buttons12 li a:hover {
transform: scale(1.0425);
}
#socials-main {
justify-content: center;
font-size: 1.125em;
gap: 0.935rem;
}
#socials-main li a {
border-radius: 1rem;
height: 2em;
width: 2em;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#socials-main li a svg {
height: 60%;
width: 60%;
transition: fill 0.25s ease;
}
#socials-main a {
background-color: #151F26;
}
#socials-main a svg {
fill: #5BACD2;
}
#socials-main a:hover {
background-color: #151F26 !important;
}
#socials-main li a + svg {
transition: transform 0.25s ease, fill 0.25s ease, stroke 0.25s ease;
}
#socials-main li a:hover {
transform: scale(1.2);
}
#socials-main li a:hover + svg {
transform: scale(1.2);
}
#socials-extra {
justify-content: center;
font-size: 1.125em;
gap: 0.935rem;
}
#socials-extra:not(:first-child) {
margin-top: 2rem !important;
}
#socials-extra:not(:last-child) {
margin-bottom: 2rem !important;
}
#socials-extra li a {
border-radius: 1rem;
height: 2em;
width: 2em;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#socials-extra li a svg {
height: 60%;
width: 60%;
transition: fill 0.25s ease;
}
#socials-extra a {
background-color: #151F26;
}
#socials-extra a svg {
fill: #5BACD2;
}
#socials-extra a:hover {
background-color: #151F26 !important;
}
#socials-extra li a + svg {
transition: transform 0.25s ease, fill 0.25s ease, stroke 0.25s ease;
}
#socials-extra li a:hover {
transform: scale(1.2);
}
#socials-extra li a:hover + svg {
transform: scale(1.2);
}
.container {
position: relative;
}
.container > .wrapper {
vertical-align: top;
position: relative;
max-width: 100%;
border-radius: inherit;
}
.container > .wrapper > .inner {
vertical-align: top;
position: relative;
max-width: 100%;
border-radius: inherit;
text-align: var(--alignment);
}
#main .container.full:first-child > .wrapper {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#main .container.full:last-child > .wrapper {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#main .container.full:first-child > .wrapper > .inner {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#main .container.full:last-child > .wrapper > .inner {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#intro-container > .wrapper {
display: inline-block;
width: 19rem;
background-color: transparent;
}
#intro-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
padding: var(--padding-vertical) var(--padding-horizontal);
}
#intro-container.default > .wrapper > .inner > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#intro-container.default > .wrapper > .inner > *:first-child {
margin-top: 0 !important;
}
#intro-container.default > .wrapper > .inner > *:last-child {
margin-bottom: 0 !important;
}
#intro-container.columns > .wrapper > .inner {
flex-wrap: wrap;
display: flex;
align-items: flex-start;
}
#intro-container.columns > .wrapper > .inner > * {
flex-grow: 0;
flex-shrink: 0;
max-width: 100%;
text-align: var(--alignment);
padding: 0 0 0 var(--gutters);
}
#intro-container.columns > .wrapper > .inner > * > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#intro-container.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;
}
#intro-container.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;
}
#intro-container.columns > .wrapper > .inner > *:first-child {
margin-left: calc(var(--gutters) * -1);
}
#intro-container.default > .wrapper > .inner > .full {
margin-left: calc(var(--padding-horizontal) * -1);
max-width: none !important;
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#intro-container.default > .wrapper > .inner > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#intro-container.default > .wrapper > .inner > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#intro-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--gutters) * -0.5);
max-width: none !important;
width: calc(100% + var(--gutters) + 0.4725px);
}
#intro-container.columns > .wrapper > .inner > div:first-child > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#intro-container.columns > .wrapper > .inner > div:last-child > .full {
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#intro-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#intro-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#intro-container.columns > .wrapper > .inner > div:first-child, #intro-container.columns > .wrapper > .inner > div:first-child > .full:first-child {
border-top-left-radius: inherit;
}
#intro-container.columns > .wrapper > .inner > div:last-child, #intro-container.columns > .wrapper > .inner > div:last-child > .full:first-child {
border-top-right-radius: inherit;
}
#intro-container.columns > .wrapper > .inner > .full {
align-self: stretch;
}
#intro-container.columns > .wrapper > .inner > .full:first-child {
border-bottom-left-radius: inherit;
border-top-left-radius: inherit;
}
#intro-container.columns > .wrapper > .inner > .full:last-child {
border-bottom-right-radius: inherit;
border-top-right-radius: inherit;
}
#intro-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
border-radius: inherit;
height: calc(100% + (var(--padding-vertical) * 2));
}
#intro-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
border-radius: inherit;
height: 100%;
position: absolute;
width: 100%;
}
#abouten-container {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
background-color: #151F26;
}
#abouten-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
padding: var(--padding-vertical) var(--padding-horizontal);
}
#abouten-container > .wrapper {
max-width: var(--width);
width: 100%;
}
#abouten-container.default > .wrapper > .inner > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#abouten-container.default > .wrapper > .inner > *:first-child {
margin-top: 0 !important;
}
#abouten-container.default > .wrapper > .inner > *:last-child {
margin-bottom: 0 !important;
}
#abouten-container.columns > .wrapper > .inner {
flex-wrap: wrap;
display: flex;
align-items: flex-start;
}
#abouten-container.columns > .wrapper > .inner > * {
flex-grow: 0;
flex-shrink: 0;
max-width: 100%;
text-align: var(--alignment);
padding: 0 0 0 var(--gutters);
}
#abouten-container.columns > .wrapper > .inner > * > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#abouten-container.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;
}
#abouten-container.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;
}
#abouten-container.columns > .wrapper > .inner > *:first-child {
margin-left: calc(var(--gutters) * -1);
}
#abouten-container.default > .wrapper > .inner > .full {
margin-left: calc(var(--padding-horizontal) * -1);
max-width: none !important;
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#abouten-container.default > .wrapper > .inner > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#abouten-container.default > .wrapper > .inner > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#abouten-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--gutters) * -0.5);
max-width: none !important;
width: calc(100% + var(--gutters) + 0.4725px);
}
#abouten-container.columns > .wrapper > .inner > div:first-child > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#abouten-container.columns > .wrapper > .inner > div:last-child > .full {
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#abouten-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#abouten-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#abouten-container.columns > .wrapper > .inner > div:first-child, #abouten-container.columns > .wrapper > .inner > div:first-child > .full:first-child {
border-top-left-radius: inherit;
}
#abouten-container.columns > .wrapper > .inner > div:last-child, #abouten-container.columns > .wrapper > .inner > div:last-child > .full:first-child {
border-top-right-radius: inherit;
}
#abouten-container.columns > .wrapper > .inner > .full {
align-self: stretch;
}
#abouten-container.columns > .wrapper > .inner > .full:first-child {
border-bottom-left-radius: inherit;
border-top-left-radius: inherit;
}
#abouten-container.columns > .wrapper > .inner > .full:last-child {
border-bottom-right-radius: inherit;
border-top-right-radius: inherit;
}
#abouten-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
border-radius: inherit;
height: calc(100% + (var(--padding-vertical) * 2));
}
#abouten-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
border-radius: inherit;
height: 100%;
position: absolute;
width: 100%;
}
#abouten-container > .wrapper > .inner > :nth-child(1) {
width: calc(22% + (var(--gutters) / 2));
}
#abouten-container > .wrapper > .inner > :nth-child(2) {
width: calc(78% + (var(--gutters) / 2));
}
#aboutnl-container {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
background-color: #151F26;
}
#aboutnl-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
padding: var(--padding-vertical) var(--padding-horizontal);
}
#aboutnl-container > .wrapper {
max-width: var(--width);
width: 100%;
}
#aboutnl-container.default > .wrapper > .inner > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#aboutnl-container.default > .wrapper > .inner > *:first-child {
margin-top: 0 !important;
}
#aboutnl-container.default > .wrapper > .inner > *:last-child {
margin-bottom: 0 !important;
}
#aboutnl-container.columns > .wrapper > .inner {
flex-wrap: wrap;
display: flex;
align-items: flex-start;
}
#aboutnl-container.columns > .wrapper > .inner > * {
flex-grow: 0;
flex-shrink: 0;
max-width: 100%;
text-align: var(--alignment);
padding: 0 0 0 var(--gutters);
}
#aboutnl-container.columns > .wrapper > .inner > * > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#aboutnl-container.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;
}
#aboutnl-container.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;
}
#aboutnl-container.columns > .wrapper > .inner > *:first-child {
margin-left: calc(var(--gutters) * -1);
}
#aboutnl-container.default > .wrapper > .inner > .full {
margin-left: calc(var(--padding-horizontal) * -1);
max-width: none !important;
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#aboutnl-container.default > .wrapper > .inner > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#aboutnl-container.default > .wrapper > .inner > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#aboutnl-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--gutters) * -0.5);
max-width: none !important;
width: calc(100% + var(--gutters) + 0.4725px);
}
#aboutnl-container.columns > .wrapper > .inner > div:first-child > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#aboutnl-container.columns > .wrapper > .inner > div:last-child > .full {
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#aboutnl-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#aboutnl-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#aboutnl-container.columns > .wrapper > .inner > div:first-child, #aboutnl-container.columns > .wrapper > .inner > div:first-child > .full:first-child {
border-top-left-radius: inherit;
}
#aboutnl-container.columns > .wrapper > .inner > div:last-child, #aboutnl-container.columns > .wrapper > .inner > div:last-child > .full:first-child {
border-top-right-radius: inherit;
}
#aboutnl-container.columns > .wrapper > .inner > .full {
align-self: stretch;
}
#aboutnl-container.columns > .wrapper > .inner > .full:first-child {
border-bottom-left-radius: inherit;
border-top-left-radius: inherit;
}
#aboutnl-container.columns > .wrapper > .inner > .full:last-child {
border-bottom-right-radius: inherit;
border-top-right-radius: inherit;
}
#aboutnl-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
border-radius: inherit;
height: calc(100% + (var(--padding-vertical) * 2));
}
#aboutnl-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
border-radius: inherit;
height: 100%;
position: absolute;
width: 100%;
}
#aboutnl-container > .wrapper > .inner > :nth-child(1) {
width: calc(22% + (var(--gutters) / 2));
}
#aboutnl-container > .wrapper > .inner > :nth-child(2) {
width: calc(78% + (var(--gutters) / 2));
}
#animations-container {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
background-color: #151F26;
}
#animations-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
padding: var(--padding-vertical) var(--padding-horizontal);
}
#animations-container > .wrapper {
max-width: var(--width);
width: 100%;
}
#animations-container.default > .wrapper > .inner > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#animations-container.default > .wrapper > .inner > *:first-child {
margin-top: 0 !important;
}
#animations-container.default > .wrapper > .inner > *:last-child {
margin-bottom: 0 !important;
}
#animations-container.columns > .wrapper > .inner {
flex-wrap: wrap;
display: flex;
align-items: flex-start;
}
#animations-container.columns > .wrapper > .inner > * {
flex-grow: 0;
flex-shrink: 0;
max-width: 100%;
text-align: var(--alignment);
padding: 0 0 0 var(--gutters);
}
#animations-container.columns > .wrapper > .inner > * > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#animations-container.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;
}
#animations-container.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;
}
#animations-container.columns > .wrapper > .inner > *:first-child {
margin-left: calc(var(--gutters) * -1);
}
#animations-container.default > .wrapper > .inner > .full {
margin-left: calc(var(--padding-horizontal) * -1);
max-width: none !important;
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#animations-container.default > .wrapper > .inner > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#animations-container.default > .wrapper > .inner > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#animations-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--gutters) * -0.5);
max-width: none !important;
width: calc(100% + var(--gutters) + 0.4725px);
}
#animations-container.columns > .wrapper > .inner > div:first-child > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#animations-container.columns > .wrapper > .inner > div:last-child > .full {
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#animations-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#animations-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#animations-container.columns > .wrapper > .inner > div:first-child, #animations-container.columns > .wrapper > .inner > div:first-child > .full:first-child {
border-top-left-radius: inherit;
}
#animations-container.columns > .wrapper > .inner > div:last-child, #animations-container.columns > .wrapper > .inner > div:last-child > .full:first-child {
border-top-right-radius: inherit;
}
#animations-container.columns > .wrapper > .inner > .full {
align-self: stretch;
}
#animations-container.columns > .wrapper > .inner > .full:first-child {
border-bottom-left-radius: inherit;
border-top-left-radius: inherit;
}
#animations-container.columns > .wrapper > .inner > .full:last-child {
border-bottom-right-radius: inherit;
border-top-right-radius: inherit;
}
#animations-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
border-radius: inherit;
height: calc(100% + (var(--padding-vertical) * 2));
}
#animations-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
border-radius: inherit;
height: 100%;
position: absolute;
width: 100%;
}
#misc-container {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
background-color: #151F26;
}
#misc-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
padding: var(--padding-vertical) var(--padding-horizontal);
}
#misc-container > .wrapper {
max-width: var(--width);
width: 100%;
}
#misc-container.default > .wrapper > .inner > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#misc-container.default > .wrapper > .inner > *:first-child {
margin-top: 0 !important;
}
#misc-container.default > .wrapper > .inner > *:last-child {
margin-bottom: 0 !important;
}
#misc-container.columns > .wrapper > .inner {
flex-wrap: wrap;
display: flex;
align-items: flex-start;
}
#misc-container.columns > .wrapper > .inner > * {
flex-grow: 0;
flex-shrink: 0;
max-width: 100%;
text-align: var(--alignment);
padding: 0 0 0 var(--gutters);
}
#misc-container.columns > .wrapper > .inner > * > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#misc-container.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;
}
#misc-container.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;
}
#misc-container.columns > .wrapper > .inner > *:first-child {
margin-left: calc(var(--gutters) * -1);
}
#misc-container.default > .wrapper > .inner > .full {
margin-left: calc(var(--padding-horizontal) * -1);
max-width: none !important;
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#misc-container.default > .wrapper > .inner > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#misc-container.default > .wrapper > .inner > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#misc-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--gutters) * -0.5);
max-width: none !important;
width: calc(100% + var(--gutters) + 0.4725px);
}
#misc-container.columns > .wrapper > .inner > div:first-child > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#misc-container.columns > .wrapper > .inner > div:last-child > .full {
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#misc-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#misc-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#misc-container.columns > .wrapper > .inner > div:first-child, #misc-container.columns > .wrapper > .inner > div:first-child > .full:first-child {
border-top-left-radius: inherit;
}
#misc-container.columns > .wrapper > .inner > div:last-child, #misc-container.columns > .wrapper > .inner > div:last-child > .full:first-child {
border-top-right-radius: inherit;
}
#misc-container.columns > .wrapper > .inner > .full {
align-self: stretch;
}
#misc-container.columns > .wrapper > .inner > .full:first-child {
border-bottom-left-radius: inherit;
border-top-left-radius: inherit;
}
#misc-container.columns > .wrapper > .inner > .full:last-child {
border-bottom-right-radius: inherit;
border-top-right-radius: inherit;
}
#misc-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
border-radius: inherit;
height: calc(100% + (var(--padding-vertical) * 2));
}
#misc-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
border-radius: inherit;
height: 100%;
position: absolute;
width: 100%;
}
#posts-container {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
background-color: #151F26;
}
#posts-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
padding: var(--padding-vertical) var(--padding-horizontal);
}
#posts-container > .wrapper {
max-width: var(--width);
width: 100%;
}
#posts-container.default > .wrapper > .inner > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#posts-container.default > .wrapper > .inner > *:first-child {
margin-top: 0 !important;
}
#posts-container.default > .wrapper > .inner > *:last-child {
margin-bottom: 0 !important;
}
#posts-container.columns > .wrapper > .inner {
flex-wrap: wrap;
display: flex;
align-items: flex-start;
}
#posts-container.columns > .wrapper > .inner > * {
flex-grow: 0;
flex-shrink: 0;
max-width: 100%;
text-align: var(--alignment);
padding: 0 0 0 var(--gutters);
}
#posts-container.columns > .wrapper > .inner > * > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#posts-container.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;
}
#posts-container.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;
}
#posts-container.columns > .wrapper > .inner > *:first-child {
margin-left: calc(var(--gutters) * -1);
}
#posts-container.default > .wrapper > .inner > .full {
margin-left: calc(var(--padding-horizontal) * -1);
max-width: none !important;
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#posts-container.default > .wrapper > .inner > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#posts-container.default > .wrapper > .inner > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#posts-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--gutters) * -0.5);
max-width: none !important;
width: calc(100% + var(--gutters) + 0.4725px);
}
#posts-container.columns > .wrapper > .inner > div:first-child > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#posts-container.columns > .wrapper > .inner > div:last-child > .full {
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#posts-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#posts-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#posts-container.columns > .wrapper > .inner > div:first-child, #posts-container.columns > .wrapper > .inner > div:first-child > .full:first-child {
border-top-left-radius: inherit;
}
#posts-container.columns > .wrapper > .inner > div:last-child, #posts-container.columns > .wrapper > .inner > div:last-child > .full:first-child {
border-top-right-radius: inherit;
}
#posts-container.columns > .wrapper > .inner > .full {
align-self: stretch;
}
#posts-container.columns > .wrapper > .inner > .full:first-child {
border-bottom-left-radius: inherit;
border-top-left-radius: inherit;
}
#posts-container.columns > .wrapper > .inner > .full:last-child {
border-bottom-right-radius: inherit;
border-top-right-radius: inherit;
}
#posts-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
border-radius: inherit;
height: calc(100% + (var(--padding-vertical) * 2));
}
#posts-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
border-radius: inherit;
height: 100%;
position: absolute;
width: 100%;
}
#portfolio-container {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
background-color: #151F26;
}
#portfolio-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
padding: var(--padding-vertical) var(--padding-horizontal);
}
#portfolio-container > .wrapper {
max-width: var(--width);
width: 100%;
}
#portfolio-container.default > .wrapper > .inner > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#portfolio-container.default > .wrapper > .inner > *:first-child {
margin-top: 0 !important;
}
#portfolio-container.default > .wrapper > .inner > *:last-child {
margin-bottom: 0 !important;
}
#portfolio-container.columns > .wrapper > .inner {
flex-wrap: wrap;
display: flex;
align-items: flex-start;
}
#portfolio-container.columns > .wrapper > .inner > * {
flex-grow: 0;
flex-shrink: 0;
max-width: 100%;
text-align: var(--alignment);
padding: 0 0 0 var(--gutters);
}
#portfolio-container.columns > .wrapper > .inner > * > * {
margin-bottom: var(--spacing);
margin-top: var(--spacing);
}
#portfolio-container.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;
}
#portfolio-container.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;
}
#portfolio-container.columns > .wrapper > .inner > *:first-child {
margin-left: calc(var(--gutters) * -1);
}
#portfolio-container.default > .wrapper > .inner > .full {
margin-left: calc(var(--padding-horizontal) * -1);
max-width: none !important;
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#portfolio-container.default > .wrapper > .inner > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#portfolio-container.default > .wrapper > .inner > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#portfolio-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--gutters) * -0.5);
max-width: none !important;
width: calc(100% + var(--gutters) + 0.4725px);
}
#portfolio-container.columns > .wrapper > .inner > div:first-child > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#portfolio-container.columns > .wrapper > .inner > div:last-child > .full {
width: calc(100% + var(--padding-horizontal) + calc(var(--gutters) * 0.5) + 0.4725px);
}
#portfolio-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#portfolio-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#portfolio-container.columns > .wrapper > .inner > div:first-child, #portfolio-container.columns > .wrapper > .inner > div:first-child > .full:first-child {
border-top-left-radius: inherit;
}
#portfolio-container.columns > .wrapper > .inner > div:last-child, #portfolio-container.columns > .wrapper > .inner > div:last-child > .full:first-child {
border-top-right-radius: inherit;
}
#portfolio-container.columns > .wrapper > .inner > .full {
align-self: stretch;
}
#portfolio-container.columns > .wrapper > .inner > .full:first-child {
border-bottom-left-radius: inherit;
border-top-left-radius: inherit;
}
#portfolio-container.columns > .wrapper > .inner > .full:last-child {
border-bottom-right-radius: inherit;
border-top-right-radius: inherit;
}
#portfolio-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
border-radius: inherit;
height: calc(100% + (var(--padding-vertical) * 2));
}
#portfolio-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
border-radius: inherit;
height: 100%;
position: absolute;
width: 100%;
}
#header {
margin-bottom: 0rem !important;
}
.buttons {
cursor: default;
display: flex;
justify-content: var(--flex-alignment);
letter-spacing: 0;
padding: 0;
}
.buttons li {
max-width: 100%;
text-align: var(--alignment);
}
.buttons li a {
align-items: center;
justify-content: center;
max-width: 100%;
text-align: center;
text-decoration: none;
vertical-align: middle;
white-space: nowrap;
}
#intro-buttons {
--flex-alignment: center;
--alignment: center;
gap: 1rem;
flex-direction: column;
flex-wrap: nowrap;
}
#intro-buttons li a {
display: inline-block;
width: 15rem;
height: 2.5rem;
line-height: 2.5rem;
padding: 0 0.5rem;
vertical-align: middle;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1.125em;
font-weight: 600;
border-radius: 1.125rem;
direction: var(--site-language-direction);
overflow: hidden;
text-overflow: ellipsis;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#intro-buttons .button {
background-color: #151F26;
color: #5BACD2;
}
#intro-buttons .button:hover {
background-color: #151F26 !important;
}
#intro-buttons li a:hover {
transform: scale(1.0425);
}
#buttons08 {
--flex-alignment: center;
--alignment: center;
gap: 1rem;
flex-direction: column;
flex-wrap: nowrap;
}
#buttons08 li a {
display: inline-block;
width: 15rem;
height: 2.5rem;
line-height: 2.5rem;
padding: 0 0.5rem;
vertical-align: middle;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1.125em;
font-weight: 600;
border-radius: 1.125rem;
direction: var(--site-language-direction);
overflow: hidden;
text-overflow: ellipsis;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#buttons08 .button {
background-color: #151F26;
color: #5BACD2;
}
#buttons08 .button:hover {
background-color: #151F26 !important;
}
#buttons08 li a:hover {
transform: scale(1.0425);
}
#to-menu-button {
--flex-alignment: center;
--alignment: center;
gap: 1rem;
flex-direction: row;
flex-wrap: wrap;
}
#to-menu-button li a {
display: inline-block;
width: 15rem;
height: 2.5rem;
line-height: 2.5rem;
padding: 0 0.5rem;
vertical-align: middle;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1.125em;
font-weight: 600;
border-radius: 1.125rem;
direction: var(--site-language-direction);
overflow: hidden;
text-overflow: ellipsis;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#to-menu-button .button {
background-color: #151F26;
color: #5BACD2;
}
#to-menu-button .button:hover {
background-color: #151F26 !important;
}
#to-menu-button li a:hover {
transform: scale(1.0425);
}
#buttons09 {
--flex-alignment: center;
--alignment: center;
gap: 1rem;
flex-direction: row;
flex-wrap: wrap;
}
#buttons09 li a {
display: inline-block;
width: 15rem;
height: 2.5rem;
line-height: 2.5rem;
padding: 0 0.5rem;
vertical-align: middle;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1.125em;
font-weight: 600;
border-radius: 1.125rem;
direction: var(--site-language-direction);
overflow: hidden;
text-overflow: ellipsis;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#buttons09 .button {
background-color: #151F26;
color: #5BACD2;
}
#buttons09 .button:hover {
background-color: #151F26 !important;
}
#buttons09 li a:hover {
transform: scale(1.0425);
}
#buttons03 {
--flex-alignment: center;
--alignment: center;
gap: 1rem;
flex-direction: row;
flex-wrap: wrap;
}
#buttons03 li a {
display: inline-block;
width: 15rem;
height: 2.5rem;
line-height: 2.5rem;
padding: 0 0.5rem;
vertical-align: middle;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1.125em;
font-weight: 600;
border-radius: 1.125rem;
direction: var(--site-language-direction);
overflow: hidden;
text-overflow: ellipsis;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#buttons03 .button {
background-color: #151F26;
color: #5BACD2;
}
#buttons03 .button:hover {
background-color: #151F26 !important;
}
#buttons03 li a:hover {
transform: scale(1.0425);
}
#buttons05 {
--flex-alignment: center;
--alignment: center;
gap: 1rem;
flex-direction: row;
flex-wrap: wrap;
}
#buttons05 li a {
display: inline-block;
width: 15rem;
height: 2.5rem;
line-height: 2.5rem;
padding: 0 0.5rem;
vertical-align: middle;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1.125em;
font-weight: 600;
border-radius: 1.125rem;
direction: var(--site-language-direction);
overflow: hidden;
text-overflow: ellipsis;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#buttons05 .button {
background-color: #151F26;
color: #5BACD2;
}
#buttons05 .button:hover {
background-color: #151F26 !important;
}
#buttons05 li a:hover {
transform: scale(1.0425);
}
#subscribe-buttons {
--flex-alignment: center;
--alignment: center;
gap: 1rem;
flex-direction: row;
flex-wrap: wrap;
}
#subscribe-buttons li a {
display: inline-block;
width: 15rem;
height: 2.5rem;
line-height: 2.5rem;
padding: 0 0.5rem;
vertical-align: middle;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1.125em;
font-weight: 600;
border-radius: 1.125rem;
direction: var(--site-language-direction);
overflow: hidden;
text-overflow: ellipsis;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}
#subscribe-buttons .button {
background-color: #151F26;
color: #5BACD2;
}
#subscribe-buttons .button:hover {
background-color: #151F26 !important;
}
#subscribe-buttons li a:hover {
transform: scale(1.0425);
}
#bluesky-info {
margin-top: 5px;
font-size: 0.9em;
color: #555;
}
#bluesky-info .highlighted {
color: #5BACD2;
font-weight: bold;
text-decoration: underline;
}
h1, h2, h3, p {
direction: var(--site-language-direction);
position: relative;
}
h1 span.p, h2 span.p, h3 span.p, p span.p {
display: block;
position: relative;
}
h1 span[style], h2 span[style], h3 span[style], p span[style], h1 strong, h2 strong, h3 strong, p strong, h1 a, h2 a, h3 a, p a, h1 code, h2 code, h3 code, p code, h1 mark, h2 mark, h3 mark, p mark, h1 spoiler-text, h2 spoiler-text, h3 spoiler-text, p spoiler-text {
-webkit-text-fill-color: currentcolor;
}
#intro-handle {
color: #151F26;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
width: 100%;
font-size: 1.25em;
line-height: 1;
font-weight: 600;
}
#intro-handle a {
text-decoration: underline;
}
#intro-handle a:hover {
text-decoration: none;
}
#intro-handle span.p:nth-child(n + 2) {
margin-top: 1rem;
}
#handle {
color: #151F26;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
width: 100%;
font-size: 1.25em;
line-height: 1;
font-weight: 600;
}
#handle a {
text-decoration: underline;
}
#handle a:hover {
text-decoration: none;
}
#handle span.p:nth-child(n + 2) {
margin-top: 1rem;
}
#abouten-text {
text-align: left;
color: #fdfeff;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
width: 100%;
font-size: 1em;
line-height: 1.5;
font-weight: 600;
}
#abouten-text a {
text-decoration: underline;
}
#abouten-text a:hover {
text-decoration: none;
}
#abouten-text span.p:nth-child(n + 2) {
margin-top: 1rem;
}
#text06 {
text-align: left;
color: #fdfeff;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
width: 100%;
font-size: 1em;
line-height: 1.5;
font-weight: 600;
}
#text06 a {
text-decoration: underline;
}
#text06 a:hover {
text-decoration: none;
}
#text06 span.p:nth-child(n + 2) {
margin-top: 1rem;
}
#fourzerofour {
color: #151F26;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
width: 100%;
font-size: 7em;
line-height: 1;
font-weight: 900;
}
#fourzerofour a {
text-decoration: underline;
}
#fourzerofour a:hover {
text-decoration: none;
}
#fourzerofour span.p:nth-child(n + 2) {
margin-top: 1rem;
}
#aboutnl-text {
text-align: left;
color: #fdfeff;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
width: 100%;
font-size: 1em;
line-height: 1.5;
font-weight: 600;
}
#aboutnl-text a {
text-decoration: underline;
}
#aboutnl-text a:hover {
text-decoration: none;
}
#aboutnl-text span.p:nth-child(n + 2) {
margin-top: 1rem;
}
#text09 {
text-align: center;
color: #fdfeff;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
width: 100%;
	font-size: 0.8em;
	padding-right: 10px;
line-height: 1.5;
font-weight: 600;
display: flex;/* Aligns items horizontally */
align-items: center;  /* Centers items vertically within flex container */
justify-content: center;  /* Centers content within the container */
gap: 0.5rem;  /* Space between icon and text */
}

#text09 a {
text-decoration: underline;
color: #5BACD2;   /* Highlight color for "Bluesky" */
font-weight: bold;
}

#text09 a:hover {
text-decoration: none;
}

#text09 .text {
color: #fdfeff;
}

#icons02 {
list-style: none;
display: flex;
justify-content: center;
font-size: 1.125em;
gap: 0.875rem;
}

#icons02 li {
display: flex;
align-items: center;
}

#icons02 li a {
height: 2em;
width: 2em;
transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
display: flex;
align-items: center;
justify-content: center;
background-color: transparent;
}

#icons02 li a svg {
height: 60%;
width: 60%;
fill: #5BACD2;
transition: transform 0.25s ease, fill 0.25s ease;
}

#icons02 li a:hover {
transform: scale(1.2);
}

#icons02 li a:hover svg {
transform: scale(1.2);
}
.image {
display: block;
line-height: 0;
max-width: 100%;
position: relative;
}
.image .frame {
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
display: inline-block;
max-width: 100%;
overflow: hidden;
vertical-align: top;
width: 100%;
}
.image .frame img {
border-radius: 0 !important;
max-width: 100%;
vertical-align: top;
width: inherit;
}
.image.full .frame {
display: block;
}
.image.full:first-child .frame {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
.image.full:last-child .frame {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#about-pfp .frame {
width: 15rem;
height: 8.875rem;
border-radius: 3.5rem;
transition: none;
}
#about-pfp img {
height: 100% !important;
object-fit: cover;
object-position: center;
width: 100% !important;
-webkit-touch-callout: none;
user-select: none;
}
#about-pfp .frame img {
transition: none;
}
.gallery .inner {
display: inline-block;
max-width: 100%;
vertical-align: middle;
}
.gallery ul {
display: flex;
flex-wrap: wrap;
justify-content: var(--flex-alignment);
}
.gallery ul li {
position: relative;
}
.gallery ul li .thumbnail {
border-radius: inherit;
position: relative;
}
.gallery ul li .frame {
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
display: inline-block;
overflow: hidden;
vertical-align: top;
}
.gallery ul li img {
margin: 0;
max-width: 100%;
vertical-align: top;
width: auto;
}
.gallery ul li .caption {
width: 100%;
}
.gallery ul li .caption p {
width: 100%;
}
.gallery ul li .caption a, .gallery ul li .caption spoiler-text {
pointer-events: auto;
}
@keyframes gallery-modal-spinner {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.gallery-modal {
-webkit-tap-highlight-color: rgba(0,0,0,0);
align-content: center;
align-items: center;
background-color: var(--color-background);
display: grid;
grid-template-areas: "previous image next" "caption caption caption";
grid-template-columns: min-content auto min-content;
height: 100%;
justify-content: space-between;
left: 0;
opacity: 0;
outline: 0;
padding: 2rem 0;
pointer-events: none;
position: fixed;
top: 0;
touch-action: pan-x pinch-zoom;
transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s, background-color 0.5s ease;
user-select: none;
visibility: hidden;
width: 100%;
z-index: 0;
}
.gallery-modal:before {
animation: gallery-modal-spinner 1s infinite linear;
background-position: center;
background-repeat: no-repeat;
background-size: 4rem;
content: '';
display: block;
height: 4rem;
left: 50%;
margin: -2rem 0 0 -2rem;
opacity: 0;
position: absolute;
top: 50%;
transition: opacity 0.25s ease;
transition-delay: 0.5s;
width: 4rem;
}
.gallery-modal .inner {
box-shadow: 0 1em 3em 0 rgba(0,0,0,0.35);
grid-area: image;
height: 100%;
opacity: 0;
overflow: hidden;
transform: translateY(0.75em);
transition: all 0.5s ease;
width: 100%;
}
.gallery-modal .inner img {
display: block;
height: 100%;
object-fit: contain;
width: 100%;
max-width: var(--natural-width, none);
max-height: var(--natural-height, none);
}
.gallery-modal .caption {
color: var(--color-caption-text);
font-family: '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Arial', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
font-size: 1rem;
grid-area: caption;
line-height: 1.6;
opacity: 0;
padding: 2rem 2rem 0 2rem;
pointer-events: none;
text-align: center;
transform: translateY(0.25em);
transition: all 0.5s ease;
}
.gallery-modal .caption::-webkit-scrollbar {
display: none;
}
.gallery-modal .caption a, .gallery-modal .caption spoiler-text {
pointer-events: auto;
}
.gallery-modal .nav {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
background-position: center;
background-repeat: no-repeat;
background-size: 3rem;
cursor: pointer;
height: 6rem;
transition: opacity 0.25s ease, transform 0.5s ease;
width: 8rem;
}
.gallery-modal .nav:hover {
opacity: 1 !important;
}
.gallery-modal .nav.next {
grid-area: next;
}
.gallery-modal .nav.previous {
grid-area: previous;
transform: scaleX(-1);
}
.gallery-modal .close {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
background-position: top 1rem right 1rem;
background-repeat: no-repeat;
background-size: 3rem;
cursor: pointer;
display: block;
height: 6rem;
position: absolute;
right: 0;
top: 0;
transition: opacity 0.25s ease, transform 0.5s ease;
width: 6rem;
}
.gallery-modal .close:hover {
opacity: 1 !important;
}
.gallery-modal.visible {
opacity: 1;
pointer-events: auto;
visibility: visible;
z-index: 10000;
}
.gallery-modal.visible:before {
opacity: 1;
}
.gallery-modal.loaded:before {
opacity: 0 !important;
transition-delay: 0s !important;
}
.gallery-modal.loaded .inner {
opacity: 1;
transform: translateY(0);
}
.gallery-modal.loaded .caption {
opacity: 1;
transform: translateY(0);
}
.gallery-modal.switching .inner {
transition: opacity 0.375s ease, transform 0.5s ease;
}
.gallery-modal.switching.from-left .inner {
transform: translateY(0) translateX(-1.5em);
}
.gallery-modal.switching.from-right .inner {
transform: translateY(0) translateX(1.5em);
}
.gallery-modal.switching.done .inner {
transition: opacity 0.375s ease;
transform: translateY(0) translateX(0);
}
.gallery-modal.zooming {
background-color: var(--color-background-zooming);
}
.gallery-modal.zooming .caption {
opacity: 0;
}
.gallery-modal.zooming .nav.next {
opacity: 0;
pointer-events: none;
transform: translateX(50%);
}
.gallery-modal.zooming .nav.previous {
opacity: 0;
pointer-events: none;
transform: translateX(-50%) scaleX(-1);
}
.gallery-modal.zooming .close {
opacity: 0;
pointer-events: none;
transform: translateX(50%) translateY(-50%);
}
.gallery-modal.dark {
--color-background: rgba(10,10,10,0.85);
--color-background-zooming: rgba(0,0,0,1);
--color-caption-text: #fdfeff;
}
.gallery-modal.dark:before {
animation: gallery-modal-spinner 1s infinite linear;
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iOTZweCIgaGVpZ2h0PSI5NnB4IiB2aWV3Qm94PSIwIDAgOTYgOTYiIHpvb21BbmRQYW49ImRpc2FibGUiPjxzdHlsZT5jaXJjbGUge2ZpbGw6IHRyYW5zcGFyZW50OyBzdHJva2U6ICNGRkZGRkY7IHN0cm9rZS13aWR0aDogMS41cHg7IH08L3N0eWxlPjxkZWZzPjxjbGlwUGF0aCBpZD0iY29ybmVyIj48cG9seWdvbiBwb2ludHM9IjAsMCA0OCwwIDQ4LDQ4IDk2LDQ4IDk2LDk2IDAsOTYiIC8+PC9jbGlwUGF0aD48L2RlZnM+PGcgY2xpcC1wYXRoPSJ1cmwoI2Nvcm5lcikiPjxjaXJjbGUgY3g9IjQ4IiBjeT0iNDgiIHI9IjMyIi8+PC9nPjwvc3ZnPg==');
}
.gallery-modal.dark .close {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgNjQgNjQiIHpvb21BbmRQYW49ImRpc2FibGUiPjxzdHlsZT5saW5lIHtzdHJva2U6ICNGRkZGRkY7c3Ryb2tlLXdpZHRoOiAxLjVweDt9PC9zdHlsZT48bGluZSB4MT0iMjAiIHkxPSIyMCIgeDI9IjQ0IiB5Mj0iNDQiIC8+PGxpbmUgeDE9IjIwIiB5MT0iNDQiIHgyPSI0NCIgeTI9IjIwIiAvPjwvc3ZnPg==');
opacity: 0.25;
}
.gallery-modal.dark .nav {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgNjQgNjQiIHpvb21BbmRQYW49ImRpc2FibGUiPjxzdHlsZT5saW5lIHtzdHJva2U6ICNGRkZGRkY7c3Ryb2tlLXdpZHRoOiAxLjVweDt9PC9zdHlsZT48bGluZSB4MT0iMjQiIHkxPSI4IiB4Mj0iNDgiIHkyPSIzMiIgLz48bGluZSB4MT0iMjQiIHkxPSI1NiIgeDI9IjQ4IiB5Mj0iMzIiIC8+PC9zdmc+');
opacity: 0.25;
}
.gallery-modal.light {
--color-background: rgba(255,255,255,0.9);
--color-background-zooming: rgba(255,255,255,1);
--color-caption-text: #000000;
}
.gallery-modal.light:before {
animation: gallery-modal-spinner 1s infinite linear;
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iOTZweCIgaGVpZ2h0PSI5NnB4IiB2aWV3Qm94PSIwIDAgOTYgOTYiIHpvb21BbmRQYW49ImRpc2FibGUiPjxzdHlsZT5jaXJjbGUge2ZpbGw6IHRyYW5zcGFyZW50OyBzdHJva2U6ICMwMDAwMDA7IHN0cm9rZS13aWR0aDogMS41cHg7IH08L3N0eWxlPjxkZWZzPjxjbGlwUGF0aCBpZD0iY29ybmVyIj48cG9seWdvbiBwb2ludHM9IjAsMCA0OCwwIDQ4LDQ4IDk2LDQ4IDk2LDk2IDAsOTYiIC8+PC9jbGlwUGF0aD48L2RlZnM+PGcgY2xpcC1wYXRoPSJ1cmwoI2Nvcm5lcikiPjxjaXJjbGUgY3g9IjQ4IiBjeT0iNDgiIHI9IjMyIi8+PC9nPjwvc3ZnPg==');
}
.gallery-modal.light .close {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgNjQgNjQiIHpvb21BbmRQYW49ImRpc2FibGUiPjxzdHlsZT5saW5lIHtzdHJva2U6ICMwMDAwMDA7c3Ryb2tlLXdpZHRoOiAxLjVweDt9PC9zdHlsZT48bGluZSB4MT0iMjAiIHkxPSIyMCIgeDI9IjQ0IiB5Mj0iNDQiIC8+PGxpbmUgeDE9IjIwIiB5MT0iNDQiIHgyPSI0NCIgeTI9IjIwIiAvPjwvc3ZnPg==');
opacity: 0.375;
}
.gallery-modal.light .nav {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgNjQgNjQiIHpvb21BbmRQYW49ImRpc2FibGUiPjxzdHlsZT5saW5lIHtzdHJva2U6ICMwMDAwMDA7c3Ryb2tlLXdpZHRoOiAxLjVweDt9PC9zdHlsZT48bGluZSB4MT0iMjQiIHkxPSI4IiB4Mj0iNDgiIHkyPSIzMiIgLz48bGluZSB4MT0iMjQiIHkxPSI1NiIgeDI9IjQ4IiB5Mj0iMzIiIC8+PC9zdmc+');
opacity: 0.375;
}
#abouten-switch .inner {
max-width: 15rem;
}
#abouten-switch ul li {
border-radius: 0.5rem;
display: inline-block;
}
#abouten-switch ul li .frame {
border-radius: 0.5rem;
}
#abouten-switch ul {
gap: 1rem;
}
#abouten-switch ul li .thumbnail {
display: block;
transition: filter 0.5s ease;
}
#abouten-switch ul li .nl-img {
filter: saturate(50%);
transition: filter 0.5s ease;
}
#abouten-switch ul li .en-img {
filter: saturate(100%);
transition: filter 0.5s ease;
}
#abouten-switch ul li .thumbnail.n01:hover .nl-img {
filter: saturate(120%);
}
#abouten-switch ul li .thumbnail.n02:hover .en-img {
filter: saturate(100%);
}
#abouten-switch ul li img {
height: auto;
max-height: 2rem;
}
#aboutnl-switch .inner {
max-width: 15rem;
}
#aboutnl-switch ul li {
border-radius: 0.5rem;
display: inline-block;
}
#aboutnl-switch ul li .frame {
border-radius: 0.5rem;
}
#aboutnl-switch ul {
gap: 1rem;
}
#aboutnl-switch ul li .thumbnail {
display: block;
transition: filter 0.5s ease;
}
#aboutnl-switch ul li .nl-img {
filter: saturate(100%);
transition: filter 0.5s ease;
}
#aboutnl-switch ul li .en-img {
filter: saturate(50%);
transition: filter 0.5s ease;
}
#aboutnl-switch ul li .thumbnail.n01:hover .nl-img {
filter: saturate(100%);
}
#aboutnl-switch ul li .thumbnail.n02:hover .en-img {
filter: saturate(120%);
}
#aboutnl-switch ul li img {
height: auto;
max-height: 2rem;
}
#animations-gallery .inner {
max-width: 100%;
}
#animations-gallery ul li {
border-radius: 4.5rem;
display: inline-block;
}
#animations-gallery ul li .frame {
border-radius: 4.5rem;
}
#animations-gallery ul li .caption {
align-items: flex-end;
border-radius: inherit;
display: flex;
height: 100%;
left: 0;
pointer-events: none;
position: absolute;
top: 0;
transition: opacity 0.5s ease, transform 0.5s ease, z-index 0.5s ease;
}
#animations-gallery ul li .caption p {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
padding-bottom: 0.625rem;
padding-left: 1rem;
padding-right: 1rem;
padding-top: 2.5rem;
text-align: center;
color: #FDFEFF;
background-color: transparent;
background-image: linear-gradient(0deg, rgba(0,0,0,0.6) 0%, transparent 100%);
background-position: 0% 0%;
background-repeat: repeat;
background-size: cover;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1em;
line-height: 1.5;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-weight: 600;
}
#animations-gallery ul {
gap: 1.25rem;
}
#animations-gallery ul li .thumbnail {
display: block;
}
#animations-gallery ul li img {
height: auto;
max-height: 10.5rem;
}
#animations-gallery ul li .thumbnail img {
transition: transform 0.5s ease, filter 0.5s ease;
}
#animations-gallery ul li .thumbnail:hover img {
transform: scale(1.095);
}
#misc-gallery .inner {
max-width: 100%;
}
#misc-gallery ul li {
border-radius: 4.5rem;
display: inline-block;
}
#misc-gallery ul li .frame {
border-radius: 4.5rem;
}
#misc-gallery ul li .caption {
align-items: flex-end;
border-radius: inherit;
display: flex;
height: 100%;
left: 0;
pointer-events: none;
position: absolute;
top: 0;
transition: opacity 0.5s ease, transform 0.5s ease, z-index 0.5s ease;
}
#misc-gallery ul li .caption p {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
padding-bottom: 0.625rem;
padding-left: 1rem;
padding-right: 1rem;
padding-top: 2.5rem;
text-align: center;
color: #FDFEFF;
background-color: transparent;
background-image: linear-gradient(0deg, rgba(0,0,0,0.6) 0%, transparent 100%);
background-position: 0% 0%;
background-repeat: repeat;
background-size: cover;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1em;
line-height: 1.5;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-weight: 600;
}
#misc-gallery ul {
gap: 1.25rem;
}
#misc-gallery ul li .thumbnail {
display: block;
}
#misc-gallery ul li img {
height: auto;
max-height: 10.5rem;
}
#misc-gallery ul li .thumbnail img {
transition: transform 0.5s ease, filter 0.5s ease;
}
#misc-gallery ul li .thumbnail:hover img {
transform: scale(1.095);
}
#portfolio-gallery .inner {
max-width: 100%;
}
#portfolio-gallery ul li {
border-radius: 2.5rem;
display: inline-block;
}
#portfolio-gallery ul li .frame {
border-radius: 2.5rem;
}
#portfolio-gallery ul li .caption {
opacity: 0;
align-items: flex-end;
border-radius: inherit;
display: flex;
height: 100%;
left: 0;
pointer-events: none;
position: absolute;
top: 0;
transition: opacity 0.5s ease, transform 1s ease, z-index 1s ease;
}
#portfolio-gallery ul li .caption p {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
padding-bottom: 0.625rem;
padding-left: 1rem;
padding-right: 1rem;
padding-top: 3rem;
text-align: center;
color: #FDFEFF;
background-color: transparent;
background-image: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, transparent 50%);
background-position: 0% 0%;
background-repeat: repeat;
background-size: cover;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 1em;
line-height: 1.5;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-weight: 600;
}
#portfolio-gallery ul li .thumbnail:hover + .caption {
opacity: 1;
}
#portfolio-gallery ul {
gap: 1.25rem;
}
#portfolio-gallery ul li .thumbnail {
display: block;
}
#portfolio-gallery ul li img {
height: auto;
max-height: 8.25rem;
}
#portfolio-gallery ul li .thumbnail img {
transition: transform 1s ease, filter 1s ease;
}
#portfolio-gallery ul li .thumbnail:hover img {
transform: scale(1.095);
}
.fade-in {
opacity: 1 !important;
}
.hidden-post {
visibility: hidden;
}
@media (orientation: portrait) {
.gallery-modal {
grid-template-areas: "image" "caption";
grid-template-columns: auto;
justify-content: center;
}
.gallery-modal .nav {
background-image: none !important;
mix-blend-mode: difference;
opacity: 1 !important;
position: absolute;
}
.gallery-modal .nav.next {
right: 0;
}
.gallery-modal .nav.previous {
left: 0;
}
.gallery-modal .nav:before {
background-color: rgba(144,144,144,0.5);
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgNjQgNjQiIHpvb21BbmRQYW49ImRpc2FibGUiPjxzdHlsZT5saW5lIHtzdHJva2U6ICNGRkZGRkY7c3Ryb2tlLXdpZHRoOiAzcHg7fTwvc3R5bGU+PGxpbmUgeDE9IjI0IiB5MT0iOCIgeDI9IjQ4IiB5Mj0iMzIiIC8+PGxpbmUgeDE9IjI0IiB5MT0iNTYiIHgyPSI0OCIgeTI9IjMyIiAvPjwvc3ZnPg==');
background-position: center;
background-repeat: no-repeat;
background-size: 1.5rem;
border-radius: 3rem;
content: '';
display: block;
height: 3rem;
position: absolute;
right: 1rem;
top: calc(50% - 1.5rem);
width: 3rem;
}
}
@media (max-width: 1680px) {
html {
font-size: 13pt;
}
#canvas {
max-width: 100%;
margin-top: 8px !important;
}
}
@media (max-width: 1280px) {
html {
font-size: 13pt;
}
.gallery-modal .nav {
opacity: 1 !important;
}
.gallery-modal .close {
opacity: 1 !important;
}
}
@media (max-width: 980px) {
html {
font-size: 11pt;
}
#canvas {
margin-top: 12px !important;
}
}
@media (max-width: 736px) {
html {
font-size: 11pt;
}
#main > .inner {
--padding-horizontal: 1.25rem;
--padding-vertical: 1.25rem;
--spacing: 1.5rem;
}
#main > .inner > * > .full {
margin-left: calc(-1.25rem);
max-width: calc(100% + 2.5rem + 0.4725px);
width: calc(100% + 2.5rem + 0.4725px);
}
#main > .inner > * > .full.screen {
margin-left: -50vw;
}
#main > .inner > header > .full:first-child {
margin-top: -1.25rem !important;
}
#main > .inner > .active > .full:last-child {
margin-bottom: -1.25rem !important;
}
#socials-main {
font-size: 1.125em;
gap: 0.875rem;
}
#socials-extra {
font-size: 1.125em;
gap: 0.875rem;
}
#socials-extra:not(:first-child) {
margin-top: 1.5rem !important;
}
#socials-extra:not(:last-child) {
margin-bottom: 1.5rem !important;
}
#intro-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
}
#intro-container.columns > .wrapper > .inner {
flex-direction: column !important;
flex-wrap: nowrap !important;
}
#intro-container.columns > .wrapper > .inner > span {
height: 0;
margin-top: calc(var(--gutters) * -1);
pointer-events: none;
visibility: hidden;
}
#intro-container.columns > .wrapper > .inner > *:first-child {
margin-left: 0 !important;
padding-top: 0 !important;
}
#intro-container.columns > .wrapper > .inner > * {
padding: calc(var(--gutters) * 0.5) 0 !important;
}
#intro-container.columns > .wrapper > .inner > *:last-child {
padding-bottom: 0 !important;
}
#intro-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#intro-container.columns > .wrapper > .inner > div:first-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#intro-container.columns > .wrapper > .inner > div:last-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#intro-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--gutters) * -0.5) !important;
}
#intro-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--gutters) * -0.5) !important;
}
#intro-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#intro-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#intro-container.columns > .wrapper > .inner > div:first-of-type, #intro-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#intro-container.columns > .wrapper > .inner > div:last-of-type, #intro-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#intro-container.columns > .wrapper > .inner > div:first-of-type, #intro-container.columns > .wrapper > .inner > div:first-of-type > .full:last-child {
border-bottom-left-radius: 0 !important;
}
#intro-container.columns > .wrapper > .inner > div:last-of-type, #intro-container.columns > .wrapper > .inner > div:last-of-type > .full:first-child {
border-top-right-radius: 0 !important;
}
#intro-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
height: auto;
}
#intro-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
height: auto;
position: relative;
width: auto;
}
#abouten-container {
--alignment: center;
--flex-alignment: center;
--indent-left: 1;
--indent-right: 1;
--margin-left: auto;
--margin-right: auto;
}
#abouten-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 3.75rem;
--padding-vertical: 2rem;
}
#abouten-container.columns > .wrapper > .inner {
flex-direction: column !important;
flex-wrap: nowrap !important;
}
#abouten-container.columns > .wrapper > .inner > span {
height: 0;
margin-top: calc(var(--gutters) * -1);
pointer-events: none;
visibility: hidden;
}
#abouten-container.columns > .wrapper > .inner > *:first-child {
margin-left: 0 !important;
padding-top: 0 !important;
}
#abouten-container.columns > .wrapper > .inner > * {
padding: calc(var(--gutters) * 0.5) 0 !important;
}
#abouten-container.columns > .wrapper > .inner > *:last-child {
padding-bottom: 0 !important;
}
#abouten-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#abouten-container.columns > .wrapper > .inner > div:first-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#abouten-container.columns > .wrapper > .inner > div:last-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#abouten-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--gutters) * -0.5) !important;
}
#abouten-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--gutters) * -0.5) !important;
}
#abouten-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#abouten-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#abouten-container.columns > .wrapper > .inner > div:first-of-type, #abouten-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#abouten-container.columns > .wrapper > .inner > div:last-of-type, #abouten-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#abouten-container.columns > .wrapper > .inner > div:first-of-type, #abouten-container.columns > .wrapper > .inner > div:first-of-type > .full:last-child {
border-bottom-left-radius: 0 !important;
}
#abouten-container.columns > .wrapper > .inner > div:last-of-type, #abouten-container.columns > .wrapper > .inner > div:last-of-type > .full:first-child {
border-top-right-radius: 0 !important;
}
#abouten-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
height: auto;
}
#abouten-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
height: auto;
position: relative;
width: auto;
}
#abouten-container > .wrapper > .inner > :nth-child(1) {
--alignment: center;
--flex-alignment: center;
--indent-left: 1;
--indent-right: 1;
--margin-left: auto;
--margin-right: auto;
min-height: 100% !important;
width: 100% !important;
}
#abouten-container > .wrapper > .inner > :nth-child(2) {
--alignment: center;
--flex-alignment: center;
--indent-left: 1;
--indent-right: 1;
--margin-left: auto;
--margin-right: auto;
min-height: 100% !important;
width: 100% !important;
}
#aboutnl-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 3.75rem;
--padding-vertical: 2rem;
}
#aboutnl-container.columns > .wrapper > .inner {
flex-direction: column !important;
flex-wrap: nowrap !important;
}
#aboutnl-container.columns > .wrapper > .inner > span {
height: 0;
margin-top: calc(var(--gutters) * -1);
pointer-events: none;
visibility: hidden;
}
#aboutnl-container.columns > .wrapper > .inner > *:first-child {
margin-left: 0 !important;
padding-top: 0 !important;
}
#aboutnl-container.columns > .wrapper > .inner > * {
padding: calc(var(--gutters) * 0.5) 0 !important;
}
#aboutnl-container.columns > .wrapper > .inner > *:last-child {
padding-bottom: 0 !important;
}
#aboutnl-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#aboutnl-container.columns > .wrapper > .inner > div:first-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#aboutnl-container.columns > .wrapper > .inner > div:last-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#aboutnl-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--gutters) * -0.5) !important;
}
#aboutnl-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--gutters) * -0.5) !important;
}
#aboutnl-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#aboutnl-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#aboutnl-container.columns > .wrapper > .inner > div:first-of-type, #aboutnl-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#aboutnl-container.columns > .wrapper > .inner > div:last-of-type, #aboutnl-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#aboutnl-container.columns > .wrapper > .inner > div:first-of-type, #aboutnl-container.columns > .wrapper > .inner > div:first-of-type > .full:last-child {
border-bottom-left-radius: 0 !important;
}
#aboutnl-container.columns > .wrapper > .inner > div:last-of-type, #aboutnl-container.columns > .wrapper > .inner > div:last-of-type > .full:first-child {
border-top-right-radius: 0 !important;
}
#aboutnl-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
height: auto;
}
#aboutnl-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
height: auto;
position: relative;
width: auto;
}
#aboutnl-container > .wrapper > .inner > :nth-child(1) {
min-height: 100% !important;
width: 100% !important;
}
#aboutnl-container > .wrapper > .inner > :nth-child(2) {
min-height: 100% !important;
width: 100% !important;
}
#animations-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
}
#animations-container.columns > .wrapper > .inner {
flex-direction: column !important;
flex-wrap: nowrap !important;
}
#animations-container.columns > .wrapper > .inner > span {
height: 0;
margin-top: calc(var(--gutters) * -1);
pointer-events: none;
visibility: hidden;
}
#animations-container.columns > .wrapper > .inner > *:first-child {
margin-left: 0 !important;
padding-top: 0 !important;
}
#animations-container.columns > .wrapper > .inner > * {
padding: calc(var(--gutters) * 0.5) 0 !important;
}
#animations-container.columns > .wrapper > .inner > *:last-child {
padding-bottom: 0 !important;
}
#animations-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#animations-container.columns > .wrapper > .inner > div:first-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#animations-container.columns > .wrapper > .inner > div:last-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#animations-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--gutters) * -0.5) !important;
}
#animations-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--gutters) * -0.5) !important;
}
#animations-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#animations-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#animations-container.columns > .wrapper > .inner > div:first-of-type, #animations-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#animations-container.columns > .wrapper > .inner > div:last-of-type, #animations-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#animations-container.columns > .wrapper > .inner > div:first-of-type, #animations-container.columns > .wrapper > .inner > div:first-of-type > .full:last-child {
border-bottom-left-radius: 0 !important;
}
#animations-container.columns > .wrapper > .inner > div:last-of-type, #animations-container.columns > .wrapper > .inner > div:last-of-type > .full:first-child {
border-top-right-radius: 0 !important;
}
#animations-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
height: auto;
}
#animations-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
height: auto;
position: relative;
width: auto;
}
#misc-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
}
#misc-container.columns > .wrapper > .inner {
flex-direction: column !important;
flex-wrap: nowrap !important;
}
#misc-container.columns > .wrapper > .inner > span {
height: 0;
margin-top: calc(var(--gutters) * -1);
pointer-events: none;
visibility: hidden;
}
#misc-container.columns > .wrapper > .inner > *:first-child {
margin-left: 0 !important;
padding-top: 0 !important;
}
#misc-container.columns > .wrapper > .inner > * {
padding: calc(var(--gutters) * 0.5) 0 !important;
}
#misc-container.columns > .wrapper > .inner > *:last-child {
padding-bottom: 0 !important;
}
#misc-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#misc-container.columns > .wrapper > .inner > div:first-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#misc-container.columns > .wrapper > .inner > div:last-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#misc-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--gutters) * -0.5) !important;
}
#misc-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--gutters) * -0.5) !important;
}
#misc-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#misc-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#misc-container.columns > .wrapper > .inner > div:first-of-type, #misc-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#misc-container.columns > .wrapper > .inner > div:last-of-type, #misc-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#misc-container.columns > .wrapper > .inner > div:first-of-type, #misc-container.columns > .wrapper > .inner > div:first-of-type > .full:last-child {
border-bottom-left-radius: 0 !important;
}
#misc-container.columns > .wrapper > .inner > div:last-of-type, #misc-container.columns > .wrapper > .inner > div:last-of-type > .full:first-child {
border-top-right-radius: 0 !important;
}
#misc-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
height: auto;
}
#misc-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
height: auto;
position: relative;
width: auto;
}
#animations-gallery ul li {
border-radius: 2.7rem;
display: inline-block;
}
#animations-gallery ul li .frame {
border-radius: 2.7rem;
}
#misc-gallery ul li {
border-radius: 2.7rem;
display: inline-block;
}
#misc-gallery ul li .frame {
border-radius: 2.7rem;
}
#posts-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
}
#posts-container.columns > .wrapper > .inner {
flex-direction: column !important;
flex-wrap: nowrap !important;
}
#posts-container.columns > .wrapper > .inner > span {
height: 0;
margin-top: calc(var(--gutters) * -1);
pointer-events: none;
visibility: hidden;
}
#posts-container.columns > .wrapper > .inner > *:first-child {
margin-left: 0 !important;
padding-top: 0 !important;
}
#posts-container.columns > .wrapper > .inner > * {
padding: calc(var(--gutters) * 0.5) 0 !important;
}
#posts-container.columns > .wrapper > .inner > *:last-child {
padding-bottom: 0 !important;
}
#posts-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#posts-container.columns > .wrapper > .inner > div:first-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#posts-container.columns > .wrapper > .inner > div:last-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#posts-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--gutters) * -0.5) !important;
}
#posts-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--gutters) * -0.5) !important;
}
#posts-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#posts-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#posts-container.columns > .wrapper > .inner > div:first-of-type, #posts-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#posts-container.columns > .wrapper > .inner > div:last-of-type, #posts-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#posts-container.columns > .wrapper > .inner > div:first-of-type, #posts-container.columns > .wrapper > .inner > div:first-of-type > .full:last-child {
border-bottom-left-radius: 0 !important;
}
#posts-container.columns > .wrapper > .inner > div:last-of-type, #posts-container.columns > .wrapper > .inner > div:last-of-type > .full:first-child {
border-top-right-radius: 0 !important;
}
#posts-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
height: auto;
}
#posts-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
height: auto;
position: relative;
width: auto;
}
#portfolio-container > .wrapper > .inner {
--gutters: 2rem;
--padding-horizontal: 2rem;
--padding-vertical: 2rem;
}
#portfolio-container.columns > .wrapper > .inner {
flex-direction: column !important;
flex-wrap: nowrap !important;
}
#portfolio-container.columns > .wrapper > .inner > span {
height: 0;
margin-top: calc(var(--gutters) * -1);
pointer-events: none;
visibility: hidden;
}
#portfolio-container.columns > .wrapper > .inner > *:first-child {
margin-left: 0 !important;
padding-top: 0 !important;
}
#portfolio-container.columns > .wrapper > .inner > * {
padding: calc(var(--gutters) * 0.5) 0 !important;
}
#portfolio-container.columns > .wrapper > .inner > *:last-child {
padding-bottom: 0 !important;
}
#portfolio-container.columns > .wrapper > .inner > div > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#portfolio-container.columns > .wrapper > .inner > div:first-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#portfolio-container.columns > .wrapper > .inner > div:last-of-type > .full {
margin-left: calc(var(--padding-horizontal) * -1);
width: calc(100% + (var(--padding-horizontal) * 2) + 0.4725px);
}
#portfolio-container.columns > .wrapper > .inner > div > .full:first-child {
margin-top: calc(var(--gutters) * -0.5) !important;
}
#portfolio-container.columns > .wrapper > .inner > div > .full:last-child {
margin-bottom: calc(var(--gutters) * -0.5) !important;
}
#portfolio-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
margin-top: calc(var(--padding-vertical) * -1) !important;
}
#portfolio-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
margin-bottom: calc(var(--padding-vertical) * -1) !important;
}
#portfolio-container.columns > .wrapper > .inner > div:first-of-type, #portfolio-container.columns > .wrapper > .inner > div:first-of-type > .full:first-child {
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#portfolio-container.columns > .wrapper > .inner > div:last-of-type, #portfolio-container.columns > .wrapper > .inner > div:last-of-type > .full:last-child {
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
}
#portfolio-container.columns > .wrapper > .inner > div:first-of-type, #portfolio-container.columns > .wrapper > .inner > div:first-of-type > .full:last-child {
border-bottom-left-radius: 0 !important;
}
#portfolio-container.columns > .wrapper > .inner > div:last-of-type, #portfolio-container.columns > .wrapper > .inner > div:last-of-type > .full:first-child {
border-top-right-radius: 0 !important;
}
#portfolio-container.columns > .wrapper > .inner > .full > .full:first-child:last-child {
height: auto;
}
#portfolio-container.columns > .wrapper > .inner > .full > .full:first-child:last-child > * {
height: auto;
position: relative;
width: auto;
}
#header {
margin-bottom: 0rem !important;
}
#intro-buttons {
gap: 1rem;
}
#intro-buttons li a {
letter-spacing: -0.05rem;
font-size: 1.125em;
}
#buttons08 {
gap: 1rem;
}
#buttons08 li a {
letter-spacing: -0.05rem;
font-size: 1.125em;
}
#to-menu-button {
gap: 1rem;
}
#to-menu-button li a {
letter-spacing: -0.05rem;
font-size: 1.125em;
}
#buttons09 {
gap: 1rem;
}
#buttons09 li a {
letter-spacing: -0.05rem;
font-size: 1.125em;
}
#buttons03 {
gap: 1rem;
}
#buttons03 li a {
letter-spacing: -0.05rem;
font-size: 1.125em;
}
#buttons05 {
gap: 1rem;
}
#buttons05 li a {
letter-spacing: -0.05rem;
font-size: 1.125em;
}
#intro-handle {
letter-spacing: -0.04375rem;
width: 100%;
font-size: 1.25em;
line-height: 1;
}
#handle {
letter-spacing: -0.04375rem;
width: 100%;
font-size: 1.25em;
line-height: 1;
}
#abouten-text {
padding-left: 7%;
padding-right: 7%;
letter-spacing: -0.04375rem;
width: 100%;
font-size: 1em;
line-height: 1.5;
text-align: center;
}
#text06 {
letter-spacing: -0.04375rem;
width: 100%;
font-size: 1em;
line-height: 1.5;
}
#fourzerofour {
letter-spacing: -0.04375rem;
width: 100%;
font-size: 3.5em;
line-height: 1;
}
#aboutnl-text {
padding-left: 7%;
padding-right: 7%;
letter-spacing: -0.04375rem;
width: 100%;
font-size: 1em;
line-height: 1.5;
text-align: center;
}
#text09 {
letter-spacing: -0.04375rem;
width: 100%;
font-size: 0.8em !important;
padding-right: 8px !important;
line-height: 1.5;
}
#about-pfp .frame {
width: 110px !important;
height: 110px !important;
border-radius: 45px !important;
}
#about-pfp img {
height: 110px !important;
object-fit: cover;
object-position: center;
width: 110px !important;
}
.gallery-modal .close {
background-position: top 0.5rem right 0.5rem;
}
#abouten-switch ul li img {
max-height: 3.5rem;
}
#aboutnl-switch ul li img {
max-height: 3.5rem;
}
#animations-gallery ul li .caption {
opacity: 1;
}
#animations-gallery ul li .thumbnail:hover + .caption {
opacity: 1;
}
#animations-gallery ul li .caption p {
letter-spacing: -0.05rem;
font-size: 1em;
}
#animations-gallery ul li img {
max-height: 6.375rem;
}
#animations-gallery ul {
gap: 1.5rem;
}
#misc-gallery ul li .caption {
opacity: 1;
}
#misc-gallery ul li .thumbnail:hover + .caption {
opacity: 1;
}
#misc-gallery ul li .caption p {
letter-spacing: -0.05rem;
font-size: 1em;
}
#misc-gallery ul li img {
max-height: 6.375rem;
}
#misc-gallery ul {
gap: 1.5rem;
}
#portfolio-gallery ul li .caption p {
letter-spacing: -0.05rem;
font-size: 1em;
}
#portfolio-gallery ul li img {
max-height: 5.375rem;
}
#posts {
color: #fdfeff;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 12pt !important;
line-height: 1.5;
font-weight: 600;
width: 385px !important;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: left;
margin: 0 auto;
}
.post-date {
font-size: 12pt !important;
}
#buttons12 li a {
width: 184px !important;
}
}
@media (max-width: 480px) {
#main > .inner {
--spacing: 1.3125rem;
}
#intro-buttons li a {
width: 15rem;
}
#buttons08 li a {
width: 15rem;
}
#to-menu-button li a {
width: 15rem;
}
#buttons09 li a {
width: 15rem;
}
#buttons03 li a {
width: 15rem;
}
#buttons05 li a {
width: 15rem;
}
#about-pfp .frame {
height: 110px !important;
}
#posts {
color: #fdfeff;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 12pt !important;
line-height: 1.5;
font-weight: 600;
width: 100% !important;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: left;
margin: 0 auto;
}
#canvas {
margin-top: 10px !important;
}
#buttons12 li a {
width: 422px !important;
max-width: 100% !important;
}
}
@media (max-width: 360px) {
#main > .inner {
--padding-horizontal: 0.9375rem;
--padding-vertical: 0.9375rem;
--spacing: 1.125rem;
}
#main > .inner > * > .full {
margin-left: calc(-0.9375rem);
max-width: calc(100% + 1.875rem + 0.4725px);
width: calc(100% + 1.875rem + 0.4725px);
}
#main > .inner > * > .full.screen {
margin-left: -50vw;
}
#main > .inner > header > .full:first-child {
margin-top: -0.9375rem !important;
}
#main > .inner > .active > .full:last-child {
margin-bottom: -0.9375rem !important;
}
#intro-container > .wrapper > .inner {
--gutters: 1.5rem;
--padding-horizontal: 1.5rem;
--padding-vertical: 1.5rem;
}
#abouten-container > .wrapper > .inner {
--gutters: 1.5rem;
--padding-horizontal: 2.8125rem;
--padding-vertical: 1.5rem;
}
#aboutnl-container > .wrapper > .inner {
--gutters: 1.5rem;
--padding-horizontal: 2.8125rem;
--padding-vertical: 1.5rem;
}
#animations-container > .wrapper > .inner {
--gutters: 1.5rem;
--padding-horizontal: 1.5rem;
--padding-vertical: 1.5rem;
}
#misc-container > .wrapper > .inner {
--gutters: 1.5rem;
--padding-horizontal: 1.5rem;
--padding-vertical: 1.5rem;
}
#posts-container > .wrapper > .inner {
--gutters: 1.5rem;
--padding-horizontal: 1.5rem;
--padding-vertical: 1.5rem;
}
#portfolio-container > .wrapper > .inner {
--gutters: 1.5rem;
--padding-horizontal: 1.5rem;
--padding-vertical: 1.5rem;
}
#intro-buttons {
gap: 0.75rem;
}
#buttons08 {
gap: 0.75rem;
}
#to-menu-button {
gap: 0.75rem;
}
#buttons09 {
gap: 0.75rem;
}
#buttons03 {
gap: 0.75rem;
}
#buttons05 {
gap: 0.75rem;
}
#intro-handle {
font-size: 1.25em;
}
#handle {
font-size: 1.25em;
}
#abouten-text {
font-size: 1em;
}
#text06 {
font-size: 1em;
}
#fourzerofour {
font-size: 3.5em;
}
#aboutnl-text {
font-size: 1em;
}
#about-pfp .frame {
height: 110px !important;
}
#abouten-switch ul {
gap: 0.75rem;
}
#aboutnl-switch ul {
gap: 0.75rem;
}
#animations-gallery ul li .caption p {
font-size: 1em;
}
#animations-gallery ul {
gap: 1.125rem;
}
#misc-gallery ul li .caption p {
font-size: 1em;
}
#misc-gallery ul {
gap: 1.125rem;
}
#portfolio-gallery ul li .caption p {
font-size: 1em;
}
#portfolio-gallery ul {
gap: 0.9375rem;
}
#canvas {
max-width: 93% !important;
margin-top: 10px !important;
}
#socials-main {
gap: 1.188rem;
}
#socials-extra {
gap: 1.188rem;
}
#intro-buttons li a {
width: 16rem;
}
#buttons08 li a {
width: 16rem;
}
#buttons09 li a {
width: 16rem;
}
#to-menu-button li a {
width: 16rem;
}
#buttons03 li a {
width: 16rem;
}
}
#animation_container {
display: flex !important;
justify-content: center !important;
align-items: center !important;
width: 100% !important;
height: 50px !important;
}
#canvas {
height: auto !important;
margin-top: -10px;
}
#post-icons {
display: flex;
gap: 15px;
margin-bottom: 20px;
}
#post-icons .icons li {
list-style: none;
}
.post-content {
margin-bottom: 2rem;
border: 1px solid #232b30;
border-radius: 32px;
padding: 1.5rem;
padding-top: 1.5rem;
}
.post-footer {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 0.5rem;
}
.post-date {
color: #5bacd2;
font-size: 14pt;
cursor: pointer;
text-align: right;
}
.post-date:hover {
text-decoration: underline;
}
#posts {
color: #fdfeff;
font-family: 'Outfit', sans-serif;
letter-spacing: -0.05rem;
font-size: 14pt;
line-height: 1.5;
font-weight: 600;
width: 500px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: left;
margin: 0 auto;
}
#posts img, 
#posts video, 
#posts audio {
max-width: 100%;
margin-left: 0;
height: auto;
margin-top: 10px;
display: block;
border-radius: 20px;
}
#posts ul {
list-style: disc inside;
margin-left: 20px;
}
#posts p {
text-align: left;
}
#load-more {
display: block;
background-color: #5bacd2;
color: #151f26;
font-weight: bold;
border: none;
border-radius: 15px;
padding: 0.5rem 1rem;
cursor: pointer;
text-align: center;
margin: 0 auto;
transition: transform 0.3s ease, background-color 0.3s ease;
}
#load-more:hover {
transform: scale(1.05);
}
#lottie-container {
width: 100%;
height: 100%;
}