@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=National+Park:wght@200..800&display=swap');

@font-face {
    font-display: swap;
    font-family: nr;
    font-style: normal;
    font-weight: 400;
    src: url(/assets/fonts/National_Park/static/NationalPark-Regular.ttf)
}
@font-face {
    font-display: swap;
    font-family: neb;
    font-style: normal;
    font-weight: 800;
    src: url(/assets/fonts/National_Park/static/NationalPark-ExtraBold.ttf)
}
@font-face {
    font-display: swap;
    font-family: nb;
    font-style: normal;
    font-weight: 700;
    src: url(/assets/fonts/National_Park/static/NationalPark-Bold.ttf)
}
@font-face {
    font-display: swap;
    font-family: rr;
    font-style: normal;
    font-weight: 400;
    src: url(/assets/fonts/Rubik/static/Rubik-Regular.ttf)
}
@font-face {
    font-display: swap;
    font-family: ri;
    font-style: italic;
    font-weight: 400;
    src: url(/assets/fonts/Rubik/static/Rubik-Italic.ttf)
}
@font-face {
    font-display: swap;
    font-family: rb;
    font-style: normal;
    font-weight: 600;
    src: url(/assets/fonts/Rubik/static/Rubik-Bold.ttf)
}
/* * {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
} */

:root {
    --KeyDarkest:           #000000;
    --Key-Warmer-Lightest:  #FBF3EA;
    --Key-Warmer-Lighter:   #DED5CA;
    --Key-Warmer-Neutral:   #A89073;
    --Key-Warmer-Darker:    #4A443E;
    --Key-Colder-Lightest:  #FFFFFF;
    --Key-Colder-Lighter:   #C7D6E1;
    --Key-Colder-Neutral:   #7398B3;
    --Key-Colder-Darker:    #2E4345;
    
    --Red-Lightest:         #FFEDEB;
    --Red-Lighter:          #FFC4BB;
    --Red-VibrantNeutral:   #FF464E;
    --Red-VibrantDarker:    #A0002F;
    --Red-CozyNeutral:      #DD676C;
    --Red-CozyDarker:       #6A1D2C;
    --Red-Darkest:          #4A001D;

    --Orange-Lightest:      #FFF2E0;
    --Orange-Lighter:       #FFCA82;
    --Orange-VibrantNeutral:#E37000;
    --Orange-VibrantDarker: #882500;
    --Orange-CozyNeutral:   #B7783A;
    --Orange-CozyDarker:    #663624;
    --Orange-Darkest:       #4D1800;

    --Yellow-Lightest:      #FFF6CC;
    --Yellow-Lighter:       #FFD300;
    --Yellow-VibrantNeutral:#BD9C00;
    --Yellow-VibrantDarker: #6D4200;
    --Yellow-CozyNeutral:   #A28E34;
    --Yellow-CozyDarker:    #5E431A;
    --Yellow-Darkest:       #322904;

    --Green-Lightest:       #E1FCCF;
    --Green-Lighter:        #9DF561;
    --Green-VibrantNeutral: #58AD00;
    --Green-VibrantDarker:  #3B5700;
    --Green-CozyNeutral:    #6DA039;
    --Green-CozyDarker:     #3F4C25;
    --Green-Darkest:        #243B00;

    --Teal-Lightest:        #CCFFE8;
    --Teal-Lighter:         #4AFFAD;
    --Teal-VibrantNeutral:  #00B091;
    --Teal-VibrantDarker:   #005C52;
    --Teal-CozyNeutral:     #43988A;
    --Teal-CozyDarker:      #254743;
    --Teal-Darkest:         #00322E;

    --Blue-Lightest:        #CCF9FF;
    --Blue-Lighter:         #69EDFF;
    --Blue-VibrantNeutral:  #3990FF;
    --Blue-VibrantDarker:   #0047A7;
    --Blue-CozyNeutral:     #5994DF;
    --Blue-CozyDarker:      #274267;
    --Blue-Darkest:         #002854;

    --Purple-Lightest:      #EBF0FF;
    --Purple-Lighter:       #C9D6FF;
    --Purple-VibrantNeutral:#8D78FF;
    --Purple-VibrantDarker: #7100DF;
    --Purple-CozyNeutral:   #9A90D0;
    --Purple-CozyDarker:    #4C2E69;
    --Purple-Darkest:       #271C53;

    --Pink-Lightest:        #FFEBFF;
    --Pink-Lighter:         #FFBCFF;
    --Pink-VibrantNeutral:  #E94CB8;
    --Pink-VibrantDarker:   #86007D;
    --Pink-CozyNeutral:     #BD61A1;
    --Pink-CozyDarker:      #552452;
    --Pink-Darkest:         #420F3A;

    --c0:   #000f;
    --c1:   #111f;
    --c2:   #222f;
    --c3:   #333f;
    --c4:   #444f;
    --c5:   #555f;
    --c6:   #666f;
    --c7:   #777f;
    --c8:   #888f;
    --c9:   #999f;
    --ca:   #aaaf;
    --cb:   #bbbf;
    --cc:   #cccf;
    --cd:   #dddf;
    --ce:   #eeef;
    --cf:   #ffff;


    --LandingFrameHeight:   864px;
}

::selection {
    background: var(--Pink-Darkest);
    color: var(--Pink-Lighter);
}

html{
    overflow-x: hidden;
    scroll-behavior: smooth;
    font-size: 16px;
}

body{
    width: 100.1vw;
    background: var(--Purple-Darkest); 
    font-family: np;
    color: #fff;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    cursor: url(/assets/cursors/default_unicontour.png), auto;
    font-size: 16px;
}



.cd{
    cursor: url(/assets/cursors/default_unicontour.png), default !important;
}
.cp{
    cursor: url(/assets/cursors/pointer_unicontour.png), pointer !important;
}
.ct{
    cursor: url(/assets/cursors/text_unicontour.png), text !important;
}
.bs1{box-shadow: 0 2em 3em #86007D}

img {
    -webkit-user-drag: none !important;
    user-drag: none !important;
}
a {
    text-decoration: none;
    color: #fff;
    cursor: url(/assets/cursors/pointer_unicontour.png), pointer;
}
section{
    height: var(--LandingFrameHeight);
}

h1, h2, h3, h4, h5, h6{
    margin: 0;
}

h1{
    font-family: rb;
    font-weight: 600;
    font-size: 4em;
    color: var(--Pink-Lighter);
    z-index: 10;
}
h2{
    font-family: neb;
    font-weight: 800;
    font-size: 2em;
    color: var(--cf);
    z-index: 10;
}
h5{
    font-family: nr;
    font-weight: 400;
    font-size: 2em;
    color: var(--cf);
    z-index: 10;
}
h6{
    font-family: rb;
    font-weight: 400;
    font-size: 1.5em;
    color: var(--Purple-Lighter);
    z-index: 10;
}
p{
    font-family: nr;
    font-weight: 400;
    font-size: 1.5em;
    color: var(--cf);
    margin: 0;
    z-index: 10;
}


@media screen and (max-width: 1535px) {
    html{
        font-size: 12px;
    }
    body{
        font-size: 12px;
    }
}
@media screen and (max-width: 659px) {
    html{
        font-size: 8px;
    }
    body{
        font-size: 8px;
    }
}