/* (start) MODALS styles for modals */

.modal {
    --bs-modal-header-border-width: 0px !important;
}

.modal-body {
    padding: 0px !important;
}

.modal-content {
   border-radius: 20px !important;
}

.modal-header {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.modal-header .btn-close {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-right: 0px !important;
    padding-left: 0px !important;
    margin-top: 10px !important;
    margin-right: 10px !important;
    z-index: 3 !important;
}

.btn-close {
    opacity: 1 !important;
    color: #1f1f1f !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-right: 0px !important;
    padding-left: 0px !important;
}

/* (end) MODALS styles for modals */

/* (start) MODALS circle nav buttons on modal */

 .circles-nav-fixed-icon-modals {
    vertical-align: 0px !important;
  }

  /* Hide scrollbar for Chrome, Safari and Opera */

  .circles-nav-fixed-div-modals::-webkit-scrollbar {
      display: none;
  }

  /* Hide scrollbar for IE, Edge and Firefox */

  .circles-nav-fixed-div-modals {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }

  .circles-nav-fixed-div-modals {
      height: 100%;
      width: 100px;
      position: absolute !important;
      z-index: 1;
      top: 12% !important;
      right: 0;
      background-color: transparent;
      overflow-x: hidden;
      padding-top: 15px;
      padding-left: 30px !important;
      padding-right: 10px;
  }

  .circles-nav-fixed-div-modals a {
      display: block;
  }

  .circles-nav-fixed-circle-modals {
      background-color: var(--color1) !important;
      border-radius: 50%;
      padding: 18px;
      height: 60px;
      width: 60px;
      color: var(--color-black) !important;
      z-index: 3 !important;
      margin-bottom: 5px !important;
      box-shadow: rgba(0, 0, 0, 0.35) 0px 13px 27px -5px, rgba(0, 0, 0, 0.35) 0px 8px 16px -8px;
  }

  .circles-nav-fixed-icon-modals {
      font-size: 24px !important;
      color: var(--color-black) !important;
      line-height: normal !important;
      vertical-align: top !important; 
      text-align: center !important;
  }

  .circles-nav-fixed-icon-modals:hover {
    color: var(--color-white) !important;
  }

/* (end) MODALS circle nav buttons on modal */