@CHARSET "UTF-8";
html { height: 100%; }
body { display: flex; flex-flow: column; align-items: center; width: 100%; height: 100%;
	background: /* linear-gradient(to bottom, #ffa726 0%,#ffb74d 27%,#ffa726 100%) */ #fff;
}

/* === LAYOUT === */
#login-container { display: flex; flex-flow: column; justify-content: center; }
#login-header { display: flex; align-items: center; justify-content: center; padding: 50px 0 30px 0; }
#login-form { padding: 20px; width: 300px; }
#copyright { text-align: center; color: #888; font-size: 0.8rem; padding: .5rem 0; }
#login-form-progress {display: none; text-align: center; color: #444; padding: 50px 0; }

/* === INPUTY, BUTTON === */
input[type='text'], input[type='password'] {
	border: 1px solid #d6dfe5; padding: .6rem 1rem .6rem 2.1rem; font-size: 1.2rem; border-radius: 3px; transition: all 0.3s ease-in-out;
	font-weight: 300; box-sizing : border-box; width: 100%; color: #555;
}
input[type='text']:focus, input[type='password']:focus { border: 1px solid #1c75bc; }

#login-div { margin-bottom: 15px; position: relative; }
#login-div:after { position: absolute; left: 7px; top: 11px; font-family: FontAwesome; content: '\f007'; font-size: 1.3rem; color: #bbb; }
#password-div { margin-bottom: 15px; position: relative; }
#password-div:after { position: absolute; left: 7px; top: 11px; font-family: FontAwesome; content: '\f023'; font-size: 1.3rem; color: #bbb; }

.button-block {
	width: 100%; text-align: center; background-color: #1c75bc; color: #fff; border: 0; border-radius: 3px; font-size: 1rem; font-weight: 700; padding: 10px 0;
	transition: all 0.3s ease-in-out; cursor: pointer;
}
.button-block:hover { background-color: #3088ce; }

::-webkit-input-placeholder { color: #999; }
:-moz-placeholder { color: #999; }  /* Firefox 18- */
::-moz-placeholder { color: #999; }  /* Firefox 19+ */
:-ms-input-placeholder { color: #999; }

/* === loading === */
#noTrespassingOuterBarG{
height:10px;
margin: 10px auto;
width:80px;
border:1px solid #1C75BC;
overflow:hidden;
background-color:#ECF0F1}

.noTrespassingBarLineG{
background-color: #1C75BC;
float:left;
width:7px;
height:60px;
margin-right:12px;
margin-top:-14px;
transform:rotate(45deg);
}

.noTrespassingAnimationG{
width:118px;
animation-name:noTrespassingAnimationG;
animation-duration:1.3s;
animation-iteration-count:infinite;
animation-timing-function:linear;
}

#noTrespassingFrontBarG{
}

@keyframes noTrespassingAnimationG{
	0%{margin-left:0px;}
	100%{margin-left:-19px;}
}