@media (max-width: 650px) {          /*---------------MOBILEs-----------------*/


#Python{
    display: block;
}

.Sidebar{
  display: none;
}



.navbar{
    display: block;
}


.navbar .logo{
    width: 10rem;
}

.navbar ul{
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.navbar ul li{
    padding-bottom: 1rem;
}

.navbar ul li a{
    font-size: 1rem;
    color: #000000;
}

.navbar ul li a img{
    width: 1.2rem;
    margin-right: 0.5rem;
}

.navbar .logout-btn{
    font-size: 1rem;
    background-color: transparent;
    border: none;
}

.navbar .logout-btn img{
    width: 1rem;
    margin-right: 0.5rem;
}


.Middle{
    width: 100%;
    border-right: 2px solid transparent;
    min-height: auto;
    padding-top: 1.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

.Middle h1{
 font-size: 1.4rem;
    padding-left: 2.5rem;
}


.Middle h1 img{
  width: 2rem;
  height: 2rem;
  top: 0rem;
}


.Middle  .main-p{
    padding-left: 2.5rem;
    margin-top: -0.2rem;
    font-size: 0.7rem;
}


.Middle .current-div{
    padding: 0.5rem 1rem;
    border-radius: 0.4rem;
}


.Middle .current-div p{
  font-size: 0.6rem;
}

.Middle .current-div h2{
    font-size: 0.8rem;
    margin-top: -0.8rem;
}


.Middle .current-div button{
    width: 2rem;
    height: 2rem;
    margin-top: -2.1rem;
    border-radius: 0.5rem;
}

.Middle .current-div button img{
    width: 0.8rem;

}

.Middle .green-div{
    margin-top: 2rem;
    border-radius: 0.4rem;
    padding: 1rem 1.5rem;
}

.Middle .green-div p{
font-size: 0.6rem;
}

.Middle .green-div h2{
    font-size: 1rem;
    margin-top: -0.8rem;
}

.Middle .green-div img{
    width: 100%;
    margin-top: 1.5rem;
}

.Middle .white-div{
    border-radius: 0.4rem;
    margin-top: 2rem;
    padding: 1.5rem 1.5rem;
}

.Middle .white-div p{
font-size: 0.6rem;
}

.Middle .white-div h2{
    font-size: 1rem;
    margin-top: -0.8rem;
}


.Middle .white-div img{
    margin-top: 1.5rem;
}


.Middle .grey-div{
    padding: 1.5rem 1.5rem;
    margin-top: 0.3rem;
    border-radius: 0.4rem;
}

.Middle .grey-div p{
font-size: 0.6rem;
}

.Middle .grey-div h2{
    font-size: 1rem;
    margin-top: -0.8rem;
}


.Middle .grey-div img{
    width: 100%;
}


.Middle .transp-div{
    padding: 1.5rem 1.5rem;
    margin-top: 0.5rem;
    border-radius: 0.4rem;
}

.Middle .transp-div p{
font-size: 0.6rem;
}

.Middle .transp-div h2{
    font-size: 1rem;
    margin-top: -0.8rem;
}


.Middle .transp-div img{
    width: 9rem;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
}

.Middle .table-div h2{
    font-size: 1.2rem;
}

.Middle #pills-tab .nav-item a{
    font-size: 0.8rem;
    padding: 0rem;
    border-radius: 0rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.Middle .table thead th{
    font-size: 0.8rem;
}


.Middle .table tbody td{
    font-size: 0.8rem;
    padding: 0.2rem;

}

.Right{
    padding: 1.5rem 1rem 1.5rem 1rem;
    width: 100%;
    min-height: auto;
}


.Right .icon-btn{
 width: 2.5rem;
 height: 2.5rem;
 margin-right: 0.3rem;
}

.Right .icon-btn img{
    width: 1rem;
}


.Right .profile-btn{
    height: 2.5rem;
    font-size: 0.8rem;
    padding: 0.5rem 2rem 0.5rem 0.5rem;
    border-radius: 1.5rem;
}


.Right .profile-btn .profile-img{
    width: 2rem;
    height: 2rem;
    margin-right: 0.5rem;
    margin-top: -0.2rem;
}


.Right .top-p{
    font-size: 0.7rem;
    margin-top: 3rem;
}

.Right .grey-div{
    padding: 0.5rem 1rem;
    border-radius: 0.4rem;
    margin-bottom: 1rem;
}

.Right .grey-div h2{
    font-size: 0.9rem;
}


.Right .grey-div h3{
    font-size: 1rem;
    margin-top: -2rem;
}

.Right .tree-1{
 width: 80%;
}

.Right hr{
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.Right h4{
    font-size: 1.1rem;
}

.Right .tree-2{
 width: 80%;
 margin-top: 1rem;
}

.Right .announcement-div{
    padding: 1rem;
    margin-top: 2rem;
    border-radius: 0.4rem 0.4rem 0.4rem 0.4rem;
}

.Right .announcement-div h2{
    font-size: 1rem;
}

.Right .announcement-div p{
    font-size: 0.6rem;
}

.Right .announcement-div .gift{
    margin-top: 0rem;
}





 }




  @media (max-width: 900px)  /*-----------TABLETS--------------*/
  and (min-width: 700px){
   
  



  }







  @media (max-width: 1300px)  /*-----------13/10 inch laptop--------------*/
  and (min-width: 900px){
   
  



  }






  @media (max-width: 1930px)  /*-----------23/24 inch laptop--------------*/
  and (min-width: 1820px){



  }