@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css');
@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900'); 

.login-body {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-align: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    background: rgb(55,55,55);
    background-image: url("/background.png");
    background-repeat: no-repeat;
    background-size: cover;
    /*background: radial-gradient(circle, rgba(55,55,55,1) 0%, rgba(48,48,48,1) 100%);*/
    font-family: 'Lato', sans-serif;
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.form-signin-container {
    width: 100%;
    max-width: 500px;
    animation: fadeIn;
    animation-duration: 2s;
}

.form-signin {
    background: #646464;
    border-radius: 5px;
    box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.23);
    -webkit-box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.23);
    -moz-box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.23);
    width: 100%;
    padding: 15px;
    padding-left: 30px;
    padding-right: 30px;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 40px;
}

label, h4 {
    color: #f7f7f7;
    font-weight: 300;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.28);
}

p {
    color: #f7f7f7;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.28);
}

.form-control, .input-group, .input-group-text {
    background: rgb(235,235,235);
    background: linear-gradient(180deg, rgba(235,235,235,1) 0%, rgba(200,200,200,1) 100%);
    border-radius: 1px;
    color: #373737;
    transition: 0.5s;
}

.form-control, .input-group, .input-group-text {
    border: 0;
}

.input-group {
    border: solid #393939 2px !important;
}

.input-group:hover {
    border: solid #2b2b2b 2px;
}

.form-control:focus
{
    background: rgb(235,235,235);
    box-shadow: none;
    color: #6e6e6e;
    border: 0;
    outline: 0;
}

.input-group:focus-within .input-group-prepend .input-group-text,
.form-control:focus ~ .input-group-append .input-group-text {
    background: rgb(235,235,235);
    color: #6e6e6e;
}
 
.btn {
	display: inline-block;
	padding: 10px 20px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.428571429;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	background-image: none;
	border: solid rgb(175, 175, 175) 1.9px;
	border-radius: 1px;
}

.btn-login {
	color: #fff;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: bold;
	background-color: #393939;
	border: solid rgb(175, 175, 175) 1.9px;
    box-shadow: 0px 0px 16px -1px rgba(0,0,0,0.27);
    -webkit-box-shadow: 0px 0px 16px -1px rgba(0,0,0,0.27);
    -moz-box-shadow: 0px 0px 16px -1px rgba(0,0,0,0.27);
	transition: all 500ms ease;
}

.btn-login:hover {
	color: #000;
	background-color: #fff;
    box-shadow: 0px 0px 16px -1px rgba(0,0,0,0.49);
    -webkit-box-shadow: 0px 0px 16px -1px rgba(0,0,0,0.49);
    -moz-box-shadow: 0px 0px 16px -1px rgba(0,0,0,0.49);
}

.alert-danger {
    text-shadow: 0px 0px 4px rgba(0,0,0,0.27);
    font-weight: bold;
    color: #e0e0e0;
    background: rgb(221,84,84);
    background: linear-gradient(180deg, rgba(221,84,84,1) 0%, rgba(179,74,74,1) 100%);
    border: solid#373737 1.5px;
    box-shadow: 0px 0px 12px -1px rgba(0,0,0,0.25);
    -webkit-box-shadow: 0px 0px 12px -1px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 12px -1px rgba(0,0,0,0.25);
}