@font-face {
    font-family: "Galano Grotesque";
    src: url("/themes/rakettjuunior/font/GalanoGrotesqueRegular.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Galano Grotesque";
    src: url("/themes/rakettjuunior/font/GalanoGrotesqueItalic.otf") format("opentype");
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: "Galano Grotesque";
    src: url("/themes/rakettjuunior/font/GalanoGrotesqueSemiBold.otf") format("opentype");
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: "Galano Grotesque";
    src: url("/themes/rakettjuunior/font/GalanoGrotesqueSemiBoldItalic.otf") format("opentype");
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: "Galano Grotesque";
    src: url("/themes/rakettjuunior/font/GalanoGrotesqueExtraBoldItalic.otf") format("opentype");
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: "Galano Grotesque";
    src: url("/themes/rakettjuunior/font/GalanoGrotesqueBlackItalic.otf") format("opentype");
    font-weight: 900;
    font-style: italic;
}

body {
    font-size:20px;
    font-family: "Galano Grotesque", sans-serif;
}


.shake-object {
    transform-origin: center;
}

@keyframes shake {
    0% { transform: rotate(0deg); }
    5% { transform: rotate(-2deg); }
    10% { transform: rotate(3deg); }
    15% { transform: rotate(-1deg); }
    20% { transform: rotate(2.5deg); }
    25% { transform: rotate(-3deg); }
    30% { transform: rotate(1.5deg); }
    35% { transform: rotate(-2.5deg); }
    40% { transform: rotate(3deg); }
    45% { transform: rotate(-1.5deg); }
    50% { transform: rotate(2deg); }
    55% { transform: rotate(-2deg); }
    60% { transform: rotate(1deg); }
    65% { transform: rotate(-1deg); }
    70% { transform: rotate(1.5deg); }
    75% { transform: rotate(-1deg); }
    80% { transform: rotate(0.5deg); }
    85% { transform: rotate(-0.5deg); }
    90% { transform: rotate(0.3deg); }
    95% { transform: rotate(-0.2deg); }
    100% { transform: rotate(0deg); }
}

/* Trigger shake on hover for demonstration */
.shake-object:hover {
    animation: shake 1.2s ease-in-out;
}

.path-1 { animation: float1 7s infinite ease-in-out; }
.path-2 { animation: float2 6.5s infinite ease-in-out; }
.path-3 { animation: float3 8.2s infinite ease-in-out; }
.path-4 { animation: float4 7.8s infinite ease-in-out; }
.path-5 { animation: float5 6.8s infinite ease-in-out; }
.path-6 { animation: float6 7.5s infinite ease-in-out; }
.path-7 { animation: float7 8.5s infinite ease-in-out; }
.path-8 { animation: float8 7.2s infinite ease-in-out; }
.path-9 { animation: float9 6.9s infinite ease-in-out; }
.path-10 { animation: float10 8.1s infinite ease-in-out; }
.path-11 { animation: float11 7.7s infinite ease-in-out; }
.path-12 { animation: float12 6.6s infinite ease-in-out; }
.path-13 { animation: float13 8.3s infinite ease-in-out; }
.path-14 { animation: float14 7.4s infinite ease-in-out; }
.path-15 { animation: float15 7.9s infinite ease-in-out; }
.path-16 { animation: float16 6.7s infinite ease-in-out; }
.path-17 { animation: float17 8.4s infinite ease-in-out; }
.path-18 { animation: float18 7.1s infinite ease-in-out; }

@keyframes float1 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(3px, -2px) rotate(1deg); }
    50% { transform: translate(-2px, 4px) rotate(-0.5deg); }
    75% { transform: translate(4px, 2px) rotate(0.8deg); }
}

@keyframes float2 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-3px, 3px) rotate(-1deg); }
    50% { transform: translate(4px, -2px) rotate(1.2deg); }
    75% { transform: translate(-2px, -3px) rotate(-0.7deg); }
}

