
body {
color:black;
background-color:white;
/*
background-image:url('images/aerial-background.jpg');
background-repeat: no-repeat;
*/
}

#TheCadre {
width: 500px;
height: 100px;
margin-left: 200px;
color: black; 
/* background-color: red;*/
font-size: 2rem;
font-weight: bold;
/* border-style: solid; */
/* border-color: black; */
background-image:url('images/contact-us.jpg');
background-repeat: no-repeat;
}

#TheForm {
width: 600px;
margin-left: 100px;
padding: 20px;/* marge versus border */
color: black; 
font-size: 1rem;
font-weight: bold;
border-style: solid;
border-color: black;
background-color: #EFEFEF; /* gris clair */
}

.SendContact {
width: 170px;
height: 60px;
background-image: url('images/send.jpg');
background-size: 100% 100%;
background-repeat: no-repeat;
border-style: none;
margin-left: 40px;
}

.SendContact:hover {
width: 170px;
height: 60px;
background-image: url('images/send.jpg');
background-size: 100% 100%;
background-repeat: no-repeat;
border-style: none;
margin-left: 40px;
background-color: #00BFFF;
background-blend-mode: luminosity;


}
.ClearContact {
width: 120px;
height:60px;
background-image: url('images/clear.jpg');
background-size: 100% 100%;
background-repeat: no-repeat;
border-style: none;
margin-left: 40px;
}

.ClearContact:hover {
width: 120px;
height:60px;
background-image: url('images/clear.jpg');
background-size: 100% 100%;
background-repeat: no-repeat;
border-style: none;
margin-left: 40px;
background-color: red;
background-blend-mode: luminosity;

}



p#myformat { 
   
   color: #FF0000; 
   font-weight: normal;
   letter-spacing: .4em;
   margin-left : 10em;
   text-transform: lowercase;
}

#LogoBriagle {
width: 200px;
 float:left;
display: block;
//background-color: #00FF00;
}


#TopFen {
width: 800px;
height: 100px;
float:left;
color: black
// float:right;
//display: flex;
//background-color: #EFEFEF; // gris clair
}

#FenMenu {
/* pas de width : prend toute largeur dispo */
width: 100%;
height : 100px;
color: #0000FF;
// float:right;
//display: flex;
//background-color: powderblue;
}

#NavMenu {
	padding: 0; margin: 0;   /* margin par rapport au bord superieur */
}
#NavMenu li {
	display: inline;
	list-style: none; /* nécessaire pour IE7 */
}

#NavMenu a {
	display:inline-block;
	margin: 0 15px;  /* margin entre les options */
        font-size: 1.5rem; 
        font-weight: bold;
        letter-spacing: 1px;
}

#MainDiv{
width: 100%;
height: 400px;
color: #000000;
background-image:url('images/aerial-background.jpg');
background-size: 100% 100%;
background-repeat: no-repeat;

}

#WebTitre {
width: 800px;
height:100px;
color: #FFFFFF;
position: absolute;
top: 100px;
left: 250px;
font-size: 3rem;
letter-spacing: 10px;
}

#WebSubTitre {
width: 800px;
height: 100px;
color: #0000FF; /* bleuté */
position: absolute;
top: 200px;
left: 360px;
font-size: 1.5rem;
letter-spacing: 5px;
font-style: italic;
font-weight: bold;
}


.BannerText {
width: 100%;
heigth: 200px;
position: absolute;
top: 460px;
left: 0px;
display: inline-block;
margin: 0;
padding: 0;
// display: flex ;
overflow: hidden;
// margin-bottom: 80px;
background-color: rgba(255, 255, 255, 0.5); 
}

.BannerText p {
// position: absolute;
white-space: nowrap;
color: #FF0000; // rouge;
font-size: 1rem;
letter-spacing: .4em;
font-weight: bold;
animation: MyTextScroll 25s linear infinite;
}


@keyframes MyTextScroll
 {
0%
{
transform: translateX(+100%);
}

100%
{
transform: translateX(-100%);
}

}