/* Fonts */

.font-bold {
  font-family: "Poppins", sans-serif;

  font-weight: 700;
}

* {
  /*  transition: all 0.5s ease-in-out;*/

  font-weight: 400;

  font-size: 1rem;

  color: #000;
}

body {
  font-family: "Poppins", sans-serif !important;
}

/* Top Header */

.navbar-toggler {
  outline: none;

  border: none;
}

.top-header {
  background-image: url(../images/hero-image-bg.jpg);

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  min-height: 779px;
}

.navbar-toggler {
  background-color: #fff;
}

.nav-item {
  padding-left: 40px;

  font-family: "Roboto", sans-serif;
}

.para {
  font-size: 0.9rem;
}

.mob-display {
  display: none;
}

@media (max-width: 992.98px) {
  .mob-display {
    display: block;
  }

  .nav-item {
    padding-left: 0px;
  }

  .mobile-none {
    display: none;
  }

  .padding-3 {
    padding-top: 0px !important;
  }

  .mobile-padding {
    padding: 0 15% !important;
  }
}

.form-btn {
  display: block;

  width: 100%;

  padding: 0.375rem 0.75rem;

  font-size: 1rem;

  line-height: 1.5;

  color: #495057;

  background-color: #fff;

  background-clip: padding-box;

  border: 1px solid #ced4da;

  border-radius: 0.25rem;

  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

  background-color: #fff;

  width: 100%;

  padding: 12px;

  color: #000;
}

.btn-signin {
  border: 1px solid #fff;

  border-radius: 5px;

  padding: 5px 20px !important;
}

.black-btn {
  border: 1px solid lightgray;

  border-radius: 5px;

  padding: 5px 20px !important;
}

.btn-signin:hover {
  background: rgba(245, 245, 245, 0.3);
}

.input-icon {
  position: absolute;

  left: 18px;

  top: 14px;
}

.padding-4 {
  padding-left: 38px !important;
}

input:focus {
  outline: none !important;
}

.form-control {
  border: none;

  padding: 10px;

  border-radius: 5px;
}

.fa-search {
  color: gray;
}

.input-container {
  background-color: #fff;
}

.text-gray {
  color: gray !important;
}

.align-center {
  position: absolute;

  transform: translate(80%, 40%);
}

.btn-search {
  background-color: #fac917;

  border: 0;

  padding: 10px 40px;

  color: #fff;

  border-radius: 5px;
}

.position-relative {
  position: relative;
}

/* Review Section */

.margin-top-100 {
  margin-top: -200px;
}

.material-icons {
  color: #fac917;
}

@media (max-width: 390px) {
  .material-icons {
    font-size: 1.1rem;

    color: #fac917;
  }

  .p-size p {
    padding-top: 2px;

    font-size: 0.9rem;
  }
}

.cards {
  background-color: #fff;

  box-shadow: 0px 8px 40px #18181829;
}

.cards p {
  font-size: 0.9rem;

  margin: 0;
}

.circle-image {
  position: absolute;

  top: -30px;

  left: 50%;

  transform: translate(-50%, 0%);
}

/* Ranks */

.ranks {
  background-color: #f7f7f7;
}

.btn-yellow {
  background-color: #fac917;

  width: 100% !important;

  padding: 12px;

  border: none;

  color: #fff;

  border-radius: 5px;
}

.text-yellow {
  color: #fac917 !important;

  text-decoration: underline;

  float: right;

  font-size: 0.9rem;
}

.yellow {
  color: #fac917 !important;
}

.btn-yellow:hover {
  color: #fff;

  text-decoration: none;
}

.dropdown-menu {
  border: 1px solid gray;
}

.dropdown-menu.show {
  display: block;

  width: 100% !important;
}

.dropdown-menu a:hover {
  text-decoration: none;

  color: gray;
}

.dropdown ul li {
  border-bottom: 1px solid gray;

  padding-bottom: 7px;

  margin-bottom: 8px;
}

.btn-white {
  background-color: #fff;

  width: 100%;

  padding: 12px;

  color: #000;
}

.btn-white:hover {
  color: #000;

  text-decoration: none;
}

/* Help Section */

.help {
  background-color: #fac917;
}

.btn-review {
  border: 1px solid #fff;

  padding: 10px 40px;

  color: #fff;
}

.btn-review:hover {
  color: gray;

  text-decoration: none;
}

/* Taxi Box */

.yellow-lable {
  background-color: #fac917;

  width: 100%;
}

.box {
  background-color: #fff;

  padding-bottom: 40px;

  margin-bottom: 1rem;

  box-shadow: 0px 8px 40px #18181829;
}

.modal-content {
  box-shadow: 0px 8px 40px #18181829;
}

.links {
  text-decoration: underline;

  color: #fac917;
}

.modal-content {
  max-height: 1000px;

  overflow-y: scroll;
}

@media (max-width: 992px) {
  .yellow-lable {
    background-color: #fac917;

    width: 50%;
  }

  .mobile-none {
    display: none;
  }

  .top-header {
    min-height: 590px;

    padding-bottom: 30px;
  }
}

@media (min-width: 992px) {
  .desktop-none {
    display: none;
  }
}

@media (min-width: 768px) {
  .disktop-view {
    display: none;
  }
}

@media (max-width: 768px) {
  .mobile-view {
    display: none;
  }
}

/*-- Footer ---*/

footer {
  background-color: whitesmoke;
}

/*---- Login Page ----*/

.black {
  color: #000 !important;
}

.side-bg-login {
  background: url(../images/login-image.png) no-repeat center;

  background-size: cover;

  height: 650px;
}

.side-bg {
  background: url(../images/Sing-Up.png) no-repeat center;

  background-size: cover;

  height: 770px;
}

.y-center {
  padding-top: 150px;
}

