:root {
    --border: #2a2e39;
    --background: #131722;
    --background-secondary:#2c2c2c;
    --contrast-color: #eeeeee;
    --contrast-secondary:#4e4e4e;
    }

body{
    margin:0;
    background-color:var(--background);
}

body::-webkit-scrollbar {
    width: 12px;
  }
  
  body::-webkit-scrollbar-track {
    background: var(--background-secondary);
  }
  
  body::-webkit-scrollbar-thumb {
    background-color: var(--contrast-secondary);
    opacity:0.1;
    border-radius: 6px;
    border: 2px solid var(--background-secondary); /* Optional for padding */
  }

.navbar{
    display:grid;
    grid-template-columns:70px 120px 90px 90px auto 110px;
    gap:1px;
    background-color:var(--border);
    border-bottom:1px solid var(--border);   
}

@media screen and (max-width: 650px) {
    .navbar{
        grid-template-columns: 70px auto auto auto 0% auto;
    }
  }
.navbar a svg{
    display:block;
    fill: var(--contrast-color);
    margin-left:auto;
    margin-right:auto;
    margin-top:4px;
}
.navbar a, .navbar div{
    padding:5px 15px;
    line-height:2.5;
    color:var(--contrast-color);
    text-decoration:none;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    background-color:var(--background);
    text-align:center;
}
.blue-text{
    display:none;
}
#dashboard-content{
    display:grid;
    grid-template-columns: auto auto 20%;
}
#dashboard-content .tradingview-widget-container, #dashboard-lower .tradingview-widget-container{
    width:95% !important;
    margin-top:15px;
    margin-left:auto;
    margin-right:auto;
    height:29vh !important;
}
#dashboard-lower .tradingview-widget-container{
    height:400px !important;
}
@media screen and (min-width: 1500px) {
    #dashboard-content .tradingview-widget-container{
        height:50vh !important;
    }
  }
@media screen and (max-width: 450px) {
    .tradingview-widget-container{
        width:100% !important;
    }
}
/*----------------*/
#crypto-lower .tradingview-widget-container{
    height: 350px !important;
}
#crypto-lowerer .tradingview-widget-container{
    height: 300px !important;
}
#multiview-grid{
    width:98%;
    margin-left:1%;
    display:grid;
    grid-template-columns: auto auto auto;
    grid-template-rows: 300px 300px 300px;
}
#cryptogrid{
    width:97.5%;
    margin-left:1.25%;
    display:grid;
    grid-template-columns:50% 50%;
}
#crypto-lowerer{
    width:97.5%;
    margin-left:1.25%;
    display:grid;
    grid-template-columns:50% 50%;
}
#aboutcontent{
    color:white;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    text-align:center;
}