@font-face {
    font-family: "ZillaSlab-SemiBold";
    src: url("/static/fonts/ZillaSlab-SemiBold.ttf");
    font-family: "Rubik";
    src: url("/static/fonts/Rubik-VariableFont_wght.ttf");
    font-family: "Cairo-SemiBold";
    src: url("/static/fonts/Cairo-SemiBold.ttf");
    font-family: "CooperHewitt-Book";
    src: url("/static/fonts/CooperHewitt-Book.ttf");
    font-family: "CooperHewitt-Medium";
    src: url("/static/fonts/CooperHewitt-Medium.ttf");
    font-family: "CooperHewitt-Semibold";
    src: url("/static/fonts/CooperHewitt-Semibold.ttf");
}

.loginTitle{
    font-family: "CooperHewitt-Semibold";
    font-size: 4rem;
    color: #090763;
    text-shadow: 1px 2px 2px #bebdf1;
}

.loginCont{
    width: 22rem;
    height: 15rem;
    /*border: 1px solid black;*/
    margin-top: 5em;
}

.loginBox{
    border-radius: 5px;
    /*border: 1px solid black;*/
    height:23rem;
}

.loginCard{
    border: 1px inset #423ff56c;
    /*-moz-box-shadow: 3px 5px 5px #583ff5c4;*/
    -webkit-box-shadow: 1px 2px 18px #0f0da7d5;
    -moz-box-shadow: 1px 2px 18px #0f0da7d5;
    box-shadow: 1px 2px 18px #0f0da7d5;
    border-radius: 10px;
}

.login-input-container{
	position:relative;
	margin-bottom:30px;
}

.login-input-container label{
	position:absolute;
	top:0px;
	left:0px;
	font-size:18px;
	color:rgb(5, 5, 5);	
    /*pointer-event:none;*/
	transition: all 0.5s ease-in-out;
}

.login-input-container input{ 
  border:0;
  border-bottom:1px solid #555;  
  background:transparent;
  width:100%;
  padding:0px 0 1px 0;
  font-size:20px;
  color:rgb(0, 0, 0);
}

.login-input-container input:focus{ 
 border:none;	
 outline:none;
 border-bottom:1px solid #e74c3c;	
}

.login-input-container input:focus ~ label,
.login-input-container input:valid ~ label{
	top:-18px;
	font-size:15px;
	color: rgb(119, 119, 119);
}

.inner-addon { 
    position: relative; 
}

.inner-addon .fa-user {
    position: absolute;
    padding: 12px 10px 10px 10px;
    pointer-events: none;
}

.inner-addon .fa-lock {
    position: absolute;
    padding: 12px 10px 10px 10px;
    pointer-events: none;
}

.right-addon .fa-user { right: 0px;}

.right-addon .fa-lock { right: 0px;}

.right-addon input { padding-right: 30px; }

:root{
    --loginBtnBg: #353aa0ea;
    --loginBtnBgBorder: rgb(0, 7, 107);
}

.btn-outline-primary:hover {
    background-color: var(--loginBtnBg);
    border-color:var(--loginBtnBgBorder);
}

.loginButton{
    color:rgb(0, 7, 107);
    border-color: rgb(0, 7, 107);
}

.infocont{
    margin-top: 3em;
    height: 2.1em;
    border-radius: 5px;
    border: 1px solid red;
    background-color: #fadada;
    box-shadow: 0px 0px 4px #550101d5;
    padding: 0;
}

.fmargin1{
    margin-top: 7em;
}
.fmargin2{
    margin-top: 2em;
}