/* CSS Document */
body{margin:0 auto; background:  #3598bc ; font:14px/18px "Trebuchet MS", Arial, Helvetica, sans-serif; height: 100%;  }
div, p, ul, h1, h2, h4, img, form, label{padding:0px; margin:0px;}
ul{list-style-type:none;}


/*----MAIN PANEL----*/

#content{ margin: 0 auto ;
        width: 997px;
        background: #3598bc;
        overflow:hidden;}
		
/*----FCK----*/		
		
.body_class h1{ font:14px Verdana, Arial, Helvetica, sans-serif; font-weight:bold; color: #0f704f; background:url(/front_files/perle-import/images/h1.png) 18px 0px  no-repeat; float:left; padding:13px 0 15px 65px;width:auto;}
.body_class h2{ font:14px "Arial",  Helvetica, sans-serif; font-weight:bold; color: #033452; background:url(/front_files/perle-import/images/h2center.jpg) 7px 9px no-repeat; float:left;width:auto;}
.body_class p{ width:638px; padding-left:20px;  font:13px "Arial",  Helvetica, sans-serif; color: #000000; float:left; text-align:justify;  }

.body_class a{ font:12px "Arial",  Helvetica, sans-serif;  color: #501F1F; text-decoration:none; font-weight:bold; }
.body_class a:hover{ color: #501F1F; text-decoration:underline; }
.body_class img{ float:left; padding:5px 10px 5px 0px; }
.textebleu{ font:13px "Arial",  Helvetica, sans-serif; color: #509ad4;  }
.textemarron{ font:13px "Arial",  Helvetica, sans-serif; color: #8d3f2a;  }

.body_class{width:676px;   background:  url(/front_files/perle-import/images/repeat.png) repeat-y ; float:left; margin-top:6px; }
		

/*----Menu----*/
#menu1{width:997px; height:242px;  background:url(/front_files/perle-import/images/banniere1.jpg) 0 top no-repeat ; background-color:#3598bc;  list-style-type: none; position:relative;}


.menu {white-space:nowrap /*IE hack*/; position:absolute;   background:none; color: #FFFFFF; font:0.85em "Arial",  Helvetica, sans-serif; font-weight:bold; color:#FFFFFF; top:205px; left:190px;}
.menu ul {list-style-type:none; display:inline; }
.menu ul li {float:left; z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; width:auto;  }
.menu ul li a {float:none !important /*Non-IE6*/; float:left /*IE-6*/;  display:block; height:2.0em; line-height:1.0em; padding:0 16px 0 16px; text-decoration:none; font-weight:bold; color: #FFFFFF; background:url(/front_files/perle-import/images/separate.jpg) right top  no-repeat; overflow:visible; width:auto;}
.menu ul li a:hover {text-decoration:underline  !important ; }

.menu li.qualite a {float:none !important /*Non-IE6*/; float:left /*IE-6*/; display:block; height:2.0em; line-height:1.0em; padding:0 16px 0 16px; text-decoration:none ; font-weight:bold; color: #FFFFFF; background-image:none;width:auto;}
.menu li.qualite a:hover { text-decoration:underline !important ;}

.menu ul li ul {display:none; border:none;}

/*Non-IE6 hovering*/

.menu ul li:hover {position:relative;  }
.menu ul li:hover a { text-decoration:underline;   }
.menu ul li:hover ul {display:block; width:10.0em; position:absolute; z-index:999; top:1.9em; margin-top:0em; left:0;   }
.menu ul li:hover ul li a {white-space:normal; display:block; width:12.9em; height:25px; padding-left:5px;line-height:2.1em; margin-left:-1px;  background-color:#9c5d3f ; font-weight:normal; color:#FFFFFF;  background:url(/front_files/perle-import/images/sousmenu.png) repeat-x; text-decoration:none !important;   }
.menu ul li:hover ul li a:hover {background-color:#9c5d3f;  background:url(/front_files/perle-import/images/sousmenuhov.png)  repeat-x;text-decoration:none !important;   }

/*IE6 hovering*/
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;}
.menu ul li a:hover {position:relative /*IE hack*/; z-index:1000 /*IE hack*/; text-decoration:underline;}
.menu ul li a:hover ul {display:block; width:10.0em; position:absolute; z-index:999; top:2.0em; left:0; margin-top:0em;}
.menu ul li a:hover ul li a {white-space:normal; display:block; width:10.0em; height:10px; line-height:1.3em; padding:4px 16px 4px 16px;  border-bottom: solid 1px #FFFFFF; background-color:#9c5d3f; font-weight:normal; color:#FFFFFF; background-image:none; text-decoration:none !important; }
.menu ul li a:hover ul li a:hover {background-color:#c48041; text-decoration:none !important;}



/*----/Menu----*/

#flag1{width:30px; height:30px;  float:left; margin-left:20px; margin-top:10px; background:url(/front_files/perle-import/images/francais.jpg) no-repeat;  }
#flag1 a{width:30px; height:30px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; float:left; }
#flag2{width:30px; height:30px;  float:left; margin-left:15px; margin-top:10px;background:url(/front_files/perle-import/images/english.jpg) no-repeat; }
#flag2 a{width:30px; height:30px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; float:left; }


/*----left Panel----*/
#leftPan{width:155px; height:575px; float:left;   color: #000000; background:url(/front_files/perle-import/images/menugauche1.jpg) no-repeat; }

#glossaire{ width:154px; height:36px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; background:url(/front_files/perle-import/images/h2-left.jpg) 2px 0px no-repeat; float:left; margin-top:20px;}
#glossaire a{ width:154px; height:36px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; float:left; }
#liens{ width:154px; height:36px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; background:url(/front_files/perle-import/images/h4-left.jpg) 2px 0px no-repeat; float:left; margin-top:10px; }
#liens a{ width:154px; height:36px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; float:left; }
#contact{ width:154px; height:36px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; background:url(/front_files/perle-import/images/h3-left.jpg) 2px 0px no-repeat; float:left; margin-top:10px; }
#contact a{ width:154px; height:36px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; float:left; }
#collection{ width:154px; height:36px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; background:url(/front_files/perle-import/images/h1-left.jpg) 2px 0px no-repeat; float:left; margin-top:70px; }
#collection a{ width:154px; height:36px;font:13px "Arial",  Helvetica, sans-serif; line-height:25px; font-weight:bold; color:#000000; float:left; }

#leftPan ul{width:147px;  padding:0px ; float:left; }
#leftPan li{ width:auto; float:left; padding-left:2px; height:30px;  }
#leftPan li a{ width:139px; height:30px;display:block;   font:12px "Arial",  Helvetica, sans-serif; font-weight:bold; color:#ffffff; background:url(/front_files/perle-import/images/menugaucheul.jpg) 0 1px  no-repeat;   text-decoration:none;  padding-top:6px; padding-left:13px;}
#leftPan li a:hover{ text-decoration:none; color:#ffffff; background:url(/front_files/perle-import/images/menugauchespan.jpg) 0 1px  no-repeat;}
#leftPan li span{   width:139px; height:30px;display:block;   font:12px "Arial",  Helvetica, sans-serif; font-weight:bold; color:#ffffff; background:url(/front_files/perle-import/images/menugauchespan.jpg) 0 1px  no-repeat;   text-decoration:none;  padding-top:7px; padding-left:13px;}

#leftPan li.menugauche { background:none; height:20px; width:auto; margin-left:10px; margin-bottom:3px; }
#leftPan li.menugauche a{ font:12px "Arial",  Helvetica, sans-serif; font-weight:bold; color:#ffffff; background:none;   padding-left:6px; height:10px; width:80px;   }
#leftPan li.menugauche a:hover{ text-decoration:underline;background:none;    }
#leftPan li.collection { width:130px; height:15px;display:block;   font:12px "Arial",  Helvetica, sans-serif; font-weight:bold; color:#ffffff;   text-decoration:none;  padding-top:6px; padding-left:15px; background:url(/front_files/perle-import/images/menugaucheul.jpg) 2px 1px  no-repeat;  }


/*----/left Panel----*/

/*----Center Panel----*/
#flash{width:678px;  margin:0 auto;  background: url(/front_files/perle-import/images/fla.jpg) no-repeat; float:left;  }
#repeat h1{ font:14px Verdana, Arial, Helvetica, sans-serif; font-weight:bold; color: #0f704f; background:url(/front_files/perle-import/images/h1.png) 18px 0px  no-repeat; float:left; padding:13px 0 15px 65px;width:auto;}
#repeat h2{ font:14px "Arial",  Helvetica, sans-serif; font-weight:bold; color: #033452; background:url(/front_files/perle-import/images/h2center.jpg) 7px 9px no-repeat; float:left;width:auto;}
#repeat p{ width:638px; padding-left:20px;  font:13px "Arial",  Helvetica, sans-serif; color: #000000; float:left; text-align:justify;  }

#repeat a{ font:12px "Arial",  Helvetica, sans-serif;  color: #800000; text-decoration:none; font-weight:bold; }
#repeat a:hover{ color: #800000; text-decoration:underline; }
#repeat img{ float:left;  }
.textebleu{ font:13px "Arial",  Helvetica, sans-serif; color: #509ad4;  }
.textemarron{ font:13px "Arial",  Helvetica, sans-serif; color: #8d3f2a;  }

#repeat{width:676px;   background:  url(/front_files/perle-import/images/repeat.png) repeat-y ; float:left; margin-top:6px; }
#bottom{width:678px; height:7px;   background: url(/front_files/perle-import/images/bas-text.jpg) no-repeat #3598bc; float:left;  }


/*----/Center Panel----*/


/*----Right Panel----*/
#rightPan{width:164px; height:574px;  float:left; background: url(/front_files/perle-import/images/partners1.jpg)  no-repeat #3598bc;   }
#containPartners{width:132px;   float:left; padding-left:25px;   }
#partners1{ width:88px; height:115px; float:left; background: url(/front_files/perle-import/images/ripcurl.png)   no-repeat ; margin-top:10px;    }
#partners1 a{ width:88px; height:115px; float:left; font:13px "Arial",  Helvetica, sans-serif; float:left;   }

#partners2{ width:105px; height:104px; float:left; background: url(/front_files/perle-import/images/surfrider.jpg)   no-repeat ; margin-top:25px;   }
#partners2 a{ width:105px; height:104px; float:left; font:13px "Arial",  Helvetica, sans-serif; float:left;   }

#partners3{ width:106px; height:63px; float:left; background: url(/front_files/perle-import/images/surfshop.jpg)   no-repeat ; margin-top:25px;   }
#partners3 a{ width:106px; height:63px; float:left; font:13px "Arial",  Helvetica, sans-serif; float:left;   }

#partners4{ width:105px; height:46px; float:left; background: url(/front_files/perle-import/images/malla.jpg)   no-repeat ; margin-top:25px;   }
#partners4 a{ width:105px; height:46px; float:left; font:13px "Arial",  Helvetica, sans-serif; float:left;   }



/*----/Right Panel----*/

/*----/Formulaire----*/
label {color: #000000;display:block;float:left;font-family: Arial, Helvetica, sans-serif;font-size:13px;width:80px; margin-bottom:10px; text-align:left; padding-left:50px;}
#box {float:left;height:30px;padding-left:50px;}
input, textarea {width:300px;background-color: #fff;color:#000000;border:1px solid #800000;margin-bottom:10px;}

.submit {width:100px;background-color: #fff;color:#000;border:1px solid #800000;margin-left:155px;}
.submit:hover {width:100px;background-color: #000;color:#fff;border:1px solid #800000;}

.content {clear:both;margin-left:20px;overflow:auto;}
.texte_blancpetit {color: #333333;font-family: Arial, Helvetica, sans-serif;font-size:13px;text-align:right;
}
/*----/Formulaire----*/

/*----Footer Panel----*/
#footermainPan { background:url(/front_files/perle-import/images/footer.jpg) no-repeat #3598bc bottom ; height:162px; float:left; width:990px; margin-top:6px; }
#footermainPan ul{width:618px; height:15px;  float:left;  padding-left:210px;    }
#footermainPan ul li{ width:auto; float:left;    }
#footermainPan ul li a{ width:180px; display:block;   font:12px "Arial",  Helvetica, sans-serif; font-weight:bold; color:#FFFFFF; background:url(/front_files/perle-import/images/separate.jpg) right  no-repeat ;   text-decoration:none; height:20px; text-align:center; padding-top:3px;   }
#footermainPan ul li a:hover{ text-decoration:underline; color:#FFFFFF; }

#footermainPan li.sanstrait a{ width:180px; display:block;   font:12px "Arial",  Helvetica, sans-serif; font-weight:bold; color:#FFFFFF; background:none !important ;text-decoration:none; height:20px; text-align:center; padding-top:3px;   }
#footermainPan li.sanstrait a:hover{ text-decoration:underline; color:#FFFFFF; }

#footermainPan ul li span{  width:180px; display:block;   font:12px "Arial",  Helvetica, sans-serif; color:#FFFFFF; font-weight:bold; text-decoration:underline; height:25px; text-align:center; padding-top:3px;}
#footerPan{margin:0 auto; clear:both;}

#footerPan p.adresse{width:400px; margin:0 auto; color:#ffffff; font:0.9em "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:normal; padding-top:20px;}
#footerPan p.adresse a{font:10px "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:normal; color:#ffffff; text-decoration:none;}
#footerPan p.adresse a:hover{font:10px "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:normal;}


#footerPan p.copyright{width:186px; padding-top:15px; padding-left:10px;color:#ffffff; margin:0 auto;  font:10px "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:normal;}
#footerPan p.copyright a{font:10px "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:normal; color:#ffffff; text-decoration:none;}
#footerPan p.copyright a:hover{font:10px "Trebuchet MS",Arial, Helvetica, sans-serif; font-weight:normal;}








