@font-face {
      font-family: ubuntu-bold;
      src: url(../font/Ubuntu-Bold.ttf);
  }


  @font-face {
      font-family: ubuntu-medium;
      src: url(../font/Ubuntu-Medium.ttf);
  }


  .register {
      height: 892px;
  }

  .signup {
      height: 702px;
  }

  a,
  a:hover {
      text-decoration: none;
  }

  .register-form .bl {
      border-right: #fff;
  }

  .register-form .input-group-text {
      border-left: #fff;
      background-color: transparent;
      padding: 0.375rem 1.75rem;
  }

  .register-form .form-control,
  .register-form .input-group-text {
      border-radius: 0.75rem;
  }

  .register-form .read-more {
      top: 0;
      right: 0;
      background-image: linear-gradient(#44da02, #32c40a);
      background: -moz-linear-gradient(#44da02, #32c40a);
      background: -webkit-linear-gradient(#44da02, #32c40a);
      text-decoration: none;
      text-transform: capitalize;
      width: 200px;
      height: 60px;
      padding: 4px !important;
      outline: none;
      border-radius: 40px;
  }

  .register-form .rm-inner {
      align-items: center;
      background-image: linear-gradient(to right, #32c40a, #44da02);
      background: -moz-linear-gradient(to right, #32c40a, #44da02);
      background: -webkit-linear-gradient(to right, #32c40a, #44da02);
      border-radius: 40px;
      display: flex;
      justify-content: center;
      height: 100%;
      transition: background .5s ease;
      width: 100%;
      text-shadow: 0px 1px 1px #3e3e3e;
      font-size: 1.2rem;
      font-weight: 600;
      color: #fff;
  }

  .register-form .rm-inner:hover {
      background-image: linear-gradient(#44da02, #32c40a);
      background: -moz-linear-gradient(#44da02, #32c40a);
      background: -webkit-linear-gradient(#44da02, #32c40a);
      cursor: pointer;
  }

  /* .register-form select {
    -moz-appearance: none;
    -webkit-appearance: none;
    border: none;
  }
  
  .register-form  select::-ms-expand {
    display: none;
  } */
  .pre-icon {
      /* height: 22px; */
  }

  .form-control {
      /* color: rgb(167, 165, 165); */
      font-family: ubuntu-medium, sans-serif;
      font-size: .8rem;
      padding: 1.575rem 1.75rem;
  }

  .input-group {
      box-shadow: 0 0 3px #ddd;
      border-radius: 31px;
  }

  .form-control::placeholder,
  .form-control:-ms-input-placeholder,
  .form-control::-ms-input-placeholder {
      color: rgb(167, 165, 165);
      font-family: ubuntu-medium, sans-serif;
      opacity: 1;
  }

  .form-control:-ms-input-placeholder {
      color: rgb(167, 165, 165);
      font-family: ubuntu-medium, sans-serif;
      font-size: .8rem;
  }

  .form-control::-ms-input-placeholder {
      color: rgb(167, 165, 165);
      font-family: ubuntu-medium, sans-serif;
      font-size: .8rem;
  }

  .div-selectpicker {
      border: 1px solid #ddd;
      border-radius: 31px;
  }

  .filter-option-inner-inner {
      color: rgb(108, 117, 125) !important;
  }

  .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
      font-size: 1rem;
  }

  .div-selectpicker .btn-light {
      background-color: #fff;
      padding: 15px 30px 15px 15px;
  }

  div.or p {
      position: relative;
      font-weight: 700;
  }

  div.or p::after {
      content: '';
      width: 200px;
      height: 1.5px;
      background: linear-gradient(198deg, #b1b1b1, transparent);
      display: block;
      position: absolute;
      top: 50%;
      left: 20px;
  }

  div.or p::before {
      content: '';
      width: 200px;
      height: 1.5px;
      background: linear-gradient(45deg, #b1b1b1, transparent);
      display: block;
      position: absolute;
      top: 50%;
      right: 23px;
  }

  div.or h5 {
      color: #b1b1b1;
      font-size: 1.1rem;
      font-weight: 400;
  }

  div.al-signup {
      color: rgb(92, 89, 89);
  }

  div.al-signup span {
      color: #000;
      font-weight: 900;
  }

  .signin-social {
      width: 300px;
  }

  .signin-social li {
      width: 50px;
      height: 50px;
      border-radius: 50%;
      cursor: pointer;
  }

  .signin-social li:nth-child(1) i {
      background: rgb(0, 89, 255);
      padding: 12px 15px;
      box-shadow: 2px 4px 0px rgba(0, 89, 255, 0.5);
  }

  .signin-social li:nth-child(1):hover i {
      background: rgba(0, 89, 255, 0.5);
      box-shadow: 2px 4px 0px rgb(0, 89, 255);
      color: #000;
  }

  .signin-social li:nth-child(2) i {
      background: rgb(0, 162, 255);
      padding: 12px;
      box-shadow: 2px 4px 0px rgb(0, 162, 255, 0.5);
  }

  .signin-social li:nth-child(2):hover i {
      background: rgb(0, 162, 255, 0.5);
      box-shadow: 2px 4px 0px rgb(0, 162, 255);
      color: #000;
  }

  .signin-social li:nth-child(3) i {
      background: rgb(255, 0, 0);
      padding: 10px 12px;
      box-shadow: 2px 4px 0px rgba(255, 0, 0, 0.5);
  }

  .signin-social li:nth-child(3):hover i {
      background: rgba(255, 0, 0, 0.5);
      box-shadow: 2px 4px 0px rgb(255, 0, 0);
      color: #000;
  }

  .signin-social li i {
      color: #fff;
      font-size: 2rem;
      font-weight: 800;
      width: 50px;
      height: 50px;
      border-radius: 50%;
  }

  div.div-selectpicker button .dropdown-toggle::after {
      background: red !important;
      content: './img/register/downarrow.png' !important;
  }

  .btn {
      outline: none;
  }

  @media(max-width: 899px) {
      div.or p::before {
          right: -123px;
      }

      div.or p::after {
          left: -120px;
      }
  }