html, body {
    height: 100%;
    font-family: 'Inter', sans-serif;
    font-size: 14px; }
  
  .text-divider {
    position: relative;
    display: flex;
    align-items: center;
    line-height: 14px;
    margin: 30px 0; }
    .text-divider:before {
      content: '';
      display: block;
      height: 1px;
      flex: 1;
      background: #b3b3b3;
      margin-right: 10px; }
    .text-divider:after {
      content: '';
      display: block;
      height: 1px;
      flex: 1;
      background: #b3b3b3;
      margin-left: 10px; }
  
  .btn {
    font-size: 15px;
    width: auto;
    display: inline-flex;
    align-items: center;
    padding: 15px 30px;
    line-height: 14px;
    border-radius: .5rem; }
    .btn.btn-sm {
      padding: 12px 20px;
      font-size: 12px; }
    .btn.btn-lg {
      padding: 20px 40px;
      font-size: 16px; }
    .btn.btn-block {
      width: 100%;
      justify-content: center; }
    .btn.btn-white {
      background: white;
      color: black; }
      .btn.btn-white:hover, .btn.btn-white:focus {
        background: rgba(255, 255, 255, 0.8); }
    .btn.btn-floating {
      height: 50px;
      width: 50px;
      padding: 0;
      font-size: 18px !important;
      justify-content: center;
      border-radius: 50%; }
      .btn.btn-floating.btn-sm {
        height: 35px;
        width: 35px;
        font-size: 14px !important; }
      .btn.btn-floating.btn-lg {
        height: 65px;
        width: 65px;
        font-size: 22px !important; }
  
  .bg-facebook {
    background: #3b5998 !important; }
  
  .bg-google {
    background: #db4437 !important; }
  
  .bg-twitter {
    background: #55acee !important; }
  
  .bg-linkedin {
    background: #0077b5 !important; }
  
  .bg-dribbble {
    background: #ea4c89 !important; }
  
  .bg-behance {
    background: #1769ff !important; }
  
  .bg-github {
    background: #00405d !important; }
  
  .bg-pinperest {
    background: #bd081c !important; }
  
  .border-facebook {
    color: #3b5998 !important;
    border: 1px solid #3b5998 !important; }
    .border-facebook:hover {
      background: #3b5998 !important;
      color: white !important; }
  
  .border-google {
    color: #db4437 !important;
    border: 1px solid #db4437 !important; }
    .border-google:hover {
      background: #db4437 !important;
      color: white !important; }
  
  .border-twitter {
    color: #55acee !important;
    border: 1px solid #55acee !important; }
  
  .border-linkedin {
    color: #0077b5 !important;
    border: 1px solid #0077b5 !important; }
  
  .border-dribbble {
    color: #ea4c89 !important;
    border: 1px solid #ea4c89 !important; }
  
  .border-behance {
    color: #1769ff !important;
    border: 1px solid #1769ff !important; }
  
  .border-github {
    color: #00405d !important;
    border: 1px solid #00405d !important; }
  
  .border-pinperest {
    color: #bd081c !important;
    border: 1px solid #bd081c !important; }
  
  .form-control {
    font-size: 14px;
    transition: all .3s; }
  
  .custom-checkbox {
    user-select: none; }
  
  .form-wrapper {
    padding: 30px 20px;
    min-height: 100%; }
    .form-wrapper .container, .form-wrapper .container-fluid {
      min-height: 100%; }
  
  @media (max-width: 500px) {
    .form-wrapper {
      display: block !important;
      padding: 20px 10px !important; } }
  
  html, body {
    background: linear-gradient(90deg, #ff4955, #673ab7);
    background-attachment: fixed; }
  
  .form-wrapper {
    display: flex;
    align-items: center;
    min-height: 100%; }
    .form-wrapper .container {
      min-height: 100%; }
  
  a {
    color: #673ab7; }
    a:hover, a:focus {
      color: #46287d; }
  
  .btn-primary {
    background: linear-gradient(90deg, #ff4955, #673ab7) !important;
    border: none;
    border-radius: 10px !important; }
  
  .custom-control-input:checked ~ .custom-control-label::before {
    background: linear-gradient(90deg, #ff4955, #673ab7) !important;
    border: none; }
  
  .logo {
    text-align: center; }
  
  .card {
    border: none;
    width: 400px;
    margin: auto;
    border-radius: 10px;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.16); }
    .card .card-body {
      padding: 30px; }
  
  .form-group {
    margin-bottom: 20px; }
    .form-group .form-icon-wrapper {
      position: relative; }
      .form-group .form-icon-wrapper .form-icon-left, .form-group .form-icon-wrapper .form-icon-right {
        padding: 0;
        transform: translateY(-50%);
        top: 50%;
        font-size: 16px;
        border: none;
        position: absolute;
        z-index: 4;
        background: none;
        transition: opacity .3s;
        color: black; }
      .form-group .form-icon-wrapper .form-icon-left {
        left: 15px; }
      .form-group .form-icon-wrapper .form-icon-right {
        right: 15px;
        left: auto; }
  
  .form-control {
    height: auto;
    padding: 13px 20px;
    padding-left: 45px;
    border: none;
    background: #f2f2f2;
    border-radius: 10px !important; }
    .form-control:focus {
      box-shadow: none;
      color: black;
      background: #ebebeb; }
      .form-control:focus + i {
        opacity: .8; }
  
  .social-links {
    display: flex; }
    .social-links a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      font-size: 18px;
      color: white;
      height: 40px;
      background: rgba(255, 255, 255, 0.4);
      border-radius: 100px;
      margin-right: 15px;
      transition: all .3s; }
      .social-links a:last-child {
        margin-right: 0; }
      .social-links a:hover, .social-links a:focus {
        background: rgba(255, 255, 255, 0.8);
        transform: scale(1.1); }
  
  @media (max-width: 500px) {
    .card {
      width: 100%; } }