* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html {
  scroll-behavior: smooth; }

body {
  font-family: 'Poppins', sans-serif;
  height: 100vh;
  background: #fff; }

h5, p, span, a, .btn, th, td, label {
  font-size: 13px; }

p {
  margin-bottom: 0 !important; }

.fa {
  font-size: 16px; }

h4 {
  font-size: 24px; }

h5 {
  font-size: 18px; }

::-webkit-input-placeholder {
  font-size: 13px !important; }

::-webkit-scrollbar {
  width: 0px;
  height: 10px; }

::-webkit-scrollbar-track {
  background: #fff;
  border-radius: 3px; }

::-webkit-scrollbar-thumb {
  background: #e5e5e5;
  border-radius: 5px; }

::-webkit-scrollbar-thumb:hover {
  background: #e5e5e5; }

.img-fluid {
  width: -webkit-fill-available !important;
  height: -webkit-fill-available !important; }

.fa {
  color: #fff;
  transition: .4s; }

.fa-green {
  color: #0EA61A; }

.btn {
  background: #c17a74;
  border: 1px solid #e3e3e3;
  border-radius: 30px;
  transition: .4s;
  font-weight: 500;
  padding: 12px 24px;
  color: #fff; }

.btn:hover {
  background: #d19c97;
  border: 1px solid #d19c97;
  color: #fff; }
  .btn:hover .fa {
    color: #fff; }

.fa-btn {
  height: 39px;
  width: 39px;
  padding: 9px; }
  .fa-btn .fa {
    color: #0EA61A; }

.fa-btn:hover {
  background: #45c2de;
  border: 1px solid #45c2de;
  color: #fff; }
  .fa-btn:hover .fa {
    color: #fff; }

.btn:focus {
  box-shadow: 0 0 0 0rem rgba(0, 123, 255, 0.25); }

.form-control {
  font-size: 14px;
  border: 1px solid #e3e3e3;
  padding: 19px;
  height: 39px; }

.custom-select {
  font-size: 14px;
  height: 39px; }

.custom-select:focus,
.form-control:focus {
  box-shadow: none;
  border: 1px solid #45c2de; }

.input-group .input-group-text {
  background: #fff;
  border-left: 0px; }
  .input-group .input-group-text .fa {
    color: #0EA61A; 
      }
#registersection {
  background: url(../img/shop-bg.jpg);
  background-size: cover;
  background-position: center;
  height: 100vh; }
  #registersection .overlay {
    position: relative;
    height: 100vh; }
  #registersection .col {
    position: relative;
    height: 100vh; }
  #registersection .login-box h3 {
    color: #0a0a0a;
    font-weight: 600;}
    #registersection .login-box form img{
    width: 350px;
  margin-bottom: 10px;}
  #registersection .login-box form {
    background: #fff;
    box-shadow: 0px 0px 30px -15px;
    height: 450px;
    max-width: 600px;
    margin: auto;
    padding-top: 20px;
    border-radius: 10px; }
    #registersection .login-box form .input-group {
      height: 70px;
      border-bottom: 1px solid #e3e3e3; }
      #registersection .login-box form .input-group .form-control {
        height: 100%;
        border: none;
        background: transparent;
        color: #555;
        font-weight: 500;
        font-size: 20px;
        padding-left: 0; }
      #registersection .login-box form .input-group .input-group-text {
        background: #fff;
        border: none;
        padding: 30px;
        transition: .4s; }
        #registersection .login-box form .input-group .input-group-text .fa {
          font-size: 20px;
          color: #555; }
    #registersection .login-box form .input-group:focus-within {
      border-bottom: 1px solid #45c2de; }
      #registersection .login-box form .input-group:focus-within .input-group-text {
        padding-left: 20px; }
        #registersection .login-box form .input-group:focus-within .input-group-text .fa {
          color: #45c2de; }
    #registersection .login-box form .btn {
      background: linear-gradient(180deg, #d19c97 25%, #c17a74 75%);
      margin-top: 23px;
      padding: 10px 50px;
      border-radius: 30px;
      border: none;
      font-size: 16px;
      font-weight: 600; }
    #registersection .login-box form .btn:hover {
      color: #fff;
      box-shadow: 0px 0px 30px -15px; }
    #registersection .login-box form ::-webkit-input-placeholder {
      font-size: 18px !important;
      color: #555; }
@media (max-width: 576px) {
    #registersection .login-box form {
  padding-top: 20px;
   height: 450px;
  padding-bottom: 20px;
  padding-right: 20px;
}
  #registersection .login-box form img {
  width: 80px;
  }
  #registersection .login-box form .input-group {
  height: 60px;
}
}

/*========================================
#loginsection {
  background: url(../img/shop-bg2.jpg);
  background-size: cover;
  background-position: center;
  height: 100vh; }
  #loginsection .overlay {
    position: relative;
    height: 100vh; }
  #loginsection .col {
    position: relative;
    height: 100vh; }
  #loginsection .login-box h3 {
    color: #0a0a0a;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px; }
  #loginsection .login-box form {
    background: #fff;
    box-shadow: 0px 0px 30px -15px;
    height: 400px;
    max-width: 600px;
    margin: auto;
    padding-top: 10px;
    border-radius: 10px; }
    #loginsection .login-box form .input-group {
      height: 100px;
      border-bottom: 1px solid #e3e3e3; }
      #loginsection .login-box form .input-group .form-control {
        height: 100%;
        border: none;
        background: transparent;
        color: #555;
        font-weight: 500;
        font-size: 20px;
        padding-left: 0; }
      #loginsection .login-box form .input-group .input-group-text {
        background: #fff;
        border: none;
        padding: 30px;
        transition: .4s; }
        #loginsection .login-box form .input-group .input-group-text .fa {
          font-size: 20px;
          color: #555; }
    #loginsection .login-box form .input-group:focus-within {
      border-bottom: 1px solid #45c2de; }
      #loginsection .login-box form .input-group:focus-within .input-group-text {
        padding-left: 20px; }
        #loginsection .login-box form .input-group:focus-within .input-group-text .fa {
          color: #45c2de; }
    #loginsection .login-box form .btn {
      background: linear-gradient(180deg, #d19c97 25%, #c17a74 75%);
      margin-top: 23px;
      padding: 10px 50px;
      border-radius: 30px;
      border: none;
      font-size: 16px;
      font-weight: 600; }
    #loginsection .login-box form .btn:hover {
      color: #fff;
      box-shadow: 0px 0px 30px -15px; }
    #loginsection .login-box form ::-webkit-input-placeholder {
      font-size: 18px !important;
      color: #555; }

========================================*/
.popup {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
padding: 50px;
max-width: 450px;
background-color: #fff;
border: 1px solid #ccc;
z-index: 1000;
}
.popup img{
width: 150px;
}
.popup button{
margin-top: 20px;
}

@media (max-width: 576px) {
.popup {
top: 40%;
left: 30%;
transform: translate(-20%, -30%);
padding: 20px;
max-width: 450px;
}
.popup img{
width: 80px;
}
.popup h6{
font-size: 22px;
}
}

/*========================================*/