@charset "utf-8";

html {
	min-height: 100%;
}

body {
	width: 100%;
	height: 100%;
	font-family: 'helvetica';
	margin: 0;
	padding: 0;
	/*background-color: #ecb955;*/
	background-color: white;
	background-image: url('img/fond.jpg');
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 100%;
	min-height: 600px;
}

a {
	font-size: 5vw;
	color: black;
}

a:visited {
	color: black;
}

p {
	font-size: 5vw;
}

label {
	font-size: 5vw;
}

input {
	font-size: 5vw;
}

input[type="submit"] {
	position: relative;
	display: block;
	border: none;
	margin: 5% auto auto;
	padding: 3vw 15vw;
	width: 60vw;
	background-image: url('img/btn.png');
	background-size: 60vw;
	background-repeat: no-repeat;
	background-color: transparent;
	font-size: 3vw;
	font-weight: bold;
	color: #e30045;
	cursor: pointer;
}
input[type="submit"]:hover {
	background-image: url('img/btnhover.png');
}

button {
	position: relative;
	display: block;
	border: none;
	margin: 5% auto auto;
	padding: 3vw 15vw;
	width: 60vw;
	background-image: url('img/btn.png');
	background-size: 60vw;
	background-repeat: no-repeat;
	background-color: transparent;
	font-size: 3vw;
	font-weight: bold;
	color: #e30045;
	cursor: pointer;
}
button:hover {
	background-image: url('img/btnhover.png');
}

img {
	width: 90%;
	margin: 5%;
}

video {
	width: 90%;
	margin: 5% 5% 0;
	border:1px solid #e30045;
}

.clear {
	clear: both;
}

h2.rougenoel {
	color: #e30045;
	font-size: 3em;
}

h2 {
	color: #e30045;
	font-size: 6vw;
}

#megawrapper {
	position: relative;
	width: 90%;
	height: 100%;
	margin: auto;
}

.cookierequired {
	min-height: calc(95vh - 99px - 86px);
}

#cookierequired1, #cookierequired2 {
	position: relative;
	text-align: center;
	padding: 10% 5% 5%;
	margin-top: 25%;
}


#answerform {
	width:90%;
	margin:5%;
}

.session_field {
	margin: 5vw;
}

.wrapperlienintro a {
	position: relative;
	display: block;
	font-size: 6vw;
	width: 60vw;
	min-height: 10vw;
	padding: 5vw 15vw;
	background-position: center;
	background-size: 90vw auto;
	background-image: url('img/btnbig.png');
	background-repeat: no-repeat;
	color: #e30045;
	text-decoration: none;
	cursor: pointer;
}
.wrapperlienintro a:hover {
	background-image: url('img/btnbighover.png');
}

.wrapperlienquartier a {
	position: relative;
	display: block;
	font-size: 6vw;
	width: 60vw;
	min-height: 10vw;
	padding: 5vw 15vw;
	background-position: center;
	background-size: 90vw auto;
	background-image: url('img/btnbig.png');
	background-repeat: no-repeat;
	color: #e30045;
	text-decoration: none;
	cursor: pointer;
}
.wrapperlienquartier a:hover {
	background-image: url('img/btnbighover.png');
}

.wrapperretry a {
	position: relative;
	display: block;
	width: 60vw;
	padding: 3vw 0vw;
	background-image: url('img/btn.png');
	background-size: 60vw;
	background-repeat: no-repeat;
	background-color: transparent;
	font-size: 3vw;
	font-weight: bold;
	color: #e30045;
	text-decoration: none;
	cursor: pointer;
	margin: 0 auto;
}
.wrapperretry a:hover {
	background-image: url('img/btnhover.png');
}

.wrappertext {
	padding: 5%;
}
.wrappertext p {
	margin: 0;
}

.wrapperchooselevel .chooselevelline {
	text-align: left;
}

.wrapperchoosechapter .choosechapterline {
	text-align: left;
}

