@charset "utf-8";
/* CSS Document */

body{
	background: url(../system-images/login-background.jpg);
	background-attachment:fixed;
	background-size:cover;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	overflow-x:hidden;
}
*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

.main-container{
	display:flex;
	width:100%;
	height:100vh;
	justify-content: flex-end;
	align-content:center;
	padding-right:5em;
	
}

.login-box{
	width:350px;
	height:100vh;
	display:flex;
	flex-direction: column;
	background-color:#FFFFFF;
	box-shadow: -1px -1px 20px 0px #b8b8b8;
	
}

.login-box-img{
	padding: 4em;
    display: flex;
    justify-content: center;

}

.ore-login-form label{
font-weight: bold;
    margin-top: 1em;
    color: #9aa2a4;
    font-family: serif;
	
}

.ore-login-button{
	width:100%;
}

/*ORE GENERAL LOADER*/
.loader-container{
	display:flex;
	width:100%;
	height: auto;
	padding:1em;
	background-color:rgba(104, 108, 156, 0.75);
	justify-content:center;
	align-items:center;
	margin-top:1em;
	flex-direction:column;
	
}

.loader-text{
	font-size:1.2em;
	color:#d1c594;
	}

.loader {
  width:64px;
  height:64px;
  border-radius: 50%;
  perspective: 800px;
  margin-bottom:1em;
}

.inner {
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border-radius: 50%;  
}

.inner.one {
  left: 0%;
  top: 0%;
  animation: rotate-one 1s linear infinite;
  border-bottom: 3px solid #c9ac68;
}

.inner.two {
  right: 0%;
  top: 0%;
  animation: rotate-two 1s linear infinite;
  border-right: 3px solid #F3CE79;
}

.inner.three {
  right: 0%;
  bottom: 0%;
  animation: rotate-three 1s linear infinite;
  border-top: 3px solid #c9ac68;
}

@keyframes fadeIn { 
  from { opacity: 0; } 
}

.animate-flicker {
    animation: fadeIn 1s infinite alternate;
}

@keyframes rotate-one {
  0% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}

@keyframes rotate-two {
  0% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}

@keyframes rotate-three {
  0% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}

/*END ORE GENERAL LOADER*/

.form-control:focus{
	outline-style:none!important;
	box-shadow:none!important;
	border-color:transparent!important;
}

.login-search-bar{
	display:flex;
	flex-direction:row;
	padding:0.2em;
	width:100%;
}

.login-search-bar input{
	width: 80%;
    height: 40px;
    outline-style: none;
    /* box-shadow: 0 0 20px 0px black; */
    border: 3px solid #004160;
    /* border-color: #ff0000!important; */
    background-color: rgb(255 255 255 / 34%);
    padding-left: 0.5em;
    color: #090909;
	border-radius: 10px 0 0 0;
}

.login-search-bar button{
	    width: 20%;
    height: 40px;
    outline-style: none!important;
    box-shadow: none!important;
    border-color: transparent!important;
    background-color: #004160;
    color: #FFFFFF;
	border-radius: 0 10px 0 0;
}

.login-search-bar button:hover{

	background-color:#FF7A7C;
	cursor:pointer;
	
}

.auth-login-container {
	display: flex;
    flex-direction: column;
    margin-top: 1em;
}

.auth-login-bar {
	display: flex;
    flex-direction: row;
    width: 100%;
    padding: 0.15em;
}

.auth-login-bar {
	
}

.auth-login-bar input{
		width: 80%;
    height: 40px;
    outline-style: none;
    /* box-shadow: 0 0 20px 0px black; */
    border: 3px solid #004160;
    /* border-color: #ff0000!important; */
    background-color: rgb(255 255 255 / 34%);
    padding-left: 0.5em;
    color: #090909;
}
.auth-login-bar input:-webkit-autofill,
.auth-login-bar input:-webkit-autofill:hover,
.auth-login-bar input:-webkit-autofill:focus,
.auth-login-bar input:-webkit-autofill:active {
    -webkit-transition: "color 9999s ease-out, background-color 9999s ease-out";
    -webkit-transition-delay: 9999s;
}

.auth-login-bar input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #d6c479;
  font-style:italic;
}
.auth-login-bar input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #d6c479;
    font-style:italic;

}
.auth-login-bar input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #d6c479;
    font-style:italic;

}
.auth-login-bar input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #d6c479;
    font-style:italic;

}

.auth-login-bar .auth-login-bar-tag{
	width: 20%;
    height: 40px;
    outline-style: none!important;
    box-shadow: none!important;
    border-color: transparent!important;
    background-color: #004160;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2em;
}

.auth-login-bar button{
width: 100%;
    height: 40px;
    outline-style: none!important;
    box-shadow: none!important;
    border-color: transparent!important;
    background-color: #004160;
    color: #FFFFFF;
	border-radius: 0 0 10px 10px;
}

.auth-login-bar button:hover{

	background-color:#006697;
	cursor:pointer;
}

.auth-login-noprofile{
	display:flex;
	width:100%;
	padding:0.6em;
	background-color:#D1A360;
	color:#FFFFFF;
	border-radius:5px;
	justify-content:center;
	align-items:center;
	
}

.auth-login-alert{
	
	display:flex;
	width:100%;
	padding:0.6em;
	color: #000000;
	border-radius:5px;
	justify-content:center;
	align-items:center;
	margin-top:1em;
	text-transform:uppercase;
	
}