@media (max-width: 361px) {

    .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 80%;
        position: fixed;
      
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }

  .dashboard-content{
    margin-left: 0;
  }


}
@media (min-width: 361px) and (max-width:376px) {
      .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 80%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }
    
  .dashboard-content{
    margin-left: 0;
  }

}

@media (min-width: 376px) and (max-width:391px) {
      .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 80%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }
    
    
  .dashboard-content{
    margin-left: 0;
  }

}

@media (min-width: 391px) and (max-width:394px) {
     .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 80%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }

    
  .dashboard-content{
    margin-left: 0;
  }

}



@media (min-width: 394px) and (max-width:413px) {
      .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 80%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }
    
  .dashboard-content{
    margin-left: 0;
  }

}

@media (min-width: 413px) and (max-width:415px) {
     .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 80%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }

   
  .dashboard-content{
    margin-left: 0;
  }



}

@media (min-width: 415px) and (max-width:481px) {
    .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 80%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }

    
  .dashboard-content{
    margin-left: 0;
  }



}

@media (min-width: 481px) and (max-width:541px) {
       .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 80%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }

    
  .dashboard-content{
    margin-left: 0;
  }

}

@media (min-width: 541px) and (max-width:769px) {
       .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 50%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }

    
  .dashboard-content{
    margin-left: 0;
  }



}

@media (min-width: 769px) and (max-width:821px) {
      .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 50%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }
    
  .dashboard-content{
    margin-left: 0;
  }


}

@media (min-width: 821px) and (max-width:913px) {
         .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 50%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }
    
  .dashboard-content{
    margin-left: 0;
  }


    }

    @media (min-width:913px) and (max-width: 992px) {
      .side_nav {
        display: none;
        background-color: #F0F5F9;
        width: 50%;
        position: fixed;
    }


    #Menu-bar {
        display: block;
        position: fixed;
        z-index: 200;
    }
     
     
  .dashboard-content{
    margin-left: 0;
  }


}

/* For large devices (laptops/desktops) */
@media (min-width: 992px) and (max-width: 1025px) {
  .side_nav {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 251px;
    z-index: 100;
    transition: all 0.5s ease;
}
.reseller-card {
    background-color: #D9D9D9;
    border: none;
    width: 90%;
}
  .dashboard-content{
    margin-left: 0;
  }

}

/* For extra-large devices (large desktops) */
@media (min-width: 1025px) {
 .side_nav {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    /* width: 207px; */
    z-index: 100;
    transition: all 0.5s ease;
}

}