a, h1, h2, h3, strong
 {
    font-family: Montserrat, sans-serif;
    font-weight: 700;
}
.top-panel {
    background: #4285f4;
    padding: 5px 0 8px;
    color: #fff
}
.top-panel-2 {
   display: none;
}

.top-panel .top-panel-col-three {
    float: right;
    top: 7px;
    position: relative
}

.top-panel i.material-icons {
    position: relative;
    top: 5px;
    margin-right: 5px
}
.top-panel .top-panel-col-three a {
    color: #fff;
    font-weight: 700
}

.top-panel .top-panel-col-three a:hover {
    color: #fff;
    font-weight: 700
}
.login-body {
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: calc(100vh - 42px);
      background: linear-gradient(135deg, #4f46e5, #06b6d4);
    }
     .login-card {
      background: rgba(255, 255, 255, 0.95);
      padding: 40px;
      border-radius: 20px;
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
      width: 90%;
      max-width: 400px;
      text-align: center;
    }

    /* Logo Styles */
    .logo-container {
      margin-bottom: 20px;
    }

    .logo-container img {
      width: 170px;
      height: auto;
      object-fit: contain;
    }

    .login-card h2 {
      color: #1e293b;
      margin-bottom: 5px;
    }

    .subtitle {
      color: #64748b;
      font-size: 14px;
      margin-bottom: 25px;
    }


    .input-group {
        display: block;
      position: relative;
      margin-bottom: 20px;
    }

    .input-group i:first-child {
      position: absolute;
      left: 15px;
      top: 50%;
      transform: translateY(-50%);
      color: #94a3b8;
    }

    .input-group input {
      width: 100%;
      padding: 12px 40px 12px 45px;
      border: 1.5px solid #e2e8f0;
      border-radius: 10px;
      font-size: 14px;
      outline: none;
      transition: border-color 0.3s;
    }

    .input-group input:focus {
      border-color: #4f46e5;
    }

    /* Hide Default Browser Password Reveal Icons */
    input::-ms-reveal,
    input::-ms-clear {
      display: none;
    }

    .toggle-password {
      position: absolute;
      right: 15px;
      top: 50%;
      transform: translateY(-50%);
      cursor: pointer;
      color: #94a3b8;
    }

    .options {
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 13px;
      color: #64748b;
      margin-bottom: 25px;
    }

    .options a {
      color: #4f46e5;
      text-decoration: none;
    }

    .options a:hover {
      text-decoration: underline;
    }

    .login-btn {
      width: 100%;
      padding: 12px;
      background-color: #4f46e5;
      color: white;
      border: none;
      border-radius: 10px;
      font-size: 16px;
      font-weight: 600;
      cursor: pointer;
      transition: background 0.3s;
    }

    .login-btn:hover {
      background-color: #4338ca;
    }

    .signup-link {
      margin-top: 20px;
      font-size: 14px;
      color: #64748b;
    }

    .signup-link a {
      color: #4f46e5;
      text-decoration: none;
      font-weight: 600;
    }

    .form-group errorp, .form-group erroru {
    position: absolute;
    width: 100%;
    left: 8px;
    top: 47px;
    font-size: 11px;
    color: #d34336;
    font-weight: 300;
    transition: .3s cubic-bezier(.68, -.55, .27, 1.55) all;
    -moz-transition: .3s cubic-bezier(.68,-.55,.27,1.55) all;
    -webkit-transition: .3s cubic-bezier(.68, -.55, .27, 1.55) all;
    opacity: 0;
    display: flex;
}
.form-group[errr] errorp,.form-group[errr] erroru {
    opacity: 1
}

.oc-flash-message span.flash-message {
   font-size: 18px;
}
.options-center {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}
 @media only screen and (max-width:992px){  
.top-panel
 {
    text-align: center;
}
.top-panel .top-panel-col-three
 {
    float: none;
}}