@media all and (min-width: 991px) {
}

@media all and (max-width: 991px) {
}

:root{
    --wave-rally-color-header-bg:#62298a;
    --wave-rally-color-bg:#0f010e;
    --wave-rally-color-bg-alt-1:#161739;
    --wave-rally-color-bg-alt-2:#251138;
    --wave-rally-color-bg-alt-3:#300a33;
    --wave-rally-color-footer-bg:#62298a;
    /*--wave-rally-color-acnhor-active:#64e7fb;*/
    /*--wave-rally-color-acnhor-underline-active:#64e7fb;*/
    /*--wave-rally-color-acnhor-active:#fbcb45;*/
    /*--wave-rally-color-acnhor-underline-active:#fbcb45;*/
    /*--wave-rally-color-acnhor-active:#ff99de;*/
    /*--wave-rally-color-acnhor-underline-active:#ff99de;*/
    --wave-rally-color-acnhor-active: #0ddfff;
    --wave-rally-color-acnhor-hover:#0ccfeb;
    --wave-rally-color-acnhor-underline-hover:#0ccfeb;
    /*--wave-rally-color-acnhor-active:var(--sl-color-violet-500);*/
    /*--wave-rally-color-acnhor-underline-active:var(--sl-color-violet-500);*/
    --wave-rally-countdown-unit-font-size:4rem;
}

html{
    font-size: 16px;
}

body{
    margin:auto;
    font-family: var(--sl-font-sans);
    background: var(--wave-rally-color-bg);
    display: grid;
}

a {
    color: var(--sl-color-neutral-1000);
    text-decoration: none;
    position: relative;
}

span.selected{
    color: var(--wave-rally-color-acnhor-hover);
    text-decoration: var(--wave-rally-color-acnhor-hover) underline;
}

a.alt{
    color: var(--wave-rally-color-acnhor-hover);
}

a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--wave-rally-color-acnhor-underline-hover);
    transform: scaleX(0) rotate(0.001deg);
    transform-origin: right center;
    transition: transform 0.3s cubic-bezier(.5, 0, .25, 1), background-color 0.3s cubic-bezier(.5, 0, .25, 1) 0.15s;
}

a:hover::before{
    transform-origin: left center;
    transform: scaleX(1) rotate(0.001deg);
}

a:hover{
    color: var(--wave-rally-color-acnhor-hover);
    background-size: 100% 1px;
}

a:active {
    color: var(--wave-rally-color-acnhor-active);
}

a.no-decoration::before {
    background-color: rgba(0,0,0,0);
}

div#content{
    grid-column: 1;
    /*grid-row:2;*/
    display: grid;
    gap:var(--sl-spacing-medium);
    max-width: 1500px;
    margin: auto;
    width: 100%;
}

main{
    grid-column: 1 / 3;
    /*grid-row:1;*/
    padding-bottom: var(--sl-spacing-medium);
    padding-left: var(--sl-spacing-small);
    padding-right: var(--sl-spacing-small);
    display: grid;
    place-items: stretch;
    /*max-width: 800px;*/
}

sl-divider {
    width: 100%;
    --color: white;
    --width: 2px;
}