@charset "utf-8";
/* CSS Document */

@import url("https://use.typekit.net/hdu5wpp.css");

/* Start of Desktop styling */
@media screen and (min-width: 1024px){

html{
	overflow-x: hidden;
}

body{
	background-color: rgba(0,0,25);
	margin:0vw;
	padding:0vw;
}

.login{
	width: 30vw;
	margin-left:35vw;
	margin-top:3vw;
}
    
.login img{
	width:20vw;
	height:auto;
	margin-left:5vw;
}    
    
.login h1{
    font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:2vw;
    color:rgba(255,255,255,1.0);
    text-align: center;
}
    
.login a{
    font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:1.2vw;
    color:rgba(255,255,255,1.0);
    text-align: center;
    display: block;
    text-decoration: none;
}     

.login input[type=email]{
	width:26vw;
	border-radius: 5vw;
	border-color: rgba(255,255,255,0.2);
	border-style: solid;
	padding-left:2vw;
	padding-right:2vw;
	border-width: thick;
	background-color:rgba(200,200,200,1.0);
	font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:2vw;
	color:rgba(0,0,25,1.0);
	transition:0.8s;
	margin-bottom:1vw;
	text-align:center;
	outline:none;
}

.login input[type=email]:focus{
	border-color:rgba(49,168,255,1.0);
	transition:0.8s;
}
    
.login input[type=email]:valid{
	border-color:rgba(49,168,255,1.0);
    background-color:rgba(49,168,255,1.0);
	transition:0.8s;
} 
    
.login input[type=email]:invalid{
	border-color:rgba(255,49,97,1.0);
	transition:0.8s;
}    

.login input[type=password]{
	width:26vw;
	border-radius: 5vw;
	border-color: rgba(255,255,255,0.2);
	border-style: solid;
	padding-left:2vw;
	padding-right:2vw;
	border-width: thick;
	background-color:rgba(200,200,200,1.0);
	font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:2vw;
	color:rgba(0,0,25,1.0);
	transition:0.8s;
	margin-bottom:1vw;
	text-align:center;
	outline:none;
}

.login input[type=password]:focus{
	border-color:rgba(49,168,255,1.0);
	transition:0.8s;
}
    
.login input[type=password]:valid{
	border-color:rgba(49,168,255,1.0);
    background-color:rgba(49,168,255,1.0);
	transition:0.8s;
}
    
.login input[type=password]:invalid{
	border-color:rgba(255,49,97,1.0);
	transition:0.8s;
}    

.login select{
	width:30.5vw;
	border-radius: 5vw;
	border-color: rgba(255,255,255,0.2);
	border-style: solid;
	padding-left:2vw;
	padding-right:2vw;
	border-width: thick;
	background-color:rgba(200,200,200,1.0);
	font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:2vw;
	color:rgba(0,0,25,1.0);
	transition:0.8s;
	margin-bottom:1vw;
	text-align:center;
    text-align-last: center;
	outline:none;
}

.login select:focus{
	border-color:rgba(49,168,255,1.0);
	transition:0.8s;
}
    
.login select:valid{
	border-color:rgba(49,168,255,1.0);
    background-color:rgba(49,168,255,1.0);
	transition:0.8s;
} 
    
.login select:invalid{
	border-color:rgba(255,49,97,1.0);
	transition:0.8s;
}     

.login input[type=submit]{
	width:20vw;
	border-radius: 5vw;
	border-color: rgba(255,255,255,0.2);
	border-style: solid;
	padding-left:2vw;
	padding-right:2vw;
	border-width: thick;
	background-color:rgba(200,200,200,1.0);
	font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:2vw;
	color:rgba(0,0,25,1.0);
	transition:0.8s;
	margin-bottom:1vw;
	margin-left:5vw;
	text-align:center;
	outline:none;
}

.login input[type=submit]:hover{
	border-color:rgba(255,255,255,1.0);
	transition:0.8s;
	cursor:pointer;
	background-color: rgba(255,255,255,1.0);
}

.login input[type=submit]:focus{
	border-color:rgba(255,255,255,1.0);
	transition:0.8s;
	cursor:pointer;
	background-color: rgba(255,255,255,1.0);
}

	
}

