body.index {
           margin-left: 0;
           margin-right: 0;   
           background-image: url(img/welcome.jpg) ;
           background-repeat : no-repeat;
           background-position : left top;
           font-family: verdana, sans-serif;}

body.page {
          margin-left: 0;
          margin-right: 0;
          background-image: url(img/background.jpg) ;
          background-repeat : no-repeat;
          background-position : left top;
          font-family: verdana, sans-serif;
          SCROLLBAR-3DLIGHT-COLOR: #E6E8E8;
          SCROLLBAR-ARROW-COLOR: #818296;
          SCROLLBAR-DARKSHADOW-COLOR: #E6E8E8;
          SCROLLBAR-FACE-COLOR: #C3CACE;
          SCROLLBAR-HIGHLIGHT-COLOR: #E6E8E8;
          SCROLLBAR-SHADOW-COLOR: #E6E8E8;
          SCROLLBAR-TRACK-COLOR: #E6E8E8;}
          


#zone1 {
       position:absolute;
       width : 17px;
       height: 17px;
       margin-left: 786px;
       margin-top: 2px;
       border-color:red;
       border-width:0px;
       border-style:solid;}

#zone3 {
       position:absolute;
       width :17px;
       height:17px;
       margin-left:838px;
       margin-top:2px;
       border-color:red;
       border-width:0px;
       border-style:solid;}

#plan {
      position:absolute;
      width : 60px;
      height: 15px;
      margin-left: 431px;
      margin-top: 572px;
      border-color:red;
      border-width:0px;
      border-style:solid;}
            
#zone2 {
          position:absolute;
          width : 72px;
          height: 15px;
          margin-left: 175px;
          margin-top: 572px;
          border-color:red;
          border-width:0px;
          border-style:solid;}

#liens {
       position:absolute;
       width : 30px;
       height: 15px;
       margin-left: 590px;
       margin-top: 572px;
       border-color:red;
       border-width:0px;
       border-style:solid;}

#tomatik {
         position:absolute;
         width : 70px;
         height: 15px;
         margin-left: 784px;
         margin-top: 1272px;
         border-color:red;
         border-width:0px;
         border-style:solid;}

#menu {
      left: 697px;
      width: 164px;
      top:105px;
      position:absolute;}

.menu  {
       width: 164px;
       height: 19px;
       margin-bottom:2px;
       padding-left:30px;
       border-color:red;
       border-width:0px;
       border-style:solid;
       background-image: url(img/cell-menu.jpg);
       background-repeat : no-repeat;
       background-position : left;
       text-align:left;
       vertical-align:super;}

a.boutonmenu:link{
                  text-decoration:none;
                  color:rgb(0,136,143);
                  font-size: 9px;
                  font-weight: bold;}

a.boutonmenu:visited{
                     text-decoration:none;
                     color:rgb(0,136,143);
                     font-size: 9px;
                     font-weight: bold;}

a.boutonmenu:hover{
                   text-decoration:none;
                   color:rgb(255,102,3);
                   font-size: 10px;}

.retrait {
         margin-left:30px;
         margin-top:30px;
         margin-right:10px;}

#carte {
       height:140px;
       width:209px;
       position:absolute;
       margin-left:15px;
       left:636px;
       top:309px;
       background-image: url(img/carte.jpg) ;
       text-align:right;}
       
#carte img{
       text-decoration:none;
       border-color:red;
       border-width:0px;
       border-style:solid;
       }
       
#inscripcarte {
       height:300px;
       width:300px;
       position:absolute;
       margin-left:15px;
       left:0px;
       top:0px;
       text-align:right;}
       
#inscripdetail {
       height:300px;
       width:200px;
       position:absolute;
       margin-left:5px;
       padding-left:5px;
       left:310px;
       top:0px;
       border-color:rgb(255,102,3);
       border-width:0 0 0 1px;
       border-style:solid;
       text-align:left;}


a.boutoncarte:link{
                   text-decoration:none;
                   color:rgb(0,76,90);
                   font-size: 9px;
                   font-weight: bold;}

