#package-itinerary {
  margin-bottom: 20px;
}
.travel-package-itinerary .itinerary-day .itinerary-day-content > div ul {
  list-style: disc inside none;
}

.travel-package-itinerary .itinerary-day .itinerary-day-content > div ul li {
  display: list-item;
  font-weight: normal;
}
.travel-package-itinerary {
  .itinerary-day {
    border-left: dashed 1px $gray-border;
    padding: 0 0 30px 30px;
    clear: both;
    &:last-child {
      border-left: none;
      padding-bottom: 0;
    }
    .itinerary-day-icon {
      width: 25px;
      height: 25px;
      display: inline-block;
      background-color: $brand-primary;
      border-radius: 13px;
      position: relative;
      float: left;
      margin-left: -43px;
      svg, svg * {
        fill: #FFFFFF;
        width: 13px;
        height: 13px;
        margin: 6px;
      }
    }

    .itinerary-day-title {
      font-size: 14px;
      @include medium-weight;
      color: $brand-grey-dark;
      text-transform: uppercase;
      padding-top: 3px;
      padding-right: 25px;
      display: block;
      position: relative;
      @media (min-width: $grid-float-breakpoint) {
        font-size: 16px;
      }
    }

    .itinerary-day-viewer {
      position: absolute;
      top: 3px;
      right: 0;
      width: 100%;
      height: 100%;
      display: block;
      svg, svg * {
        fill: $brand-copy-light;
        width: 18px;
        height: 18px;
        position: absolute;
        top: 3px;
        right: 0;
      }
      &.collapsed {
        svg {
          transform: rotate(180deg);
        }
      }
    }

    .itinerary-day-content {
      font-size: 14px;
      @media (min-width: $screen-sm-min) {
        font-size: 16px;
      }
      font-weight: $roboto-light;
      color: $brand-grey-dark;
      margin-top: 10px;
      div {
        margin: 0 0 10.5px;
      }
      img {
        width: 100%;
        height: 125px;
        object-fit: cover;
        @media (min-width: $screen-sm-min) {
          height: 350px;
        }
        margin-bottom: 10px;
        border-radius: 8px;
      }
      .itinerary-day-note {
        background-color: $brand-secondary-light;
        padding: 10px;
        font-size: $font-size-base;
        display: inline-block;
        p {
          margin: 0;
        }
      }
      li {
        display: inline-block;
        font-size: $font-size-base;
        @media (min-width: $grid-float-breakpoint) {
          font-size: 16px;
        }
        @include medium-weight;
        color: $brand-grey-dark;
        margin-right: 15px;
        margin-bottom: 10px;
        span {
          font-weight: $roboto-light;
        }
        svg, svg * {
          fill: $brand-grey-dark;
          width: 20px;
          height: 20px;
          margin-right: 5px;
          margin-bottom: -5px;
        }
      }
    }
  }
}


/* Small devices (tablets, 768px and up) */
@media (min-width: $screen-sm-min) {

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: $screen-md-min) {

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: $screen-lg-min) {

}
