:root {
    --c-red: #FF130A;
    --c-purple: #715596;
    --c-green: #09A800;
    --c-gray: #B6B5A0;
    --c-yellow: #EED600;
    --c-blue: #22B3BD;
}


.bg-red {background-color: var(--c-red);}
.bg-purple {background-color: var(--c-purple);}
.bg-green {background-color: var(--c-green);}
.bg-gray {background-color: var(--c-gray);}
.bg-yellow {background-color: var(--c-yellow);}
.bg-blue {background-color: var(--c-blue);}
.bg-black {background-color :black;}

.c-red {color: var(--c-red) !important;}
.c-purple {color: var(--c-purple) !important;}
.c-green {color: var(--c-green) !important;}
.c-gray {color: var(--c-gray) !important;}
.c-yellow {color: var(--c-yellow) !important;}
.c-blue {color: var(--c-blue) !important;}
.c-white {color: white !important;}
.c-black {color: black !important;}

.s-yellow {-webkit-text-stroke: 2px var(--c-yellow);}
@media only screen and (min-width: 1024px) {
    .s-yellow {-webkit-text-stroke: 3px var(--c-yellow);}
}

/* 
ELEMENT
*/
.anchor {
    position: absolute;
    left: 0;
    top: -3.5rem;
    height: 0;
    width: 0;
}

/* 
TITLE
*/
.title.t-street {
    display: block;
    width: fit-content;
    line-height: 82% !important;
}
.title.t-street.t-small {padding: .05em .07em;}
.title.t-street.t-body,
.title.t-street.t-medium {padding: .05em;}
.title.t-street.t-large {padding: .05em .05em;}
.title.t-street.t-xlarge {padding: .03em .05em;}

.title.t-serif.t-body {padding: .1em .3em;}

@media only screen and (min-width: 1024px) {
    .title.t-street.t-small {padding: .05em .07em;}
    .title.t-street.t-body {padding: .02em .05em;}
    .title.t-street.t-medium {padding: .025em .03em;}
    .title.t-street.t-large {padding: .05em}
    .title.t-street.t-xlarge {padding: .0175em .02em;}
}

/* 
BUTTON
*/
.button-street {
    width: fit-content;
    height: fit-content;
    padding: .22em .1em;
    border-radius: 6px;
    line-height: 82% !important;
}

.button-street.t-xsmall,
.button-street.t-small {padding: .1em .075em;}

.button-small {
    width: fit-content;
    height: fit-content;
    padding: .25rem .5rem;
    border-radius: 6px;
}



/* 
ANIMATION
*/
@keyframes fall {
    0% { opacity: 1;
         transform: translateY(-100vh);}
    to {opacity: 1;
        transform: translateY(100vh);}
}

@keyframes fall-small {
    0% { opacity: 1;
         transform: translateY(-100%);}
    to {opacity: 1;
        transform: translateY(200vh);}
}

/* 
GENERIC
*/
.hide {display: none;}
.hide-scrollbar::-webkit-scrollbar {display: none;}
.hide-scrollbar {-ms-overflow-style: none;scrollbar-width: none;}

.hide-m {display: none;}
.hide-m_t {display: none;}
.hide-m_d {display: none;}
@media only screen and (min-width: 768px) {
    .hide-t {display: none;}
    .hide-t_d {display: none;}
    .hide-m {display: unset;}
    .hide-m_d {display: unset;}
}
@media only screen and (min-width: 1024px) {
    .hide-d {display: none;}
    .hide-m_d {display: none;}
    .hide-m_t {display: unset;}
}
.stop {overflow: hidden;}


@media only screen and (min-width: 768px) {}
@media only screen and (min-width: 1024px) {}
@media (hover: hover) {}