/* Penambahan Styling */

.datepicker {
  width: 100%;
}

.myNav > li > a {
  font-weight: 200 !important;
  font-size: 15px !important;
  color: #000 !important;
  text-transform: uppercase !important;
}

.myNav > li > ul > li > a {
  font-weight: 200 !important;
  font-size: 15px !important;
  color: #000 !important;
  text-transform: uppercase !important;
}

.myNav > li > ul > li > a:hover {
  background-color: rgb(212, 0, 42) !important;
  color: #fff !important;
}

.myNav > li + li {
  margin-left: 20px !important;
}

.btn-avis {
  background-color: rgb(212, 0, 42);
  color: #fff;
  padding: 1em 2em;
}

.btn-avis:hover {
  /* transform: translate(-5px, -5px); */
  color: #fff;
  background-color: rgb(177, 2, 37);
}

.btn-avis2 {
  background-color: rgb(236, 17, 61);
  color: #fff;
}

.btn-avis2:hover {
  transform: translate(-5px, -5px);
  color: #fff;
}

.btn-avis-black {
  background-color: rgb(0, 0, 0);
  color: #fff;
  padding: 1em 2em;
}

.btn-avis-black:hover {
  transform: translate(-5px, -5px);
  color: #fff;
}

.link-avis {
  color: rgb(212, 0, 42) !important;
}

.text-black {
  color: #000;
}

.text-up {
  text-transform: uppercase !important;
}

.sub-heading img {
  border: 3px solid #ed5505;
  padding: 0.3em;
  border-radius: 50%;
}

.mobile-nav__content .search-toggler {
  color: #000;
  font-weight: 400;
  padding: 20px;
  margin-bottom: 1em;
}

.top-mobile a {
  font-size: 14px;
}

.text-avis {
  font-weight: 200;
  line-height: 1.3;
}

.input-avis {
  border-bottom: 2px solid rgb(212, 0, 42) !important;
}

.breadcrumb {
  margin-bottom: 0;
}

.breadcrumb-item + .breadcrumb-item::before {
  content: var(--bs-breadcrumb-divider, ">") !important ;
}

.breadcrumb-item.active {
  color: rgb(212, 0, 42);
}

.jumbotron {
  background-color: var(--thm-black);
  position: relative;
}

.jumbotron img {
  position: absolute;
  bottom: -100px;
  right: 100px;
}

.jumbotron-title,
.jumbotron-subtitle {
  color: #fff;
}

.bg-alicelightblue {
  background-color: #ebf4ff;
}

.option-header {
  background-color: rgba(0, 0, 0, 0.6);
  position: sticky;
  top: 60px;
  left: 0;
  right: 0;
  z-index: 99;
  padding-left: 1em;
  padding-right: 1em;
}

.question {
  color: #150b5c;
  font-size: 20px;
}

.similar {
  color: #150b5c;
}

.text-expand {
  color: #000;
  /* font-weight: bold; */
}

.text-expand:hover {
  font-weight: normal;
}

.siteMapList a,
.siteMapList b {
  color: #000;
  font-size: 15px;
  text-decoration: underline;
}

.siteMapList a:hover {
  text-decoration: none;
}

.similarCarOpt li,
.siteMapList li {
  list-style: inside;
}

.similarCarOpt li a {
  color: #ed5505;
  text-decoration: underline;
}

.listNumber li {
  list-style-type: decimal;
}

.listInfo {
  background-color: #f8f8f8;
  border-radius: 25px;
}

.chooseRent a,
.yellow {
  color: #ed5505;
}

.chooseRent a:hover,
.yellow.link:hover {
  color: #ed9005;
}

.roadsideList li {
  border: 0 !important;
}

.rentType {
  color: #fff;
  font-size: 5rem;
}

.siteMapHeader {
  color: #fff;
  font-size: 2.5rem;
}

.support {
  color: #150b5c;
  font-size: 2.5rem;
}

.carsContainer {
  background-color: rgb(248, 248, 248);
}

.bg-findOut {
  background-color: rgb(241, 241, 241);
}

.linked {
  color: #ed5505;
  text-decoration: underline;
}
.linked:hover,
.card-link:hover .yellow {
  color: #ed9005;
}

.btnCar {
  background-color: #150b5c;
  color: #fff;
  padding: 1em 2em;
}

.btnCar:hover {
  transform: translate(-5px, -5px);
  color: #fff;
}

.expand {
  transform: rotate(-90deg);
}

.expand.active {
  transform: rotate(0deg);
}

.carSiteMap {
  position: absolute;
  left: 35%;
  bottom: -120px;
  width: 25em;
  z-index: 10;
}

.card-item {
  height: 320px;
  border-bottom: 4px solid rgb(204, 204, 204);
}

.card-item p {
  font-size: 15px;
}

.btn-upload {
  border: 1px solid rgb(215, 215, 215);
  background-image: linear-gradient(
    rgb(255, 255, 255) 0px,
    rgb(215, 215, 215) 100%
  );
}

@media screen and (max-width: 1199px) {
  .option-header {
    top: 90px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .roadsideList li,
  .roadsideList li:last-child {
    width: 33.3% !important;
  }
}

@media screen and (max-width: 991px) {
  .jumbotron .imgCar {
    width: 250px;
    text-align: center;
    bottom: -50px;
    right: 20%;
  }

  .jumbotron {
    height: 200px;
  }

  .rentType,
  .support,
  .siteMapHeader {
    font-size: 30px;
  }

  .carSiteMap {
    width: 15em;
    bottom: -80px;
  }
}

@media screen and (max-width: 575px) {
  .option-header {
    padding-left: 0.5em !important;
  }
}

@media screen and (max-width: 400px) {
  .carSiteMap {
    width: 10em;
    bottom: -50px;
  }
}

.email-link {
  color: #0000bf;
}
.email-link:hover {
  color: #0000ff;
}