.y1-center {
  padding-top: 150px;
}

@media (max-width: 992.98px) {
  .side-bg {
    height: 550px !important;
  }

  .side-bg-login {
    height: 550px !important;
  }

  .y1-center {
    padding-top: 50px;
  }
}

.form-text {
  background-color: #fff !important;

  padding: 12px;

  width: 100%;

  border: none;

  border: 1px solid lightgray;
}

.login-text {
  font-weight: 700;

  font-size: 2.4rem;

  color: #fac917;
}

.login-heading h1 {
  font-weight: 700;
}

.yellow-text {
  color: #fac917 !important;

  text-decoration: underline;

  font-size: 0.9rem;

  font-weight: bold;
}

.login-heading {
  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);
}

@media (max-width: 992px) {
  .mob-padd-2 {
    padding-top: 15px;
  }

  .nav-item a {
    color: #000 !important;
  }

  .navbar {
    background-color: white !important;
  }

  .login-heading {
    position: absolute;

    top: 50%;

    left: 30%;

    transform: translate(-25%, -50%);
  }
}

@media (max-width: 425.98px) {
  .login-heading h1 {
    font-size: 1.8rem;
  }

  .login-heading p {
    font-size: 0.9rem;
  }

  .side-bg {
    height: 450px !important;
  }

  .side-bg-login {
    height: 450px !important;
  }

  .login-heading {
    position: absolute;

    top: 60%;

    left: 30%;

    transform: translate(-25%, -50%);
  }
}

/* User Page */

.img-user {
  width: 40px;

  height: 40px;

  border-bottom-right-radius: 6px;

  border-bottom-left-radius: 6px;

  border-top-right-radius: 6px;
}

.border-y {
  border-bottom: 3px solid rgba(250, 201, 23, 1);
}

.bg-blue {
  padding: 10px 20px !important;

  background-color: rgba(250, 201, 23, 1) !important;
}

.circle1 {
  position: relative;

  border-radius: 100%;

  height: 250px;

  width: 250px;

  overflow: hidden;
}

.user-img {
  height: 250px;

  width: 250px;
}

.camera-icon {
  width: 30px;

  height: 25px;

  cursor: pointer;
}

#photo {
  display: none;
}

.hover-effect {
  position: absolute;

  background-color: rgba(250, 201, 23, 0.6);

  width: 250px;

  height: 80px;

  bottom: 0;

  display: none;
}

.circle1:hover .hover-effect {
  display: block;
}

.yellow-btn {
  padding: 14px 80px;

  background-color: rgba(250, 201, 23, 1);

  border: none;

  border-radius: 5px;

  color: #fff;
}

.user-review {
  border-left: 1px solid lightgray;
}

.border-bottom {
  border-bottom: 1px solid lightgray;
}

.btn-y {
  padding: 10px 30px;

  background-color: rgba(250, 201, 23, 1);

  border: none;

  border-radius: 5px;

  color: #fff;
}

@media (max-width: 991.98px) {
  .center-md {
    max-width: 360px;
  }
}

/* Scroll Bar */

/*

::-webkit-scrollbar {

width: 20px;

}





::-webkit-scrollbar-track {

box-shadow: inset 0 0 5px grey; 

border-radius: 10px;

}





::-webkit-scrollbar-thumb {

background: rgba(250, 201, 23, 1); 

border-radius: 10px;

}





::-webkit-scrollbar-thumb:hover {

background: rgba(250, 201, 23, 1); 

}

*/

/*------------Review page ---------------*/

.search-icon {
  width: 30px;

  position: absolute;

  top: 53%;

  left: 2%;

  transform: translate(0, -50%);
}

.form-field {
  background-color: lightgray;

  border: none;

  padding: 10px;

  width: 100%;

  padding-left: 45px;
}

.search-btn {
  background-color: #fac917;

  border: 0;

  padding: 10px;

  width: 100%;

  color: #fff;

  border-radius: 5px;
}

.circle-yellow {
  font-size: 2rem;

  padding: 8px 22px;

  border-radius: 50%;

  background-color: #fac917;

  color: #fff;
  cursor: pointer;
}

.size-f {
  min-height: 350px;

  border: 1px solid lightgray;
}

.center {
  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -30%);
}

.cards1 {
  background-color: #fff;
}

.color {
  color: #fac917;

  font-weight: bold;
}

.text-a {
  width: 100%;
}

.modal-text-area {
  position: relative;
  z-index: 1000000000;
  margin: 0.5rem;
}

.modal-content1 {
  background-color: #fff;
}

.modal-content1 {
  box-shadow: 0px 8px 40px #18181829;
}

.modal-content1 {
  position: relative;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-orient: vertical;

  -webkit-box-direction: normal;

  -ms-flex-direction: column;

  flex-direction: column;

  width: 100%;

  pointer-events: auto;

  background-color: #fff;

  background-clip: padding-box;

  border: 1px solid rgba(0, 0, 0, 0.2);

  border-radius: 0.3rem;

  outline: 0;
}

.fill {
  color: #fac917;
}

.mobile-none p {
  margin-bottom: 0.5rem;
}

.box .row .container-fluid .row .col-5.col-lg-12 p {
  white-space: nowrap;
}

a.links[data-toggle="modal"] {
  white-space: nowrap;
  padding-left: 1rem;
}

.col.icons p {
  margin-bottom: 0.9rem;
  margin-top: -5px;
}

@media (max-width: 992px) {
  .col.icons p {
    margin-bottom: 1rem;
  }
}

.modal-body div[class=""] {
  margin-top: -4rem;
  margin-bottom: 2rem;
}

@media (max-width: 576px) {
  .modal-body div[class=""] {
    margin-top: -3rem;
  }
}

.modal-title {
  line-height: 2;
}
