html, body{
    font-family: 'Muli', sans-serif !important;
}

body > div > div > div:first-child{
	background-color:#000000;
	background-image: url('/images/desktop.jpg');
	height: 100vh;
	overflow: hidden;
	padding: 0;
	background-repeat: no-repeat;
	background-size: cover;
}

body > div > div > div:last-child{
	background-color:white;
	min-height: 100vh;
	padding:40px 40px;
}

body > div > div > div:last-child h2{
	text-transform:uppercase;
	font-size: 18px;
	color: #6d7278;
	font-weight: bold;
	margin-top:50px;
	letter-spacing: 1.5px;
}

body > div > div > div:first-child > img{
	display: block;
	width: 100%;
}

#encryptedKey{
	height: 20em;
}

.modal-header {
    background-color: #555555;
}

.modal-header h2{
	font-weight: unset;
	font-size: 1rem;
	text-transform: none;
	color: #fff;
}

span.error{color:#dc3545;}

h1 { color: #ffffff; font-size: 41px; margin-top:188px; font-weight: bold }
h1.public { font-size: 54px; text-align: center; }
h1 + h2{ color: #ffffff; margin-left: 107px; font-size: 24px; width: 566px;}
h2 + p{margin-top: 40px; margin-bottom: 40px;}


#public-logo{ width: 182px; margin-left: -6px; }

.form-group{
	position:relative;
	margin-bottom:16px;
	margin-top:16px;
}

.form-group label{
	position: absolute;
	top: 11px;
	left: 15px;
	font-size: 14px;
	color:#616161;
	z-index:2;
}

.form-group input[type="text"], .form-group input[type="password"]{
	height: 44px;
	border-color:#04bce3;
	border-radius:5px;
}

.form-group input[type="password"]{
	margin-top: 32px;
}

.form-group label.focused, .form-group label.always-focused{
	top: 4px;
	left: 11px;
	font-size: 10px;
	color: #555;
}

.actions-section > div:first-child > a{
	color: #0091ff;
	font-weight: bold;
	margin-top:28px;
}

.actions-section > div:last-child > button{
	background-color: #0288d1;
	width: 158px;
	height: 44px;
	border-radius: 22px;
	text-align: center;
	border:unset;
	color: #ffffff;
	margin-top:20px;
}

.actions-section > div:last-child > div > div >.btn-primary{
	background-color: unset; border: unset;
}

span.error{ font-size: 14px; color: #ff6161 ; display:block;margin-left:13px;  }


.home-page-links{
	list-style: none;
	padding-left:15px;
}
.home-page-links > li{
	height: 30px;
}
.home-page-links > li > span{
	display: block;
	width:0;
	height: 20px;
	margin-top:5px;
	background-image:url('/images/bullet.svg');
	float: left;
}

.home-page-links > li > a{
	display: block;
	padding-top:3px;
	margin-left: 0;
	color: #0288d1 !important;
}

#modal {
	z-index: 910 !important;
}

.modal-backdrop{
	z-index: 900 !important;
}

#spinner{
	background-color: rgba(38, 38, 38, 0.4);width: 100vw;height: 100vh;position: fixed;overflow: hidden;z-index: 950;
	display: none;
}

#spinner > div{
	width: 100%;
	height: 50vh;
}

#spinner > img{
	display:block;
	margin: -50px auto 0;
	
	-webkit-animation-name: spin;
    -webkit-animation-duration: 1000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: spin;
    -moz-animation-duration: 1000ms;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: spin;
    -ms-animation-duration: 1000ms;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    
    animation-name: spin;
    animation-duration: 1000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-ms-keyframes spin {
    from { -ms-transform: rotate(360deg); }
    to { -ms-transform: rotate(0deg); }
}
@-moz-keyframes spin {
    from { -moz-transform: rotate(360deg); }
    to { -moz-transform: rotate(0deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(360deg); }
    to { -webkit-transform: rotate(0deg); }
}
@keyframes spin {
    from {
        transform:rotate(360deg);
    }
    to {
        transform:rotate(0deg);
    }
}

.modal-content{
	border-radius:7px !important;
}


@media screen and (max-width: 1603px){
	.demo-credentials{
		font-size:12px;
		padding:10px;
	}	
}