body
{
    margin: 0;
    background-color: #1f1f1f;
    overflow-x: hidden;
    perspective: 800px;
    position:relative;
    scrollbar-color: #1f1F1F #3f3F3F;
    --scrollbar-color-thumb: #1f1F1F;
    --scrollbar-color-track: #3f3F3F;
    --scrollbar-width: thin;
    --scrollbar-width-legacy: 10px;
}
::-moz-selection
{
    color: #000;
    background: #e87d0d;
}
::selection
{
    color: #000;
    background: #e87d0d;
}

.band
{
    margin: 0;
    min-height: 200px;

    padding-left: 30px;
    padding-right: 30px;
    padding-top: 10px;
    padding-bottom: 30px;

    background-color: #000;

    text-align: center;
}

h1
{
    font-family: Barlow;
    font-weight: 700;
    font-size: 200px;
    color: #fff;
}
h2
{
    font-family: Barlow;
    color: #ffffff99;
}
h3
{
    font-family: Barlow;
    color: #ffffff50;
}
h6
{
    font-weight:normal;
    font-family: Barlow;
    font-size: medium;
    color: #ffffff50;
}
span
{
    font-family: Barlow;
    color: #ffffff50;
}
p
{
    font-family: Barlow;
    color: #ffffff70;
    font-size: large;
}

