/*Par Pierrot Davy pour le site de la Ken'ADOT marche organisée pas les assos de Saint-Quay Perros*/

/* CSS Reset */
*{
margin: 0;
padding: 0;
}

header, footer, aside, nav, article, p {
display:block;
}

img{
border:none
}
a:link 
{ 
 text-decoration:none; 
}
/*end reset*/

html {
font-size:100%;
background:#b4c0bc url(../img/kenadot.jpg) top center repeat;	/* on répète l'image verticalement */
/*opacity:0.65;*/
background-attachment:fixed;
margin:0;
padding:0
}

body {
background-color:#dddddd;
color:#000;
font-size:.9em;
font-family:Arial, Helvetica, sans-serif;
/*background-color:#ffffff;*/
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5 px#6d7673;
box-shadow: 0 0 5px #6d7673;
width:900px;		/* largeur fixe */
height:100%;
/*height:100%;*/
/* min-height:1200px;*/	/* hauteur minimale */
margin:10px auto;	/* 10px en haut de la page et marges gauche et droite égales*/
padding:0
}

/*  Définition des styles pour le header de la page, photo et et texte */
header#banner{
color:#fff;
text-shadow:3px 3px 3px #000;
background:#6d7673 url(../img/bandeau_2025.png) no-repeat;
width:850px;
height:175px;	/* hauteur de la photo */
margin:10px 10px 10px 10px;
padding:5px;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673
}

header a{
	text-decoration:none;  /* pas de liens soulignés */
}
header h2{
color:red;
}
/*   menu horizontal dans la bannière */
header#banner p{		
	font-size:.65em;
	margin:-15px 0 0 5px
}
/* ----conteneur/positionnement---- */
#conteneur{
	margin:0 auto;
	width:900px;
	height:100%;
	text-align:left;
}
#conteneur-fond {
	margin:left:3px;
/*	padding-left:3px;
	padding-right:3px;*/
/*	background:url(../img/ombre_totale.gif) repeat-y; */
	background-color:#FFF;
	float:left;
}
/* ----modele B---- */
#mB-contenu {
	width:640px;
	height:100%;
	float:left;
	padding:0 0 0px 0px;
	margin-left:20px;
	margin-top:30px;
/*	background-color:#dddddd;
	text-align:left;*/
}
#mB-contenu .titre{		/* titre dans le texte  id=menuside class =.titre */
	text-shadow: 0px 0px 10px #000 , -1px -1px #000 ;
	font-weight:600;
	font-size:1.5em;
	color:green;
	margin:15px 0;
	text-align:center;
}

#mB-contenu .titre_allee{
	font-weight:400;
	font-size:1.3em;
	font-style:italic;
	color:green;
	margin:15px 0;
	text-align:center; 
}

#mB-contenu .rolland{
	text-align:center;
/*	color:#0b7e2a; */
	font-size:1.10em;
}

#mB-contenu p{
	font-family:Verdana,sans-serif;
	font-size: 13px;
	margin-left:12px;
	text-align: justify;
}
#mB-contenu .titreverger{
	font-weight:400;
	font-size:1.2em;
	color:green;
	margin:15px 0;
	text-align:center;
}
#mA-contenu {
	width:840px;
	height:100%;
	float:left;
	padding:0 0 0px 0px;
	margin-left:20px;
