@charset "utf-8";



body

{

	font-family: Trebuchet Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif, Arial, Helvetica, sans-serif;

	font-size: 1em;

	color: #222;

	margin: auto;

	padding: 0;

}

h1{

	font-size:120%;

	/*margin-left:10px;*/
	text-align:center;
		

	}

h2{

	font-size:110%;

    margin-left: 10px;

    margin-bottom: 0.3em;

	}

	

h3{

	font-size:105%;

    margin-left: 10px;

    margin-bottom: 0.3em;

	}

header

{

	position:relative;

	margin:0 auto;

	padding-top:20px;	

	width:900px;

	font-size:130%;

}

 17/08/2025

.header {

	/*position: fixed;*/

	left: 0;

	right: 0;

	/*height: 166px;*//*66px;*/

	line-height: 32px;

	color: #888;

	/*background-color: #303f9f;*/

	
/**/

		margin:0 auto;

		/*padding-top:20px;	*/

		/*width:900px;*/

		font-size:130%;

	/**/

}

.header__logo {

	font-weight: bold;

	padding: 0 25px;

	float: left

}



img{

	

	max-width:100%;

	height:auto;

	

	

}



#log{

	

	font-size:120%;

	text-align:left;

	

	}

#top {

	background-color:#999;

	position:relative;

	padding: 5px 0;

	height: 80px;

	text-align: center;

	vertical-align: top;

	margin: 0;

	width: 930px;

}

#friendly {

	position : absolute;

	top: 30px;

	left: 814px;

	width: 86px;

	height: 104px;

	z-index: 10;

}

#beaukal {

	margin-left: 60px;

	padding-top:0;

	padding-right:70px;

	float: none;

	height: 100px;

	font-size:120%;

	text-align: center;

	color:#888;

}

#logo_img {

	padding-left:5px;

	padding-top:2px;

	padding-right:20px;

	float:left;

}

main{

	

	}

#accueil {

	margin: 0 auto;

	background-color: #eee;

	display: block;

	/*margin: 20px 0px 0px 0px;*/

	padding-top: 2px;

	padding-bottom: 25px;

	width: 900px;

	font-size: 110%;

}

#accueil p{

	/*text-align:center;*/

	

}



#pages{

	font-size: 100%;

	}

#pages aside {

	float: left;

	width: 220px;

	text-align: left;

	height: 800px;

}

#SousTitre {

	margin: 10px;

}

#pages #droite {

	text-align: left;

}

#cl {

		clear:both;

	}

footer

{

	color: #eee;

	background-color: #999;/*7d8186;*/

	width: 900px;

	font-size: 80%;

	margin: 0 auto;

	padding: 0.5em 0px;

	

}

footer p {

    margin-top: 10px;

    margin-right: 10px;

    margin-left: 10px;

    margin-bottom: 5px;

    text-align: left;

}


/* === Utilities === */
.centrer{ text-align:center; }                 /* centre le contenu */
.cta-gap{ margin:1.2rem 0; }                   /* espace haut ET bas autour du CTA */
.centrer a{ display:inline-block; line-height:0; }  /* supprime le petit blanc sous l’image */
.centrer img{ max-width:100%; height:auto; vertical-align:middle; }

/* Compat : si vous utilisez encore .cta-center ailleurs */
.cta-center{ text-align:center; margin:1.2rem 0; }
.cta-center img{ max-width:100%; height:auto; vertical-align:middle; }

.footer-nap address{ font-style:normal; text-align:center; opacity:.95; }
.footer-nap a{ color:inherit; text-decoration:underline; }
.footer-nap{ margin:1rem 0 .5rem; }

/* CSS Document */


.centrer{

	

	text-align:center;

	

	}

	

	.margeHaut{

	

	margin-top:10px;

	

	}



