h1{
	text-align: center;
	color: white;
}
h2 {
	text-align: center;
	background: linear-gradient(90deg,#00e4d5,#3942c6);
	background-clip: inherit;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

main{
	align-items: center;
}
article.mainTexte{
	width:90%;
	margin:auto;
	background-clip: padding-box;
    border: 30px;

    padding: 20px;
    border-style: solid;
    border-color:  #00e4d55d;
    font-size: larger;
    background-color: #ffffffbb;

}
fieldset{
	border: 5px #124380;
	border-style: none double none double;

}
form{
	width: 100%
}
fieldset.F1{
	width: 50%;
}


fieldset.F1 div {
	display:flex;

}
fieldset.F1 label{
	font-size: 120%;
	margin: 5px 5px;
}

fieldset.F1 div{
	margin : 5px 5px;
}
fieldset.F1 input{

	font-size: 100%;
}

fieldset.F2{
	display: flex;
	flex-direction: column;
	width: 70%;


}


fieldset.F3{
	display:flex;
	flex-direction: column;
	align-items:center;
	width : 80%;


}

fieldset.F3 input{
	padding-top: 3%;
	font-size: 80%;
}

input[type=radio] { border: 0px; width: 100%; height: 3vw; }



.F3 > .input > .input-objet:nth-child(1){
	
	color: #124380;
	font-weight: bold;
}


.envoyer{
	width:30%;

	min-width: 100px;
	display: block;
	margin-left: auto;
    margin-right: auto;

	font-size: 100%;
	margin-top: 8%;
	transition: width 2s;
}
.envoyer:hover{
	width: 50%;
}

#animation{
	margin-top : 10vh;
	position : relative;
	width: 25vw;


	/*background-image:url("images/ingenieur.jpg");
	background: red;*/
	animation: mymove 10s infinite;
	margin-bottom: 10px;
}

#animation img{
	width:25vw;
}

article fieldset.F2,fieldset.F1{
	transition: width 2s;
}
article fieldset.F2:hover{
	width: 100%;

}
article fieldset.F1:hover{
	width: 100%;
}
article textarea{
	height: 10vw;
	transition: height 4s;
}
article textarea:hover {
	height: 20vw;
}
@keyframes mymove {
  0%{top: 0px; left : -33vw;}
  50%{top: 0px; left: 33vw;}
  100%{top: 0px; left : -33vw;}

}

@media(max-width:768px){

	h1{
		font-size: 200%;
	}
	fieldset.F2 {
		display: none;
	}
	.responsive{
		display: none;

	}
	#animation {
		display:flex;
		justify-content: center;
		width: 90%;
		animation : none;
	}
	#animation img{
		width:100%;
	}
	article.mainTexte{
		width:auto;

	}
	main{
		width:95%;
	}
	fieldset.F1 .radio{
		border:none;
		display:flex;
		flex-direction: column
	}
	fieldset.F1,fieldset.F3{
		border:none;
		transition:none;
		width: 100%;
	}
	input[type=radio] { border: 0px; width: 100%; height: 8vw; }
	fieldset.F3 .input-objet{
		width: 50vw;
		height: 15vw;
	}
}