/*===| I. LAYOUT SIZE |====================================================*/

#container, #footer, #header {
    width: 820px;
}
#container {
    margin: 0 auto;
    text-align: center;
}
#header {
    height: 285px;
    float: left;
}
#footer {
    position: relative;
    z-index: 19;
    margin: 0 auto;
    padding: 10px 0px 0px 0px;
}
#footer-left {
    float: left;
    text-align: center;
    padding: 5px 30px;
    width:231px;
    line-height: 15px;
}
#footer-right {
    float: left;
    padding: 0px 0px;
    width: 525px;
    text-align: center;
}
#left-vertical-spacer1 {
    position: absolute;
    z-index: 1;
    width: 50%;
    height: 100%;
}
#left-vertical-spacer2 {
    position: relative;
    z-index: 2;
    width: 50%;
    height: 70px;
    padding: 0px 0px 0px 0px;
    margin-top: -70px;
}
#left-column {
    float: left;
    width: 291px;
    padding-bottom: 12px;
}
#right-column {
    float: left;
    width: 525px;
}
/*	--- Important! ----------------------------------------
#wrap-footer, #footer and .push must be the same height
-------------------------------------------------------
*/
#footer, .push {
    height: 60px;
}
#wrap-footer {
    height:70px;
    margin: -60px 0 0 0;
}
.push {
    clear: both;
}
/* --- Important! -------------------------------
The bottom margin of #wrap-container
is the negative value of the footer's height
-----------------------------------------------
*/
#wrap-container {
    position:relative;
    z-index: 17;
    width: 100%;
    height: auto !important;
    height: 100%;

}

/* ===| II. LAYOUT's DEFAULT ELEMENTS |=======================================*/

* {
    margin: 0;
}
html {
    height: 100%;
    width: 100%;
}
body {
    height: 100%;
    width: 100%;
    position:absolute;
    z-index: 0;
}
ul {
    list-style-position: outside;
    margin: 0px;
    padding: 0px;
}
li {
    list-style-position: outside;
    margin-left: 15px;
    padding: 2px;
}
p {
    padding: 0px 0px;
}
.ref {
    position: relative;
    z-index:999;
    width: 820px;
    text-align: center;
    margin: 0 auto;
}
/* cursor
-------------------------------------------------------------------------*/
a{
    cursor: pointer;
}

a:focus{
    outline: none;
}



/* ===| II. LEFT-COLUMN ELEMENTS |=======================================*/

/* --- Operations du moment -------------------------------------------- */
#actualite {
    margin:15px 6px 10px 6px;
    padding: 0px 0px 0px 0px;
}
.actualite_div1_content {
    padding: 8px 0px 0px 6px;
}
/* --- Coordonnees -------------------------------------------- */
#contact-info{
    margin: 0px 5px;
    padding: 6px 0px 0px 0px;
}
#contact-info p {
    text-align: left;
}
#contact-info a,a:visited {
    padding:0px 5px;
    text-align: center;
}
#contact-info a:hover {
    text-align: center;
}
#contact-info_div1{
    margin: 8px 0px;
    padding: 50px 0px 10px 10px;
}


/* ===| III. RIGHT-COLUMN ELEMENTS |======================================*/
/* --- Introduction ------------------------------------------- */
.introduction {
    margin: 15px 6px;
    width: 506px;
}
.introduction p{
    padding: 10px 5px 5px 5px;
    margin: 0;
}
.introduction_pannel1 {
    margin: 0px 0px 0px 0px;
    padding: 5px 5px 5px 5px;
    width: 506px;
    float: left;
}
.introduction_pannel1 p {
    padding: 5px 0px 0px 0px;
    text-align: justify;
}

/* --- Description ------------------------------------------- */
.description {
    margin: 0px 6px;
    width: 506px;
}
.description p {
    padding: 10px 0px 5px 5px;
    text-align: justify !important;
}

/* --- Highlights ------------------------------------------- */
.highlights {
    margin: 15px 6px;
    padding: 5px 0px 0px 0px;
}
.highlights p{
    padding: 5px 0px 0px 10px;
    text-align: justify !important;
}
.highlights_pannel1 {
    margin: 0px 0px 0px 0px;
    padding: 5px 5px 0px 5px;
    width: 504px;
}
.highlights_pannel1 p {
    margin: 0px 0px 0px 0px;
    padding: 5px 0px 0px 0px;
}
.highlights_pannel2 {
    margin: 5px 0px 0px 0px;
    padding: 5px 5px 5px 5px;
}
.highlights_pannel2 p {
    margin: 0px 0px 0px 0px;
    padding: 5px 0px 0px 0px;
}
/* --- Lists ------------------------------------------- */
.my_list1 {
    padding: 0;
    margin: 0 0 0 5px;
    text-align:  justify;
    float: left;
}
.my_list2 {
    margin: 0px;
    padding: 0px 0px 0px 10px;
    text-align:  justify;
    width: 355px;
    float: left;
}
.my_list3 {
    margin: 0px;
    padding: 0px 0px 0px 0px;
    text-align:  justify;
}

/* --- Search bar ------------------------------------------- */
#search-holder {
    padding:13px 0 0px 5px;
    float:left;
    width:400px;

}
#search-bar{
  float: left;
  width:350px;
  height: 50px;

}
#search-label{
  font-weight: bold;
  font-size: 12px;
  color: #000000;
  width:80px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}
.categ{
  width: 150px;
}
.recherche{
  border:none;
  float:left;
}

/*	--- Important! -----------------------------------
If you want space between paragraphs or headers,
use padding instead of margin.
-------------------------------------------------*/

/* ===| III. CONTENT ELEMENTS |===============================================*/

img {
    border: 0;
}

/*	--- Important! ----------------------------------
Use class "left" or "right" on the html elements
you want to float (on the thumbs, for example)
*/
p .left {
    float: left;
    margin: 5px;
}
p .right {
    float: right;
    margin: 5px;
}
.left {
    float: left;
    margin: 0px 0px 0px 0px;
    padding: 0px;
}
.left1 {
    float: left;
    margin: 0px;
    padding: 0px;
}
.right {
    float: right;
    margin: 0px 0px 0px 10px;
    padding: 0px;
}
.right1 {
    float: right;
    margin: 5px 5px 5px 10px;
    padding: 0px;
}
.paragraph {
    clear: both;
    display: table;
}
.clear {
    clear: both;
}


.star
{
  margin:8px 6px 0 10px;
  float:left;
}


/* ===| IV. NAVIGATION |===============================================*/
#menu2 ul li {
    display: inline;
}

/* ---| THE END |------------------------- */