.gris{color:#888;}

/*Liens*/

a:link {

	color: #00AE98;

	text-decoration: none;

	/*text-decoration-style: dashed;*/

}

a:hover{

	text-decoration: underline;

}

a:visited {

	color: #00AE98;

}

a img

{

	border: none;

} 

footer a:link {

	color: #fff;/*FFBE03;*/

	text-decoration-style: dashed;

}

footer a:visited {

	color: #fff;/*FFBE03;*/

	text-decoration-style: dashed;

}

/* MENU */









/* FIN MENU */

/*  MENU aside */





#content {

	/*clear:both;*//*modif*/	

	position: relative;

	display: block;

	overflow: auto;

	width: 900px;

	padding: 0;

	margin-right: auto;

	margin-bottom: 0;

	margin-left: auto;

	height: auto;

	background-color:#eee;

}

#left {
    width: 20%;	/*192px*/
    height: auto;
    float: left;
    margin-top: 19px;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding-top: 4px;
    padding-right: 14px;
    padding-bottom: 20px;
    padding-left: 4px;
    color: #FFFFFF;
    text-decoration: none;
    border-right: #fff thin solid;

}





#leftformation {

	width: 46%;	

	height: auto;



	float: left;

	margin-top: 19px;

	margin-left: 0;

	margin-right: 0;

	margin-bottom: 0;

	padding-top: 4px;

	padding-right: 14px;

	padding-bottom: 20px;

	padding-left: 4px;

	

	color: #000;

	text-decoration: none;

	border-right:#fff thin solid;



}





#left ul.plaquette {

	text-align: left;

	list-style-image: url(../images/icones/fleche-orange.png);

	list-style-type: none;

	padding: 0;

	margin-top: 10px;

	margin-right: 0;

	margin-bottom: 10px;

	margin-left: 35px;

	list-style-position: outside;

}

#left ul {

	text-align: left;

	list-style-image: url(../images/icones/fleche.gif);

	list-style-type: none;

	padding: 0;

	margin-top: 10px;

	margin-right: 0;

	margin-bottom: 10px;

	margin-left: 20px;

	list-style-position: outside;

}

#left ul li {

	margin: 0;

	padding-top: 0;

	padding-right: 0;

	padding-bottom: 5px;

	padding-left: 0;

}

#left ul li a{

	color: #222;

	text-decoration: none;

	font-size: 80%;

}

#left ul li a:hover{

	color: #D95F1C;

	text-decoration: none;

	font-size: 80%;

}

#left ul li.ici  {

	margin-left:15px;

}

#left ul li.ici a {

	color: #BBB522;

}







#right {

	/*font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;*/

	float: right;

	width: 75%;/*650px*/

	text-align: left;

	text-decoration: none;

	margin: 0;

	height: inherit;

	padding-left: 10px;
	padding-right: 10px;


}

#rightformation {

		

	float: right;

	width: 50%;

	text-align: left;

	text-decoration: none;

	margin: 0;

	height: inherit;

	padding-left: 10px;

}



ul#video{

	list-style-type:none;

	width:450px;

	margin:10px auto 0 ;

	

}

ul#video li{

	padding:10px;

	

}





/* FIN MENU aside */

.beaukal {

	font-size:110%;

	font-weight: bold;

	color: #fe6600;/*e94a29;ffbe03;*/

}

p {

    margin: 0 10px 20px 10px;

    font-size: 1em;

	

	

}

.SousTitre {

	background-color: #D0672E;

	font-weight: normal;

	

}

.orange {

	color: #fe6600;

	font-weight: bold;

	

	}

	

.marge {

	margin: 10px 0;

	}

#actua {

	position: relative;

	display: block;

	overflow: auto;

	margin-top: 0;

	margin-right: auto;

	margin-bottom: 0;

	margin-left: 0;

	height: auto;

	/*background-color: #2D2D2D;*/

	font-size: 100%;

	padding: 25px;

}	

#actua li {

	margin-bottom: 25px;

}

	

	

/*Responsive*/

