@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');
body{
	margin:0;
	padding: 0;
	font-family: 'Montserrat',sans-serif;
}

button{
	text-transform: uppercase;
}
.container {
	display: grid;
	grid-template-columns: 1fr 1fr;
	//grid-column-gap: 50px;
	//padding: 10px 20px 0px 20px;
}

/*img.image-holder {
	width: 100%;
	height: 100vh;
}*/

.left-body{
	background-color: #e8e8e8;
	height: 100vh;
	background-image: url("https://placeimg.com/640/480/nature");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
/*for log in(from here)*/
.form-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;

}

.form-container{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 350px;

}

form.login-form {
	text-align: center;
	width: 100%;
}

.logo {
	max-width: 60px;
	max-height: 60px;

}

h1.title {
	text-align: center;
	font-size: 24px;
    font-weight: 400;
    letter-spacing: 0;
}

input.text-input {
	margin-bottom: 20px;
	outline: none;
	border: 0px;
	border-bottom: 1px solid #d3d3d3;
	width: 100%;
	transition: border-bottom 0.5s;
	font-weight: 400;
	font-size: 14px;
	letter-spacing: 0.5px;
}

input.text-input:focus{
	border-bottom: 1px solid #f10e6f ;
	font-weight: 500;
}

button.login-btn, .logout, .continue {
  background-color: #f10e6f;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  display: inline-block;
  font-size: 12px;
  font-weight: 500;
  margin-top: 15px;
  margin-bottom: 15px;
  outline: none;
  width: 100%;
  cursor: pointer;
  letter-spacing: 1.25px;
}

.overline {
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
}

/*.overline-signup {
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
}*/
/*log in (upto here)*/


/*for already logged in (from here)*/
.user-info-container {
	background-color: #f5f5f5;
	width: 100%;
	align-items: center;
	padding: 10px;
	display: grid;
	grid-template-columns: 1fr 3.5fr;
	box-sizing: border-box;
}

.profile-picture {
	height: 56px;
	width: 56px;
	border-radius: 50%;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
}

.user-info-text {
/*	display: grid;
	grid-template-columns: 1fr;
	grid-gap: 0;*/
}

.user-name{
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.5px;

}

.email{
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0.25px;
}
/*already logged in (upto here)*/