#wrapperchoosescene .choosesceneline {
	text-align: left;
}

.wrapperchooselevel {
	margin-top: 15%;
}

.wrapperchoosechapter {
	margin-top: 5%;
	margin-bottom: 5%;
}

.wrapperchoosedifficulty {
	margin: 5% auto;
	width: 73.8vw;
}

#wrapperchoosescene {
	margin-top: 5%;
	margin-bottom: 5%;
}

.chooselevelline {
	/*padding-left: 10%;*/
	margin-bottom: 5%;
	min-width: 75vw;
}

.choosechapterline {
	/*padding-left: 10%;*/
	margin-bottom: 5%;
	min-width: 75vw;
}

.choosesceneline {
	padding-left: 10%;
	margin-bottom: 5%;
}

input[type="radio"].inputbutton {
	display: block;
	width: 75vw;
	height: 19.625vw;
	-webkit-appearance:none;
	   -moz-appearance:none;
	        appearance:none;
	background-size: 100%;
	margin: 5% auto 5%;
}

input[type="radio"].inputbutton:disabled {
	opacity: 0.5;
}

.wrapperchoosedifficulty input[type="radio"].inputbutton {
	width: 22.6vw;
	height: 15.7vw;
	float: left;
	margin : 5% 1vw 5%;
}

#season1 { background-image: url('img/jeu2021.png'); }
#season1:checked { background-image: url('img/jeu2021select.png'); }
#season2 { background-image: url('img/jeu2022.png'); }
#season2:checked { background-image: url('img/jeu2022select.png'); }

#level11 { background-image: url('img/kevin.png'); }
#level11:checked { background-image: url('img/kevinselect.png'); }

#level12 { background-image: url('img/phiephie.png'); }
#level12:checked { background-image: url('img/phiephieselect.png'); }

#level13 { background-image: url('img/dantonin.png'); }
#level13:checked { background-image: url('img/dantoninselect.png'); }

#level24 { background-image: url('img/kevin.png'); }
#level24:checked { background-image: url('img/kevinselect.png'); }

#level25 { background-image: url('img/phiephie.png'); }
#level25:checked { background-image: url('img/phiephieselect.png'); }

#level26 { background-image: url('img/dantonin.png'); }
#level26:checked { background-image: url('img/dantoninselect.png'); }

#chapter11 { background-image: url('img/acte1-2021.png'); }
#chapter11:checked { background-image: url('img/acte1-2021select.png'); }

#chapter12 { background-image: url('img/acte2-2021.png'); }
#chapter12:checked { background-image: url('img/acte2-2021select.png'); }

#chapter13 { background-image: url('img/acte3-2021.png'); }
#chapter13:checked { background-image: url('img/acte3-2021select.png'); }

#chapter21 { background-image: url('img/acte1-2022.png'); }
#chapter21:checked { background-image: url('img/acte1-2022select.png'); }

#chapter22 { background-image: url('img/acte2-2022.png'); }
#chapter22:checked { background-image: url('img/acte2-2022select.png'); }
#chapter22:disabled { background-image: url('img/acte2-2022grey.png'); }

#chapter23 { background-image: url('img/acte3-2022.png'); }
#chapter23:checked { background-image: url('img/acte3-2022select.png'); }
#chapter23:disabled { background-image: url('img/acte3-2022grey.png'); }

#difficulty11 { background-image: url('img/niv1.png'); }
#difficulty11:checked { background-image: url('img/niv1select.png'); }

#difficulty12 { background-image: url('img/niv2.png'); }
#difficulty12:checked { background-image: url('img/niv2select.png'); }

#difficulty13 { background-image: url('img/niv3.png'); }
#difficulty13:checked { background-image: url('img/niv3select.png'); }

#difficulty21 { background-image: url('img/niv1.png'); }
#difficulty21:checked { background-image: url('img/niv1select.png'); }