/*	text-align:left;*/
}
#mA-contenu p{
	font-family:Verdana,sans-serif;
	font-size: 13px;
	margin-left:12px;
	text-align: justify;
}
#mA-contenu ul{
	margin-left:40px;
}
#mC-contenu {
	width:840px;
	height:100%;
	float:left;
	padding:0 0 0px 0px;
	margin-left:20px;
}
#mC-contenu .titrediapo{
	font-weight:500;
	font-size:1.5em;
	color:green;
	margin:15px 0;
	text-align:center;
}
hgroup {
	height:100%;
	border-radius:10px;
	-moz-border-radius:10px;
	padding:0 10px 0px 10px;/* top right botoom left */
	background: #ebebeb; /* Old browsers */
	/*background: -moz-linear-gradient(left, #ebebeb 48%, #ffffff 100%);*//* FF3.6+ */
	background: -moz-linear-gradient(left, #f3ffe3 48%, #ffffff 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(48%,#ebebeb), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, #def8c4 48%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, #def8c4 48%,#ffffff 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(left, #ebebeb 48%,#ffffff 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebebeb', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
	background: linear-gradient(left, #ebebeb 48%,#ffffff 100%); /* W3C */
}
hgroup h1, h2 {
font-family:"Times New Roman", Times, Serif;
font-weight:600;
line-height:1.2;
padding:3px 0 0 5px
}

hgroup h1 {
text-align:center;
font-size:1.75em;
font-style:italic;
padding:3px 0 0 5px;
color:green
}
hgroup h3 {
text-align:center;
font-family:"Times New Roman", Times, Serif;
font-weight:600;
line-height:1.2;
padding:3px 0 0 5px
}

hgroup h4 {
font-weight:400;
font-style:italic;
color:#2b4d40;
padding:3px 0 0 5px;
margin-left:12px;
}

hgroup p{
text-align:justify;
text-justify:inter-word;
}

/*   Pour les liens sur les étapes */
#colonne-droite {
	width:180x;
	height:100%;
	float:right;
	border:0;
/*padding:12px 15px 0 12px;*/
	margin-bottom:80px;
	margin-top:30px;
}
#colonne-droite.img{
	width:150px;
	height:120px;
}

/*
#colonne-droite {
border: 2px solid green;
}
*/
#carre_vert{				/* lien sur l'allée couverte */
color:#000;
width:180px;
height:165px;					
border:1px solid #6d7673;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673;
background:#dafa8e; /* Old browsers */
margin-right:10px;
margin-bottom:20px;/*
padding:15px 5px;
float:right;*/
}	

#carre_vert_petit{				/* lien sur l'allée couverte */
color:#000;
width:180px;
height:135px;					
border:1px solid #6d7673;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673;
background:#dafa8e; /* Old browsers */
margin-right:10px;
margin-bottom:20px;/*
padding:15px 5px;
float:right;*/
}	
div#allee {
  background-image: url(../img/allee_couverte.png);
  background-repeat: no-repeat;
  width: 140px;
  height: 100px;
  padding:10px 10px 10px 10px;
  margin-left:10px
 }
 div#cidre {
  background-image: url(../img/kerroux1.png);
  background-repeat: no-repeat;
  width: 140px;
  height: 100px;
  padding:10px 10px 10px 10px;
  margin-left:10px
 }
 div#poney{
  background-image: url(../img/poney.png);
  background-repeat: no-repeat;
  width: 160px;
  height: 90px;
  padding:10px 10px 10px 10px;
  margin-left:10px
}
 div#tunnel{
  background-image: url(../img/tunnel.png);
  background-repeat: no-repeat;
  width: 160px;
  height: 90px;
  padding:10px 10px 10px 10px;
  margin-left:10px
}
div#marchenord{
  background-image: url(../img/marchenordique.gif);
  background-repeat: no-repeat;
  width: 160px;
  height: 90px;
  padding:10px 10px 10px 10px;
  margin-left:10px
}
#carre_vert a{
	text-align:center;
	font-family:Verdana;
	font-size:.60em;
	font-weight:bold;
	color:#4FA902;
	margin-left:10px;
}
#carre_vert_petit a{
	text-align:center;
	font-family:Verdana;
	font-size:.60em;
	font-weight:bold;
	color:#4FA902;
	margin-left:10px;
}


