#ferme_center { margin: 0 auto; max-height: 52vh; max-width: 52vw; position: relative; }
#ferme_ferme { max-height: 52vh; max-width: 52vw; opacity: 1; }
#ferme_icones { 
	width: 40%;
	height: 15%;
	position: absolute;
	top: 49%;
	left: 15%;
	background-image: url('assets/panneau.png');
	background-size: 100% 100%; background-position: center; background-repeat: no-repeat;
}
#ferme_icones div { 
	display: inline-block;
	height: 80%;
	aspect-ratio: 1;
	background-color: white;
	background-size: contain; background-position: center; background-repeat: no-repeat;
	border-radius: 50%;
	border: 2px solid black;
}
#ferme_fermeDiv { position: relative; bottom: 0; }
#ferme_fermeDiv.ferme_open { bottom: 100vh; transition: bottom 3s linear; }
.ferme_animal {  max-height: 13vh; max-width: 13vw; z-index: -1; position: absolute; bottom: 5px; }
.ferme_enter { left: -50vw; }
.ferme_enter.ferme_s1 { left: 42%; transition: left 1s linear; }
.ferme_enter.ferme_s2 { left: 42%; transition: left 2s linear; }
.ferme_enter.ferme_s4 { left: 42%; transition: left 4s linear; }
.ferme_enter.ferme_s6 { left: 42%; transition: left 6s linear; }
.ferme_exit { right: 50%; }
.ferme_exit.ferme_s1 { right: -50vw; transition: right 1s linear; }
.ferme_exit.ferme_s2 { right: -50vw; transition: right 2s linear; }
.ferme_exit.ferme_s4 { right: -50vw; transition: right 4s linear; }
.ferme_exit.ferme_s6 { right: -50vw; transition: right 6s linear; }
#ferme_answer { opacity: 0; user-select: none; }
.ferme_answer_block { display: inline-block; }
.ferme_answer_block img {  max-height: 8vh; }
#ferme_answer.ferme_show { opacity: 1; transition: opacity 1s linear; }
#ferme_answer.ferme_blocked button { visibility: hidden; }
#ferme_answer button, #ferme_answerText1, #ferme_answerText2, #ferme_answerText3 { font-size: 1.2em; padding: 0.1em 0.4em; }
#ferme_validButton { margin-left: 2em; }
#ferme_result { position: absolute; width: 100%; opacity: 0; bottom: 0; }
#ferme_result.ferme_show { opacity: 1; bottom: 20vh; transition: opacity 1s linear, bottom 1s linear; }
#ferme_result button { font-size: 120%; }
.ferme_good { font-weight: bold; color: green; }
.ferme_bad { font-weight: bold; color: red; }
