@media screen and (max-width: 720px) {
  body {
    flex-direction: column;
  }

  #left {
    width: 100%;
    margin-bottom: 10px;
  }

  #controls_container {
    width: 100%;
    max-width: 100%;
  }

  #colors {
    width: 80vw;
    justify-content: center;
    flex-direction: column;
    align-items: center;
  }

  .stack_container {
    width: 80vw;
  }

  .stack_input {
    width: 100px;
  }

  .color_input {
    width: 100%;
  }

  #color {
    margin-bottom: 10px;
  }

  .color_text {
    width: 80vw;
  }

  #download_container {
    width: 80vw;
    margin-bottom: 10px;
  }

  #download {
    width: 50%;
  }

  #file_format {
    width: 50%;
  }

  input {
    width: 80vw;
  }

  #size {
    width: 80vw;
  }

  #search {
    width: calc(80vw - 10px);
    order: 100;
    margin-bottom: 10px;
  }

  #right {
    width: 100%;
    justify-content: center;
    max-height: calc(100vh - 60px);
    -webkit-overflow-scrolling: touch;
  }

  .underline:before {
    -webkit-transition-property: none !important;
    transition-property: none !important;
    height: 0px;
  }

  .hover {
    -webkit-transform: none !important;
    transform: none !important;
  }

  .icon:hover > i,
  .icon:focus > i,
  .icon:active > i {
    -webkit-animation-name: none !important;
    animation-name: none !important;
  }
}