a.boutoncarte:visited{
                      text-decoration:none;
                      color:rgb(0,76,90);
                      font-size: 9px;
                      font-weight: bold;
                      padding:1px}

a.boutoncarte:hover{
                    padding-left:12px;
                    padding-right:0px;
                    text-decoration:none;
                    color:rgb(0,76,90);
                    font-size: 10px;
                    background-image:url(img/flecheb.jpg);
                    background-repeat:no-repeat;
                    background-position:0% 50%;}

.retraitcarte {
              margin-left:10px;
              margin-top:0px;
}

                               /* vvvvvvvvv  specific index  vvvvvvvv */

#slogan {
        margin-right:10px;
        padding:0px;
        height:173px;
        width:526px;
        color:rgb(119,116,120);
        text-align:center;
        font-size: 10px;
        font-weight: bold;
        position:absolute;
        left: 85px;
        top:300px;
      /*  background-image: url(img/slogan.jpg);*/}
        
#nav {
        position:absolute;
        color:rgb(188,202,104);
        width : 350px;
        height: 15px;
        font-size: 9px;
        margin-left: 424px;
        margin-top: 565px;}

.retraitslogan {
               margin-left:7px;
               margin-top:0px;}
			   
.retraitnav {
               margin-left:0px;
               margin-top:0px;}

#info {
      padding:0px;
      height:99px;
      margin-right:30px;
      color:rgb(0,76,90);
      text-align:left;
      font-size: 10px;
      font-weight: bold;
      height:99px;
      width:226px;
      position:absolute;
      left: 637px;
      top:576px;
      background-image: url(img/info.jpg);}
	
#temoin{
        margin-right:30px;
        color:rgb(0,76,90);
        text-align:left;
        font-size: 10px;
        font-weight: bold;
        padding:0px;
        height:99px;
        width:226px;
        position:absolute;
        left: 379px;
        top:456px;
        background-image: url(img/temoin.jpg);}
        
#temoignage {
        margin-left:5px;
        padding-right:10px;
        padding-left:10px;
        padding-bottom:10px;
        margin-top:10px;
        border-color:rgb(255,102,3);
        border-width:1px;
        border-style:solid;
        background-color:rgb(255,255,255)}

.retraittemoin {
               margin-left:10px;
               margin-top:25px;}

                                /* ^^^^^^^^^^  specific index ^^^^^^^^^^   */

.retraitemploi {
               margin-left:30px;
               margin-top:25px;}
               
.retraitplus {
             margin-left:30px;
             margin-top:25px;}


#emploi{
        margin-right:30px;
        color:rgb(0,76,90);
        text-align:left;
        font-size: 10px;
        font-weight: bold;
        margin-left:15px;
        padding:0px;
        height:99px;
        width:209px;
        position:absolute;
        left: 637px;
        top:456px;
        background-image: url(img/emploi.jpg);}
 


a.savoirplus:link{
                  text-decoration:none;
                  color:rgb(151,0,118);
                  text-align:right;
                  font-size: 9px;
                  font-weight: bold;
                  padding:1px}

a.savoirplus:visited{
                     text-decoration:none;
                     color:rgb(151,0,118);
                     font-size: 9px;
                     font-weight: bold;}

a.savoirplus:hover{
                   background-image:url(img/flechev.jpg);
                   background-repeat:no-repeat;
                   background-position:0% 50%;
                   padding-left:12px;
                   text-decoration:none;
                   color:rgb(151,0,118);
                   font-size: 10px;}



                              /* vvvvvvvvv  specific page  vvvvvvvv */

#central{
         overflow: auto;
         margin-left:0px;
         padding-right:20px;
         height:315px;
         width:514px;
         color:rgb(79,85,89);
         text-align:justify;
         font-size: 10px;
         position:absolute;
         left: 100px;
         top:235px;
         border-color:red;
         border-width:0px;
         border-style:solid;
         line-height:15px;}
         
