/* General body styling */
body {
    background-color: #f8f9fa;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* header/button styleing */
 header {
      background-color: #0078d4;
      color: white;
      padding: 2rem;
      text-align: center;
    }
    .hero {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-around;
      padding: 2rem;
    }
    .hero img {
      max-width: 400px;
      width: 100%;
      height: auto;
    }
    .hero-text {
      max-width: 500px;
    }
    .hero-text h1 {
      font-size: 2rem;
      margin-bottom: 1rem;
    }
    .features {
      display: flex;
      justify-content: space-around;
      flex-wrap: wrap;
      padding: 2rem;
      background-color: #e6eef7;
    }
    .feature {
      flex: 1 1 200px;
      margin: 1rem;
      text-align: center;
    }
    .pricing {
      padding: 2rem;
      text-align: center;
    }
    .plan {
      display: inline-block;
      background-color: white;
      border: 1px solid #ccc;
      border-radius: 8px;
      padding: 1rem;
      margin: 1rem;
      width: 250px;
      min-height: 150px;
    }
    .plan h3 {
      margin-top: 0;
    }
    .cta {
      text-align: center;
      padding: 2rem;
    }
    .cta button,
    .cta .btn {
      background-color: #0078d4;
      color: white;
      border: none;
      padding: 1rem 2rem;
      font-size: 1rem;
      border-radius: 5px;
      cursor: pointer;
      text-decoration: none;
    }
    .cta button:hover,
    .cta .btn:hover {
      background-color: #005fa3;
    }
    footer {
      background-color: #f1f1f1;
      text-align: center;
      padding: 1rem 0;
      font-size: 0.9rem;
      margin-top: 50px;
      display: block;
      width: 100%;
      position: relative;
      bottom: 0;
    }

#wrap {
    width: 100%;
    height: 100%;
    min-height: 100vh;
    position:relative;
    display: block;
}

/* Card styling */
.card {
    border-radius: 1rem;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

/* Buttons */
.btn-primary {
    background-color: #4e73df;
    border: none;
}
.btn-primary:hover {
    background-color: #2e59d9;
}

/* Alerts */
.alert {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    position: relative;
}

.alert.show {
    opacity: 1;
}

.alert i {
    margin-right: 0.5rem;
}

/* Centered form */
.centered-form {
    margin-top: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Navbar */
.navbar {
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

/* Footer */
.footer {
    text-align: center;
    padding: 1rem 0;
    font-size: 0.9rem;
    color: #6c757d;
}

/* Input focus */
.form-control:focus {
    box-shadow: none;
    border-color: #4e73df;
}


/* bad and good */
.bad,
.pw-validate-list .bi-x-circle {
    color: #990000;
}
.good,
.pw-validate-list .bi-check-circle {
    color: #009900;
}

/* lists */
.no-bull {
    list-style-type: none;
}

.sm {
    font-size: .8em;
}

.w-495 {
  width: 49.5% !important;
}

.m-bottom-0 {
  margin-bottom: 0px !important;
}