@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Special+Gothic&family=Special+Gothic+Condensed+One&display=swap');
html, body
{
    width : 100% !important;
    height : 100% !important;
}
.loginpage
{
min-width : 100%;
min-height : 100%;
background-image: url('../imageassets/final-login-bgc-b.jpg');
background-size: cover;
background-position: center;
display : block;
}
#particleground
{
min-width : 100%;
min-height : 100%;
position : fixed;
top : 0;
left : 0;

}

.v-flex
{
    display : flex;
    flex-direction: column;
    height: 100vh;
    justify-content: center;
}

.h-flex
{
    display : flex;
    flex-direction: row;
    width: 100%;
    justify-content: center;
}

.login-container
{
   /* // background : rgba(255, 255, 255, 1);

	// backdrop-filter : blur(3px);
    border-radius: 10px;
   // border : 1px solid #000000;
   // padding : 1em; */
  
    padding-top : 2em;
    padding-bottom : 2em;
    z-index : 9;
  /*  box-shadow: 0px 0px 7px 3px #615f5f; */
}
.theme-input
{
    background-color: inherit;
    color : #ffffff !important;
}
.theme-input:focus
{
    background-color: inherit;
    color : #ffffff !important;
}
.logo 
{
    width : 60%;
    height : auto;
    margin-left : 20%;
    margin-bottom: 1em;
}
label
{
    color : #ffffff;
}

.video-background {
    position: fixed;
    height: 100vh;
    width: 100%;
    overflow: hidden;
  }

  .video-background video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
  /* // min-height: 100%;
   // width: auto; */
    height: auto;
    transform: translate(-50%, -50%);
    z-index: -1;
    object-fit: contain;
  }


  .logincontainer-inner
  {
    background-color: #ffffff;
    opacity : 1;
    color : #000000;
    position : relative;
    padding-top : 3.5em;
    padding-bottom : 2em;
    padding-left : 2em;
    padding-right : 2em;
    border-radius: 1.68em;
    overflow: hidden;
  }
  h5
  {
    font-family: "Montserrat", sans-serif;
  }
  h4
  {
    font-family: "Special Gothic", sans-serif;
  }
  .lg
  {
    font-size: 1.5em;
  }
  
  .input-holder
  {
    display: flex;
    flex-direction: row;
    padding-bottom: 7px;
    border-bottom: 2px solid #7c7e82;
    margin-bottom: 2em;
  }
  .input-holder2
  {
    display: flex;
    flex-direction: row;
    padding-bottom: 7px;
    color : #7c7e82;
    margin-bottom: 2em;
  }
  .login-input,   .login-input:focus, .login-input:active 
  {
    display : inline-block;
    flex: 1;
    margin-left : 1em;
    border : none;
    outline: none;
    background-color: transparent;

  }
  .input-holder i
  {
    padding-top : 2px;
    color : #7c7e82;
  }
  .flex1
  {
    flex : 1;
  }
  .lg-btn
  {
    width: 100%;
    padding-top : 1em;
    padding-bottom : 1em;
    color : #ffffff;
    background-image: linear-gradient(180deg, #4766c8, #53a1fd);
    border : none;
    outline: none;
    border-radius: 4px;
    cursor : pointer;
  }

  .icon-container {
    display: flex;
    gap: 20px; /* space between circles */
   
    padding-top: 40px;
    padding-left: 0;
    padding-right: 40px;
    padding-bottom: 30px;
  }

  .circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-image: linear-gradient(180deg, #4766c8, #53a1fd);
  
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    transition: background-color 0.3s;
    cursor : pointer;

  }

  .circle:hover {
    background-color: #0056b3;
  }

.abs
{
    position : absolute;
    width : 100%;
    height : auto;
    top : 0;
    right : 0;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    -webkit-text-fill-color: black !important;
    transition: background-color 9999s ease-in-out 0s;
  }