body
{
	background-color:black;
}
.banniere
{
	width : 916px;
	float : center;
	text-align:center;
	margin-left:auto;
	margin-right: auto;
	z-index:5;
	position:relative;
	}
.menu{
	width : 916px;
	margin-left:auto;
	margin-right: auto;
	color:#FFFFFF;
	float:center;
	margin-top:-20px;
	z-index:10;
	position:relative;
}


/*Lien vers la page Apropos/About*/
.apropos
{
	font-weight: bold;
	opacity:0.5;
}
.leurliban
{
	font-weight: bold;
	opacity:0.5;
}
.apropos:hover
{
	opacity:1;
}
.leurliban:hover
{
	opacity:1;
}
.leurliban{
	margin-right:150px;
}
.onglets{
	float:right;

	text-align:right;
}
.urlSsSoul{
	text-decoration:none;
	font-style:normal;
}


/*Drapeaux changement de langue*/
.flags
{
	float:left;
}
.flag
{
	border-radius: 5px;
	opacity:0.5;
}
.flag:hover{
	opacity:1;
}


.corps
{
	clear: both;
	font-family:"Arial", serif;
	font-size:11pt;
	height : 549px;
	width : 916px;
	float : center;
	margin-left:auto;
	margin-right: auto;
	white-space: normal;
	border-radius: 20px;
	
	
	/*background-color:yellow;*/
	overflow: hidden;
	background:url(./img/Graffiti.jpg);
	background-size:916px 549px;
	background-repeat:no-repeat;
	background-position: center;
	/*background-attachment:fixed;*/
	<--border: solid #FF88DD 1px;-->
}
.interviewDrapeau
{
	clear:both;
	font-family:"Arial", serif;
	font-size:12pt;
	height : 549px;
	width : 916px;
	float : center;
	margin-left:auto;
	margin-right: auto;
	white-space: normal;
	border-radius: 20px;
	
	
	overflow: hidden;
	background:url(./img/drapeau.jpg);
	background-size:916px 549px;
	background-repeat:no-repeat;
	background-position: center;

}

.interview
{
	color:white;
	/*border-radius: 20px;*/
	display:block;
	overflow: auto;
	background-color: rgba(0,0,0,0.9);
	height: 550px;
    width: 916px;
	z-index:2;
	position:relative;
	
	
	left:50%;
	margin-left: -458px;
	opacity:1;
}
.presentation{
	color:white;
	display:block;
	margin-left:50px;
}

.partager{
	clear:both;
	float : right;
	margin-right:20px;
	margin-top:5px;
}
.interviewCorps{
	margin-top:100px;
	<!-- clear: both; -->
	margin-left:5px;
	white-space: normal;
	margin-left:8px;
	margin-right:20px;
}
.dessous{
	clear: both;
}
.picture
{
	clear:both;
	float:right;
	margin-top:15px;
	margin-right:15px;
	border:3px solid rgb(18,67,44);
	border-radius: 20px;
	opacity: 1;
	max-height:250px;
	max-width:400px;
}
.question
{
	color:rgb(24,120,58);
	font-weight: bold;
}
.reponse
{
	color:white;
}
.base
{
	color:white;
	
}

a{
	color:white;
	font-style:italic;
}

ul
{
	/* On supprime les puces, on précise une largeur
        et on centre la liste par rapport à la page. */
    list-style: none;
	width: 916px;
	margin: auto;
	padding:0px 0px 0px 0px;
}

li
{
	/* On fixe les dimensions
        des éléments de notre liste. */
    width: 180px;
	height: 180px;
  
        /* On modifie l'affichage pour que
        les éléments soient sur la même ligne. */
	display: inline-block;
	
        /* On ajoute une petite bordure
        et on définit les marges.  */
	border: 0px solid #000;
	margin: 0px;
	padding: 0px;

        /* Quitte à faire du CSS3, autant
        avoir des coins arrondis :p. */
        border-radius: 20px;
        
        /* On centre l'arrière-plan. */
        background-position: center;
      
        /* On modifie la position pour pouvoir ensuite
        placer comme on le souhaite la description des liens. */
        position: relative;

        /* On n'affiche pas ce qui dépasse de nos éléments ! */
	overflow: hidden;	
}
li a
{
	/* Pour fixer les dimensions d'un lien,
        il est nécessaire de l'afficher en tant
        qu'élément de type block. */
    display: block;
	width: 100%;
	height: 100%;
    text-decoration: none;
}

.pied {
	color:white;
	width : 916px;
	margin-left:auto;
	margin-right: auto;
	font-size: 15px;
	text-align: center;
}
.pied .webmestre{
	font-size:10px;
}
.items img{
	border-radius: 20px;
	
	opacity:1;

}
.items img:hover{
	opacity:1;
	transition-property: opacity;
	transition-duration: 0.5s;
	transition-timing-function: linear;
	transition-delay: 0s;
	/* Firefox 4 */
	-moz-transition-property:opacity;
	-moz-transition-duration:0.75s;
	-moz-transition-timing-function:linear;
	-moz-transition-delay:0s;
	/* Safari and Chrome */
	-webkit-transition-property:opacity;
	-webkit-transition-duration:0.75s;
	-webkit-transition-timing-function:linear;
	-webkit-transition-delay:0s;
	/* Opera */
	-o-transition-property:opacity;
	-o-transition-duration:0.75s;
	-o-transition-timing-function:linear;
	-o-transition-delay:0s;
}

.about
{
	color:white;
	
	
	border-radius: 20px;
	display:block;
	overflow: auto;
	background-color: rgba(0,0,0,0.9);
	height: 550px;
    width: 916px;
	z-index:2;
	position:relative;
	text-align: center;
	
	left:50%;
	margin-left: -458px;
	opacity:1;
}

.aboutTexte{
	margin-left:15px;
	font-size:18px;
}

#derniereLigneAbout{
	font-size:16px;
	margin-left:15px;
}

#libanQueJaime{
	text-align:center;
	padding-right:15px;
	padding-left:15px;
}

#Carousel{
	position:relative;
	margin-left: auto;
	margin-right: auto;
	text-align:center;
}
a.info{
	overflow:visible;
}
a.info span {
   display: none; /* On masque l'infobulle. */
   z-index:200;
   background-color: rgba(0,0,0,0.5);
   border-radius: 10px;
   text-align:center;
}
a.info:hover span{
	display: inline; /* On affiche l'infobulle. */
   position: absolute;

   white-space: nowrap; /* On change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non désiré. */

   top: 0px; /* On positionne notre infobulle. */
   left: 800px;

   color: white;
}
img.cloudcarousel{
	border: 2px;
	border-color:green;
}
#carousel1{
	width:850px; height:300px;background:#000;overflow:visible;
	margin-left:auto;
	margin-right:auto;
}
.boutons{
	
	font-size:14px;
	color:white;
	width:500px;
	margin-left:auto;
	margin-right:auto;
	width:400px;
}
.boutons#flecheD{
	text-align:right;
}
#quote{
	width : 916px;
	margin-left:auto;
	margin-right:auto;
	
	text-align:center;
	color:white;
	font-family:palatino;
}
#defilement{
	overflow:auto;
	overflow-style: marquee-line ;
}

#flecheG{
	float:left;
	margin-top:10px;
	margin-left:15px;
}
#flecheD{
	float:right;
	margin-top:10px;
	margin-right:15px;
}