/* --------------------menu haut-------------------- */
#menu-conteneur {
	height:50px;
	width:872px;
	margin: 0px 10px 10px 10px;
	float:left;
}
.menu-principal-fond{
	background-image:url(../img/menu.gif);
}
#menu-principal,
#menu-principal ul /* Liste */ {
	list-style:none;
	text-align:center;
	margin:0;
	padding:0;
	clear:both;
}
#menu-principal a /* Contenu des listes */ {
	display:block;
	background:transparent;
	color:#3D8900;
	text-decoration:none;
	font-family:Verdana, sans-serif;
	font-size:9px;
}
#menu-principal li /* Elements des listes */ {
	float:left;
	line-height:13px;
}
#menu-principal li ul /* Sous-listes */ {
	position:absolute;
	width:172px;
	left:-999em;
	background-image:url(../img/sous_menu_btm.gif);
	background-position:bottom;
	padding-bottom:13px;
	top:260px;
}
#menu-principal li ul li /* elements de sous-listes */ {
	line-height:20px;
	color:#747474;
}
#menu-principal li ul li a /* elements de sous-listes */ {
	font-weight:normal;
	font-family:Arial;
	font-size:13px;
	color:#747474;
	text-align:left;
	width:157px;
	padding:0 0 0 10px;
}

li.menu-roll:hover,
li.menu-roll a:hover, 
.menu-roll:hover a.menu-titre-1ligne,
.menu-roll:hover a.menu-titre-2lignes
{
	/* Lorsque la souris passe sur un des liens */
	background:url(../img/menu_degrade.gif) repeat-x;
	font-weight:bold;
}
#menu-principal li:hover ul, 
#menu-principal li li:hover ul
{
	/* Sous-listes lorsque la souris passe sur un element de liste ET sous-sous-lites lorsque la souris passe sur un element de sous-liste */
	left:auto;
	min-height:0;
	z-index: 10;
}
#menu-principal ul li a:hover {
	background:#7AC841;
	color:#FFF;
	font-weight:bold;
}
#menu-principal h2{
	/* attention ! la hauteur de l'element doit etre suffisante pour l'effet du menu*/
	height:45px;
	font-weight: bold;
	float:left;
}
.menu-separateur {
	margin:10px 0 0;
	padding:0;
	height:19px;
	width:2px;
	background:url(../img/separateur.gif);
}
#menu-vignette-ppm{
	position:absolute;
	top:81px;
}
.menu-titre-1ligne{
	padding:14px 8px 14px 8px;
	font-weight:bold;
	text-transform:uppercase;
	max-width:250px;
}
.menu-titre-2lignes{
	padding:8px 8px 9px 8px;
	font-weight:bold;
	text-transform:uppercase;
	max-width:115px;
}
/*
.tbulle {
	border-right:black 1px solid;
	padding-right:2px;
	border-top:black 1px solid;
	padding-left:2px;
	z-index:100;
	font-weight:bolder;
	visibility:hidden;
	padding-bottom:2px;
	width:150px;
	padding-top:2px;
	border:2px solid;
	position:absolute;
	background-color:#FFE;
	border-color:ButtonFace ButtonShadow ButtonShadow ButtonFace;
	text-align:center;
}*/

#image_allee1 {
	float:left;
	width: 200px;
	margin-right:20px;  /* pour décoller le texte de l'image */
	margin-left:10px;
}
#image_allee2 {
	float:left;
	width: 150px;
	margin-right:20px;  /* pour décoller le texte de l'image */
	margin-left:10px;
}
#image_stele2 {
	float:left;
	width: 200px;
	margin-right:20px;  /* pour décoller le texte de l'image */
	margin-left:10px;
}
#image_centre {
/*	width:400px;
	height:300px; */
	text-align:center;
	margin-right:auto;  
	margin-left:auto;
}
#image_tunnel{
	text-align:center;
	margin-left:130px;
	box-shadow:0 0 15px 5px grey;
}
#image_cheque{
	text-align:center;
	margin:30px; 
	box-shadow:0 0 15px 5px grey;
}
#conteneur_image{
	width:190px;
	height:190px;
	margin-right:10px;
	border:1px solid #6d7673;
	border:1px solid #6d7673;
	border-radius:10px;
	-moz-border-radius:10px;
	-moz-box-shadow: 0 0 5px #6d7673;
	-webkit-box-shadow: 0 0 5px# 6d7673;
	box-shadow: 0 0 5px #6d7673;
	background:#d9cdce; /* Old browsers */
}
#image_facebook{
	vertical-align:middle;
	margin: 0 0 0 200px;
	height: 33px; /* spécifiez la hauteur de l'image, une bonne attitude à prendre */
	width: 33px; /* spécifiez la largeur de l'image, une bonne habitude à prendre */
}
#fond_gris{
	width:180px;
	height:20px;
	margin-right:10px;
	border:1px solid #6d7673;
	border:1px solid #6d7673;
	border-radius:10px;
	-moz-border-radius:10px;
	-moz-box-shadow: 0 0 5px #6d7673;
	-webkit-box-shadow: 0 0 5px# 6d7673;
	box-shadow: 0 0 5px #6d7673;
	background:#d9cdce; /* Old browsers */
}
#conteneur_image a{
	text-align:center;
	font-family:Verdana;
	font-size:.75em;
	font-weight:bold;
	color:green;
	margin-left:10px;
}
#conteneur_image p{
	text-align:center;
	font-family:Verdana;
	font-size:.65em;
	font-weight:bold;
	color:green;
	margin-left:5px;
}

