@font-face {
    font-family: 'fantom';
    src: url('../fonts/fantom.woff2') format('woff2'),
         url('../fonts/fantom.woff2') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'big_shoulders';
    src: url('../fonts/big_shoulders.woff2') format('woff2'),
         url('../fonts/big_shoulders.woff2') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'odudo';
    src: url('../fonts/odudo/OdudoMono-Regular.woff2') format('woff2'),
         url('../fonts/odudo/OdudoMono-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'odudo_light';
    src: url('../fonts/odudo/OdudoMono-Light.woff2') format('woff2'),
         url('../fonts/odudo/OdudoMono-Light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'odudo_bold';
    src: url('../fonts/odudo/OdudoMono-Bold.woff2') format('woff2'),
         url('../fonts/odudo/OdudoMono-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'odudo_semibold';
    src: url('../fonts/odudo/OdudoMono-SemiBold.woff2') format('woff2'),
         url('../fonts/odudo/OdudoMono-SemiBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'barlow_semi';
    src: url('../fonts/barlow_semi.woff2') format('woff2'),
         url('../fonts/barlow_semi.woff2') format('woff');
    font-weight: normal;
    font-style: normal;
}


.skinny_scrollbar {
}

.skinny_scrollbar::-webkit-scrollbar {
    width: 8px;  /* Width of the scrollbar */
}

.skinny_scrollbar::-webkit-scrollbar-track {
    background: #222; /* Track background */
}

.skinny_scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.1); /* Scrollbar color */
    border-radius: 8px; /* Rounded corners */
}

.skinny_scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4); /* Color on hover */
}

.padding_scrollbar {
}

.padding_scrollbar::-webkit-scrollbar {
    width: 10px;  /* Width of the scrollbar */
}

.padding_scrollbar::-webkit-scrollbar-track {
    background: #222; /* Track background */
}

.padding_scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.1); /* Scrollbar color */
    border-radius: 10px; /* Rounded corners */
}

.padding_scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4); /* Color on hover */
}