@media (min-width: 120px) and (max-width: 480px) {

	body {

			/*font-family: Roboto, Trebuchet Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif, Arial, Helvetica, sans-serif;*/



	margin: 0;

	padding: 0;

	/*font-size: 0.9em;*/

	font-size:16px;

}



h1 {

	font-size: 1.2em;

	line-height: 1.2em;

}

h2 {

	font-size: 1.15em;

	margin-top: 24px;

}

h3 {

	font-size: 1.1em;

	margin-top: 20px;

}

h4 {

	font-size: 1.05em;

	margin-top: 20px;

}

h5 {

	font-size: 1.0em;

	margin-top: 20px;

}

/*max-device-width*/





nav {

	display: block;

	width: 100%;

}

header {

	position: relative;

	z-index: 10;

	width: 100%;

	padding-left: 0;

	padding-right: 0;

	top: 0;

	height: auto;

	padding-top: 11px;

	/*min-width: 1000px;*/

	background-color: rgba(255,255,255,0.67);

	font-size:100%;

}







header p img {

	/*float: left;*/

	margin-right: 0;

	margin-left: 0;

	margin-top: 0;

	margin-bottom: 0;

	width: 150px;

	height: auto;

	display: block;

}



#beaukal {

    color: #888;

    font-size: 100%;

    text-align: center;

}



#accueil{

	width:100%;

	text-align:center;

	font-size: 110%;

	

	}

#accueil p {

	/*margin-left: 10px;

	margin-right: 10px;

	margin-bottom: 21px;*/

	text-align: center;

	color: #222222;

	margin-top: 2px;

	line-height: 1.2em;

	font-size: 1em;

}

footer {

	position: relative;

	width: 100%;	

	margin-right: 0;

	margin-left: 0;

	margin-top: 0;

	margin-bottom: 0;

	background-color: #999;

	/*height: auto;*/

	/*padding-left: 20px;*/

	border: solid 1px #eeeeee;

	/*padding-right: 20px;*/

	color: #eee;

	float: none;

	font-size:80%;

}



#friendly {

	position : static;

	z-index: 10;

	display:none;

}

#content {

	clear:both;/*modif*/	

	position: static;

	display: block;

	overflow:hidden;

	width: auto;

	padding: 0;

	margin-right: auto;

	margin-bottom: 0;

	margin-left: auto;

	height: auto;

	background-color:#eee;

}

#right{

	float:none;

	width:auto;

	margin: 0;

	height: auto;

	padding-left: 10px;	

	text-align: left;

	text-decoration: none;



}

#left{

	display:block;

	float:none;

	width:auto;

	height: auto;

	

	margin-top: 19px;

	margin-left: 0;

	margin-right: 0;

	margin-bottom: 0;

	

	padding-top: 4px;

	padding-right: 14px;

	padding-bottom: 20px;

	padding-left: 4px;

	border-right:#fff thin solid;

	color: #000;

	text-decoration: none;



}

#content img{

	max-width:100%;

	height:auto;

}



/*Pages formation*/



#rightformation{

	float:none;

	width:auto;

	margin: 0;

	height: auto;

	padding-left: 10px;	

	text-align: left;

	text-decoration: none;



}



#leftformation{

	display:block;

	float:none;

	width:auto;

	height: auto;

	

	margin-top: 19px;

	margin-left: 0;

	margin-right: 0;

	margin-bottom: 0;

	

	padding-top: 4px;

	padding-right: 14px;

	padding-bottom: 20px;

	padding-left: 4px;

	border-right:#fff thin solid;

	color: #000;

	text-decoration: none;



}



	#formation img{

	max-width:100%;

	height:auto;

}

	

input, textarea, select {

    padding: 3px;

    border: 1px solid #000000;

    border-radius: 5px;

    width: 90%;

    /*box-shadow: 1px 1px 2px #C0C0C0 inset;*/

 }	

	

}

	.objet-formulaire { display:none; }