#image_petite{
	margin-top:20px;
	margin-left:5px;
	box-shadow:0 0 15px 5px grey;
}
#image{
	margin-left:5px;
}
#image_stele{
	margin-left:60px;
	margin-right:60px;
}
#image_gauche{
	float:left;
	margin-left:10px;
}
#image_droite{
	float:right;
}
.telecharge{
	margin-left:30px;
}
.rouge{
	color:red;
}
.orange{
	color:#808000;
}
.vert{
	color:#519f02;
}
#browser{
height:70px;
text-align:center;
border-radius:10px;
/* margin-top:10px;
margin-left:30px;
margin-right:30px; */
margin-bottom:20px;
/*margin:15px 16px 0 50px;*/	/* 250 pour la marge de gauche place la secton à droite du menu vertical */
-moz-border-radius:10px;
background: #def8c4 ; /* Old browsers */
background: -moz-linear-gradient(left, #def8c4 18%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(18%,#def8c4 ), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #def8c4  18%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #def8c4 18%,#ffffff 100%); /* Opera11.10+ */
background: -ms-linear-gradient(left, #def8c4   18%,#ffffff 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#def8c4', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
background: linear-gradient(left, #def8c4 18%,#ffffff 100%); /* W3C */
/*	width:100%;
	background:#6f4a2b url(img/footer.gif) repeat-x;
	padding:0 0 21px; */
}
#browser p {
	text-align:center;
}
#browser h3 {
text-align:center;
font-family:"Times New Roman", Times, Serif;
font-weight:600;
line-height:1.2;
padding:3px 0 0 5px;
color:#4b8a54;
}
 /* Pour le défilement en javaScript avec Chrome et Safari  */
#boitedefile {
	height: 54px;
    line-height: 54px;
    position: relative;
    overflow: hidden;
}
#textedefile {
    width: 100%;
    position: absolute;
}

/*  Définition des styles pour le bandeau des sponsors */

footer#pied{
color:green;
text-align:justify;
/*text-shadow:3px 3px 3px #000; */
background:#eaf8cd;
width:860px;
height:300px;	
border:1px solid #6d7673;
border-radius:10px;
margin-bottom:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673background: linear-gradient(left, #ebebeb 48%,#ffffff 100%); /* W3C */
}

footer#pied p{
	text-align:center;
	font-size:1.75em;
	font-style:italic;
	padding:3px 0 0 5px;
	color:green
}