button
{
    border: #00000000;
    border-radius: 100px;
    padding: 7px;
    font-family: Barlow;
    font-size: 30px;
    font-weight: 500;
    padding-left: 20px;
    padding-right: 20px;

    background: linear-gradient(45deg, #e87d0d, #265787);
    background-size: 300%;
    background-position: 50% 50%;

    transition: all 0.5s;

    cursor: pointer;
    box-shadow: #e87e0d40 -10px 0px 30px, #26578750 10px 0px 30px;

    margin-left: 20px; margin-right: 20px;
}
button:hover
{
    background-size: 100%;
    background-position: 50% 50%;
    box-shadow: #e87e0d85 -30px 0px 65px, #265787 30px 0px 65px;
}
button.discord
{
    box-shadow: rgba(126, 137, 255, 0.4) -10px 0px 30px, rgba(27, 38, 159, 0.5) 10px 0px 30px; 
}
button.discord:hover
{
    background-size: 100%;
    background-position: 50% 50%;
    box-shadow: rgb(126, 136, 255) -30px 0px 65px, rgb(27, 38, 159) 30px 0px 65px;
}
button:disabled
{
    background: #535353;
    color: #000;
    box-shadow: none;
}
button.left:disabled
{
    background: #535353;
    color: #000;
    box-shadow: none;
}
button.right:disabled
{
    background: #535353;
    color: #000;
    box-shadow: none;
}
button.right:disabled:hover
{
    background: #3b3b3b;
    color: #000;
    box-shadow: none;
    cursor: no-drop;
}
button.left:disabled:hover
{
    background: #3b3b3b;
    color: #000;
    box-shadow: none;
    cursor: no-drop;
}
button.left
{
    background: linear-gradient(45deg, #e87d0d, #265787);
    background-size: 300%;
    background-position: 20% 50%;

    box-shadow: #e87e0d40 -20px 0px 40px, #26578710 5px 0px 30px;
}
button.left:hover
{
    background: linear-gradient(45deg, #e87d0d, #265787);
    background-size: 150%;
    background-position: 20% 50%;

    box-shadow: #e87e0d70 -40px 0px 40px, #26578770 20px 0px 30px;
    transform: none;
}

button.right
{
    background: linear-gradient(45deg, #e87d0d, #265787);
    background-size: 300%;
    background-position: 80% 50%;

    box-shadow: #e87e0d10 -5px 0px 40px, #26578740 20px 0px 30px;
}
button.right:hover
{
    background: linear-gradient(45deg, #e87d0d, #265787);
    background-size: 150%;
    background-position: 90% 50%;

    box-shadow: #e87e0d50 -20px 0px 30px, #26578790 40px 0px 40px;
    transform: none;
}

button.doc-button
{
    background: linear-gradient(180deg, #e87d0d, #265787);
    background-size: 1000% 1000%;
    background-position: 50% 70%;

    position: relative; left: 50%; translate: -50% 0;

    box-shadow: #e87e0d10 -5px 0px 40px, #26578740 20px 0px 30px;
    height: 30px;
    font-size: medium;
    padding: 5px;
    padding-left: 20px;
    padding-right: 20px;
}
button.doc-button:hover
{
    background: linear-gradient(180deg, #e87d0d, #265787);
    background-size: 300% 300%;
    background-position: 50% 70%;

    box-shadow: #26578750 0px -2px 30px, #e87e0d20 0px 6px 40px;
    transform: none;
}
button.button-shadow
{
    transition: all 200ms;
    box-shadow: #00000000 0px 0px 0px;
}
button.button-shadow:hover
{
    box-shadow: #00000050 5px 5px 0px;
}


.zoomable
{
    transition: all 0.2s;
    transform: scale3d(1, 1, 1) rotate3d(0, 0, 0, 0deg);
    z-index: -5;
    position: relative;
    cursor: pointer;
}
.zoomable:hover { z-index: 20; }
.left:hover
{
    z-index: 20;
    transform: scale3d(1.5, 1.5, 1.5) rotate3d(0, 1, 0, 30deg) translate3d(50px, 0, 0)
}
.right:hover
{
    z-index: 20;
    transform: scale3d(1.5, 1.5, 1.5) rotate3d(0, -1, 0, 30deg) translate3d(0px, 0, 0)
}
video.zoomable.right:hover
{
    transform: scale3d(2, 2, 2) rotate3d(0, -1, 0, 10deg) translate3d(0px, -50px, 0)
}
video.zoomable.left:hover
{
    transform: scale3d(2, 2, 2) rotate3d(0, 1, 0, 10deg) translate3d(0px, -50px, 0)
}

.clickable-text{color: #a8a8a8;}
.clickable-text:hover{color: #265787;}

:root
{
    --m-color-a: #aa410f;
    --m-color-b: #ac8ef6;
    --m-color-a-alpha: #aa410f50;
    --m-color-b-alpha: #ac8ef650;
}

#resource-wall
{
    background: linear-gradient(70deg, var(--m-color-a), var(--m-color-b));
    box-shadow: var(--m-color-a) 0 50px 300px;
    transition: all 0.1s;
}
.wall-button
{
    background: #00000000;
    box-shadow: none;
    transition: all 0.15s;
    filter: brightness(1);
}
.wall-button:hover
{
    box-shadow: #00000050 -5px 5px 0;
    filter: brightness(3);
}

.download-model
{
    box-shadow: var(--m-color-a-alpha) 0 0 40px;
    margin-top: 10px;
    margin-right: 10px;

    height: 65px;
    width: 65px;
    
    padding: 0;
    background: #00000000;

    transition: all 0.1s;
    scale: 0.95;
}
.download-model:hover
{
    box-shadow: var(--m-color-a) 0 0 100px;
    background: var(--m-color-b)
}
.download-model > svg{scale: 1.05; fill: #4f4f4f; filter: blur(0.3px);}
.download-model.loaded:hover{background: var(--m-color-a-alpha);}
.download-model.loaded > svg{scale: 1.05; fill: var(--m-color-b); filter: blur(0);}

.resource-button
{
    background: linear-gradient(45deg, var(--m-color-a), var(--m-color-b));
    box-shadow: var(--m-color-a-alpha) -10px 0px 50px, var(--m-color-b-alpha) 10px 0px 50px;
    transition: all 0.2s;
}
.resource-button:hover
{
    box-shadow: var(--m-color-a) -10px 0px 40px, var(--m-color-b) 10px 0px 40px;
}

input[type=range]
{
    margin-top: 10px;
    -webkit-appearance: none;
    height: 5px;
    background: #1f1f1f;
    outline: none;
    border-radius: 10px;
    -webkit-transition: .1s;
    transition: opacity .1s;  
}
input[type=range]::-webkit-slider-thumb
{
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    background: #e87e0d;
    cursor: pointer;
    outline: none;
    border: #00000000;
    border-radius: 100px;
}
input[type=range]::-moz-range-thumb
{
    width: 15px;
    height: 15px;
    background: #e87e0d;
    cursor: pointer;
    outline: none;
    border: #00000000;
    border-radius: 100px;
}

#resources-button
{
    background: #16a80c;
    box-shadow: none;
    margin-top: 50px;
    transition: all 200ms;
}
#resources-button:hover
{
    filter: drop-shadow(#16a80c90 0px 0px 15px) drop-shadow(#000000 7px 7px 0px);
}

/* 3D Text */
#huge-title
{
    animation-name: title-intro;
    animation-duration: 1.5s;
    color: #e87e0d;
    text-shadow: 0px 0px 0 rgb(209,103,0),-1px -1px 0 rgb(207,101,0),-2px -2px 0 rgb(204,98,0),-3px -3px 0 rgb(202,96,0),-4px -4px 0 rgb(199,93,0),-5px -5px 0 rgb(197,91,0),-6px -6px 0 rgb(194,88,0),-7px -7px 0 rgb(192,86,0),-8px -8px 0 rgb(189,83,0),-9px -9px 0 rgb(187,81,0),-10px -10px 0 rgb(184,78,0),-11px -11px 0 rgb(181,75,0),-12px -12px 0 rgb(179,73,0),-13px -13px 0 rgb(176,70,0),-14px -14px 0 rgb(174,68,0),-15px -15px 0 rgb(171,65,0),-16px -16px 0 rgb(169,63,0),-17px -17px 0 rgb(166,60,0),-18px -18px 0 rgb(164,58,0),-19px -19px 0 rgb(161,55,0),-20px -20px 0 rgb(158,52,0),-21px -21px 0 rgb(156,50,0),-22px -22px 0 rgb(153,47,0),-23px -23px 0 rgb(151,45,0),-24px -24px 0 rgb(148,42,0),-25px -25px 0 rgb(146,40,0),-26px -26px 0 rgb(143,37,0),-27px -27px 0 rgb(141,35,0),-28px -28px 0 rgb(138,32,0),-29px -29px 0 rgb(135,29,0),-30px -30px 0 rgb(133,27,0),-31px -31px 0 rgb(130,24,0),-32px -32px 0 rgb(128,22,0),-33px -33px 0 rgb(125,19,0),-34px -34px 0 rgb(123,17,0),-35px -35px 0 rgb(120,14,0),-36px -36px 0 rgb(118,12,0),-37px -37px 0 rgb(115,9,0),-38px -38px 0 rgb(113,7,0),-39px -39px 0 rgb(110,4,0),-40px -40px 0 rgb(107,1,0),-41px -41px 0 rgb(105,-1,0),-42px -42px 0 rgb(102,-4,0),-43px -43px 0 rgb(100,-6,0),-44px -44px 0 rgb(97,-9,0),-45px -45px 0 rgb(95,-11,0),-46px -46px 0 rgb(92,-14,0),-47px -47px 0 rgb(90,-16,0),-48px -48px 0 rgb(87,-19,0),-49px -49px 0 rgb(84,-22,0),-50px -50px 0 rgb(82,-24,0),-51px -51px 0 rgb(79,-27,0),-52px -52px 0 rgb(77,-29,0),-53px -53px 0 rgb(74,-32,0),-54px -54px 0 rgb(72,-34,0),-55px -55px 0 rgb(69,-37,0),-56px -56px 0 rgb(67,-39,0),-57px -57px 0 rgb(64,-42,0),-58px -58px 0 rgb(62,-44,0),-59px -59px 0 rgb(59,-47,0),-60px -60px 0 rgb(56,-50,0),-61px -61px 0 rgb(54,-52,0),-62px -62px 0 rgb(51,-55,0),-63px -63px 0 rgb(49,-57,0),-64px -64px 0 rgb(46,-60,0),-65px -65px 0 rgb(44,-62,0),-66px -66px 0 rgb(41,-65,0),-67px -67px 0 rgb(39,-67,0),-68px -68px 0 rgb(36,-70,0),-69px -69px 0 rgb(33,-73,0),-70px -70px 0 rgb(31,-75,0),-71px -71px 0 rgb(28,-78,0),-72px -72px 0 rgb(26,-80,0),-73px -73px 0 rgb(23,-83,0),-74px -74px 0 rgb(21,-85,0),-75px -75px 0 rgb(18,-88,0),-76px -76px 0 rgb(16,-90,0),-77px -77px 0 rgb(13,-93,0),-78px -78px 0 rgb(11,-95,0),-79px -79px 0 rgb(8,-98,0),-80px -80px 0 rgb(5,-101,0),-81px -81px 0 rgb(3,-103,0),-82px -82px 0 rgb(0,-106,0),-83px -83px 0 rgb(-2,-108,0),-84px -84px 0 rgb(-5,-111,0),-85px -85px 0 rgb(-7,-113,0),-86px -86px 0 rgb(-10,-116,0),-87px -87px 0 rgb(-12,-118,0),-88px -88px 0 rgb(-15,-121,0),-89px -89px 0 rgb(-18,-124,0),-90px -90px 0 rgb(-20,-126,0),-91px -91px 0 rgb(-23,-129,0),-92px -92px 0 rgb(-25,-131,0),-93px -93px 0 rgb(-28,-134,0),-94px -94px 0 rgb(-30,-136,0),-95px -95px 0 rgb(-33,-139,0),-96px -96px 0 rgb(-35,-141,0),-97px -97px 0 rgb(-38,-144,0),-98px -98px 0 rgb(-40,-146,0),-99px -99px 0 rgb(-43,-149,0),-100px -100px  0 rgb(-46,-152,0),-101px -101px 100px rgba(38,87,135,1),-101px -101px 1px rgba(38,87,135,0.5),0px 0px 100px rgba(38,87,135,.2);
}
#extrude-title
{
    animation-duration: 1.5s;
    color: #929bff;
    text-shadow: 0px 0px 0 rgb(86,99,240),1px 1px 0 rgb(84,97,238),2px 2px 0 rgb(81,94,235),3px 3px 0 rgb(79,92,233),4px 4px 0 rgb(77,90,231),5px 5px 0 rgb(75,88,229),6px 6px 0 rgb(73,86,227),7px 7px 0 rgb(71,84,225),8px 8px 0 rgb(68,81,222),9px 9px 0 rgb(66,79,220),10px 10px 0 rgb(64,77,218),11px 11px 0 rgb(62,75,216),12px 12px 0 rgb(60,73,214),13px 13px 0 rgb(58,71,212),14px 14px 0 rgb(55,68,209),15px 15px 0 rgb(53,66,207),16px 16px 0 rgb(51,64,205),17px 17px 0 rgb(49,62,203),18px 18px 0 rgb(47,60,201),19px 19px 0 rgb(45,58,199),20px 20px 0 rgb(42,55,196),21px 21px 0 rgb(40,53,194),22px 22px 0 rgb(38,51,192),23px 23px  0 rgb(36,49,190),24px 24px 23px rgba(0,0,0,0.6),24px 24px 1px rgba(0,0,0,0.5),0px 0px 23px rgba(0,0,0,.2);
}
#extrude-title-G
{
    animation-duration: 1.5s;
    color: #e87e0d;
    text-shadow: 0px 0px 0 rgb(227,123,11),1px -1px 0 rgb(225,121,9),2px -2px 0 rgb(222,118,6),3px -3px 0 rgb(220,116,4),4px -4px 0 rgb(217,113,1),5px -5px 0 rgb(215,111,0),6px -6px 0 rgb(212,108,0),7px -7px 0 rgb(210,106,0),8px -8px 0 rgb(207,103,0),9px -9px 0 rgb(205,101,0),10px -10px 0 rgb(202,98,0),11px -11px 0 rgb(200,96,0),12px -12px 0 rgb(197,93,0),13px -13px 0 rgb(195,91,0),14px -14px 0 rgb(192,88,0),15px -15px 0 rgb(190,86,0),16px -16px 0 rgb(187,83,0),17px -17px 0 rgb(185,81,0),18px -18px 0 rgb(182,78,0),19px -19px 0 rgb(180,76,0),20px -20px 0 rgb(177,73,0),21px -21px 0 rgb(175,71,0),22px -22px 0 rgb(172,68,0),23px -23px 0 rgb(170,66,0),24px -24px 0 rgb(167,63,0),25px -25px  0 rgb(164,60,0),26px -26px 25px rgba(0,0,0,0.6),26px -26px 1px rgba(0,0,0,0.5),0px 0px 25px rgba(0,0,0,.2);
}
#huge-title-o
{
    animation-duration: 1.5s;
    color: #e87e0d;
    text-shadow: 0px 0px 0 rgb(227,123,11),1px -1px 0 rgb(225,121,9),2px -2px 0 rgb(222,118,6),3px -3px 0 rgb(220,116,4),4px -4px 0 rgb(217,113,1),5px -5px 0 rgb(215,111,0),6px -6px 0 rgb(212,108,0),7px -7px 0 rgb(210,106,0),8px -8px 0 rgb(207,103,0),9px -9px 0 rgb(205,101,0),10px -10px 0 rgb(202,98,0),11px -11px 0 rgb(200,96,0),12px -12px 0 rgb(197,93,0),13px -13px 0 rgb(195,91,0),14px -14px 0 rgb(192,88,0),15px -15px 0 rgb(190,86,0),16px -16px 0 rgb(187,83,0),17px -17px 0 rgb(185,81,0),18px -18px 0 rgb(182,78,0),19px -19px 0 rgb(180,76,0),20px -20px 0 rgb(177,73,0),21px -21px 0 rgb(175,71,0),22px -22px 0 rgb(172,68,0),23px -23px 0 rgb(170,66,0),24px -24px 0 rgb(167,63,0),25px -25px  0 rgb(164,60,0),26px -26px 25px rgba(0,0,0,0.6),26px -26px 1px rgba(0,0,0,0.5),0px 0px 25px rgba(0,0,0,.2);
}
#extrude-title-green
{
    animation-duration: 1.5s;
    color: #23cf17;
    text-shadow: 0px 0px 0 rgb(31,203,19),1px -1px 0 rgb(28,200,16),2px -2px 0 rgb(24,196,12),3px -3px 0 rgb(21,193,9),4px -4px 0 rgb(17,189,5),5px -5px 0 rgb(13,185,1),6px -6px 0 rgb(10,182,0),7px -7px 0 rgb(6,178,0),8px -8px 0 rgb(3,175,0),9px -9px 0 rgb(-1,171,0),10px -10px 0 rgb(-5,167,0),11px -11px 0 rgb(-8,164,0),12px -12px 0 rgb(-12,160,0),13px -13px 0 rgb(-15,157,0),14px -14px 0 rgb(-19,153,0),15px -15px 0 rgb(-23,149,0),16px -16px 0 rgb(-26,146,0),17px -17px 0 rgb(-30,142,0),18px -18px 0 rgb(-33,139,0),19px -19px 0 rgb(-37,135,0),20px -20px 0 rgb(-41,131,0),21px -21px 0 rgb(-44,128,0),22px -22px 0 rgb(-48,124,0),23px -23px 0 rgb(-51,121,0),24px -24px 0 rgb(-55,117,0),25px -25px  0 rgb(-59,113,0),26px -26px 25px rgba(0,0,0,1),26px -26px 1px rgba(0,0,0,0.5),0px 0px 25px rgba(0,0,0,.2);
}
@keyframes title-intro
{
    0%
    {
        /* transform: translate(-1000px, -1000px); */
        text-shadow: 0px 0px 0 rgb(209,103,0),
             -.1px -.1px 0 rgb(207,101,0),
             -.2px -.2px 0 rgb(204,98,0),
             -.3px -.3px 0 rgb(202,96,0),
             -.4px -.4px 0 rgb(199,93,0),
             -.5px -.5px 0 rgb(197,91,0),
             -.6px -.6px 0 rgb(194,88,0),
             -.7px -.7px 0 rgb(192,86,0),
             -.8px -.8px 0 rgb(189,83,0),
             -.9px -.9px 0 rgb(187,81,0),
             -1px -1px 0 rgb(184,78,0),
             -1.1px -1.1px 0 rgb(181,75,0),
             -1.2px -1.2px 0 rgb(179,73,0),
             -1.3px -1.3px 0 rgb(176,70,0),
             -1.4px -1.4px 0 rgb(174,68,0),
             -1.5px -1.5px 0 rgb(171,65,0),
             -1.6px -1.6px 0 rgb(169,63,0),
             -1.7px -1.7px 0 rgb(166,60,0),
             -1.8px -1.8px 0 rgb(164,58,0),
             -1.9px -1.9px 0 rgb(161,55,0),
             -2px -2px 0 rgb(158,52,0),
             -2.1px -2.1px 0 rgb(156,50,0),
             -2.2px -2.2px 0 rgb(153,47,0),
             -2.3px -2.3px 0 rgb(151,45,0),
             -2.4px -2.4px 0 rgb(148,42,0),
             -2.5px -2.5px 0 rgb(146,40,0),
             -2.6px -2.6px 0 rgb(143,37,0),
             -2.7px -2.7px 0 rgb(141,35,0),
             -2.8px -2.8px 0 rgb(138,32,0),
             -2.9px -2.9px 0 rgb(135,29,0),
             -3px -3px 0 rgb(133,27,0),
             -3.1px -3.1px 0 rgb(130,24,0),
             -3.2px -3.2px 0 rgb(128,22,0),
             -3.3px -3.3px 0 rgb(125,19,0),
             -3.4px -3.4px 0 rgb(123,17,0),
             -3.5px -3.5px 0 rgb(120,14,0),
             -3.6px -3.6px 0 rgb(118,12,0),
             -3.7px -3.7px 0 rgb(115,9,0),
             -3.8px -3.8px 0 rgb(113,7,0),
             -3.9px -3.9px 0 rgb(110,4,0),
             -4px -4px 0 rgb(107,1,0),
             -4.1px -4.1px 0 rgb(105,-1,0),
             -4.2px -4.2px 0 rgb(102,-4,0),
             -4.3px -4.3px 0 rgb(100,-6,0),
             -4.4px -4.4px 0 rgb(97,-9,0),
             -4.5px -4.5px 0 rgb(95,-11,0),
             -4.6px -4.6px 0 rgb(92,-14,0),
             -4.7px -4.7px 0 rgb(90,-16,0),
             -4.8px -4.8px 0 rgb(87,-19,0),
             -4.9px -4.9px 0 rgb(84,-22,0),
             -5px -5px 0 rgb(82,-24,0),
             -5.1px -5.1px 0 rgb(79,-27,0),
             -5.2px -5.2px 0 rgb(77,-29,0),
             -5.3px -5.3px 0 rgb(74,-32,0),
             -5.4px -5.4px 0 rgb(72,-34,0),
             -5.5px -5.5px 0 rgb(69,-37,0),
             -5.6px -5.6px 0 rgb(67,-39,0),
             -5.7px -5.7px 0 rgb(64,-42,0),
             -5.8px -5.8px 0 rgb(62,-44,0),
             -5.9px -5.9px 0 rgb(59,-47,0),
             -6px -6px 0 rgb(56,-50,0),
             -6.1px -6.1px 0 rgb(54,-52,0),
             -6.2px -6.2px 0 rgb(51,-55,0),
             -6.3px -6.3px 0 rgb(49,-57,0),
             -6.4px -6.4px 0 rgb(46,-60,0),
             -6.5px -6.5px 0 rgb(44,-62,0),
             -6.6px -6.6px 0 rgb(41,-65,0),
             -6.7px -6.7px 0 rgb(39,-67,0),
             -6.8px -6.8px 0 rgb(36,-70,0),
             -6.9px -6.9px 0 rgb(33,-73,0),
             -7px -7px 0 rgb(31,-75,0),
             -7.1px -7.1px 0 rgb(28,-78,0),
             -7.2px -7.2px 0 rgb(26,-80,0),
             -7.3px -7.3px 0 rgb(23,-83,0),
             -7.4px -7.4px 0 rgb(21,-85,0),
             -7.5px -7.5px 0 rgb(18,-88,0)
    }
    100%
    {
        transform: translate(0px, 0px);
        text-shadow: 0px 0px 0 rgb(209,103,0),-1px -1px 0 rgb(207,101,0),-2px -2px 0 rgb(204,98,0),-3px -3px 0 rgb(202,96,0),-4px -4px 0 rgb(199,93,0),-5px -5px 0 rgb(197,91,0),-6px -6px 0 rgb(194,88,0),-7px -7px 0 rgb(192,86,0),-8px -8px 0 rgb(189,83,0),-9px -9px 0 rgb(187,81,0),-10px -10px 0 rgb(184,78,0),-11px -11px 0 rgb(181,75,0),-12px -12px 0 rgb(179,73,0),-13px -13px 0 rgb(176,70,0),-14px -14px 0 rgb(174,68,0),-15px -15px 0 rgb(171,65,0),-16px -16px 0 rgb(169,63,0),-17px -17px 0 rgb(166,60,0),-18px -18px 0 rgb(164,58,0),-19px -19px 0 rgb(161,55,0),-20px -20px 0 rgb(158,52,0),-21px -21px 0 rgb(156,50,0),-22px -22px 0 rgb(153,47,0),-23px -23px 0 rgb(151,45,0),-24px -24px 0 rgb(148,42,0),-25px -25px 0 rgb(146,40,0),-26px -26px 0 rgb(143,37,0),-27px -27px 0 rgb(141,35,0),-28px -28px 0 rgb(138,32,0),-29px -29px 0 rgb(135,29,0),-30px -30px 0 rgb(133,27,0),-31px -31px 0 rgb(130,24,0),-32px -32px 0 rgb(128,22,0),-33px -33px 0 rgb(125,19,0),-34px -34px 0 rgb(123,17,0),-35px -35px 0 rgb(120,14,0),-36px -36px 0 rgb(118,12,0),-37px -37px 0 rgb(115,9,0),-38px -38px 0 rgb(113,7,0),-39px -39px 0 rgb(110,4,0),-40px -40px 0 rgb(107,1,0),-41px -41px 0 rgb(105,-1,0),-42px -42px 0 rgb(102,-4,0),-43px -43px 0 rgb(100,-6,0),-44px -44px 0 rgb(97,-9,0),-45px -45px 0 rgb(95,-11,0),-46px -46px 0 rgb(92,-14,0),-47px -47px 0 rgb(90,-16,0),-48px -48px 0 rgb(87,-19,0),-49px -49px 0 rgb(84,-22,0),-50px -50px 0 rgb(82,-24,0),-51px -51px 0 rgb(79,-27,0),-52px -52px 0 rgb(77,-29,0),-53px -53px 0 rgb(74,-32,0),-54px -54px 0 rgb(72,-34,0),-55px -55px 0 rgb(69,-37,0),-56px -56px 0 rgb(67,-39,0),-57px -57px 0 rgb(64,-42,0),-58px -58px 0 rgb(62,-44,0),-59px -59px 0 rgb(59,-47,0),-60px -60px 0 rgb(56,-50,0),-61px -61px 0 rgb(54,-52,0),-62px -62px 0 rgb(51,-55,0),-63px -63px 0 rgb(49,-57,0),-64px -64px 0 rgb(46,-60,0),-65px -65px 0 rgb(44,-62,0),-66px -66px 0 rgb(41,-65,0),-67px -67px 0 rgb(39,-67,0),-68px -68px 0 rgb(36,-70,0),-69px -69px 0 rgb(33,-73,0),-70px -70px 0 rgb(31,-75,0),-71px -71px 0 rgb(28,-78,0),-72px -72px 0 rgb(26,-80,0),-73px -73px 0 rgb(23,-83,0),-74px -74px 0 rgb(21,-85,0),-75px -75px 0 rgb(18,-88,0),-76px -76px 0 rgb(16,-90,0),-77px -77px 0 rgb(13,-93,0),-78px -78px 0 rgb(11,-95,0),-79px -79px 0 rgb(8,-98,0),-80px -80px 0 rgb(5,-101,0),-81px -81px 0 rgb(3,-103,0),-82px -82px 0 rgb(0,-106,0),-83px -83px 0 rgb(-2,-108,0),-84px -84px 0 rgb(-5,-111,0),-85px -85px 0 rgb(-7,-113,0),-86px -86px 0 rgb(-10,-116,0),-87px -87px 0 rgb(-12,-118,0),-88px -88px 0 rgb(-15,-121,0),-89px -89px 0 rgb(-18,-124,0),-90px -90px 0 rgb(-20,-126,0),-91px -91px 0 rgb(-23,-129,0),-92px -92px 0 rgb(-25,-131,0),-93px -93px 0 rgb(-28,-134,0),-94px -94px 0 rgb(-30,-136,0),-95px -95px 0 rgb(-33,-139,0),-96px -96px 0 rgb(-35,-141,0),-97px -97px 0 rgb(-38,-144,0),-98px -98px 0 rgb(-40,-146,0),-99px -99px 0 rgb(-43,-149,0),-100px -100px  0 rgb(-46,-152,0),-101px -101px 100px rgba(38,87,135,1),-101px -101px 1px rgba(38,87,135,0.5),0px 0px 100px rgba(38,87,135,.2);
    }
}
@keyframes fade
{
    0%
    {
        opacity: 0;
    }
    60%
    {
        opacity: 0;
    }
    100%
    {
        opacity: 100;
    }
}
@keyframes invert-fade
{
    0%
    {
        background: #000000;
        pointer-events: all;
    }
    60%
    {
        background: #000000;
        pointer-events: all;
    }
    100%
    {
        background: #00000000;
        pointer-events: none;
    }
}
@keyframes comparison-A
{
    0%{opacity: 1;}
    25%{opacity: 1;}
    35%{opacity: 0;}
    95%{opacity: 0;}
    100%{opacity: 1;}
}
@keyframes comparison-B
{
    0%{opacity: 0;}
    25%{opacity: 0;}
    35%{opacity: 1;}
    60%{opacity: 1;}
    70%{opacity: 0;}
    100%{opacity: 0;}
}
@keyframes comparison-C
{
    0%{opacity: 0;}
    60%{opacity: 0;}
    70%{opacity: 1;}
    95%{opacity: 1;}
    100%{opacity: 0;}
}

/* Font */
.barlow-thin {
    font-family: "Barlow", sans-serif;
    font-weight: 100;
    font-style: normal;
}
.barlow-thin-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 100;
  font-style: italic;
}
.barlow-extralight {
  font-family: "Barlow", sans-serif;
  font-weight: 200;
  font-style: normal;
}
.barlow-extralight-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 200;
  font-style: italic;
}
.barlow-light {
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  font-style: normal;
}
.barlow-light-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  font-style: italic;
}
.barlow-regular {
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.barlow-regular-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  font-style: italic;
}
.barlow-medium {
  font-family: "Barlow", sans-serif;
  font-weight: 500;
  font-style: normal;
}
.barlow-medium-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 500;
  font-style: italic;
}
.barlow-semibold {
  font-family: "Barlow", sans-serif;
  font-weight: 600;
  font-style: normal;
}
.barlow-semibold-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 600;
  font-style: italic;
}
.barlow-bold {
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.barlow-bold-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-style: italic;
}
.barlow-extrabold {
  font-family: "Barlow", sans-serif;
  font-weight: 800;
  font-style: normal;
}
.barlow-extrabold-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 800;
  font-style: italic;
}
.barlow-black {
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-style: normal;
}
.barlow-black-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-style: italic;
}

@font-face {
    font-family: Alterna;
    src: url(./SpAlterna-Regular.otf);
}
@font-face {
    font-family: Splat-Bold;
    src: url(./BlitzBold.otf);
}