@media screen and (min-width: 480px) and (max-width: 780px) {

body {

	margin: 0;

	padding: 0;

	font-size: 0.9em;

}



h1 {

	font-size: 1.2em;

	line-height: 1.2em;

}

h2 {

	font-size: 1.15em;

	margin-top: 50px;

}

h3 {

	font-size: 1.1em;

	margin-top: 20px;

}

h4 {

	font-size: 1.05em;

	margin-top: 20px;

}

h5 {

	font-size: 1.0em;

	margin-top: 20px;

}

/*max-device-width*/





nav {

	display: block;

	width: 100%;

}

header {

	position: relative;

	z-index: 10;

	width: 100%;

	padding-left: 0;

	padding-right: 0;

	top: 0;

	height: auto;

	padding-top: 11px;

	/*min-width: 1000px;*/

	background-color: rgba(255,255,255,0.67);

	font-size:110%;

}







header p img {

	/*float: left;*/

	margin-right: 0;

	margin-left: 0;

	margin-top: 0;

	margin-bottom: 0;

	width: 150px;

	height: auto;

	display: block;/*

-webkit-box-shadow: 3px 3px 2px rgba(218,218,218,1.00);

box-shadow: 3px 3px 2px rgba(218,218,218,1.00);

*/

}



#beaukal {

    color: #888;

    font-size: 110%;

    text-align: center;

}



#accueil{

	width:100%;

	text-align:center;

	font-size: 110%;

	

	}

#accueil p {

	/*margin-left: 10px;

	margin-right: 10px;

	margin-bottom: 21px;*/

	text-align: center;

	color: #222222;

	margin-top: 2px;

	line-height: 1.2em;

	font-size: 1em;

}

footer {

	position: relative;

	width: 100%;	

	margin-right: 0;

	margin-left: 0;

	margin-top: 0;

	margin-bottom: 0;

	background-color: #999;

	/*height: auto;*/

	/*padding-left: 20px;*/

	border: solid 1px #eeeeee;

	/*padding-right: 20px;*/

	color: #eee;

	float: none;

	font-size:80%;

}



#friendly {

	position : static;

	/*top: 30px;

	left: 814px;

	width: 86px;

	height: 104px;*/

	z-index: 10;

	display:none;

}



#content {

	/*clear:both;*//*modif*/	

	position: relative;

	display: block;

	overflow: auto;

	width: auto;

	padding: 0;

	margin-right: auto;

	margin-bottom: 0;

	margin-left: auto;

	height: auto;

	background-color:#eee;

}

#right{

	float:none;

	width:auto;

	text-align: left;

	text-decoration: none;

	margin: 0;

	height: inherit;

	padding-left: 10px;

}

#left{

	float:none;width:auto;

	margin-top: 19px;margin-left: 0;

	

	color: #FFFFFF;

	text-decoration: none;

	margin-right: 0;

	margin-bottom: 0;

	padding-top: 4px;

	padding-right: 14px;

	padding-bottom: 20px;

	padding-left: 4px;

	height: auto;

	border-right:#fff thin solid;

}



/*Pages formation*/

#rightformation {

	float: right;

	width: 50%;

	text-align: left;

	text-decoration: none;

	margin: 0;

	height: inherit;

	padding-left: 10px;

}



#leftformation {

	width: 45%;	

	height: auto;



	float: left;

	margin-top: 19px;

	margin-left: 0;

	margin-right: 0;

	margin-bottom: 0;

	padding-top: 4px;

	padding-right: 14px;

	padding-bottom: 20px;

	padding-left: 4px;

	

	color: #000;

	text-decoration: none;

	border-right:#fff thin solid;

}

#formation img{

	max-width:100%;

	height:auto;

}



}





/*AJOUT FROM STYLES*/



