/************************************************
Général 
************************************************/

body {
margin : 0;
padding : 0;
background-image : url('../img/fond.jpg');
background-repeat : repeat-x;
background-position: top;
background-color : #880026;
color : #d70040;
font-family : Arial, Helvetica, sans-serif;
font-size : 12px;
text-align: center;
}


/************************************************
Reglages des DIVs
************************************************/

#conteneur {
margin:auto;
width:980px;
position : relative;
background : url('../img/coulisse.jpg') repeat-y;
min-height : 230px;
text-align: left;
}
#entete {
width : 980px;
height : 423px;
/*clear : both;*/
font-weight : bold;
line-height : 57px;
text-align : center;
background : url('../img/header.jpg') no-repeat;
background-position : center;
border : 0;
vertical-align : middle;
}
nav{
width : 840px;
padding:0 0 20px 0;
margin:0;
}
article{
padding:20px 0;
margin:0;
}
footer{
padding:0;
margin:0;
text-align:center;
}
#adresse {
width : 980px;
height : 32px;
clear : both;
line-height : 32px;
text-align : center;
background : url('../img/footer.jpg') no-repeat;
padding : 50px 0 0 0;
color : #000;
}
aside {
width : 200px;
float : right;
border : 1px dashed #580203;
background : #860028;
margin-left : 50px;
padding : 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
}
div#corps_bas {
background : url('../img/corps-bas.jpg') no-repeat;
background-position : bottom;
}
div#corps {
background : url('../img/corps-haut.jpg') no-repeat;
background-position : top;
padding : 0 70px 0 70px;
}


/************************************************
Differents effets de textes
************************************************/

.couleur {
color : #d70040;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}
.petit {
font-size : 14px;
}
.grand {
font-weight : bold;
font-size : 30px;
font-family : "Times New Roman", Times, serif;
color : #fff;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}
h1 {
font-weight : bold;
font-size : 25px;
font-family : "Palatino Linotype", "Book Antiqua", Palatino, Times, "Times New Roman", "Liberation Serif", FreeSerif, serif;
margin : 0;
padding : 0;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}
h2, h3, h4, h5, h6 {
font-weight : bold;
font-size : 15px;
font-family : "Gill Sans", "Gill Sans MT", "Arial Black", Gadget, sans-serif;
margin : 0;
padding : 0;
}
P {
font-size : 12px;
font-family : Arial, Helvetica, sans-serif;
color : #fff;
margin : 0;
padding : 0;
font-weight:normal;
}


/************************************************
Gestion des images
************************************************/

img{
border:none;
margin:0;
padding:0;
}

.border {
margin:2px;
border:1px solid #666666;
}

.opacite { 
-moz-border-radius: 10px; /* compatibilité avec Firefox */
-webkit-border-radius: 10px; /* compatibilité avec les navigateurs Webkit */
border-radius: 10px; /* propriété CSS3 */


}
a img.opacite {
background-color:#FFF;
cursor:pointer; 
border: 1px solid #CCCCCC;
filter:alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
margin:2px; 
padding:5px
}
a:hover img.opacite {
border: 1px solid #CCCCCC;
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
margin:2px; 
}
.plan { border:1px solid #CCCCCC; padding:2px;}

/************************************************
Gestion des Listes a puces 
************************************************/

div#conteneur ul li {
background : url('../img/puce.gif') no-repeat left 12px;
list-style-type : none;
padding : 0 0 0 10px;
line-height : 20px;
}
div#conteneur ul {
margin : 0;
padding : 0;
}


/************************************************
Gestion des liens
************************************************/


A:link {
font-family : arial;
text-decoration: none;
color : #d70040;
}
A:active {
font-family : arial;
text-decoration : none;
color : #d70040;
}
A:visited {
font-family : arial;
text-decoration : none;
color : #d70040;
}
A:hover {
font-family : arial;
text-decoration: underline;
color : #fff;
}
.amis { 
-moz-border-radius: 5px; /* compatibilité avec Firefox */
-webkit-border-radius: 5px; /* compatibilité avec les navigateurs Webkit */
border-radius: 5px; /* propriété CSS3 */
background-color: #8f0f32;
border:1px solid #d70040;
padding:1px;
margin:0px;
line-height:22px;
}
/************************************************
Gestion du menu
************************************************/

ul.menu {
height : 60px;
margin : 0;
padding : 0;
list-style-type : none;
}
ul.menu li {
display : inline;
margin : 0;
padding : 0;
}
ul.menu li a {
display : block;
height : 60px;
float : left;
margin : 0 0;
padding : 0 7px;
color : #d70040;
line-height : 60px;
text-decoration : none;
background : url('img/separation.jpg') no-repeat left;
font-size : 25px;
font-family : "Palatino Linotype", "Book Antiqua", Palatino, Times, "Times New Roman", "Liberation Serif", FreeSerif, serif;
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.9);
}
ul.menu li a:hover, ul.menu li a.active {
background : url('../img/rollhover.jpg') repeat-x;
background: #d70040;
text-decoration : none;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
color : #fff;
font-size : 25px;
font-family : "Palatino Linotype", "Book Antiqua", Palatino, Times, "Times New Roman", "Liberation Serif", FreeSerif, serif;
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.9);
}

