.modal {
  width: 100%;
  height: 70%;
  display: block;

  &-dialog {
    z-index: 1000;
    margin: 0;
    width: 100%;
    height: 100%;
    background: #77d5ed;
    overflow-y: initial;
  }

  &-content {
    height: 100%;
    border-radius: 0;
    border: 0;
    background: #77d5ed;
    color: #333333;
  }
}

@media only screen and (min-width : 768px) {

  .modal {
    width: 400px;
    height: 100%;

    &-dialog {
      position: fixed;
      left: 0;
      top: 0;
      z-index: 10000;
      margin: 0;
      width: 400px;
      height: 100%;
    }

    &-content {
      border-radius: 0;
      border: 0;
      height: 100%;
      background: #77d5ed;
      color: #333333;
    }


  }
}

.single-unit-modal {

  &__box {
    background: #fff;
    margin: 10px 0 10px 0;
    padding: 10px;
  }
}

Add separate sass file for modal styles
Add separate sass file for modal styles
