@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@1,300&family=Open+Sans:wght@500&family=Roboto:ital,wght@0,400;0,700;1,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Golos+Text:wght@400;800&family=Montserrat:ital,wght@0,300;0,400;1,200&family=Oswald:wght@200;300;400;500;600;700&family=Raleway:wght@200;300;400&family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400&family=Roboto:wght@300;500;700&family=Rubik:ital,wght@0,300;0,400;0,500;0,700;0,800;1,300;1,400&display=swap');


body , html{
		height: 100%;
		margin: 0;

	}



.spinner,
	.loading-text{
		font-size: var(--normal-font);
		display: none;
	}

			 .fa-spinner{
			 -webkit-animation: spin 2s linear infinite;
		  animation: spin 2s linear infinite;
		}

		@-webkit-keyframes spin {
		  0% { -webkit-transform: rotate(0deg); }
		  100% { -webkit-transform: rotate(360deg); }
		}

	@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.input-wrapper .visibility-button{
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    color: #0a53be;
    padding: 10px;
}


.input-wrapper .icon .fa-solid{
    margin-top: 50%;
}


	#admin-auth-wrapper{
		background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
  height: 100%;
  background-position: center;
  background-size: cover;
		background-repeat: no-repeat;
		    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
	}

#admin-auth-wrapper .auth-container{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    margin: auto;
    min-height: 100%;
}

#admin-auth-wrapper .auth-container .form-wrapper{
    width: 550px;
}

    #admin-auth-wrapper .form-wrapper .card{
        text-align: left;
        box-shadow: 0px 0px 6px rgba(0,0,0, 0.5);
    }

	#admin-auth-wrapper .form-wrapper .card .card-header .auth-logo-wrapper .img-fluid{
        width: 100px;
        height: auto;
        display: block;
        margin: auto;
    }

	#admin-auth-wrapper .form-wrapper .card .card-header .title{
		text-align: center;
		text-transform: capitalize;
		font-weight: bold;
		font-size: 16px;
		font-family: 'Roboto', sans-serif;
		padding: 8px;
	}


	#admin-auth-wrapper .form-wrapper .card .card-body .input-wrapper{
		position: relative;
	}


	#admin-auth-wrapper .form-wrapper .card .card-body .input-wrapper .icon{
		position: absolute;
		padding: 5px 10px;
		top: 0;
		bottom: 0;
		left: 0;
		background-color: #000274;
		border-top-left-radius: 5px;
		border-bottom-left-radius: 5px;
		color: #fff;
	}



	#admin-auth-wrapper .form-wrapper .card .card-body .input-wrapper .form-control,
	#admin-auth-wrapper .form-wrapper .card .card-body  .input-wrapper .form-select{
		box-shadow: none;
		outline: none;
		border-bottom-color: #350053;
		focus: none;
		font-size: 14px;
		border-top-left-radius: 5px;
		border-bottom-left-radius: 5px;
		padding-left: 40px;
        font-family: 'Nunito', sans-serif;
        color: rgba(0,0,0,0.75);
	}


#admin-auth-wrapper .form-wrapper .card .card-body .form-check-label{
    font-size: 14px;
    text-transform: capitalize;
    font-weight: bolder;
    font-family: Open Sans, sans-serif;
}

#admin-auth-wrapper .form-wrapper .card .card-body .form-check-input{
    border: 1px solid #051b11;
    border-radius: 0px;
}


#admin-auth-wrapper .form-wrapper .card .card-body .form-check-input:checked{
   background-color: #0093bd;
}


	#admin-auth-wrapper .form-wrapper .card .card-body .old_acc_link{
		margin-right: 8px;
		font-size: 14px;
		font-family: 'Roboto', sans-serif;
		color: #454545;
	}

	#admin-auth-wrapper .form-wrapper .card .card-body .auth-temp-link{
		font-size: 12px;
        font-family: 'Raleway', sans-serif;
        text-transform: capitalize;
        text-decoration: none;
        font-weight: bold;
        background-color: rgba(0, 0, 0 ,0.1);
        border-radius: 15px;
        padding: 6px 10px;
        color: #1a1d20;
	}

	#admin-auth-wrapper .form-wrapper .card .card-body  .admin-auth-btn{
		background-color: #001054;
		color: #fff;
		text-transform: uppercase;
		font-family: 'Roboto', sans-serif;
		font-size: 14px;
		box-shadow: none;
		outline: none;
		width: 100%;
	}

		#admin-auth-wrapper .ps-page-bottom-left {
	  left: 16px;
	background-color: rgba(0 , 0 , 0, 0.2);
			padding: 12px;
			color: #fff;
	}


	#admin-auth-wrapper .ps-page-bottom-left .title{
			font-size: 12px;
	}


	#admin-auth-wrapper .form-wrapper .custom-auth-alert-wrapper{
        font-size: 14px;
        padding: 6px 10px;
        margin-bottom: 0.5rem;
        color: #ffffff;
        border-radius: 6px;
	}

    #admin-auth-wrapper .form-wrapper .danger-auth-notification{
    background-color: rgba(201,38,18,0.75);
    }

    #admin-auth-wrapper .form-wrapper .success-auth-notification{
    background-color: rgba(15,199,43,0.75);
    }


	#admin-auth-wrapper .form-wrapper .custom-auth-alert-wrapper .text{
        font-size: 14px;
        font-family: 'Roboto', sans-serif;
        margin-bottom: 0.5rem;
        font-weight: 300;
	}


#admin-auth-wrapper .form-wrapper .card .pre-form-wrapper{
    padding: 10px;
}

#admin-auth-wrapper .form-wrapper .card .pre-form-wrapper p{
   margin: 0px;
    padding: 5px 4px;
}

#admin-auth-wrapper .form-wrapper .card .pre-form-wrapper p .value,
#admin-auth-wrapper .form-wrapper .card .pre-form-wrapper p .label{
  margin-right: 10px;
    font-size: var(--small-font);
    font-family: 'Nunito', sans-serif;
}

#admin-auth-wrapper .form-wrapper .card .pre-form-wrapper p .label:after{
    content: ":";
    font-weight: 300;
}

#admin-auth-wrapper .form-wrapper .card .pre-form-wrapper .btn{
   background-color: rgba(8,82,203,0.75);
    color: #ffffff;
    text-transform: capitalize;
    border-radius: 5px;
    padding: 6px;
    font-size: var(--small-font);
    font-family: 'Poppins', sans-serif;
}


@media screen and (max-width: 550px){

    #admin-auth-wrapper .auth-container,
    #admin-auth-wrapper .form-wrapper .card .card-body{
        padding: 10px;
    }

    #admin-auth-wrapper .auth-container .form-wrapper{
        width: 100% !important;
    }

    #admin-auth-wrapper .form-wrapper .card .form-text{
        display: none;
    }

    #admin-auth-wrapper .form-wrapper .card .mb-3{
        margin-bottom: .5rem !important;
    }


}