body {
   font-family: Arial,sans-serif;
   font-size: 12px;
   margin: 0 auto;
   padding: 0;
   background: url(../interface/site/pattern.gif);
}
div, h1, h2, h3, h4, p, form, label, input, textarea, img, span, ul, li{
   margin: 0;
   padding: 0;
}
img{ border:0;}

a, input, select{ outline:none; text-decoration: none;}
a{ color: #11999c;}
a:hover{text-decoration: none;}

#contenuepage a, #contenuepage a:link, #contenuepage a:active, #contenuepage a:hover, #contenuepage a:visited{ color:#1776b1; text-decoration: underline;}


h1 {
   font-family: 'Droid Sans', serif;
   color: #FFF;
   font-size: 22px;
   font-weight: 400;
   text-transform: uppercase;
}
h2 {
   font-family: 'Droid Sans', serif;
   color: #f83333; 
   font-size: 16px;
   font-weight: 400;
}
h3 {
   font-family: 'Droid Sans', serif;
   color: #FFF;
   font-size: 14px;
   font-weight: bold;
   line-height: 18px;
   margin: 0;
}
h4 {
   color: #000;
   font-size: 14px;
   font-weight: bold;
   line-height: 17px;
   margin: 0;
}
p {
   font-family: verdana, sans-serif;
   font-size: 14px;
   line-height: 17px;
}

/* ============================================ */
/* =============   GÉNÉRAL TEMPLATE   ============== */
/* ============================================ */   

#HeaderWrapper{ height: 180px; background: url(../interface/site/pattern_header.jpg) repeat-x;}
   #Header{width: 960px; height: 137px; margin: 0 auto;}
      #Logo{ background: url(../interface/site/logo.gif) no-repeat; width: 216px; height: 106px; display: inline-block; cursor: pointer;}
      #Header-F_right{ float: right; width: 660px; }
      #Menu-secondaire{ width: 660px; text-align: right; margin: 15px 10px 0 0;}
      #Menu-secondaire a{ font-size: 12px; font-weight: bold; color: #2a2e03; margin:0 4px; display: inline-block;}
      #Search{ float: right; width: 350px; margin: 30px 0 0;}
         #Search Form Input[type="text"]{float:left; width: 253px; height: 24px; padding: 3px 3px 0; margin: 0; border: none;}
         #Search Form div.Submit{float:left; cursor: pointer; width: 86px; height: 21px; padding-top: 6px; background-color: #444545; color: #FFF; text-align: center;}
   
   /* MENU PRINCIPAL */   
   #Menu{ height: 43px; width: 960px; margin: 0 auto; overflow: hidden;}
         #Menu ul li{ 
               list-style: none; 
               height: 43px; 
               display: block;
               float: left;
               padding: 0 9px;
               font-size: 11px; 
               font-weight: bold;
               text-transform: uppercase;
               font-family: 'Droid Sans', serif;
               background: url(../interface/site/bg_menu-line.gif) right no-repeat;
         }
         #Menu ul li a{ color:#FFF; display: inline-block; height: 30px; padding-top: 15px;}         
         #Menu ul li a.actif, #Menu ul li a:hover{ color: #686b72;} 
            
#Wrapper{width: 960px; margin: 0 auto;}
   