/* Start of Mobile styling */
@media screen and (max-width: 1023px){

html{
	overflow-x: hidden;
}

body{
	background-color: rgba(0,0,25);
	margin:0vw;
	padding:0vw;
}

.login{
	width: 90vw;
	margin-left:5vw;
	margin-top:10vw;
}
    
.login img{
	width:90vw;
	height:auto;
	margin-left:0vw;
}   
    
.login h1{
    font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:7vw;
    color:rgba(255,255,255,1.0);
    text-align: center;
}   
    
.login a{
    font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:4vw;
    color:rgba(255,255,255,1.0);
    text-align: center;
    display: block;
    text-decoration: none;
}      

.login input[type=email]{
	width:86vw;
	border-radius: 5vw;
	border-color: rgba(255,255,255,0.2);
	border-style: solid;
	padding-left:2vw;
	padding-right:2vw;
	border-width: thick;
	background-color:rgba(200,200,200,1.0);
	font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:7vw;
	color:rgba(0,0,25,1.0);
	transition:0.8s;
	margin-bottom:5vw;
	text-align:center;
	outline:none;
}

.login input[type=email]:focus{
	border-color:rgba(49,168,255,1.0);
	transition:0.8s;
}
    
.login input[type=email]:valid{
	border-color:rgba(49,168,255,1.0);
    background-color:rgba(49,168,255,1.0);
	transition:0.8s;
} 
    
.login input[type=email]:invalid{
	border-color:rgba(255,49,97,1.0);
	transition:0.8s;
}    

.login input[type=password]{
	width:86vw;
	border-radius: 5vw;
	border-color: rgba(255,255,255,0.2);
	border-style: solid;
	padding-left:2vw;
	padding-right:2vw;
	border-width: thick;
	background-color:rgba(200,200,200,1.0);
	font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:7vw;
	color:rgba(0,0,25,1.0);
	transition:0.8s;
	margin-bottom:5vw;
	text-align:center;
	outline:none;
}

.login input[type=password]:focus{
	border-color:rgba(49,168,255,1.0);
	transition:0.8s;
}
    
.login input[type=password]:valid{
	border-color:rgba(49,168,255,1.0);
    background-color:rgba(49,168,255,1.0);
	transition:0.8s;
}
    
.login input[type=password]:invalid{
	border-color:rgba(255,49,97,1.0);
	transition:0.8s;
}    

.login select{
	width:91vw;
	border-radius: 5vw;
	border-color: rgba(255,255,255,0.2);
	border-style: solid;
	padding-left:2vw;
	padding-right:2vw;
	border-width: thick;
	background-color:rgba(200,200,200,1.0);
	font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:7vw;
	color:rgba(0,0,25,1.0);
	transition:0.8s;
	margin-bottom:5vw;
	text-align:center;
    text-align-last: center;
	outline:none;
}

.login select:focus{
	border-color:rgba(49,168,255,1.0);
	transition:0.8s;
}
    
.login select:valid{
	border-color:rgba(49,168,255,1.0);
    background-color:rgba(49,168,255,1.0);
	transition:0.8s;
} 
    
.login select:invalid{
	border-color:rgba(255,49,97,1.0);
	transition:0.8s;
}     

.login input[type=submit]{
	width:90vw;
	border-radius: 5vw;
	border-color: rgba(255,255,255,0.2);
	border-style: solid;
	padding-left:2vw;
	padding-right:2vw;
	border-width: thick;
	background-color:rgba(200,200,200,1.0);
	font-family: din-condensed, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:7vw;
	color:rgba(0,0,25,1.0);
	transition:0.8s;
	margin-bottom:1vw;
	margin-left:0vw;
	text-align:center;
	outline:none;
}

.login input[type=submit]:hover{
	border-color:rgba(255,255,255,1.0);
	transition:0.8s;
	cursor:pointer;
	background-color: rgba(255,255,255,1.0);
}

.login input[type=submit]:focus{
	border-color:rgba(255,255,255,1.0);
	transition:0.8s;
	cursor:pointer;
	background-color: rgba(255,255,255,1.0);
}

	
}