html,body{

margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
height: 100%;
font-family: 'Tajawal', sans-serif;
color: #3e4044;
width: 100%;

}

header{
	height: 5%;
	background-color: black;
	width: 100%;
	position: fixed;

	display: flex;
	align-items: center;
	justify-content: flex-end;
	z-index: 2;
}

#theDiv{
	margin-right: 30px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

#imageDuHaut{

background: url('images/fondnoisefilterz2.jpg') no-repeat center center ;
background-size: cover; 
min-height: 100vh;
position: relative;
z-index: 1;
}

.scrollDown{
	position: absolute;
	bottom: 15px;
	left: 50%;
	height: 8em;
}
#test{
	height: 50%;
	background-color: #fdfff9;
	text-align: center;
	
	display: flex; /* contexte sur le parent */
  	flex-direction: column; /* direction d'affichage verticale */
  	justify-content: center;
}

#separation
{
	width: 20px;
}

.Signin{
vertical-align: middle;
height: 2em;
}

.logIn{
vertical-align: middle;
height: 2em;

}

.Separateur{
vertical-align: middle;
height: 1.2em;
}

.Signin:hover{
cursor:pointer;
}

.logIn:hover{
cursor:pointer;
}

#image2{
	height: 100%;
	background: url('images/fondimage4f.jpg') no-repeat center center ;
	background-size: cover;

	display: flex; /* contexte sur le parent */
  	flex-direction: column; /* direction d'affichage verticale */
  	justify-content: center;
  	text-align: center;
}

#contenuGauche{
	width: 50%;
	padding: 20px;

}

#contenudroite{
width: 50%;
}

#presentationOutils{
	padding: 25px;
	height: 50%;
	background-color: #fdfff9;
	display: flex; /* contexte sur le parent */
	
  	align-items: center;
  	justify-content: space-around;
  	text-align: center;
}

.imgExMixage{
	height: 15em;
	border-radius: 10px;
	box-shadow: 0 3px 6px 0 #cfd7df;
}

#presentationLogiciel{
	height: 50%;
	background: url('images/testFond2.jpg') no-repeat center center ;
	background-size: cover;
	display: flex; /* contexte sur le parent */
	
  	align-items: center;
  	justify-content: space-around;
  	text-align: center;
}

#appelAlaction{

	background-color: white;
	height: 25%;
	display: flex; /* contexte sur le parent */
  	flex-direction: column; /* direction d'affichage verticale */
  	justify-content: center;
  	text-align: center;
  	line-height: 0.8em;
}

#bandeDuBas{

	height: 15%;
	background-color: black;
	display: flex; /* contexte sur le parent */
	
  	align-items: center;
  	justify-content: space-around;
  	text-align: center;
}

.leLogo{
	height: 8em;
}

.tabletteApp{
	height: 40em;
	margin-top: -35px;
	margin-left: 25px;
}

#gauche{
	width: 50%;
}

#droite{
	width: 50%;
}