html, body {
        margin:0;
        background : #637FA1;
        height: 100%;
        font-family: Arial, Verdana, Helvetica, Lucida, Tahoma, Geneva, sans-serif;

}

/*--------------SECURIDEV----------------SECURIDEV-------------------------SECURIDEV-----------------------------*/

 .essai{

   height: 100px;
   width: 180px;
   border :0px #000000 solid;
   background: url(../../images/cadre.jpg) no-repeat;
}

.logosecuridev{
  margin-top:10px;

}

.lien {
             padding: 5 10px 1 10px;
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 60%;
             font-weight: bold;
             color: #004080;
             text-decoration: none;
}

a.lien:hover {
              padding: 5 10px 1 10px;

              font-family: Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
              font-size: 60%;
              margin-left: 0px;
              font-weight: bold;
              color: #C8E5FC;
}

/* ----------CADRE menu---------------CADRE menu----------------CADRE menu------------- */
.securidev {         /* positionnement du cadre, que vous pouvez modifier */
        position: absolute;
        float: left;
        left: 0px;
        top: 120px;
        height: 380px;
        width: 180px;
        border :0px #000000 solid;
}


p {
       margin:0; /* marges des paragraphes */
}





#navlist
{
padding: 0 0px 0px;
margin-left: 0px;





background: #C0C0C0;
width: 10em;
}

#navlist li
{
list-style: none;
margin-bottom: 0.00em;
border-top: 0px solid #FFFFFF;
text-align: left;
}

#navlist li a
{
display: block;
padding: 0.25em 1.50em 0.50em 2.75em;
border-left: 1em solid #C9E4FE;
background: #FFFFFF;
text-decoration: none;
}

#navlist li a:link { color: #448; }
#navlist li a:visited { color: #667; }

#navlist li a:hover
{
border-color: #FFFFFF;
color: #FFF;
background: #004080;
}




/* ----------menu------------------------menu----------------------menu------------- */
 .lien1 {
             padding: 5 10px 1 10px;
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 60%;
             font-weight: bold;
             color: #004080;
             text-decoration: none;
}

a.lien1:hover {
              padding: 5 00px 1 10px;
              background: url(../images/guil.gif) no-repeat;
              background-position: 5% 50%;
              padding-left: 20px;
              font-family: Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
              font-size: 60%;
              margin-left: 0px;
              font-weight: bold;
              color: #C8E5FC;
}

.blocpage {

     position:absolute;
     left: 50%;
     width: 800px;
     margin-left: -400px; /* moitié de la largeur */
     border: 0px solid #B7B7B7;
     background: #FFFFFF;
}

.flash{
     position:absolute;
     width: 550px;
     height: 250px;
     border: 1px solid #C0C0C0;
}
.texte {
            width: 550px;
            margin-left: 20px;
            color: #808080;
            font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
            font-size: 75%;
            font-weight: bold;
            border: 0px solid #C0C0C0;

}

.bottom_prod {
            width: 550px;
            height: 45px;
            background-color: #E8E8E8;
            border: 0px solid #000;
            margin-top: 30px;
            z-index:1;
}

.telecharger{
       float : right;
       margin-top:-73px;
       z-index:200;

}


.prod {

            font-family: Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
            color: #000000;
            font-weight: bold;
            font-size: 60%;
            padding-left: 20px;
            padding-top: 0px;
}

.titrepdf {

            font-family: Helvetica, sans-serif;
            color: #000;
            font-weight: bold;
            font-size: 70%;
            padding-left: 20px;
            padding-top: 0px;
}

.entete {

            height: 0px;
            margin-left: 3px;
            border: 0px solid #000;
}

.contenu {
            float: top;
            top: 100px;
            margin-top: 120px;
            margin-left: 200px;
            width: 590px;

            border: 0px solid #000000;

}

.fleche{

            width: 20em;
            padding: 1 40px;
            background: url(../../images/fleche.gif) no-repeat;
            border: 0px solid #000;
}

.calque{
            float: top;
            position: absolute;
            left: 0px;
            top: 600px;
            width: 175px;
            height: 423px;
            z-index:1;
            background: url(../../images/calques.png) no-repeat;

}
.calque2{
            float: top;
            position: absolute;
            left: 0px;
            top: 380px;
            width: 156px;
            height: 150px;
            z-index:1;
            background: url(../../images/calques2.png) no-repeat;

}

.calque3{
            float: top;
            position: absolute;
            left: 0px;
            top: 520px;
            width: 156px;
            height: 150px;
            z-index:1;
            background: url(../../images/calques2.png) no-repeat;

}



.bas_page {

            font-family:  Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
            font-size: 60%;
            color: #808080;
            text-align: center;
            background: #FFFFFF;
            float: top;
            top: 100px;
            width: 100%;
            height:20px;

}


/*----------TEXTE----------------------TEXTE----------------TEXTE-----------------------------------*/

h1{
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 120%;
             font-weight: bold;
             color: #6EB5FB;
             text-decoration: none;
}

h2{
             font-family:  Helvetica, sans-serif;
             font-size: 110%;
             font-weight: bold;
             color: #000080;
             margin-left: 40px;
             margin-TOP: 0px;

}

