@media screen and (max-width: 500px) {
/* Navbar */
    .topnav-right a {
        float: none;
    }
    .column{
        width:100%;
    }
    .flip-column{
        width:100%;
    }
    div.content {margin-left: 0;}
    
    img{
      width: auto;
      height: auto;
      position: relative;
    }
    .responsive {
      width: auto;
      height: auto;
      }
}

@media screen and (max-width: 700px) {
  .sidebar {
    width: 100%;
    height: auto;
    position: relative;
  }
  .sidebar a {float: left;}
  
  div.content {margin-left: 0;}
  
  img{
    width: auto;
    height: auto;
    position: relative;
    }
    .responsive {
      width: auto;
      height: auto;
      }
}

/* On screens that are less than 400px, display the bar vertically, instead of horizontally */
@media screen and (max-width: 400px) {
  .sidebar a {
    text-align: center;
    float: none;
  }
  .column{
      width:100%;
  }
  .flip-column{
      width:100%;
  }
  
  div.content {margin-left: 0;}
  
  img{
    width: auto;
    height: auto;
    position: relative;
    }
    .responsive {
      width: auto;
      height: auto;
      }
}