.content_container{
    padding-bottom:0px;
}
.forget_pass{
    color:#fff;
    text-align:right;
    cursor:pointer;
    color:#fff;
    /*font-weight:bold;*/
    transition:.2s;
}
.forget_pass:hover{
    opacity:.8s;
    text-decoration:underline;
}
.main_container{
    grid-template-rows:50px 1fr 0px;
}
.rc-anchor-light{
    background:red!important;
}
.loginBox{
    width: 500px;
    padding: 20px;
    margin: auto;
    box-shadow: #302a41 0px 0px 10px 0px;
    border-radius:10px;
    background-color: rgba(0,0,0,.25);
    border:1px solid #fff;
    margin-top:30px;
    margin-bottom:20px;
  }
  .loginHeading{
    font-size: 25px;
    display: block;
    padding-bottom: 5px;
    border-bottom: 2px solid #fff;
    color: #fff;
  }
  .radio_form_div{
      color:#fff;
      border:1px solid lightgray;
      padding:10px 10px;
      border-radius:5px;
      margin: 20px 0px 10px 0px;
  }
  .radio_form_div .radio_div{
      display:flex;
      align-items:center;
      column-gap:10px;
      font-size:16px;
      
  }
  .radio_form_div .radio_div label{
      cursor:pointer;
  }
  .formGroup {
      position: relative;
      margin-bottom: 20px;
      margin:20px 0px 10px 0px;
    }
    .terms_conditions_div{
        display:flex;
        align-items:center;
        color:#fff;
        column-gap:10px;
        padding:10px;
    }
    .terms_conditions_div input[type='checkbox']{
        height:20px;
        width:20px;
        cursor:pointer;
        border-radius:5px;
    }
    .terms_conditions_div label{
         cursor:pointer;
    }
    .formElement {
      padding: 20px 10px 6px 10px;
      border-radius: 2px;
      border: 1px solid lightgray;
      width: 100%;
      font-size: 14px;
      outline:none;
      font-weight: 500;
      background-color: transparent;
      color: #fff;
      border-radius:5px;
    }
    .fromElementTextarea{
        resize: none;
        overflow-y: hidden;
        /*min-height: 50px;*/
    }
    .floatingLabel {
      position: absolute;
      left: 20px;
      top: 11px;
      transition: 0.3s;
      pointer-events: none;
      color: #ffffffcc;
    }
    .formElement:-webkit-autofill + .floatingLabel{
        color:#000!important;
    }
    
    .formElement:focus + .floatingLabel,
    .formElement:valid + .floatingLabel, .formElement[readonly] + .floatingLabel,.formElement[active] + .floatingLabel{
      left:10px;
      top: 5px;
      transform: translateY(0);
      font-size: 11px; /* Adjust font size as needed */
      color: #ffffffcc;
    }
    .formElement[readonly]{
        background:var(--black_light);
    }
    .formElement[readonly]:focus{
         border-color:lightgray;
    }
    
    .floatingLabelActive{
      left:10px;
      top: 3px;
      transform: translateY(0);
      font-size: 11px; /* Adjust font size as needed */
      color: #ffffffcc;
    }
    .formElement:focus {
      border-color: var(--pink);
    }
    .submitButton{
      position:relative;
      background: var(--gradient);
      color: #fff;
      padding: .5rem 2rem;
      border: none;
      font-weight: bold;
      cursor: pointer;
      border-radius: 0.4rem;
      font-size: 1rem;
      text-transform: uppercase;
      transition: 0.5s ease-in-out;
    }
    .submitButton:hover{
      opacity: .7;
    }
    .loader-icon {
        border: 4px solid rgba(255, 255, 255, 0.3);
        border-radius: 50%;
        border-top: 4px solid #fff;
        width: 20px;
        height: 20px;
        animation: spin 1s linear infinite;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -10px;
        margin-left: -10px;
        display: none;
    }
    @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }
    .loading_active .loader-icon {
        display: inline-block;
    }
    
    .loading_active .btn_text{
     opacity:.1;   
    }
    .loading_active span {
        opacity: 1;
    }

    .already_span{
      display:block;
      margin-top:10px;
      text-transform: uppercase;
      text-align: right;
      font-size: 14px;
      color:#fff;
    }
    .already_span a{
      text-transform: uppercase;
      margin-left:4px;
      font-weight: bold;
      text-decoration: none;
      font-size: 14px;
      color:var(--pink)
    }
    input:-webkit-autofill {
    /* Set a background color that fits with your dark theme */
    background-color: #2a2a2a !important;
    /* Add other necessary styles */
}
@media screen and (max-width: 550px) {
   .loginBox{
    width:90%;
    padding: 20px;
    margin: auto;
    box-shadow: #302a41 0px 0px 10px 0px;
    border-radius:20px;
    background-color: rgba(0,0,0,.25);
    margin-top:0px;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
  } 

}