h5{
             font-family:  Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 80%;
             font-weight: bold;
             color: #003366;

             margin-TOP: 0px;

}

h3{
             font-family:  Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 85%;
             color: #000000;
             margin-left: 20px;
             }

h4{
             font-family:  Lucida, Tahoma,  Geneva, Helvetica, arial,  sans-serif;
             font-size: 120%;
             color: #808080;
             margin-TOP: 15px;
             margin-left: 20px;
             }
             
.lienproduit {


             color: #808080;
             margin-TOP: 15px;
             margin-left: 20px;
             text-decoration: none;
             z-index:10;
             }

a.lienproduit:hover {


             color: #808080;
             margin-TOP: 15px;
             margin-left: 20px;
             text-decoration: underline;
             z-index:10;
}



.liste {
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 80%;
             font-weight: bold;
             color: #808080;
             text-decoration: none;
             margin-left: 30px;
             z-index:10;

}

a.liste:hover {
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 80%;
             font-weight: bold;
             color: #84BDFD;
             left: 60px;
             text-decoration: none;
             margin-left: 30px;
             z-index:10;

}

.liensite {
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 70%;
             font-weight: bold;
             color: #808080;
             text-decoration: none;
             margin-left: 20px;
}

a.liensite:hover {
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 70%;
             font-weight: bold;
             color: #84BDFD;
             margin-left: 20px;
             text-decoration: none;
}

.mail {
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 70%;
             font-weight: bold;
             color: #808080;
             text-decoration: none;


}

a.mail:hover {
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 70%;
             font-weight: bold;
             color: #84BDFD;
             left: 60px;
             text-decoration: none;


}

p{
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 80%;
             color: #808080;

             text-decoration: none;
             margin-left: 20px;
             margin-right: 20px;
             text-align: justify;
             z-index:10;
}

.tab{
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;

             color: #808080;
             text-decoration: none;
             vertical-align:top;
             margin-left: 20px;
             margin-right: 20px;

}

.produit {
             font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 80%;
             font-weight: bold;
             color: #808080;
             text-decoration: underline;
             z-index:10;
}

a.produit:hover {


              font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
             font-size: 80%;
             font-weight: bold;
             color: #6EB5FB;
             text-decoration: underline;
             z-index:10;
}

.lienpdf {
             font-size: 120%;
             color: #808080;
             text-decoration: none;

}

a.lienpdf:hover {
              text-decoration: none;
              color: #000;
              font-size: 120%;
}




.retour{
    font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
    font-size: 70%;
    text-decoration: none;
    color: #808080;

}

a.retour:hover {
    font-family:  Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
    font-size: 70%;
    text-decoration: none;
    color: #52A3FC;
}
/*----------TITRE INDEX----------------------TITRE INDEX--------------------TITRE INDEX--------------------TITRE INDEX-----------------*/
.ti1{
     margin-left: 0px;
}

.ti2{
     margin-left: 75px;
}

.ti3{
     margin-left: 200px;
}

/*----------PHOTOS----------------------PHOTOS--------------------PHOTOS--------------------PHOTOS-----------------*/

.photo_prod {
             float:right;
             margin-right: -5px;

             
}


.loupe {
             float:right;
             margin-left: -4px;
}




/*----------BOX----------------------BOX--------------------BOX--------------------BOX-----------------*/


.center{
          align : center;
}
.gauche{
          background: url(../../images/gauche.gif) no-repeat;
          width: 17px;
          height: 18px;
          padding: 0px;
          margin-right :0px;
          margin-bottom :0px;
          float : left;

}
.box{
          background: url(../../images/box.gif);
          width: 80px;
          height: 17px;
          padding: 0px;
          margin-right: 0px;
          float : left;
          font-family:  Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
          font-size: 80%;
          font-weight: bold;
          margin-bottom :0px;
          color: #FFFFFF;


}

.droite{
          background: url(../../images/droite.gif) no-repeat;
          width: 17px;
          height: 17px;
          padding: 0px;
          margin-left :0px;
          margin-right :0px;
          margin-bottom :0px;
          float : left;

}
.fenetre{
          background: url(../../images/box_deg.gif);
          width: 350px;
          height: 107px;
          float : top;
          margin-top :0px;
          border: 1px solid #999999;
          font-family: Verdana, Arial, Lucida, Tahoma,  Geneva, Helvetica, sans-serif;
          font-size: 70%;
          padding: 10 10px 4 10px
          font-weight: bold;
          margin-top : -3px;
          color: #000;
          text-align: justify;

}

.center{
          border: 0px solid #999999;
          width: 300px;
          height: 107px;

}


.champ{
          background: url(../../images/champ.jpg) no-repeat;
}


#search{
	background: #FFF url(../images/champ.jpg) no-repeat;
	background-position: 3px center;
	padding-left: 20px;
	width: 170px;

}

.input{
       height: 20px;
       width: 170px;
       border-right-width: 0px;
       border-bottom-width: 0px;
       border-top-width: 0px;
       border-left-width: 0px;
       font-family: Helvetica, sans-serif;
       font-size: 12px;
       line-height: normal;
       color: #000000;
       padding: 3px;
}

.form{
        border: 1px solid #c0c0c0;


}

legend{
       color: #004080;
       font-weight: bold;

}