@media only screen and (max-width: 650px) {



html, body {

	font-size: 16px;

	line-height: 1.4;

	height: 100%;

	margin: 0;

	padding: 0;

	background-color:#eee;

}



.site-pusher, .site-container {

	height: 100%

}

.site-container {

	overflow: hidden

}

.site-pusher {

	-moz-transition-duration: 0.3s;

	-o-transition-duration: 0.3s;

	-webkit-transition-duration: 0.3s;

	transition-duration: 0.3s;

	-moz-transform: translateX(0px);

	-ms-transform: translateX(0px);

	-webkit-transform: translateX(0px);

	transform: translateX(0px)

}

.site-content {

	position: absolute;

	top: 75px;/*66*/

	right: 0;

	left: 0;

	bottom: 0;

	padding-top: 0;

	overflow-y: scroll;

	-webkit-overflow-scrolling: touch

}

.header {

	position: static;

	font-size:110%;

	background-color: #eee;

	line-height:100%;

}

.header__icon {

	position: relative;

	display: block;

	background-image:url(hamburger-menu-50-60.png);

	float: right;

	width: 50px;

	height: 66px;

	cursor: pointer;

	z-index:200;

}

.header__icon:after {

	content: '';

	position: absolute;

	background-image:url(hamburger-menu-50-60.png);

	display: block;

	/*width: 1rem;*/

	/*height: 0;*/

	top: 5px;/*16*/

	left: 15px;

}

.menu {

	position: absolute;

	right: 0;

	top: 0;

	bottom: 0;

	padding-top:10px;/*aj*/

	overflow-y: scroll;

	-webkit-overflow-scrolling: touch;

	background-color: #999;

	width: 180px;

	-moz-transform: translateX(180px);

	-ms-transform: translateX(180px);

	-webkit-transform: translateX(180px);

	transform: translateX(180px)

}

.menu a  {

	display: block;

	height: 40px;

	color:#fff;/**/

	text-align: center;

	text-decoration:none;

}

.menu a:link, a:visited, a:hover,a:active

{

	/*color:#fff;*//**/

	

	}

.with--sidebar .site-pusher {

	-moz-transform: translateX(-180px);

	-ms-transform: translateX(-180px);

	-webkit-transform: translateX(-180px);

	transform: translateX(-180px)

}

.with--sidebar .site-cache {

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	bottom: 0;

	background-color: rgba(0,0,0,0.6)

}



.container{

margin:0;/*fixer les marges ? l'interieur du container*/



}



#logo_img {

margin-top:-10px;

padding-top:0;

width:35px;

height:auto;





}

footer{

margin:0;

width:100%;

}



}





@media screen and (min-width: 480px) and (max-width: 2200px) {

	input, textarea, select {

    padding: 3px;

    border: 1px solid #000000;

    border-radius: 5px;

    width: 60%;

    /*box-shadow: 1px 1px 2px #C0C0C0 inset;*/

 }	

form {

    

    padding-top: 11px;

    padding-right: 11px;

    padding-left: 11px;

    padding-bottom: 11px;

    width: 70%;

    /*width: 80%;*/

    /*width: 100%;*/

 }	

}





























/*Pages formation*/



#formation {

	margin: 0 auto;

	background-color: #eee;

	display: block;

	/*margin: 20px 0px 0px 0px;*/

	padding-top: 2px;

	padding-bottom: 25px;

	width: 900px;

	max-width:100%;

	font-size: 110%;

}

#formation p{

	/*text-align:center;*/

	

}



#ensemble {

	background-image: url(../formation-photo/images/formation-photographe-succes.jpg);

	height: 50%;

	width: 50%;

	position: relative;

	font-weight: bold;

	font-size: 200%;

	/*font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;*/

	text-align: left;

	padding-top: 35px;

	background-repeat: no-repeat;

	margin-right: auto;

	margin-left: auto;

	margin-top:50px;

	margin-bottom:50px;

	text-align: left;

}





/*Bandeau cookies*/

form {

    background-color: #EEEEEE;/*#EEEEEE*/

    margin: auto;

    padding-top: 11px;

    padding-right: 11px;

    padding-left: 11px;

    padding-bottom: 11px;

    /*width: 70%;*/

    /*width: 80%;*/

    /*width: 100%;*/

 }

fieldset {

    padding: 0 20px 20px 20px;

    margin-bottom: 10px;

    border: 1px solid #FFFFFF;

 }

