#crop-image-modal .button-item button {
  width: 100%;
  margin: 5px 0px;
}
#crop-image-modal .crop-image-header {
  justify-content: flex-end;
}
#crop-image-modal .crop-image-header .button-close-crop {
  margin-right: 20px;
}
#crop-image-modal .crop-image-header {
  background: #f4f4f4;
}
@media only screen and (max-width: 768px) {
  #crop-image-modal .crop-action {
    width: 100%;
  }
  #crop-image-modal .crop-area {
    min-height: 350px;
  }
  #crop-image-modal .crop-preview {
    height: 350px;
    width: 100% !important;
    min-height: initial;
  }
  #crop-image-modal #rotate-slider {
    width: 100%;
  }
}
@media only screen and (max-width: 576px) {
  .image-container > .action {
    display: block;
    right: 0px;
    top: 44px;
  }
  #crop-image-modal .crop-action {
    width: 100%;
  }
  #crop-image-modal .crop-area {
    min-height: 150px !important;
  }
  #crop-image-modal .crop-preview {
    height: 250px;
    width: 100% !important;
    min-height: initial;
  }
  #crop-image-modal #rotate-slider {
    width: 100%;
  }
  #crop-image-modal .action-buttons-group .button-item {
    padding-right: 5px;
    padding-left: 5px;
  }
  .button-delete-folder {
    margin-left: 0 !important;
  }
  #crop-image-modal input[type=range] {
    -webkit-appearance: none;
    background: transparent;
  }
  #crop-image-modal input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    background: #fff;
    height: 18px;
    width: 18px;
    margin-top: -8px;
    border-radius: 99px;
    border: 0.5px solid #686868;
  }
  #crop-image-modal input[type=range]::-webkit-slider-runnable-track {
    width: 300px;
    height: 4px;
    background: #ddd;
    border: 0.5px solid #686868;
  }
}