#difficulty22 { background-image: url('img/niv2.png'); }
#difficulty22:checked { background-image: url('img/niv2select.png'); }

#difficulty23 { background-image: url('img/niv3.png'); }
#difficulty23:checked { background-image: url('img/niv3select.png'); }

.divetape p {
	font-size: 6vw;
	color: #e30045;
	margin: 8% 0 0;
	font-weight:bold;
}

.wrappergoodanswer h2 {
	font-size: 6vw;
	color: #e30045;
	margin: 8% 0 0;
	font-weight:bold;
}

.wrapperbadanswer {
	margin-bottom: 5vw;
}

.wrapperbadanswer p {
	font-size: 6vw;
	color: #e30045;
	margin: 8% 0 0;
	font-weight:bold;
}

#wrapperscore {
	position: relative;
}

#wrapperscore p {
	color: green;
	font-weight: bold;
	font-size: 4vw;
}

button.bigbutton {
	background-image: url('img/btnbig.png');
	min-height: 15vw;
}
button.bigbutton:hover {
	background-image: url('img/btnbighover.png');
}

#riddles {
	position: absolute;
	left: -2vw;
	top: 2vw;
	width: 22.6vw;
	height: 15.7vw;
	background-image: url('img/enigmes.png');
	background-size: 100%;
}

#checkpoint {
	position: absolute;
	right: -2vw;
	top: -6vw;
	width: 22.6vw;
	height: 15.7vw;
	background-image: url('img/retour.png');
	background-size: 100%;
}

#riddlespopup {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	padding-top: 5vw;
	color: white;
	text-shadow: 2px 2px grey;
}

.riddlestext {
	position: relative;
	margin: 0 auto 4vw;
}

.riddlestext p {
	margin: 0;
}

#riddlespopupbackground {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: grey;
	opacity: 0.9;
}

#riddlesclose {
	position: absolute;
	left: 3vw;
	top: 3vw;
	width: 10vw;
	height: 10vw;
	background-image: url('img/close.png');
	background-size: 100%;
}

.riddleslist {
	position: relative;
	width: 74vw;
	margin: 0 auto;
}

.riddle {
	float: left;
	width: 36vw;
	height: 20.6vw;
	background-size: 100%;
	margin-bottom: 2vw;
}

.riddle > a {
	display: block;
	width: 100%;
	height: 100%;
}

.riddle:nth-child(odd) {
	margin-right: 2vw;
}

#riddle1.riddleon { background-image: url('img/btn01.png'); }
#riddle2.riddleon { background-image: url('img/btn02.png'); }
#riddle3.riddleon { background-image: url('img/btn03.png'); }
#riddle4.riddleon { background-image: url('img/btn04.png'); }
#riddle5.riddleon { background-image: url('img/btn05.png'); }
#riddle6.riddleon { background-image: url('img/btn06.png'); }
#riddle7.riddleon { background-image: url('img/btn07.png'); }
#riddle8.riddleon { background-image: url('img/btn08.png'); }
#riddle9.riddleon { background-image: url('img/btn09.png'); }
#riddle10.riddleon { background-image: url('img/btn10.png'); }
#riddle1.riddleoff { background-image: url('img/btn01off.png'); }
#riddle2.riddleoff { background-image: url('img/btn02off.png'); }
#riddle3.riddleoff { background-image: url('img/btn03off.png'); }
#riddle4.riddleoff { background-image: url('img/btn04off.png'); }
#riddle5.riddleoff { background-image: url('img/btn05off.png'); }
#riddle6.riddleoff { background-image: url('img/btn06off.png'); }
#riddle7.riddleoff { background-image: url('img/btn07off.png'); }
#riddle8.riddleoff { background-image: url('img/btn08off.png'); }
#riddle9.riddleoff { background-image: url('img/btn09off.png'); }
#riddle10.riddleoff { background-image: url('img/btn10off.png'); }