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

/*STYLING input (text, email, and password) ONCE 
NOTE: STILL CAN BE DONE SEPERATLY*/

textarea, input[type='text'], input[type='email'], input[type='phone'],input[type='password'],input[type='phone']{
border-radius: 3px;  
border: #bbb 1px solid;
width: 98%;
padding:8px;
margin:5px 0;
box-sizing:border-box;
transition:.3s;
outline:none;
} 

input:focus[type='text'], input:focus[type='email'], input[type='phone'], input:focus[type='password']{
border-radius: 10px;

}

input[type='submit']{
border-radius: 6px;
width: 50%;
height: 40px;
border:none;
background-color: var(--MenuBgColor);
color:#fff;
cursor: pointer;
}

input:hover[type='submit']{
border-radius: 6px;
height: 40px;
background-color: #996633;
color:#fff;
cursor: pointer;
margin-left: 0px;
}


.inputWithIcon input[type='text'], input[type='password'], input[type='email']{
	padding-left:50px;
}

.inputWithIcon{
	position: relative;
}

.inputWithIcon i{
	position: absolute;
	left:0;
	top: 8px;
	padding:10px 8px;
	color:#aaa;
	transition:.3s;
}

.inputWithIcon input[type='text']:focus + i, input[type='password']:focus + i, input[type='email']:focus + i{
	color:dodgerBlue;
}


@media only screen and (max-width: 350px){
	.loginForm img{
		margin-left: 70px;
	}
}