legend {

 color:#DF3F3F;

 font-weight:bold

 }

label {

 margin-top:10px;

 display:block;

 }

label.inline {

    display: inline;

    margin-right: 5px;

 }

input, textarea, select, option {

    border: thin  #222222;

    background-color: #FFFFFF;

 }

input, textarea, select {

    padding: 3px;

    border: 1px solid #000000;

    border-radius: 5px;

   /* width: 80%;*/

    /*box-shadow: 1px 1px 2px #C0C0C0 inset;*/

 }

select {

 margin-top:10px;

 }

input[type=radio] {

 background-color:transparent;

 border:none;

 width:20px;

	margin-right: 30px;

	margin-left: 0px;

 }

input[type=checkbox] {

 background-color:transparent;

 border:none;

 width:20px;

	margin-right: 30px;

	margin-left: 0px;

 }

input[type=submit], input[type=reset] {

    width: 100px;

    margin-left: 5px;

    box-shadow: 1px 1px 1px #C3B8B8;

    cursor: pointer;

    -webkit-box-shadow: 1px 1px 1px #C3B8B8;

 }



 

 

/**************************************************** MENUS *************************************************/ 



/* ******************************************************************************************************** */ 





/************************************************* MENU HAUT ************************************************************/

.menu {

	/*float: left;*/

	

	/*width:900px;*/

	/*height:100px;*/

	background-color:#999;

	margin:auto;

	font-size:16px;

}

.menu a {

	padding: 0 10px;/* 0 10*/

	color: #fff

}

.menu a:hover {

	color: #fff;

}



/*********************************************** FIN MENU HAUT ******************************************************/







/*******************************************  MENU ASIDE ***************************************************************/







 #menu {

	width: 900px;

	/*height: 31px;*/

	text-align: center;

	margin-top: 0;

	margin-bottom:0;

	padding-top: 10px;

	padding-right:0;

	padding-left:0;

	padding-bottom:10px;

	float: left;

	visibility: visible;

	background-color: #999;

	color:#fff;

}

#menu a, .menu a:visited {

	color:#fff; 

	text-decoration:none; 

	font-size:100%;

	font-weight:bold; 

	/*cursor:pointer;*/

	/*background-color: #;*/

}

#menu a:hover {

	color:#fff; 

	/*background:#fff;*/

}

#menu a:hover span{

	color: #fff;

}

#menu ul {

	margin:0;

	padding:0;

	list-style-type:none;

}

#menu li {

	

	display:block;

	float:left;

	padding:0;

	text-align:center;

	margin-top:0;

	margin-right:0;

	margin-bottom:0;

	margin-left:0;

	font-size: 70%;

	font-weight: bold;

	padding: 5px 10px 0;

	

	color: #FFFFFF;

	background-repeat: repeat-x;

	margin:0;

	

}



#menu li span.aa 		{

	display:block;

	/*width: 3px;*/

	height: 31px;

	float: left;

	/*border-bottom: 1px solid #888;*/

	/*background-image: url(../images/fd_menu_Red_left.gif);*/

	padding:0;

	

	margin:0;/*background-color:#f54234;*//*e94a29;7D8186*/

}

#menu li span.bb 		{

	height:26px;

	float:left;

	/*border-bottom:1px solid #888;*/

	/*background-image: url(../images/fd_menu_Red.gif);*/

	font-size: 70%;

	font-weight: bold;

	padding: 5px 10px 0;

	

	color: #FFFFFF;

	background-repeat: repeat-x;

	margin:0;

	/*background-color:#f54234;*//*e94a29;d0672e*/

}

#menu li span.cc {

	display:block;

	width:7px;

	height:31px;

	float:left;

	/*border-bottom:1px solid #888;*/

	/*background-image: url(../images/fd_menu_Red_right.gif);*/

	padding:0;

	

	margin:0;

}

#menu li.ici span.aa {

	display:block;

	width:4px;

	height:31px;

	float:left;

	/*border-bottom:1px solid #888;

	background-image: url(../images/fd_menu_jaune_left.gif);*/

	padding:0;

	margin:0;

}

