html, body {
	background-image: url('../images/dark-blue-space.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	font-family: Montserrat; font-size: 24px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 20px;
	padding-top: 0 !important;
	margin-top: 0 !important;
}

body {
	padding-top: 216px !important;
}

.logincontainer {
	font-size: 12px;
	padding-top: 0;
}

.logincontainer2 {
	font-size: 12px;
	padding-top: 0;
}

a.forgot-pw {
	font-size: 16px !important;
}

@media screen and (max-width: 640px) and (orientation: portrait) {
	body {
		padding-top: 94px !important;
	}
	.logincontainer {
		font-size: 12px;
		/* padding-top: 0; */
		width: 100%;
		margin: 0;
		/* border: 2px solid green; */
	}
	.card {
		width: 100%;
	}
	h3 {
		font-size: 32px !important;
	}
	p.flowtext {
		font-size: 20px;
	}
	.card-header {
		margin-top: 40px;
	}
	.input-group-prepend span {
		width: 30px !important;
	}
	a.forgot-pw {
		font-size: 12px !important;
	}
}

@media screen and (max-height: 480px) {
	body {
		padding-top: 94px !important;
	}
	/*
	.logincontainer {
		border: 2px solid orange;
	}
	*/
	.fixed-footer, .fixed-footer2 {
		display: none;
	}
}

@media screen and (max-height: 320px) {
	body {
		padding-top: 94px !important;
	}
	div.forgot-pw {
		display: none !important;
	}
	.card-header {
		display: none;
	}
	/*
	.logincontainer {
		border: 2px solid yellow;
	}
	*/
}

@media screen and (max-height: 240px) {
	body {
		padding-top: 0 !important;
	}
	/*
	.logincontainer {
		border: 2px solid red;
	}
	*/
	.fixed-header {
		display: none;
	}
	.fixed-footer, .fixed-footer2 {
		display: none;
	}
	/*
	div.forgot-pw {
		display: none !important;
	}
	*/
}

@media screen and (min-width: 800px) and (min-height: 720px) and (orientation: landscape) and (orientation: portrait) {
	.logincontainer {
		font-size: 16px;
		/* padding-top: 148px; */
		position: absolute;
		right: 50%;
		bottom: 50%;
		transform: translate(50%,50%);
	}
}

@media screen and (max-height: 720px) and (orientation: landscape) and (orientation: portrait) {
	.logincontainer {
		font-size: 16px;
		position: absolute;
		/* padding-top: 148px; */
		top: 0;
		right: 50%;
		transform: translate(50%,0%);
	}
	h3 {
		/* background-color: blue; */
		font-size: 2.5em !important;
		line-height: 1.0em !important;
	}
	.card-header {
		/* border: 1px solid white; */
		padding: 0.5em !important;
		margin-top: 0.5em !important;
	}
	.card-body {
		/* border: 1px solid white; */
		margin-top: 0 !important;
		padding: 0.5em !important;
	}
	.form-group {
		margin-top: 0em !important;
		margin-bottom: 1.0em !important;
	}
}

/*
@media screen and (max-height: 700px) {
	.logincontainer {
		font-size: 16px;
		position: absolute;
		right: 50%;
		bottom: 50%;
		transform: translate(50%,50%);
	}
	h3 {
		background-color: blue;
		font-size: 12px;
	}
	.card-header {
		right: 0;
		bottom: 0;
		transform: none;
	}
}
*/

.logincontainer2 {
	font-size: 16px;
	padding-top: 0;
	/*position: absolute;*/
	right: 50%;
	/*bottom: 50%;*/
	/*transform: translate(50%,50%);*/
}


.card{
/*height: 500px;*/
/*
margin-top: 0;
margin-bottom: auto;*/
/*width: 400px;*/
text-align: center;
background-color: rgba(255,255,255,0) !important;
border: none;
}

.social_icon span{
font-size: 60px;
margin-left: 10px;
color: #FFC312;
}

.social_icon span:hover{
color: white;
cursor: pointer;
}

.card-header h1 {
font-size: 3vh;
color: white;
}

.card-header h3{
color: white;
}

.social_icon{
position: absolute;
right: 20px;
top: -45px;
}

.input-group-prepend span{
width: 60px;
background-color: #FFC312;
color: black;
border:0 !important;
}

input:focus{
outline: 0 0 0 0  !important;
box-shadow: 0 0 0 0 !important;

}

.remember{
color: white;
}

.remember input
{
width: 20px;
height: 20px;
margin-left: 15px;
margin-right: 5px;
}

.login_btn{
color: black;
background-color: #FFC312;
margin-top: 30px;
}

.login_btn:hover{
color: black;
background-color: white;
}

.links{
color: white;
}

.links a{
margin-left: 4px;
}