/* Extra large */
@media (max-width: 1200px) {
  .home .heart {
    transform: translateX(-50%) translateY(65px);
  }
}

/* Laptop */
@media (max-width: 992px) {
  html {
    font-size: 7%;
  }
  .simply-countdown > .simply-section {
    padding: 70px;
  }

  /* icon css */
  .home .heart {
    display: none;
  }

  .timeline::before {
    left: 60px;
  }

  .timeline li .timeline-image {
    left: 15px;
    margin-left: 45px;
    top: 16px;
  }

  .timeline li .timeline-panel {
    width: calc((100% - 200px));
    float: right;
  }

  .timeline li .timeline-panel::before {
    border-left-width: 0;
    border-right-width: 15px;
    left: -15px;
    right: auto;
  }

  .timeline li .timeline-panel::after {
    border-left-width: 0;
    border-right-width: 14px;
    left: -13px;
    right: auto;
  }
}

/* table */
@media (max-width: 768px) {
  html {
    font-size: 65%;
  }
  .simply-countdown > .simply-section {
    padding: 60px;
    margin: 5px;
  }

  .mynavbar .nav-link {
    font-style: italic;
    font-size: 2rem;
  }

  .sticky-top {
    overflow: hidden;
  }

  .timeline li .timeline-image {
    width: 140px;
    height: 140px;
  }
}

/* mobile phone */
@media (max-width: 576px) {
  html {
    font-size: 50%;
  }
  .simply-countdown > .simply-section {
    padding: 40px;
    margin: 2px;
  }

  .mynavbar .nav-link {
    font-style: italic;
    font-size: 2rem;
  }

  .timeline li .timeline-image {
    width: 80px;
    height: 80px;
  }

  .timeline li .timeline-panel {
    width: 65%;
    transform: translateX(-20px);
  }

  .timeline li .timeline-panel::before {
    top: 30px;
  }

  .timeline li .timeline-panel::after {
    top: 31px;
  }
}