/* =============   LAYOUT 1  ============== */   
   /* CONTENT LAYOUT 1 */  
   #LeftCollomnLayout1{ float: left; width: 620px; margin:0; }

     
      #MainContentLayout1{ 
         width:608px; 
         margin:30px 10px 0;
         background-color: #FFF;
         border:1px solid #a1a6ab;
      }
      #MainContentLayout1 .BubbleRegular{position: absolute;}
      #MainContentLayout1 div.Bubble_red{ margin: -15px 0 0 -15px;}   
      #MainContentLayout1 div.Bubble_Footer_Red{width: 150px;}   
      #MainContentLayout1 .Content div{padding: 4px 25px; }
      #MainContentLayout1 .Content .TeaserNews-footer{padding: 0; }
      #MainContentLayout1 .TeaserNews-footer{
         width: 608px;
      }
      
   
      #FastLinkLayout1{ width: 620px; height: 124px; margin-top: 20px;} 
         #FastLinkLayout1 img{ float: left; width: 190px; height: 124px; margin-left: 20px;} 
         
   #RightCollomnLayout1{ float: left; width: 340px;}
      #FastLink{ width: 340px; margin-top: 14px;}
         #FastLink img{ margin:5px 0 0 20px;}
      
      #TeaserNews{ float: left; width: 330px; margin:25px 0 15px 10px; position: relative;}
        #TeaserNews .BubbleRegular{ width: 215px; position: absolute; left: 0; top: 0; z-index: 9999;}
            #TeaserNews .Bubble_Footer_Grey{ background-position: left;}
         #TeaserNews-content{ position: relative; width: 308px; margin:14px 0 0 10px; border:1px solid #a1a6ab; background-color: #FFF;}
         .TeaserNews-previous, .TeaserNews-next{ position: absolute; margin-top: 60px; width: 28px; height: 39px; z-index: 9999;}
         #TeaserNews-text{ margin: 45px 35px 15px 35px;}
            #TeaserNews-text h4{ font-family: 'Droid Sans', serif; font-size: 14px; color: #f83333;}
            #TeaserNews-text p{ font-size: 12px; color: #666666; margin-top: 4px;}
         .TeaserNews-previous{ left: 0;}
         .TeaserNews-next{ right: 0;}
         .TeaserNews-footer{ width: 308px; height: 44px; background: url(../interface/site/bg_more_info.gif) repeat-x;}
            .TeaserNews-footer a{ 
               width: 278px; 
               height: 30px; 
               display: block;  
               color:#383a3a;
               padding: 14px 0 0 30px;
            }
            .TeaserNews-footer a img{ position: absolute;}
            .TeaserNews-footer a span{ 
               font-family: 'Georgia', serif;
               font-size: 13px; 
               font-weight: bold; 
               font-style: italic;
               line-height: 17px;
               margin-left: 30px;
            }
            #TeaserNews-text.ui-widget-content{background: none; border: none; position: relative;}         
            #TeaserNews-text.ui-widget-content ul{display:none;}
            #TeaserNews-text .ui-widget-content{padding: 0;}
            #TeaserNews .Bubble_Grey{ text-transform: uppercase;}
            #TeaserNews-text div{cursor: pointer;}
            

/* =============   LAYOUT 2  ============== */  
      
  /* SOUS MENU LAYOUT 2 */     
   #LeftCollomnLayout2{ float: left; width: 205px; margin:0; margin-top: 30px; }
            #LeftCollomnLayout2 ul li{ 
                        list-style: none; 
                        text-transform: uppercase;                   
                        margin-top:3px;
                        font-family: 'Droid Sans', serif;
                        line-height: 14px;
            }
            #LeftCollomnLayout2 ul li a{ 
                        width: 170px; 
                        font-size: 12px; 
                        padding: 8px 27px 8px 8px; 
                        font-weight: bold; 
                        display: block; 
                        background: url(../interface/site/puce-menu.gif) no-repeat #FFF;
                        background-position: 185px 6px;
            }
            #LeftCollomnLayout2 ul li a:hover, #LeftCollomnLayout2 ul li a.actif, #SubMenu ul li a.actif:hover{ 
                                       color: #FFF; 
                                       background: url(../interface/site/puce-menu-actif.gif) no-repeat #7d818a;
                                       background-position: 185px 6px;
            }
                  #LeftCollomnLayout2 ul li ul li{
                              font-family: Verdana,Arial,sans-serif;
                              font-size: 12px;
                              list-style: none;
                              text-transform: none;
                  }
                  #LeftCollomnLayout2 ul li ul li a{ 
                              width: 172px; 
                              font-size: 12px; 
                              color: #3c3d3d; 
                              padding: 10px 8px 8px 25px; 
                              font-weight: bold; 
                              display: inline-block; 
                              border-bottom: 1px solid #8c8f95;
                              background: url(../interface/site/puce-menu-sub.png) no-repeat;
                              background-position: 12px 13px;
                  }            
                 #LeftCollomnLayout2 ul li ul li a:hover, #LeftCollomnLayout2 ul li ul li a.actif, #SubMenu ul li ul li a.actif:hover{ 
                                             color: #3c3d3d; 
                                             background: url(../interface/site/puce-menu-sub.png) no-repeat;
                                             background-position: 12px 13px;
                  } 

                  #LeftCollomnLayout2 ul li ul li ul li a{ 
                              width: 162px; 
                              font-size: 12px; 
                              color: #3c3d3d; 
                              padding: 6px 8px 0 35px; 
                              font-weight: 400; 
                              display: inline-block; 
                              border-bottom: none;
                              background: none;
                  }            
                 #LeftCollomnLayout2 ul li ul li ul li a:hover, #LeftCollomnLayout2 ul li ul li ul li a.actif, #SubMenu ul li ul li ul li a.actif:hover{ 
                                             color: #3c3d3d; 
                                             background: none;
                  }
                                    
         #LeftCollomnLayout2 .SubMenuVide{ border: 1px solid #8c8f95; width: 189px; background-color: #FFF; padding: 12px 7px;}
  
  /* CONTENT LAYOUT 2 */ 
  #MainContentLayout2{ float: left; width: 497px; border: 1px solid #8c8f95; margin:30px 15px; padding: 0 18px 18px; background-color: #FFF; }   
  #MainContentLayout1 div.Bubble_red, #MainContentLayout2 div.Bubble_red{ margin-top: -15px; padding: 3px 10px;}   
  #MainContentLayout2 div.Bubble_red h1{ line-height: 30px;}   

  #RightCollomnLayout2{ float: left; width: 190px; margin:15px 0 0; }    
         #TexteSecondaire{ border: 1px solid #8c8f95; width: 174px; background-color: #FFF; padding: 12px 7px;}      
         #ToolsLink{width: 190px;}
            #ToolsLink img{margin-top:15px; }                 
            

