
body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  font-size: 16px;
  line-height: 1.4;
  color: #777777;
  font-family: "Roboto", sans-serif;
  -webkit-font-smoothing: antialiased;
}

nav {
  display: grid;
  grid: 1fr / auto-flow auto;
  box-shadow: 0 2px 4px 0 #e9e9eb;
}

a {
  -webkit-tap-highlight-color: transparent;
  display: grid;
  grid: 1fr / 34px auto 34px;
  align-items: center;
  border: 1px solid #b5b5b9;
  border-width: 1px 0;
  text-decoration: none;
  background: #f6f6f7;
}

a:first-child {
  border-radius: 4px 0 0 4px;
  border-width: 1px 0 1px 1px;
  grid: 1fr / auto 34px;
}

a:last-child {
  border-radius: 0 4px 4px 0;
  border-width: 1px 1px 1px 0;
  grid: 1fr / 34px auto;
}

a:not(:first-child):before,
a:not(:last-child):after {
  display: block;
  border: 34px solid transparent;
  border-right-width: 0;
  content: "";
}

a:not(:first-child):before {
  border-left-color: #b5b5b9;
}

a:not(:last-child):after {
  transform: translateX(33px);
  border-left-color: #f6f6f7;
}

span {

  line-height: 1.2rem;
  color: #b5b5b9;
}

span:first-line {
  color: #b5b5b9;
  font-weight: 700;
  font-size: 0.85rem;
}

.current {
  background: #0a58ca;
}

.current span {
  color: #ffffff;
}

.current span:first-line {
  color: white;
}

.current:not(:first-child):before {
  border-left-color: #0a58ca;
}

.current:not(:last-child):after {
  border-left-color: #0a58ca;
}

.current + a:not(:first-child):before {
  border-left-color: #0a58ca;
}

a:not(.current):hover span,
.done span {
  color: #5b5b61;
}

a:not(.current):hover span:first-line,
.done span:first-line {
  color: #1d1d1f;
}

a:not(.current):hover {
  background: #e9e9eb;
}

a:not(.current):hover:not(:last-child):after,
a:not(.current):hover:not(:first-child):before {
  border-left-color: #e9e9eb;
}

a:not(.current):hover + a:not(.current):not(:first-child):before {
  border-left-color: #e9e9eb;
}

.current + a:not(.current):hover:not(:first-child):before {
  border-left-color: #5b5b61;
}

.slider-banner {
  position: relative;
}

.form-select {

  display: block;
  width: 100%;
  padding: .240rem 2.25rem .240rem .75rem;
  -moz-padding-start: calc(0.75rem - 3px);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #ffffff;
  background-color: #0a58ca;
  background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 16px 12px;
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: .375rem;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.form-control {
  color: #000 !important;
}

.form-control::placeholder {
  opacity: 1;
  color: #000;
}

.form-select-white {

  display: block;
  width: 100%;
  padding: .240rem 2.25rem .240rem .75rem;
  -moz-padding-start: calc(0.75rem - 3px);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.7;
  color: #000;
  background-color: #FFFFFF;
  background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 16px 12px;
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: .375rem;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  height: 38px;
}

.form-label {
  margin-bottom: 0px !important;
  font-size: 0.875rem !important;
  font-weight: 700;
  color: #000000 !important;
  padding-left: 8px !important;
}

.form-control:focus {
  color: var(--bs-body-color);
  background-color: #ffffff !important;
  border-color: #ebeaea !important;
  outline: 0;
  box-shadow: 0 0 0 0rem rgba(13, 110, 253, .25) !important;
}

.carousel-caption {
  position: absolute;
  right: 55%;
  bottom: 17.25rem;
  left: 15%;
  text-shadow: 4px 4px #000000;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  color: #fff;
  text-align: center;
}

.tab-form {
  position: absolute;
  top: 392px;
  left: 50%;
  transform: translateX(-50%);
  background: white;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  width: 100%;
  max-width: 1082px;
  z-index: 9990;
}

@media screen and (max-width: 767px) {
  .tab-form {
    top: 39% !important;
  }

  @media screen and (max-width: 480px) {
    .tab-form {
      top: 39% !important;
    }
  }
}

.quantity-2 button, .quantity button {
  background-color: #0d6efd;
  color: #fff;
  border: none;
  cursor: pointer;
  font-size: 16px;
  width: 30px;
  height: auto;
  text-align: center;
  transition: background-color 0.2s;
}

.form-group.optionss {
  margin-bottom: 10px;
  position: relative;
  background-color: #dfdfdf;
  padding: 8px;
  padding-left: 20px;
  font-weight: bold;
  text-align: left;
}

.quantity-2 button:hover, .quantity button:hover {
  background-color: #0d6efd;
}

.input-box2, .input-box {
  width: 40px;
  text-align: center;
  border: none;
  padding: 8px 10px;
  font-size: 16px;
  outline: none;
}

/* Hide the number input spin buttons */
.input-box2::-webkit-inner-spin-button,
.input-box2::-webkit-outer-spin-button,
.input-box::-webkit-inner-spin-button,
.input-box::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.input-box2[type="number"], .input-box[type="number"] {
  -moz-appearance: textfield;
}

.position-chan {
  float: right;
}