#centraltitre{
              margin-left:0px;
              margin-bottom:0px;
              padding-right:20px;
              height:100px;
              width:514px;
              position:absolute;
              left: 114px;
              top:135px;
              border-color:blue;
              border-width:0px;
              border-style:solid;
              background-image: url(img/central.jpg);
              background-repeat: no-repeat;
              background-attachment: scroll;}

.retraitcentraltitre {
                     margin-left:15px;
                     margin-top:5px;
                     padding-right:150px ;
                     color:white;
                     font-weight: bold;
                     text-align:left;
                     font-size: 14px;}

.retraitcentraldescription {
                           margin-left:5px;
                           margin-right:5px;
                           margin-top:25px;
                           color:rgb(153,163,166);
                           text-align:justify;
                           font-size: 12px;
                           font-weight: bold;}

a.retraitcentraldescription:link {
                                 text-decoration:none;
                                 color:rgb(153,163,166);
                                 font-size: 12px;
                                 font-weight: bold;}

a.retraitcentraldescription:visited {
                                    text-decoration:none;
                                    color:rgb(153,163,166);
                                    font-size: 12px;
                                    font-weight: bold;}

a.retraitcentraldescription:hover {
                                  text-decoration:none;
                                  color:rgb(255,102,3);
                                  font-size: 12px;
                                  font-weight: bold;}
                                  
a.retraitcentraldescription:active {
                                  text-decoration:none;
                                  color:rgb(255,102,3);
                                  font-size: 12px;
                                  font-weight: bold;}

.retraitcentraltexte {  
                     margin-left:5px;
                     margin-top:10px;}
                     
.encars {
                     margin-left:25px;
                     margin-top:10px;
                     padding-top:5px;
                     padding-left:5px;
                     padding-right:5px;
                     padding-bottom:5px;
                     border-width:1px;
                     border-style:solid;}

a.retraitcentraltexte:link {
                           text-decoration:none;
                           color:rgb(0,136,143);}

a.retraitcentraltexte:visited {
                              text-decoration:none;
                              color:rgb(0,136,143);}

a.retraitcentraltexte:hover {
                            text-decoration:none;
                            color:rgb(255,102,3);
                            font-weight:bold;}
                            
.zoom {
height:400px;
margin:auto;
}
.zoom p {
text-align:center;
}
.zoom img {
width:400px;
height:300px;
}
.zoom img:hover {
width:740px;
height:540px;
}

.zoom1 {

 width: 451px;
 height: 327px;
 background: url(img/challenge4.jpg);
 background-repeat:no-repeat;
 margin: 0 auto; 
}
.zoom1 p, .zoom1 a {
height: 327px;
display: block;
margin:0 auto;
}
.zoom1 a:hover {
overflow:auto;
background-image: url(img/challenge5.jpg);
background-position: 0px 0px;
background-repeat: no-repeat;
cursor:help;
}
                            
li {
   font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
   font-size: 100%;
   color: rgb(102,102,102);
   margin: 0 0 5px 0 ;
   display : list-item;
   list-style-image : url(puce.gif);
   list-style-position: outside;}
 
h1 {
   text-align: center;
   margin: 15px 0 25px 20px;
   color: rgb(255,152,86);
   font-size: 14px;
   letter-spacing: 4px;
   font-weight:bold;}

h2 {
   text-align: left;
   margin-left: 20px;
   margin-top: 10px;
   padding-left:5px;
   padding-right:5px;
   color: rgb(36,142,146);
   font-size: 11px;
   letter-spacing: 2px;
   border-color:rgb(255,152,86);
   border-width:1px;
   border-style:solid;
   background-color:rgb(251,225,158);
   }

h3 {
   text-align: left;
   margin-left: 40px;
   color: rgb(111,138,190);
   font-size: 11px;
   letter-spacing: 2px;}

h4 {
   text-align: left;
   margin-left: 30px;
   margin-top:5px;
   margin-bottom:5px;
   color: black;
   font-size: 10px;
   letter-spacing: 1px;}
   
