/*

	Creator:	Stephane KESAKO
	Goal:		The goal of this CSS function is to create de design code for the Website named "stephetnani2014.fr"
	retour d'experience la delcaration d'un fonction se fait une seul fois dans le code php c-a-d include se fait une seul fois dans toute une page
*/




/* L'en-tête */

/*body
{
	background-color: rgb(247, 231, 248);		
	background-image:radial-gradient(white, rgb(2556, 256, 256));
}*/


/* Ajouter le 21/02/2014 */

/*police des paragraphe */

@font-face
{
	font-family: 'testcaviar';
	src: url('mes_polices/CaviarDreams.ttf'); /*format('truetype')*/
}

html
{
	font-family: 'testcaviar', 'georgia', 'elephant';
}

#en-tete
{
	/*padding: 100 px*/
  	/*height: 30%;*/
	height: auto;
	width: 100%
	/*border: 2px solid black;  *//* tracage d'une bordure autour de la zone d'en-tete epasseur egal 2 pixels */
	/*border: 2px solid black;  *//* tracage d'une bordure autour de la zone d'en-tete epasseur egal 2 pixels */
	/*background-color: rgb(255, 0, 0);*/
	/*background-color: rgb(256, 99, 99);	*/
	background-repeat : no-repeat;
	/*background-image:radial-gradient(white, rgb(216, 99, 99));*/
	/*background-image:linear-gradient(white, rgb(255, 0, 0));*/
	
background: -moz-linear-gradient(top, rgba(243,93,91,1) 0%, rgba(250,178,184,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(243,93,91,1)), color-stop(100%,rgba(250,178,184,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(243,93,91,1) 0%,rgba(250,178,184,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(243,93,91,1) 0%,rgba(250,178,184,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(243,93,91,1) 0%,rgba(250,178,184,0) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(243,93,91,1) 0%,rgba(250,178,184,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f35d5b', endColorstr='#00fab2b8',GradientType=0 ); /* IE6-9 */
	

}


.block-interne-entete
{
	height: 120px;
	/*border: solid black; */						/*coutour de l'éléménent  block interne*/
	background-image: url("images/fond_entete.png");	/*image de fond du block*/
	background-repeat : no-repeat;
	background-position: 10% 50%;
	
}



.block-interne-entetetype2
{
	display: inline-block;
    width: auto;					/*permet de dimentionner automatiquement la le block on peut remplacer auto par xp ou x% */
    /*border: 2px solid black;*/	/* permet de dessiner les coutour du block interne */
    vertical-align: top;
}



#corps-du-site
{
	/*height: 70%;	*//*penser à metre la taille du corps en auto*/
	height: auto;
	width: 80%;
	/*border: solid black;*/
	/*background-image:radial-gradient(white, rgb(228, 108, 10));*/
}

#banderole-dubas
{
	height: auto;	/*penser à metre la taille du corps en auto*/
	/*width: 100%;*/
	width: auto;
	/*border: solid black;*/
}

.block-interne-banderole-dubas
{
	display: inline-block;
	height: auto;
    width: auto;
	border-radius: 8px;			/*permet de dimentionner automatiquement le block on peut remplacer auto par xp ou x% */
    border: 2px solid black; 	/*permet de dessiner les coutour du block interne */
	vertical-align: top;
}


#pied-de-page
{
	height: 40%;
	width: 100%;
	/*background-color:rgb(216, 99, 99);*/
	/*background-color: rgb(255, 0, 0)*/
	/*background-image:linear-gradient(white, rgb(255, 0, 0));
	/*border: solid black;*/
	
	
background: -moz-linear-gradient(top, rgba(250,178,184,0) 1%, rgba(243,93,91,1) 99%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(250,178,184,0)), color-stop(99%,rgba(243,93,91,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(250,178,184,0) 1%,rgba(243,93,91,1) 99%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(250,178,184,0) 1%,rgba(243,93,91,1) 99%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(250,178,184,0) 1%,rgba(243,93,91,1) 99%); /* IE10+ */
background: linear-gradient(to bottom, rgba(250,178,184,0) 1%,rgba(243,93,91,1) 99%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fab2b8', endColorstr='#f35d5b',GradientType=0 ); /* IE6-9 */



/*
 Partie Css dédiée à la banière défilante 
*/


#mon-carrousel{
width:531px; /* la largeur totale du carrousel */
height:373px;	/* la hauteur totale du carrousel (prévoir la place pour le div.temoins) */
}

#mon-carrousel .interieur-carrousel
{
margin-left:0px; /* décalage entre le début du caroussel et l'endroit où disparaissent les images */
margin-top:0px; /* décalage par rapport à en haut du carrousel */
width: 533px; /* la largeur de l'interieur = (largeur d'un item + margin right d'un item)*(nombres d'item étant apparants en même
temps) */
height:331px;	/* la hauteur d'un item */
}

#mon-carrousel .item{
/*width:259px;	*//* la largeur d'un item */
width:300px;	
margin-right:13px; /* son espacement éventuel par rapport à l'item suivant */
height:331px; /* la hauteur d'un item */
}


.carrousel{
	position:relative;
	overflow:hidden;
}

.carrousel .interieur-carrousel
{
	position:relative;
	overflow:hidden;
}

.carrousel .items
{
	position:absolute;
	top:0;
	left:0;
	width: 10000px;
}
.carrousel .item
{
	display:block;
	float:left;
}

.carrousel .temoins
{
	position:absolute;
	bottom:0;
	left:0;
	text-align:center;
	width:100%;
}
.carrousel .temoins 
img
{
	padding-left:5px;
}