@keyframes float3 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(2px, 4px) rotate(0.6deg); }
    50% { transform: translate(-4px, -1px) rotate(-1.1deg); }
    75% { transform: translate(3px, -3px) rotate(0.9deg); }
}

@keyframes float4 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-2px, -4px) rotate(-0.8deg); }
    50% { transform: translate(3px, 2px) rotate(1.3deg); }
    75% { transform: translate(-4px, 3px) rotate(-1deg); }
}

@keyframes float5 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(4px, 1px) rotate(1.1deg); }
    50% { transform: translate(-1px, -4px) rotate(-0.9deg); }
    75% { transform: translate(-3px, 2px) rotate(0.7deg); }
}

@keyframes float6 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(1px, -3px) rotate(0.5deg); }
    50% { transform: translate(-3px, 3px) rotate(-1.2deg); }
    75% { transform: translate(4px, -1px) rotate(1deg); }
}

@keyframes float7 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-4px, 2px) rotate(-1.1deg); }
    50% { transform: translate(2px, -3px) rotate(0.8deg); }
    75% { transform: translate(1px, 4px) rotate(-0.6deg); }
}

@keyframes float8 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(3px, 3px) rotate(0.9deg); }
    50% { transform: translate(-2px, 1px) rotate(-1.3deg); }
    75% { transform: translate(-1px, -4px) rotate(1.1deg); }
}

@keyframes float9 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-1px, 4px) rotate(-0.7deg); }
    50% { transform: translate(4px, -2px) rotate(1.2deg); }
    75% { transform: translate(-3px, -1px) rotate(-1deg); }
}

@keyframes float10 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(2px, -1px) rotate(1deg); }
    50% { transform: translate(-4px, 4px) rotate(-0.8deg); }
    75% { transform: translate(3px, -3px) rotate(0.9deg); }
}

@keyframes float11 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-3px, -2px) rotate(-1.2deg); }
    50% { transform: translate(1px, 3px) rotate(0.7deg); }
    75% { transform: translate(4px, 1px) rotate(-0.9deg); }
}

@keyframes float12 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(4px, -4px) rotate(1.1deg); }
    50% { transform: translate(-2px, 2px) rotate(-1deg); }
    75% { transform: translate(-1px, -3px) rotate(0.8deg); }
}

@keyframes float13 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-2px, 1px) rotate(-0.6deg); }
    50% { transform: translate(3px, -4px) rotate(1.3deg); }
    75% { transform: translate(1px, 4px) rotate(-1.1deg); }
}

@keyframes float14 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(1px, 2px) rotate(0.8deg); }
    50% { transform: translate(-4px, -3px) rotate(-1.2deg); }
    75% { transform: translate(3px, 1px) rotate(1deg); }
}

@keyframes float15 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-1px, -1px) rotate(-0.9deg); }
    50% { transform: translate(4px, 3px) rotate(1.1deg); }
    75% { transform: translate(-3px, -4px) rotate(-0.7deg); }
}

@keyframes float16 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(3px, -3px) rotate(1.2deg); }
    50% { transform: translate(-1px, 4px) rotate(-0.8deg); }
    75% { transform: translate(-4px, 1px) rotate(0.9deg); }
}

@keyframes float17 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-4px, -1px) rotate(-1.1deg); }
    50% { transform: translate(2px, -2px) rotate(0.6deg); }
    75% { transform: translate(1px, 3px) rotate(-1.3deg); }
}

@keyframes float18 {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(2px, 4px) rotate(0.7deg); }
    50% { transform: translate(-3px, -2px) rotate(-1deg); }
    75% { transform: translate(4px, -1px) rotate(1.2deg); }
}

details > summary {
    list-style: none;
}
details > summary::-webkit-details-marker {
    display: none;
}


ol,
ul {
    padding-left: .5rem !important;
}

ol {
    list-style-type: decimal !important;
}

ul {
    list-style-type: disc !important;
}