@media (min-width: 1601px){
    .grid-container{
        display: grid !important;
        grid-template-columns: 59% 20% 20% !important;
        gap: 8px;
    }
    .history-container {
        display: grid;
        grid-template-columns: 13% 87%;
    }
}
@media (min-width: 1301px) and (max-width: 1600px){
    .grid-container{
        display: grid !important;
        grid-template-columns: 51% 24% 24% !important;
        gap: 8px;
    }
    .history-container {
        display: grid;
        grid-template-columns: 16% 84%;
    }
}
@media screen and (max-width: 1300px) {
    .menu-right-grp svg{
        width: 18px !important;
    }
    .right-menu li a{
        font-size: 14px !important;
    }
    .menu .nav-item .nav-link{
        padding-right: 10px !important;
    }
   .menu-scanner svg{
        width: 150px !important;
    }
    .grid-container{
        display: grid !important;
        grid-template-columns: 51% 24% 24% !important;
        gap: 8px;
    }
    .grid-container1 {
        display: grid;
        grid-template-columns: 75% 24% !important;
        gap: 10px;
    }
    .market-container {
        display: grid;
        grid-template-columns: 32% 32% 32%;
        gap: 20px;
    }
    .history-container {
        display: grid;
        grid-template-columns: 20% 80%;
    }
}
@media screen and (max-width: 1199px) {
    
    .menu .dropdown-content a h5{
        font-size: 14px !important;
    }
    .menu-asset-grp{
        left: 0px !important;
    }
    
    .menu-prfl-grp{
        left: 0px !important;
        padding: 0 !important;
    }
    #scanner-content{
        left: 0px !important;
    }
    .favorite-grp tbody{
        height: 248px;
    }
    .metric-container {
        display: grid;
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 30px;
    }
    .metric-container.zenxbot{
        display: grid;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 30px;
    }
}
@media screen and (max-width: 767px) {
    .favorite-grp {
        width: 390px;
    }
    .favorite-grp.fav-show{
        width: 100% !important;
        max-width: 550px;
        left: 10px !important;
    }
    .favorite-grp{
        & svg{
            width: 10px;
        }
        .table > :not(caption) > * > *{
            font-size: 11px !important;
        }
    }
    .nft-au-dtls div,
    .nft-menu-list li{
        display: inline-block !important;
    }
    .nft-all-detials{
        margin-top: 200px;
    }
    .nft-au-dtls div{
        margin: 10px;
    }
    .history-container {
        display: block;
        & .commoncard{
            height: auto !important;
        }
    }
}

@media screen and (max-width: 991px) {
    .login_form {
        width: 90%; /* Adjusts the width for smaller screens */
        height: auto; /* Allows the height to adjust based on content */
        padding: 15px;
      }
    .grid-container{
        grid-template-columns: 48% 25% 25% !important;
        & .fs-20{
            font-size: 18px;
        }
        .table > :not(caption) > * > *{
            font-size: 12px !important;
        }
    }
    .grid-container1 {
        display: grid;
        grid-template-columns: 74% 25% !important;
        gap: 10px;
    }
}
@media (min-width: 768px) and (max-width: 991px){
    /* .grid-container{
        display: grid !important;
        grid-template-columns: 65%  33%!important;
        grid-template-rows: 41%;
        gap: 8px;  
        & .column1{
            grid-column: span 1;
            height: max-content;
            & .tradingview-container{
                height: 400px;
            }
        }
        & .column2{
            grid-row: 2;
            display: flex;
            gap: 10px;
            height: max-content;
            .commoncard{
                width: 50%;
                height: max-content;
            }
        }
        & .column3{
            grid-row: 1;
            grid-column: 2;
        }
        .table > :not(caption) > * > *{
            font-size: 11px !important;
        }
    } */
    .grid-container{
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px;  
        & .column1{
            grid-column: span 2;
        }
        & .column2{
            grid-row: 2;
            grid-column: span 1;
        }
        & .column3{
            grid-row: 2;
            grid-column: span 1;
        }
        .table > :not(caption) > * > *{
            font-size: 11px !important;
        }
    }
    .market-container{
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px;
    }
    .metric-container{
        display: grid;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px;
    }
    .history-container {
        display: grid;
        grid-template-columns: 22% 78%;
    }
}
@media (max-width: 767px){
    .titlecard{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        margin: 10px 0;
    }
    .grid-container{
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px;  
        & .column1{
            grid-column: span 2;
        }
        & .column2{
            grid-row: 2;
            grid-column: span 1;
        }
        & .column3{
            grid-row: 2;
            grid-column: span 1;
        }
        .table > :not(caption) > * > *{
            font-size: 11px !important;
        }
    }
    .wallet-gridcontainer,.market-container,.metric-container{
        display: block !important;
    }
}
@media (max-width: 600px){
    .grid-container{
        display: block !important;
        & .column2{
          display: block !important;
          & .commoncard{
            width: 100%;
          }
        }
    }

    .grid-container1{
        display: block !important;
    }
    .amount-text{
        font-size: 12px !important;
    }
    .cdk-overlay-pane.mat-mdc-dialog-panel{
        margin: 10px !important;
    }
    .coinimg{
        width: 30px;
    }
}

@media (max-width:576px){
    .mt-200{
        margin-top: 0px !important;
    }
}
