html, body {
    height: 100%;
}

html {
    background-color: #1c2631 !important;
}

body {
    background: none !important;
}

@media all and (min-height: 400px) {
    .login-panel {
        margin-top: calc(25vh - 100px);
    }
}

@media all and (max-height: 400px) {
    .login-panel {
        margin-top: calc(25vh - 70px);
    }

        .login-panel .card-title {
            margin-bottom: 0 !important;
        }

            .login-panel .card-title > h3 {
                margin-top: 0.5rem !important;
                margin-bottom: 0 !important;
            }

        .login-panel .md-form {
            margin-top: 1rem !important;
            margin-bottom: 1rem !important;
        }

    #btn_login {
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
    }
}

@media all and (min-height: 700px) {
    .registration-panel {
        margin-top: calc(20vh - 100px);
    }
}

.card {
    background-color: #283544 !important;
}

/* Remove autofill background */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0px 0px 0px 100px #283544 inset !important;
    box-shadow: 0px 0px 0px 100px #283544 inset !important;
    background-color: #283544 !important;
}

input:-webkit-autofill {
    -webkit-text-fill-color: lightgray !important;
    color: lightgray !important;
}

.md-form input {
    color: lightgray;
}

    .md-form input:focus {
        color: white;
    }

.login-panel .card {
    border-radius: 10px !important;
    opacity: 0.96 !important;
}

.registration-panel .card {
    opacity: 0.96 !important;
}

.md-form.input-group .form-control {
    padding: .6rem 0 .4rem 0 !important;
}

/*   Site css   */
input[type="text"].form-control, input[type="text"].hasDatepicker, input[type="number"].form-control {
	height: auto !important;
	font-size: 0.875rem !important
}

i.prefix {
	line-height: 32px !important;
}

.md-form label {
	left: 0 !important;
}

.md-form > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label, .md-form > input[type="time"]:not(.browser-default) + label {
	font-size: .95rem !important;
	-webkit-transform: translateY(-14px) scale(0.8) !important;
	transform: translateY(-14px) scale(0.8) !important;
	-webkit-transform-origin: 0 100%;
	transform-origin: 0 100%;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "Open Sans",sans-serif;
	font-weight: 300;
}

#toast-container {
	z-index:9999;
}

#loading {
	background: url('/backend/images/sports.gif') rgba(0, 0, 0, 0.815) no-repeat center center;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1999;
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
}

.invalid-feedback {
	font-size: 100% !important;
	margin-left: 2rem !important;
	position: absolute;
	top: 2.5rem;
}

.color-2 {
	background-color: #214a80 !important;
}

::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.4);
	border-radius: 10px;
}

::-webkit-scrollbar-thumb {
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.7);
}

::-webkit-scrollbar {
	width: 10px;
}

	::-webkit-scrollbar:vertical {
		width: 5px;
	}

::-webkit-scrollbar-button:increment, .contenedor::-webkit-scrollbar-button {
	display: none;
}