body.login
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	width:100%;
	height:100%;
	overflow:hidden;

	div
		position:relative;
		width: 220px;
		height: 30px;



		div.logo
			background-image: url(/static/images/logo_dark.svg);
			background-size: 35px;
			background-repeat: no-repeat;
			background-position: center center;
			position:absolute;
			top:0px;
			left:0px;
			height:30px;
			width:35px;

			animation-name:             fadein;
			animation-duration:         1.5s;
			animation-timing-function:  ease-in;

		a
			background: #2b303b;
			color: #FFF;
			text-decoration:none;
			position:absolute;
			top:0px;
			right:0px;
			text-transform: uppercase;
			font-size: 13px;
			min-width: 150px;
			text-align: center;
			padding: 5px;
			animation-name:             fadein;
			animation-duration:         1.5s;
			animation-timing-function:  ease-in;

	div.alert
		position:fixed;
		top:0px;
		left:0px;
		right:0px;
		line-height:25px;
		padding:20px;
		width:100%;
		border:none;
		text-align:center;
		vertical-align:middle;
		height:auto;
		border-radius:0px;

@keyframes flyin
	0%
		left:-3000px;
	100%
		left:0px;

@keyframes flyin_right
	0%
		right:-3000px;
	100%
		right:0px;

@keyframes fadein
	0%
		opacity:0;
	100%
		opacity:1;