@charset "UTF-8";


#box-verif-email
{
	width: 1170px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr;
	grid-template-areas: 
		"code text";
	background-color: rgba(0,0,0,0.9);
	border-radius: 15px;
	height: 100%;
	position: absolute;
	z-index: 100;
}
		
#check-code-email
{
	grid-area: code;
	color: #FFF;
	padding-left: 50px;
	padding-top: 50px;
}

#info-text-email
{
	grid-area: text;
	color: #FFF;
	font-family: overpass-light, Arial;
	font-size: 1.3rem;
	padding-top: 173px;
	padding-right: 50px;
	line-height: 30px;
}

#tx-verif-email
{
	font-family: overpass-extrabold, Arial;
	font-size: 2rem;
	margin-bottom: 80px;
}

#tx-inscrire-code
{
	font-family: overpass-light, Arial;
	font-size: 1.5rem;
	margin-bottom: 25px;
}

#cont-input-code-verif-email
{
	display: flex;
}

#input-code-verif-email
{
	outline: none;
	height: 50px;
	font-size: 1.4rem;
	border-radius: 8px;
	border: none;
	width: 150px;
	text-align: center;
	margin-right: 15px;
}

.btn-verifier-and-envoi-code-mail
{
	height: 50px;
	font-size: 1.4rem;
	border-radius: 8px;
	border: 1px solid #FFF;
	width: 180px;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	-webkit-transition: background-color 0.2s, border 0.2s, color 0.2s;
	-moz-transition: background-color 0.2s, border 0.2s, color 0.2s;
	-o-transition: background-color 0.2s, border 0.2s, color 0.2s;
	transition: background-color 0.2s, border 0.2s, color 0.2s;
}

.btn-verifier-and-envoi-code-mail:hover
{
	background-color: #FFF;
	color: #000;
}

.ajust-btn-renvoyer-code
{
	width: 280px;
}

#tx-mail-non-recu
{
	font-family: overpass-light, Arial;
	font-size: 1.2rem;
	margin-top: 80px;
	margin-bottom: 20px;
}

#tx-bloque-mail
{
	font-family: overpass-light, Arial;
	font-size: 1.1rem;
	margin-top: 20px;
}

.tx-bold-un-probleme
{
	font-family: overpass-bold, Arial;
}

.link-verif-email
{
	text-decoration: underline;
	color: #FFF;
}

.link-verif-email:hover
{
	text-decoration: underline dotted;
}

#retour-code-erreur
{
	background-color: #424242;
	width: 155px;
	height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 15px;
	border-radius: 7px;
	font-size: 1rem;
	color: #FFF;
}

@media screen and (max-width: 1200px)
{
	#box-verif-email
	{
		width: 100%;
		border-radius: 0;
	}
}

/*rupture en dessous de tablette portrait*/
@media screen and (max-width: 959px)
{
	#info-text-email
	{
		padding-right: 22px;
		padding-left: 22px;
		padding-top: 70px;
		padding-bottom: 80px;
	}

	#box-verif-email
	{
		overflow-y: scroll;
		grid-template-areas: 
		"code code"
		"text text";
	}

	#check-code-email
	{
		padding-left: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-right: 22px;
		margin-left: 22px;
	}
}

/*rupture smartphone*/
@media screen and (max-width: 767px)
{
	.btn-verifier-and-envoi-code-mail
	{
		width: 140px;
	}

	.ajust-btn-renvoyer-code
	{
		width: 310px;
	}
}