/* FOOTER */         
#FooterWrapper{ height: 221px; background: url(../interface/site/pattern_footer.jpg) repeat-x; margin: 35px 0;}         
   #Footer{width: 960px; height: 221px; margin: 0 auto;}
      #Footer div{ width: 300px; height: 221px; float: left; display: inline-block; padding-left: 20px; background: url(../interface/site/bg_footer-separation.gif) right no-repeat;}
         #Footer div h3{ margin-top: 35px;} 
         #Footer div ul{ width: 285px; margin-top: 20px;} 
         #Footer div li{ 
            font-family: Arial, sans-serif; 
            font-size: 12px; 
            font-weight: bold; 
            list-style:none;
            margin: 8px 5px 0 0;
             padding: 0 0 8px 5px;
            background: url(../interface/site/line.gif) bottom repeat-x;
         }        
         #Footer div li span{ width: 11px; height: 11px; margin-right:10px;  background: url(../interface/site/puce.gif) no-repeat; display: inline-block;}
         #Footer div li a{ color: #66a9b1;}
         #Footer div p{  margin-top: 10px; font-size: 12px; line-height: 17px;}

         #Footer div div.BubbleRegular{ display: inline-block; width: 190px; height: 30px; text-align: center; float: none; background: none; padding: 0; margin-top: 15px;}
            #Footer div div.BubbleRegular div.Bubble_red{float: none;  height: 30px; width: 190px; padding: 0;background: url(../interface/site/bg_header_shadow.png) left top no-repeat #f83333;}
            #Footer div div.BubbleRegular div.Bubble_red a{ 
                     display: block; 
                     font-size: 12px; 
                     font-family: 'Droid Sans', serif; 
                     color:#FFF; 
                     font-weight: bold; 
                     padding: 8px 2px;
            }
            #Footer div div div.Bubble_Footer_Red{float: none;  background: url(../interface/site/bg_bubble_red_footer.png) right no-repeat; width: 190px; height: 15px; padding: 0;}

         
#MainContentLayout2 p{ margin: 15px 0 0; color: #000;}         
#MainContentLayout2 ul{ margin: 8px 0 0 16px;}         
 

.BubbleRegular{ display: inline-block; height: 45px; text-align: center;}
.Bubble_Grey{ height: 30px; padding: 0;background: url(../interface/site/bg_header_shadow.png) left top no-repeat #323232;}
.Bubble_Footer_Grey{background: url(../interface/site/bg_bubble_grey_footer.png) right no-repeat; height: 15px;}
.Bubble_red{ height: 30px; padding: 0;background: url(../interface/site/bg_header_shadow.png) left top no-repeat #f83333;}
.Bubble_Footer_Red{background: url(../interface/site/bg_bubble_red_footer.png) right no-repeat; height: 15px;}

.Bubble_red a, .Bubble_Grey a{ 
         display: block; 
         font-size: 12px; 
         font-family: 'Droid Sans', serif; 
         color:#FFF; 
         font-weight: bold; 
         padding: 8px 2px;
}
         
/* ============================================ */
/* =============   GÉNÉRAL CSS   ============== */
/* ============================================ */

.FieldsError, .messageStackError{ color:#FF0000;}
.FieldsNoError{ color:#17b70f;}
.fs_11{ font-size: 11px;}
.fs_13{ font-size: 13px;}
.inline{ display:inline;}
.F_right{ float: right;}
.F_left{ float: left;}
.clear-r{ clear: right;}
.clear-l{ clear: left;}
.clear-b{ clear: both;}
.T_AlignRight{ text-align: right;}
.italic{ font-style: italic;}

.Tabulation{ margin-left: 50px; clear: left;}
.Half_Tabulation{ margin-left: 25px; clear: left;}
.margin-15{ margin-top: 15px;}
.margin-20{ margin-top: 20px;}
.margin-40{ margin-top: 40px;}

/*copy HERE the same style than your actual general a */
.lookLikeA{  text-decoration: underline; cursor:pointer; }


/* ************************ */
/* STYLES POUR L'IMPRESSION */
/* ************************ */
@media print{
   #Menu-secondaire, #LeftCollomn, #Header, #Menu, #Content-Right-collomn, #Footer{ display:none;}
   #MainContent{ clear:both;min-height:0;width:100%;}
}