/* Summary Page */
@media (max-width: 1000px) {
    .summary-div {
      justify-content: flex-start;
    }
  }
  
  @media (max-width: 716px) {
    .summary-top {
      font-size: 30px;
    }
  
    .summary-top span {
      font-size: 41px;
    }
  
    .task-box-deadline {
      width: 566px;
    }
  
    .task-box {
      width: 166px;
      height: 166px;
    }
  
    .task-box-to-do {
      width: 166px;
      height: 166px;
    }
  
    .date-and-upcoming-deadline span {
      font-size: 27px !important;
    }
  
    .summary-bottom span {
      font-size: 19px;
    }
  }
  
  @media (max-width: 657px) {
    .task-box-deadline {
      width: 453px;
      height: 150px;
    }
  
    .task-box-to-do {
      width: 453px;
      height: 106px;
      flex-direction: row;
    }
  
    .biggerTask {
      margin-left: 5rem;
    }
  
    .date-and-upcoming-deadline span {
      font-size: 21px !important;
    }
  
    .task-box {
      width: 131px;
      height: 124px;
    }
  
    .summary-bottom span {
      font-size: 17px;
    }
  
    .welcome-user-message {
      padding-bottom: 92rem;
      padding-top: 130rem;
      animation: fadeInFromBottom 1s ease-in-out;
      animation-fill-mode: forwards;
    }
  }
  
  @media (max-width: 516px) {
    .summary-top {
      font-size: 30px;
    }
  
    .summary-top span {
      font-size: 41px;
    }
  
    .welcome-user-message {
      padding-bottom: 92rem;
      padding-top: 120rem;
      animation: fadeInFromBottom 1s ease-in-out;
      animation-fill-mode: forwards;
    }
  
    .task-box-deadline-left {
      padding-right: 16px;
    }
  
    .date-and-upcoming-deadline {
      padding-left: 16px;
    }
  
    .task-box-deadline {
      width: 398px;
      height: 150px;
    }
  
    .task-box-to-do {
      width: 398px;
      height: 106px;
    }
  
    .task-box {
      width: 144px;
      height: 134px;
      margin: 17.5px;
      margin-left: 18px;
      margin-right: 18px;
    }
  }
  
  @media (max-width: 440px) {
    .summary-top {
      font-size: 30px;
    }
    
    .summary-top span {
      font-size: 41px;
    }
  
    .task-box-deadline {
      width: 398px;
      height: 142px;
    }

    .task-box {
      width: 144px;
      height: 134px;
      margin: 17.5px;
      margin-left: 18px;
      margin-right: 18px;
    }
  }
  
  @media (max-width: 431px) {
    .task-box {
      width: 142px;
      height: 131px;
      margin: 13.5px;
    }

    .task-box-to-do {
      width: 313px;
      height: 101px;
    }

    .task-box-deadline {
      width: 313px;
    }

    .date-and-upcoming-deadline span {
      font-size: 17px !important;
    }

    .biggerTask {
      margin-left: 4rem;
    }

    .task-number {
      margin-left: 18px;
    }

    .task-picture-and-count {
      margin-left: 5px;
    }
  }