#carre_pizza{				
color:#000;
display:inline-block;
vertical-align: top;
width:330px;
height:230px;					
border:1px solid #6d7673;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673;
background:#cfe0ad; /* Old browsers */
margin-left:55px;
margin-bottom:10px;
margin-right:5px;
padding:5px 5px;
/*float:right;*/
}	
#carre_pizza_2015{				
color:#000;
display:inline-block;
vertical-align: top;
width:630px;
height:260px;					
border:1px solid #6d7673;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673;
background:#cfe0ad; /* Old browsers */
margin-left:30px;
margin-bottom:10px;
margin-right:5px;
padding:5px 5px;
/*float:right;*/
}
#carre_pizza_2015 h4{
	color:red;
	font-size:1.4em;
	font-weight:bold;
	text-align:center;
}	
#carre_endurance_shop{				
color:#000;
display:inline-block;
vertical-align: top;
width:180px;
height:230px;					
border:1px solid #6d7673;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673;
background:#cfe0ad; /* Old browsers */
margin-left:25px;
margin-bottom:10px;
margin-right:10px;
padding:5px 15px;
/*float:right;*/
}
#carre_mousquetaire{				
color:#000;
display:inline-block;
/*vertical-align: top;*/
width:120px;
height:230px;					
border:1px solid #6d7673;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673;
background:#cfe0ad; /* Old browsers */
margin-left:10px;
margin-bottom:10px;
margin-right:45px;
padding:5px 5px;
float:right;
}
#carre_webdesign{				
color:#000;
display:inline-block;
vertical-align:top;
width:170px;
height:225px;					
border:1px solid #6d7673;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673;
background:#cfe0ad; /* Old browsers */
margin-left:45px;/*
margin-bottom:10px;
margin-right:10px;	*/
padding-top:15px;
padding-left:10px;
float:left;
/*float:right;*/
}
#carre_accueil{				
color:#000;
display:inline-block;
vertical-align: top;
width:630px;
height:420px;					
border:1px solid #6d7673;
border:1px solid #6d7673;
border-radius:10px;
-moz-border-radius:10px;
-moz-box-shadow: 0 0 5px #6d7673;
-webkit-box-shadow: 0 0 5px# 6d7673;
box-shadow: 0 0 5px #6d7673;
background:#cfe0ad; /* Old browsers */
margin-left:30px;
margin-bottom:10px;
margin-right:5px;
padding:5px 5px;
/*float:right;*/
}	

.conteneur_pizza{
	margin:0 auto;
	width:350px;
	height:100%;
}
.conteneur_pizza h3 {
font-weight:400;
font-style:italic;
color:#2b4d40;
padding:3px 0 0 5px;
text-align:center;
}
#image_pizza{
	float:left;
	width: 144px;
	margin-right:20px;  /* pour décoller le texte de l'image */
	margin-left:0px;
}
.dessous{
	font-weight:400;
	font-style:italic;
	color:#2b4d40;
/*	padding:3px 0 0 5px;*/
	text-align:center;
    clear: both;
}
	
#picture_tunnel{
	float:left;
	width:190px;
	margin-left:20px;
	margin-top:10px;
}
#picture_droite{
	float:right;
	width:280px;
	margin-left:20px;
	margin-top:10px;
}
#picture_gauche{
	float:left;
	width:280px;
	margin-left:20px;
	margin-top:30px;
}
.defile{
	color:OrangeRed3;
}
#temoignage{
	margin: 10px auto;
	width:400px;
	background-color:rgba(227, 254, 242, 0.7);
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
	-moz-background-clip:padding;
	-webkit-background-clip:padding;
	background-clip:padding;
	-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.3);
	-moz-box-shadow:0 0 10px rgba(0, 0, 0, 0.3);
	box-shadow:0 0 10px rgba(0, 0, 0, 0.3);
}
#temoignage h2{
	text-align:center;
	font-size:1.3em;
	font-style:italic;
	padding:3px 10px 0 5px;
	color:#006400
}
#bloc_temoin{
	margin: 10px 10px;
	width:900px;
	background-color:rgba(227, 254, 242, 0.7);
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
	-moz-background-clip:padding;
	-webkit-background-clip:padding;
	background-clip:padding;
	-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.3);
	-moz-box-shadow:0 0 10px rgba(0, 0, 0, 0.3);
	box-shadow:0 0 10px rgba(0, 0, 0, 0.3);
}
#bloc_temoin h3 {
	text-align:center;
	font-size:1.2em;
	font-style:italic;
	padding:3px 0 0 5px;
	color:#006400
}
#bloc_temoin p {
	padding-left:20px;
	padding-right:20px;
	}
/*   Pour la kenadot 14 mai 2023  */
#picture_droite_2023{
	float:right;
	width:350px;
	margin-left:50px;
	margin-top:10px;
}
#picture_gauche_2023{
	float:left;
	width:320px;
	margin-left:20px;
	margin-top:30px;
}