#offre {
        margin-left:5px;
        padding-right:10px;
        margin-top:10px;
        border-color:rgb(255,102,3);
        border-width:1px;
        border-style:solid;
        background-color:rgb(221,241,243)}

.inscrip {
        margin-top:0px;
        text-align: left;
        margin-left: 0px;
        color: black;
        font-size: 9px;
        font-weight:bold;
        letter-spacing: 0px;}

.emploidate{
             text-align: left;
             margin-left: 20px;
             color: red;
             font-size: 11px;
             letter-spacing: 1px;}

.emploipro{
             text-align: center;
             margin-left: 40px;
             color: green;
             font-size: 15px;
             font-weight:bold;
             letter-spacing: 1px;}
             
.emploiintro{
             text-align: justify;
             margin-left: 20px;
             color: grey;
             font-size: 10px;
             font-weight:bold;
             letter-spacing: 1px;}
             
.emploititre{
             text-align: center;
             margin-left: 40px;
             color: blue;
             font-size: 11px;
             letter-spacing: 0px;}
             
.emploidescrip{
             text-align: justify;
             margin-left: 10px;
             color: grey;
             font-size: 9px;
             letter-spacing: 0px;}
             
h.emploidescrip{
             text-align: left;
             margin-left: 40px;
             color: black;
             font-size: 9px;
             font-weight:bold;
             letter-spacing: 1px;}
             
                            /* vvvvvvvvv  specific carte  vvvvvvvv */
         
#france{
         overflow: auto;
         margin-left:0px;
         padding-right:20px;
         height:430px;
         width:500px;
         text-align:justify;
         font-size: 10px;
         position:absolute;
         left: 114px;
         top:148px;
         border-color:red;
         border-width:0px;
         border-style:solid;
         line-height:15px;}
         
#centralcarte{
              margin-left:0px;
              margin-bottom:0px;
              padding-right:20px;
              height:100px;
              width:514px;
              position:absolute;
              left: 114px;
              top:135px;
              border-color:blue;
              border-width:0px;
              border-style:solid;
              background-image: url(img/centralcarte.jpg);
              background-repeat: no-repeat;
              background-attachment: scroll;}
              
#detail {
       /*overflow: auto;   */
       height:260px;
       width:295px;
       position:absolute;
       margin-left:0px;
       margin-bottom:1px;
       margin-top:10px;
       padding-left:5px;
       padding-right:5px;
       padding-top:5px;
       left:550px;
       top:280px;
       text-align:left;
       font-size: 9px;
       border-color:red;
       border-width:0px;
       border-style:solid;}
       
#imagette {
       height:135px;
       width:170px;
       position:absolute;
       left:-20px;
       top:-127px;
       border-color:red;
       border-width:0px;
       border-style:solid;}
       
.detail {
        margin-left:5px;
        margin-top:10px;}
        

#detail h1 {
   text-align: center;
   margin: 0px 0 2px 0px;
   color: rgb(255,152,86);
   font-size: 12px;
   letter-spacing: 1px;
   border-color:rgb(255,152,86);
   border-width:1px;
   border-style:solid;
   background-color:rgb(255,204,153);
   font-weight:bold;}
   
#detail h2 {
   text-align: center;
   margin-left: 2px;
   margin-top: 2px;
   padding-left:0px;
   padding-right:0px;
   color: rgb(36,142,146);
   background-color:rgb(251,225,158);
   font-size: 10px;
   letter-spacing: 2px;}

#detail h3 {
   text-align: left;
   margin-left: 4px;
   color: rgb(111,138,190);
   font-size: 9px;
   letter-spacing: 2px;}
   
#detail a:link {
        text-decoration:none;
        color:rgb(0,136,143);
        font-size: 9px;
        font-weight: bold;}
        
#detail a:hover {
        text-decoration:none;
        color:rgb(255,102,3);
        font-size: 9px;
        font-weight: bold;}
        
#detail a:visited {
        text-decoration:none;
        color:rgb(0,136,143);
        font-size: 9px;
        font-weight: bold;}
              
                          /* ^^^^^^^^^^  specific carte ^^^^^^^^^^   */