@font-face {
  font-family: 'Montserrat Light';
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/montserrat-v12-latin-300.woff2") format("woff2"),url("../fonts/montserrat-v12-latin-300.woff") format("woff");
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/montserrat-v12-latin-regular.woff2") format("woff2"),url("../fonts/montserrat-v12-latin-regular.woff") format("woff");
}
@font-face {
  font-family: 'Montserrat Bold';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/montserrat-v12-latin-700.woff") format("woff2"),url("../fonts/montserrat-v12-latin-700.woff") format("woff");
}

img{width: 100%;height:auto;}

body{
	background:url('../imgs/bg.jpg');
	background-size: cover;
	background-position:center;
	background-repeat: no-repeat;
	color:#fff;
	margin:0;
	 width: 100vw;
	height:100vh;
	
	
}

body.home{
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding:0 33px;
	width: calc(100vw - 66px);
}


.container{
	text-align: center;
}

.btn-joya{
	font-family: 'Montserrat Light';
	text-align: center;
	font-size: 24px;
	font-weight: 300;
	color:#000;
	text-decoration: none;
	padding:16px 24px;
	align-items: center;
	border-radius: 32px;
	background: linear-gradient(93deg, #FFC64A 4.38%, #F6931F 85.03%, #DF4411 177.12%);
	line-height: 110%;
	border:0;
	width: fit-content;
	margin:0 auto;
	cursor: pointer;
}

.inscription .container, .infos .container,.questions .container{
	margin:120px 44px 0;
	text-align: center;
	
}
.inscription h1, .infos h1, .questions h1{
	margin:0 auto 40px;
}

.inscription .input-group{
	margin:16px 0;
	width:100%;
	text-align: left;
}

.inscription .input-group label{
	font-family: 'Montserrat Bold';
	font-size: 16px;
	line-height: 160%;
	color:#fff;
	width: 100%;
	margin-bottom:16px;
}

.inscription form{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height:70vh;
}

.inscription .input-group input[type=text],.inscription .input-group input[type=email]{
	padding:8px 16px;
	border-radius: 100px;
	background-color:#fff;
	font-family: 'Montserrat';
	font-size: 16px;
	font-weight: 400;
	line-height: 160%;
	color:#AAA;
	width: calc(100% - 32px);
	border:0;
}
.infos .infos-content{
	display: flex;
	flex-direction: column;
	justify-content: center;
	height:40vh;
}

.infos .infos-content .infos-texte{
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.infos .infos-texte h2{
	font-family:'Montserrat Bold';
	font-size:40px;
	font-weight:700;
	line-height:160%;
	text-align: center;
	margin:0;	
}

.infos .infos-texte p{
	font-family:'Montserrat';
	font-size:24px;
	font-weight:400;
	line-height:140%;
	text-align: center;	
	margin:0;	
}

.questions label{
	font-family: 'Montserrat';
	font-size: 24px;
	font-weight: 400;
	line-height: 140%;
	text-align: center;
	margin:20px 0;
	display: block;
}
.questions .bloc-reponse{
	display:flex;
	flex-direction: column;
	justify-content: center;
	gap:16px;
	height:40vh;
}

.questions .bloc-reponse .btn-question{
	padding:16px;
	border-radius:8px;
	border:2px solid #FFC64A;
	background: #fff;
	font-family:'Montserrat';
	font-size:20px;
	font-weight:400;
	line-height:140%;
	text-align: center;
	color:#AAA; 
	cursor:pointer;
}

.questions .bloc-reponse .btn-question.btn-select{
	border-radius:8px;
	border:2px solid #fff;
	background: linear-gradient(93deg, #FFC64A 4.38%, #F6931F 85.03%, #DF4411 177.12%);
	color:#fff; 
}

.questions .bloc-reponse .btn-question.btn-error{
	border-radius:8px;
	border:2px solid #fff;
	background: linear-gradient(92deg, #EC6608 2.97%, #E94E1B 51.44%, #E30613 99.41%);
	color:#fff; 
}

.infos.qrcode .img-content{
	width: 80%;
	margin:80px auto 20px;
}

.infos.qrcode .infos-texte h2{
	font-size:24px;	
}
.questions .bloc-reponse{
	justify-content: flex-start;
}

.questions .bloc-reponse .input-score{
	padding:16px;
	text-align: center;
	border-radius:8px;
	border:2px solid #FFC64A;
	background:#fff;
	font-family: 'Montserrat';
	font-size: 16px;
	font-weight: 400;
	line-height: 160%;
	color:#AAA;
}

.questions .bloc-reponse .input-score:focus{	
	outline:0;
}

.retour-question .infos-texte{
	margin-bottom:100px;
}

@media screen and (orientation: landscape) {
	body.video{
		width:auto;height:100vh;
		background:#fff;
		text-align: center;
		overflow: hidden;
	}

	body.video video{
		height:100%;
		width: auto;
		margin:0 auto;
		
		object-fit: cover;
	}
}

@media screen and (orientation: portrait) {
	body.video{
		width:100vw;
		height: 100vh;
		background:#fff;
		text-align: center;
		overflow: hidden;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	body.video video{
		height:640px;
		width: 380px;
		margin:0 auto;
		object-fit: cover;
	}
}

@media screen and (min-width: 400px) {
	body{
		background:url('../imgs/bg@2x.jpg');
		background-size: cover;
		background-position:center;
		background-repeat: no-repeat;
		color:#fff;
		margin:0;
		width: 100vw;
		height:100vh;
	}
}