body {
    height: 100%;
    /*overflow: hidden;*/
}
img {
    max-width: 100%;
}

.text-danger {
    color: #f16861 !important;
}

.text-warning {
    color: #4B93AF !important;
}

.display-3 {
    font-size: 3.8rem;
    font-weight: 100;
    color: black;
}

#login {
    /*padding-bottom: 100% !important;*/
}

#login {
    text-align: center;
    display: flex;
    align-items: center;
    position: relative;    
    width: 100%;
	top: 100px;
}

#logo {
	width: 40%;
}

#cover-caption {
    position: absolute;
    right: 30%;
    width: 40%;
    top: 5%;
}

@media only screen and (min-width: 0px) and (max-width: 1024px) {
			
	#cover-caption {
		position: absolute;
		right: 30%;
		width: 40%;
		top: 5%;
	}
	
	.display-3 {
		font-size: 3.0rem;
		font-weight: 300;
		width: 100%;
		color: black;
	}
}

@media (max-width: 768px) { 
	#cover-caption {
		position: absolute;
		right: 10%;
		width: 75%;
		top: 5%;
	}
	
	#login {
		background-image: none !important;
	}
	
	.display-3 {
		font-size: 3.0rem;
		font-weight: 300;
		width: 100%;
		color: black;
	}
	
}

@media (max-width: 543px) {
	
	hr {   
		border-top: 1px solid #373a3c;
	}
	
	#login {
		background-image: none !important;
	}
	
	#cover-caption {
		position: absolute;
		right: 0%;
		width: 100%;
		top: 5%;
	}
	
	.display-3 {
		font-size: 3.0rem;
		font-weight: 300;
		width: 100%;
		color: black;
	}
}