.animate-slider {
  animation: addOnslide 0.4s cubic-bezier(0.42, 0, 0.58, 1); }

@keyframes addOnslide {
  from {
    opacity: 0;
    transform: translateX(20%); }
  to {
    opacity: 1;
    transform: translateX(0); } }

.first, .cancel-appointment-inner {
  animation: addOnslideTop 0.5s cubic-bezier(0.42, 0, 0.58, 1) forwards; }

@keyframes addOnslideTop {
  0% {
    opacity: 0;
    transform: translateY(20%); }
  100% {
    opacity: 1;
    transform: translateY(0); } }

@keyframes addOnslideOut {
  from {
    opacity: 1;
    transform: translateX(0%); }
  to {
    opacity: 0;
    transform: translateX(-20%); } }

.slide-out-animation {
  animation: addOnslideOut 0.4s cubic-bezier(0.42, 0, 0.58, 1) forwards; }

.signature-canvas {
  border: solid 1.5px #dadddf; }

.hidden {
  display: none; }

.dollar-sign {
  font-weight: bold; }

.second_image {
  max-height: 230px; }

.ulist {
  list-style-type: none;
  padding: 0;
  margin: 3% auto;
  display: flex;
  justify-content: center; }

/* Style for the li items */
.lilist {
  width: 10px;
  height: 11px;
  margin-right: 10px;
  background-color: #80808082;
  border-radius: 20px; }

/* Style for the black li item */
.black {
  background-color: black; }

.underline-text {
  text-decoration: underline; }

.cross-btn {
  height: 30px; }

.cross-div {
  display: flex;
  justify-content: flex-end;
  padding: 12px 12px 0 0; }

.margin-remove {
  margin-bottom: 0 !important; }

.mobile-cancel-popup {
  -ms-overflow-style: none;
  scrollbar-width: none; }

.mobile-cancel-popup::-webkit-scrollbar {
  display: none; }

.vendor_add_on_popup, .appointment-cancel-popup {
  position: fixed;
  z-index: 99;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  background-color: rgba(0, 0, 0, 0.6); }
  .vendor_add_on_popup .add_on_body, .appointment-cancel-popup .add_on_body {
    width: 42%;
    margin: 1% auto;
    background-color: white;
    border-radius: 20px; }
    @media (max-width: 767px) {
      .vendor_add_on_popup .add_on_body, .appointment-cancel-popup .add_on_body {
        width: 92%;
        margin: 70px auto; } }
    .vendor_add_on_popup .add_on_body .popup_sections, .appointment-cancel-popup .add_on_body .popup_sections {
      display: flex;
      flex-direction: column;
      padding: 10px 10px 25px 10px;
      width: 90%;
      margin: 0 auto; }
      @media (max-width: 767px) {
        .vendor_add_on_popup .add_on_body .popup_sections, .appointment-cancel-popup .add_on_body .popup_sections {
          padding: 15px 10px 30px 10px;
          width: 92%; } }
      .vendor_add_on_popup .add_on_body .popup_sections .popup_image, .appointment-cancel-popup .add_on_body .popup_sections .popup_image {
        display: flex;
        justify-content: center;
        margin-bottom: 10px;
        background: #8080801c;
        padding: 10px;
        border-radius: 20px; }
      .vendor_add_on_popup .add_on_body .popup_sections .heading-popup, .appointment-cancel-popup .add_on_body .popup_sections .heading-popup {
        font-family: ProximaNova;
        font-size: 38px;
        color: #f9a631;
        font-weight: bold;
        text-align: center;
        margin-bottom: 10px; }
        @media (max-width: 767px) {
          .vendor_add_on_popup .add_on_body .popup_sections .heading-popup, .appointment-cancel-popup .add_on_body .popup_sections .heading-popup {
            line-height: 1.18; } }
        @media (max-width: 414px) {
          .vendor_add_on_popup .add_on_body .popup_sections .heading-popup, .appointment-cancel-popup .add_on_body .popup_sections .heading-popup {
            font-size: 22px; } }
        @media (max-width: 375px) {
          .vendor_add_on_popup .add_on_body .popup_sections .heading-popup, .appointment-cancel-popup .add_on_body .popup_sections .heading-popup {
            font-size: 20px; } }
        .vendor_add_on_popup .add_on_body .popup_sections .heading-popup .homeowner_name, .vendor_add_on_popup .add_on_body .popup_sections .heading-popup .price_change, .appointment-cancel-popup .add_on_body .popup_sections .heading-popup .homeowner_name, .appointment-cancel-popup .add_on_body .popup_sections .heading-popup .price_change {
          color: #33b82f; }
      .vendor_add_on_popup .add_on_body .popup_sections .information, .appointment-cancel-popup .add_on_body .popup_sections .information {
        text-align: center;
        font-family: ProximaNova;
        font-size: 25px;
        color: #373737;
        margin-bottom: 20px; }
        @media (max-width: 767px) {
          .vendor_add_on_popup .add_on_body .popup_sections .information, .appointment-cancel-popup .add_on_body .popup_sections .information {
            line-height: 1.38; } }
        @media (max-width: 414px) {
          .vendor_add_on_popup .add_on_body .popup_sections .information, .appointment-cancel-popup .add_on_body .popup_sections .information {
            font-size: 21px; } }
        @media (max-width: 375px) {
          .vendor_add_on_popup .add_on_body .popup_sections .information, .appointment-cancel-popup .add_on_body .popup_sections .information {
            font-size: 20px; } }
        @media (max-width: 360px) {
          .vendor_add_on_popup .add_on_body .popup_sections .information, .appointment-cancel-popup .add_on_body .popup_sections .information {
            font-size: 19px; } }
        .vendor_add_on_popup .add_on_body .popup_sections .information .homeowner_name, .vendor_add_on_popup .add_on_body .popup_sections .information .price_change, .appointment-cancel-popup .add_on_body .popup_sections .information .homeowner_name, .appointment-cancel-popup .add_on_body .popup_sections .information .price_change {
          font-weight: bold; }
      .vendor_add_on_popup .add_on_body .popup_sections .information-3, .appointment-cancel-popup .add_on_body .popup_sections .information-3 {
        text-align: center;
        font-family: ProximaNova;
        font-size: 22px;
        color: #373737;
        margin-bottom: 20px; }
        @media (max-width: 767px) {
          .vendor_add_on_popup .add_on_body .popup_sections .information-3, .appointment-cancel-popup .add_on_body .popup_sections .information-3 {
            line-height: 1.38; } }
        @media (max-width: 414px) {
          .vendor_add_on_popup .add_on_body .popup_sections .information-3, .appointment-cancel-popup .add_on_body .popup_sections .information-3 {
            font-size: 18px; } }
        @media (max-width: 375px) {
          .vendor_add_on_popup .add_on_body .popup_sections .information-3, .appointment-cancel-popup .add_on_body .popup_sections .information-3 {
            font-size: 17px; } }
        @media (max-width: 360px) {
          .vendor_add_on_popup .add_on_body .popup_sections .information-3, .appointment-cancel-popup .add_on_body .popup_sections .information-3 {
            font-size: 16px; } }
        .vendor_add_on_popup .add_on_body .popup_sections .information-3 .homeowner_name, .vendor_add_on_popup .add_on_body .popup_sections .information-3 .price_change, .appointment-cancel-popup .add_on_body .popup_sections .information-3 .homeowner_name, .appointment-cancel-popup .add_on_body .popup_sections .information-3 .price_change {
          font-weight: bold; }
      .vendor_add_on_popup .add_on_body .popup_sections .popup_box, .appointment-cancel-popup .add_on_body .popup_sections .popup_box {
        border: solid 1.5px #dadddf;
        width: 100%;
        padding: 20px 5px 0px 5px;
        margin-bottom: 30px; }
        .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_heading, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_heading {
          font-family: ProximaNova;
          font-size: 19px;
          font-weight: bold;
          color: #373737;
          text-align: center;
          margin-bottom: 20px; }
          @media (max-width: 767px) {
            .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_heading, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_heading {
              width: 90%;
              margin: 0 auto;
              margin-bottom: 10px;
              line-height: 1.17; } }
          @media (max-width: 414px) {
            .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_heading, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_heading {
              font-size: 17px;
              margin-bottom: 15px; } }
          @media (max-width: 375px) {
            .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_heading, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_heading {
              font-size: 16px; } }
        .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item {
          cursor: pointer;
          display: flex;
          margin-bottom: 5px; }
          .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item .item_image, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item .item_image {
            width: 15%;
            text-align: center; }
            @media (max-width: 767px) {
              .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item .item_image, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item .item_image {
                width: 20%;
                position: relative;
                top: 5px; } }
            @media (max-width: 414px) {
              .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item .item_image, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item .item_image {
                width: 19%; } }
            @media (max-width: 360px) {
              .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item .item_image, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item .item_image {
                top: 0; } }
            @media (max-width: 360px) {
              .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item .item_image img, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item .item_image img {
                width: 22px; } }
          .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item p, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item p {
            width: 80%;
            color: #373737;
            font-size: 19px;
            line-height: normal; }
            @media (max-width: 767px) {
              .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item p, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item p {
                width: 74%; } }
            @media (max-width: 414px) {
              .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item p, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item p {
                font-size: 18px; } }
            @media (max-width: 375px) {
              .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item p, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item p {
                font-size: 16px; } }
            .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item p .bold_text, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item p .bold_text {
              font-weight: bold; }
          .vendor_add_on_popup .add_on_body .popup_sections .popup_box .box_item .green_text, .appointment-cancel-popup .add_on_body .popup_sections .popup_box .box_item .green_text {
            color: #33b82f; }
      .vendor_add_on_popup .add_on_body .popup_sections .popup_button, .appointment-cancel-popup .add_on_body .popup_sections .popup_button {
        text-align: center;
        margin-bottom: 5px; }
        .vendor_add_on_popup .add_on_body .popup_sections .popup_button button, .appointment-cancel-popup .add_on_body .popup_sections .popup_button button {
          border-radius: 29.6px;
          background-color: #00a3e7;
          border: none;
          color: white;
          font-size: 20px;
          font-weight: bold;
          height: 62px;
          width: 64%; }
          @media (max-width: 1024px) {
            .vendor_add_on_popup .add_on_body .popup_sections .popup_button button, .appointment-cancel-popup .add_on_body .popup_sections .popup_button button {
              width: 68%; } }
          @media (max-width: 767px) {
            .vendor_add_on_popup .add_on_body .popup_sections .popup_button button, .appointment-cancel-popup .add_on_body .popup_sections .popup_button button {
              width: 96%; } }
          @media (max-width: 414px) {
            .vendor_add_on_popup .add_on_body .popup_sections .popup_button button, .appointment-cancel-popup .add_on_body .popup_sections .popup_button button {
              font-size: 19px; } }
          @media (max-width: 375px) {
            .vendor_add_on_popup .add_on_body .popup_sections .popup_button button, .appointment-cancel-popup .add_on_body .popup_sections .popup_button button {
              font-size: 17px;
              height: 56px; } }
          @media (max-width: 360px) {
            .vendor_add_on_popup .add_on_body .popup_sections .popup_button button, .appointment-cancel-popup .add_on_body .popup_sections .popup_button button {
              font-size: 16px;
              height: 52px; } }
      .vendor_add_on_popup .add_on_body .popup_sections .go_back, .appointment-cancel-popup .add_on_body .popup_sections .go_back {
        font-family: ProximaNova;
        font-size: 20px;
        font-weight: bold;
        color: #00a3e7;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 10px; }
        @media (max-width: 375px) {
          .vendor_add_on_popup .add_on_body .popup_sections .go_back, .appointment-cancel-popup .add_on_body .popup_sections .go_back {
            font-size: 19px; } }
        @media (max-width: 360px) {
          .vendor_add_on_popup .add_on_body .popup_sections .go_back, .appointment-cancel-popup .add_on_body .popup_sections .go_back {
            font-size: 18px; } }
        .vendor_add_on_popup .add_on_body .popup_sections .go_back img, .appointment-cancel-popup .add_on_body .popup_sections .go_back img {
          padding-right: 7px;
          padding-bottom: 2px; }
      .vendor_add_on_popup .add_on_body .popup_sections .error_message, .appointment-cancel-popup .add_on_body .popup_sections .error_message {
        font-family: ProximaNova;
        font-size: 18px;
        line-height: 1.33;
        text-align: center;
        color: #ff5b5b; }
        @media (max-width: 375px) {
          .vendor_add_on_popup .add_on_body .popup_sections .error_message, .appointment-cancel-popup .add_on_body .popup_sections .error_message {
            font-size: 17px; } }
        @media (max-width: 360px) {
          .vendor_add_on_popup .add_on_body .popup_sections .error_message, .appointment-cancel-popup .add_on_body .popup_sections .error_message {
            font-size: 16px; } }