/* Custom styling */
body {
	font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

/* Header styling */
nav {
	margin: 0;
}

.acc-header a p {
    margin: 10px;
}

.menu-button {
	display: none;
	@media screen and (max-width: calc(40rem - 1px)) {
        display: block;
    }
}

/* Custom TW-like class */
.mobile\:hidden {
    @media screen and (max-width: 40rem) {
        display: none;
    }
}

.loader {
    --loader-thickness: calc(var(--loader-size) * 0.1);
    width: var(--loader-size);
    height: var(--loader-size);
    transform: rotateZ(45deg);
    perspective: 1000px;
    border-radius: 50%;
    color: #2400b2;
    isolation: isolate;
}

.loader:before,
.loader:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: inherit;
    height: inherit;
    border-radius: 50%;
    transform: rotateX(70deg);
    animation: 1s spin linear infinite;
}

.loader:after {
    color: #FF0000;
    transform: rotateY(70deg);
    animation-delay: .4s;
}

@keyframes rotate {
    0% {
        transform: translate(-50%, -50%) rotateZ(0deg);
    }

    100% {
        transform: translate(-50%, -50%) rotateZ(360deg);
    }
}

@keyframes rotateccw {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(-360deg);
    }
}

@keyframes spin {
    0%, 100% {
        box-shadow: var(--loader-thickness) 0px 0 0px currentcolor;
    }

    12% {
        box-shadow: var(--loader-thickness) var(--loader-thickness) 0 0 currentcolor;
    }

    25% {
        box-shadow: 0 var(--loader-thickness) 0 0px currentcolor;
    }

    37% {
        box-shadow: calc(-1 * var(--loader-thickness)) var(--loader-thickness) 0 0 currentcolor;
    }

    50% {
        box-shadow: calc(-1 * var(--loader-thickness)) 0 0 0 currentcolor;
    }

    62% {
        box-shadow: calc(-1 * var(--loader-thickness)) calc(-1 * var(--loader-thickness)) 0 0 currentcolor;
    }

    75% {
        box-shadow: 0px calc(-1 * var(--loader-thickness)) 0 0 currentcolor;
    }

    87% {
        box-shadow: var(--loader-thickness) calc(-1 * var(--loader-thickness)) 0 0 currentcolor;
    }
}