ul.menu li a:visited {
text-decoration : none;
font-size : 25px;
font-family : "Palatino Linotype", "Book Antiqua", Palatino, Times, "Times New Roman", "Liberation Serif", FreeSerif, serif;
text-shadow: 2px 2px 3px rgba(136, 0, 37, 0.9);
}

ul.menu li.premier_lien a {
background : none;
}
ul.menu li.premier_lien a:hover, ul.menu li.premier_lien a.active {
background : url('../img/rollhover.jpg') repeat-x;
color : #d70040;
}


/************************************************
Lettrine pour une premiere lettre en majuscule
************************************************/

.lettrine > p:first-child:first-letter {
font-size : 3.3em;
line-height : 80%;
float : left;
margin-right : 0.1em;
padding : 0.1em;
color : #fff;
background : #d70040;
font-family : "Palatino Linotype", "Book Antiqua", Palatino, Times, "Times New Roman", "Liberation Serif", FreeSerif, serif;
}
.lettrine {
text-align : justify;
	-moz-column-count:2;
	-moz-column-gap:2em;
	-webkit-column-count:2;
	-webkit-column-gap:2em;
	column-count:2;
	column-gap:2em;
}


/************************************************
Autres
************************************************/

textarea {
overflow : auto;
}
.ie6 legend, .ie7 legend {
margin-left : -7px;
}
input[type="radio"] {
vertical-align : text-bottom;
}
input[type="checkbox"] {
vertical-align : bottom;
}
.ie7 input[type="checkbox"] {
vertical-align : baseline;
}
.ie6 input {
vertical-align : text-bottom;
}
label, input[type="button"], input[type="submit"], button {
cursor : pointer;
}
button, input, select, textarea {
margin : 0;
}
button {
width : auto;
overflow : visible;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display : block;
}
/*-------------------------------------------- Couleurs pour l'accessibilité -------------------------------------------- */
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid { 
      border-radius: 1px;
    -moz-box-shadow: 0px 0px 5px red; 
 -webkit-box-shadow: 0px 0px 5px red; 
         box-shadow: 0px 0px 5px red;
}
.no-boxshadow input:invalid, 
.no-boxshadow textarea:invalid { background-color: #f0dddd; }

/* These selection declarations have to be separate.
   No text-shadow: twitter.com/miketaylr/status/12228805301 
   Also: hot pink. */
::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
::selection { background:#FF5E99; color:#fff; text-shadow: none; } 

/*  j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #FF5E99; } 

/* bicubic resizing for non-native sized IMG: 
   code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img { -ms-interpolation-mode: bicubic; }


/*-------------------------------------------- Formulaire Mail -------------------------------------------- */

#contact {
	width: 550px; 
	margin:0; 
	padding: 30px 30px;
	background: #860028; 
	border: 1px solid #d70040;
	-moz-box-shadow: 0px 0px 8px #444;
	-webkit-box-shadow: 0px 0px 8px #444;
}


label {
	float: left; 
	clear: left; 
	margin: 11px 20px 0 0; 
	width: 95px;
	text-align: right; 
	font-size: 16px; 
	color: #d70040;
	text-transform: uppercase; 
	text-shadow: 0px 1px 0px #d70040;
}

input {
	width: 260px; height: 35px; padding: 5px 20px 0px 20px; margin: 0 0 20px 0;
	background: #5E768D;
	background: -moz-linear-gradient(top, #546A7F 0%, #5E768D 20%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#546A7F), color-stop(20%,#5E768D)); /* webkit */
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
	-moz-box-shadow: 0px 1px 0px #f2f2f2;-webkit-box-shadow: 0px 1px 0px #f2f2f2;
	text-shadow: 0px -1px 0px #334f71;
}
	input::-webkit-input-placeholder  {
    	color: #d70040; text-shadow: 0px -1px 0px #38506b;
	}
	input:-moz-placeholder {
	    color: #d70040; text-shadow: 0px -1px 0px #38506b;
	}

textarea {
	width: 260px; height: 170px; padding: 12px 20px 0px 20px; margin: 0 0 20px 0;
	background: #5E768D;
	background: -moz-linear-gradient(top, #546A7F 0%, #5E768D 20%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#546A7F), color-stop(20%,#5E768D)); /* webkit */
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
	-moz-box-shadow: 0px 1px 0px #f2f2f2;-webkit-box-shadow: 0px 1px 0px #f2f2f2;
	text-shadow: 0px -1px 0px #334f71;
}
	textarea::-webkit-input-placeholder  {
    	color: #a1b2c3; text-shadow: 0px -1px 0px #38506b;
	}
	textarea:-moz-placeholder {
	    color: #a1b2c3; text-shadow: 0px -1px 0px #38506b;
	}

input:focus, textarea:focus {
	background: #728eaa;
	background: -moz-linear-gradient(top, #668099 0%, #728eaa 20%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#668099), color-stop(20%,#728eaa)); /* webkit */
}

input[type=submit] {
	width: 185px; height: 52px; float: right; padding: 10px 15px; margin: 0 15px 0 0;
	-moz-box-shadow: 0px 0px 5px #999;-webkit-box-shadow: 0px 0px 5px #999;
	border: 1px solid #556f8c;
	background: -moz-linear-gradient(top, #718DA9 0%, #415D79 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#718DA9), color-stop(100%,#415D79)); /* webkit */
	cursor: pointer;
}