* {
  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: 520px;
    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; }

#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: 500px;
    max-width: 600px;
    margin: auto;
    padding-top: 20px;
    border-radius: 10px; }
    #registersection .login-box form .input-group {
      height: 100px;
      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; }

#register-data-section {
  background: url(../img/shop-bg.jpg);
  background-size: cover;
  background-position: center;
  height: 100vh; }
  #register-data-section .overlay {
    position: relative;
    height: 100vh; }
  #register-data-section .col {
    position: relative;
    height: 100vh; }
  #register-data-section .login-box h3 {
    color: #0a0a0a;
    font-weight: 600;}
    #register-data-section .login-box form img{
    width: 350px;
  margin-bottom: 10px;}
  #register-data-section .login-box form {
    background: #fff;
    box-shadow: 0px 0px 30px -15px;
    height: 520px;
    max-width: 600px;
    margin: auto;
    padding-top: 20px;
    border-radius: 10px; }
    #register-data-section .login-box form .input-group {
      height: 70px;
      border-bottom: 1px solid #e3e3e3; }
      #register-data-section .login-box form .input-group .form-control {
        height: 100%;
        border: none;
        background: transparent;
        color: #555;
        font-weight: 500;
        font-size: 20px;
        padding-left: 0; }
      #register-data-section .login-box form .input-group .input-group-text {
        background: #fff;
        border: none;
        padding: 30px;
        transition: .4s; }
        #register-data-section .login-box form .input-group .input-group-text .fa {
          font-size: 20px;
          color: #555; }
    #register-data-section .login-box form .input-group:focus-within {
      border-bottom: 1px solid #45c2de; }
      #register-data-section .login-box form .input-group:focus-within .input-group-text {
        padding-left: 20px; }
        #register-data-section .login-box form .input-group:focus-within .input-group-text .fa {
          color: #45c2de; }
    #register-data-section .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; }
    #register-data-section .login-box form .btn:hover {
      color: #fff;
      box-shadow: 0px 0px 30px -15px; }
    #register-data-section .login-box form ::-webkit-input-placeholder {
      font-size: 18px !important;
      color: #555; }

#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; }

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

.permission-popup {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 40px;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  width: 400px;
  text-align: center;
}

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

/*========================================*/
/* google-sign-in-button */


.google-sign-in-button {
  cursor: pointer;
  transition: background-color .3s, box-shadow .3s;

  padding: 12px 16px 12px 42px;
  border: none;
  border-radius: 20px;
  box-shadow: 0 -1px 0 rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .25);

  color: #757575;
  font-size: 18px;
  font-weight: 500;
  /* font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; */

  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=);
  background-color: white;
  background-repeat: no-repeat;
  background-position: 12px 12px;
}

.google-sign-in-button:hover {
  box-shadow: 0 -1px 0 rgba(0, 0, 0, .04), 0 2px 4px rgba(0, 0, 0, .25);
}

.google-sign-in-button:active {
  background-color: #eeeeee;
}

.google-sign-in-button:active {
  outline: none;
  box-shadow:
    0 -1px 0 rgba(0, 0, 0, .04),
    0 2px 4px rgba(0, 0, 0, .25),
    0 0 0 3px #c8dafc;
}

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