body
{
    background-color: #191A3F;
}

*
{
    color: aliceblue;
    font-family: 'Inconsolata', monospace;
}


.main-loader
{
    background-color: #11122B;
    width: 100%;
    height: 100%;

    top: 0; 
    left: 0; 
    position: fixed;
    z-index: 1001;

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;

    animation: loading_animation 0.8s forwards;
    animation-delay: 0.35s;
}

@keyframes loading_animation
{
    from { opacity: 100%; }
    to { opacity: 0%; }
}

.main-nav {
    background-color: #191A3F;
    border-bottom: 2px solid #202251;
    width: 100vw;
    height: 68px;

    top: 0;
    left: 0;
    position: fixed;

    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 0 20px;
    box-sizing: border-box;
    z-index: 1000;
}

.nav-left, .nav-center, .nav-right {
    display: flex;
    align-items: center;
}

.nav-left {
    flex: 1;
}

.nav-center {
    justify-content: center;
    background-color: #141530;
    border: 1px solid #202251;
    width: 80px;
    height: 45px;

    border-radius: 6px;
    margin-right: 5%;
}

.nav-right {
    flex: 1;
    justify-content: flex-end;
    gap: 10px;
}

.nav-btn {
    width: 42px;
    height: 45px;

    background-color: #1F214F;
    border: 1px solid #282a5f;
    border-radius: 5px;

    display: flex;
    justify-content: center;
    align-items: center;
}

.side-btn {
    width: 62px;
    height: 45px;

    background-color: #1F214F;
    border: 1px solid #282a5f;
    border-radius: 5px;

    display: flex;
    justify-content: center;
    align-items: center;
}


.main-container
{
    background-color: #11122B;
    width: 100vw;
    height: calc(150vh - 68px - 68px);

    top: 68px; 
    left: 0;
    position: absolute;

    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    overflow: scroll;
}

.main-container * 
{
    z-index: 5;
}

.container-banner
{
    margin-top: 3%;
   
    width: 90%;
    height: 180px;
    border-radius: 6px;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.main-sidebar
{
    background-color: #191A3F;
    border-top: 2px solid #202251;
    width: calc(100vw);
    height: 68px;

    top: calc(100% - 68px); 
    left: 0;
    position: fixed;

    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}
.divider {
    width: 90%;
    height: 3px;

    margin-top: 5%;
    margin-bottom: 3%;

    background: linear-gradient(to right, rgba(40, 42, 95, 0) 0%, #282a5f 25%, #282a5f 50%, #282a5f 75%, rgba(40, 42, 95, 0) 100%);
    border-radius: 3px;
}

.betting-list
{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5%;
}