#menu li.ici span.bb {

	height:26px;

	float:left;

	/*border-bottom:1px solid #888;*/

	/*background-image: url(../images/fd_menu_jaune.gif);background-repeat: repeat-x;*/

	font-size: 100%;

	font-weight: bold;

	padding: 5px 10px 0;

	color: #FFFFFF;

	

	margin:0;

}

#menu li.ici span.cc {

	display:block;

	width:7px;

	height:31px;

	float:left;

	/*border-bottom:1px solid #888;

	background-image: url(../images/fd_menu_jaune_right.gif);*/

	padding:0;

	margin:0;

}



.titremenu {

	font-weight: bold;

	color: #fe6600;/*e94a29;7D8186*FFBE03;*/

	margin-left: 15px;

}



/************************************************** FIN MENU ASIDE  ***************************************************/







@media screen and (max-width: 780px) {



#menu{

	/*-webkit-box-shadow: 5px 6px 3px 1px rgba(189,187,187,1.00);

	box-shadow: 3px 3px 2px 2px rgba(189,187,187,1.00);*/

	float: none;

	margin-top:0;

	width: auto;

}

#menu ul {

	list-style-type: none;

	text-decoration: none;

	margin-left:0;

	margin-top:0;

	padding-left:0;

	padding-top:0;

	padding-bottom:0;

	/*background-color: #930000;*/

}



#menu ul li {

	float:none;

	display: block;

	

	

	

	padding:0;

	text-align:center;

	margin-top:0;

	margin-right:0;

	margin-bottom:0;

	margin-left:0;

	font-size: 70%;

	font-weight: bold;

	padding:0;

	

	color: #FFFFFF;

	background-repeat: repeat-x;

	margin:0;

	

}



#menu ul li a {

	text-decoration: none;

	font-family: "Open Sans", Arial, Helvetica, Verdana, sans-serif !important;

	font-size: 13px;

	color: #F1EBEB;/*inherit*/

	display: block;

	/*height: 70%;*//*inherit*/

	text-align: center;

	white-space: nowrap;

	/*margin: 10px 15px;*/

	padding:0 2px;

	line-height: 20px;/*border: 1px solid #F7F7F7;*/

}

#menu ul li a:hover {

	color: #333333;/*inherit*/

	background-color: #a7a7a7;

}

.titremenu {

	margin-left: 15px;

	text-align: left;



}





}

.orangecb {

	color: #fe6600;

}

/***********************************************/

/*Youtube*/

.ytbox {

    /*ajouté à la tarte au citron*/

	position: relative;

    width: 80%;

    height: 0;

    padding-top: 50%;

    margin: 5%;

}

.youtube_player {

    position: absolute;

    top: 0;

    left: 0;

    bottom: 0;

    right: 0;

    width: 100%;

    height: 100%;

}

/*DIAPORAMA*/
* {box-sizing: border-box;}
body {font-family: Verdana, sans-serif;}
.diapos {display: none;}
img {vertical-align: middle;}

/*Conteneur diaporama*/
.conteneur-diaporama{
  /*width: 80%;*/
  position: relative;
  margin: auto;
}
.conteneur-diaporama p{
	text-align: center;
}
/* Diaporama */
.diaporama {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Légende */
.text-diapo {
  color:#ff0000; /* #f2f2f2 */
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: -9px;
  width: 100%;
  text-align: center;
}

/* Numéros des diapos */
.numero-diapo {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* Cercles */
.zone-cercles {
text-align:center;
position:relative;
top:-20px;
}
.cercles {
  height: 10px;
  width: 10px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active {
  background-color: #717171;
}

/* Fondu enchainé */
.fade {
  animation-name: fade;
  animation-duration: 2.1s;
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* Diminue taille du texte sur petits écrans */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}

}

@media only screen and (max-width: 500px) {
	.cercles {
	  height: 5px;
	  width: 5px;
}