/* ************************* 

[MASTER STYLESHEET] 
Project: vectorSKIN
Version: 1.2  
Last change: 14/01/2009
Assigned to: J.MARTINET - vectorSKIN 

[COLOR CODES] 
.bleu   #5397be 
.orange #ff9900
.bleu #0fb2c6
.vert #a3cf30
.rouge #CE4242

[XHTML STRUCTURE]  
+body
    + #conteneur
		+ #header .themeorange ( cette classe permet de changer les couleurs selon le theme)
			- .racourcis
			- .logo
		+ #mainmenu
		+ #sousmenu
		+ #mainpage
			- 
			- .pagedroite
		+ .footer

 
************************* */
@media screen {

html { margin:0;padding:0;}
body { margin:0;padding:0; color:#89897b; font-size:11px; text-align:center; background:#fff url(../images/interface/ban_head.gif) repeat-x; font-family:Arial, Helvetica, sans-serif;}

#conteneur{width:880px;margin:0 auto; text-align:left; position:relative; background:#FFFFFF url(../images/interface/conteneur.gif) repeat-y;color:#414142; font-size:1em;}
#mainpage { clear:both; float:none; width:860px; margin-left:10px;}

/* Gestion des titres */
h1, h2,h3, h4,h5, h6,dl, dt, dd, img, p, img a {padding:0; margin:0; list-style:none; border:none;}
p.clear, div.clear { display:block; width:100%; clear:both; font-size:1px; padding:0; margin:0; height:1px;}

ul, li { padding:0; margin:0; list-style:none;}
.center { text-align:center;}
.center img { margin:0 auto;}
 
/* Gestion des formulaires */
fieldset { padding:0; margin:0; border: none; display:block;}
form { padding:0; margin:0; border: none; display:inline;}

.input { color:#a4a493;background-color:#fff;}
.select { color:#a4a493;background-color:#fff;}
.textarea { color:#a4a493;background-color:#fff;}
textarea {font-family: Verdana, "Lucida Grande", Lucida, Tahoma, "Trebuchet MS", Arial, Geneva, Helvetica, sans-serif;}
table, tr, td { border-collapse:collapse; padding:0; margin:0;}

.separation { width:100%; clear:both; float:none; font-size:1px; padding:0; margin:0; line-height:0.8em; background:url(../images/interface/separation.gif) repeat-x 0 0; height:40px;}

.red { color:#CC3300; font-weight:bold; background-color:inherit;}

/* *********************** */
/*       HEADER           */
/* ********************* */

#header{ height:220px; width:880px; background:#F8F7F2 url(../images/interface/banniere.gif) no-repeat 0 0;color:#fff;}
#header .racourcis { height:55px; width:880px;}

/* logo */
#header .logo a { display:block;float:left; background:url(../images/interface/vectorskin_logo.gif) no-repeat 0 0; width:150px; height:37px; margin:6px 0 0 15px;}
#header .logo span { display:none;}
#header .banniere { width:980px;height:175px; }

/* raccourcis */
#raccourcisblock { width:279px; height:28px; background:url(../images/menus/raccourcis_back.gif) no-repeat; position:absolute; top:8px; right:10px}
#raccourcisblock ul { display:block; list-style:none;}
#raccourcisblock ul li { list-style:none; display:inline;}
#raccourcisblock ul li a { display:block; float:left; width:88px; height:20px; padding-top:2px;background:url(../images/menus/raccourcis_a_link.gif) no-repeat 0 0; margin:4px -2px 0 5px; text-align:center; color:#A7AB90; background-color:inherit; font-size:11px; text-decoration:none; line-height:1.5em}
#raccourcisblock ul li a:hover { background-position:0 -22px; color:#BFC1A7; background-color:inherit;}

/* *********************** */
/*       MAIN MENU        */
/* ********************* */
 
#mainmenu { position:absolute; top:80px; height:93px; width:657px; right:30px;} 
#mainmenu ul { padding:0; margin:0;}
#mainmenu ul li { display: inline; list-style:none;}
#mainmenu ul li a { display:block;  background:url(../images/menus/bouton_menu.png) no-repeat 0 0; float:left; font-size:1em; color:#414142; background-color:inherit; text-align:center; text-decoration:none; width:auto;  }
#mainmenu ul li a strong { font-size:1.5em;}

#mainmenu ul li a:hover.item1,#mainmenu ul li.active a.item1 { background-position:0 -65px; color:#414142; background-color:inherit;}
#mainmenu ul li a:hover.item2,#mainmenu ul li.active a.item2 { background-position:0 -65px; color:#414142; background-color:inherit;}
#mainmenu ul li a:hover.item3,#mainmenu ul li.active a.item3 { background-position:0 -65px; color:#414142; background-color:inherit;}
 
#mainmenu ul li a.item1,#mainmenu ul li a.item2 { text-align:left; padding: 10px 0 0 20px; width:199px; height:55px}
#mainmenu ul li a.item3 { height:47px; width:219px;padding-top:18px;}
#mainmenu ul li a span { font-size:0.8em; font-weight:normal;}
/* ******************* */
/*  SOUS MENU         */
/* ***************** */

#submenu { position:absolute; top:186px; left:35px; height:34px; width:90%;}
#submenu ul { padding:0; margin:0; list-style:none; height:34px; overflow:hidden;}
#submenu ul li { list-style:none; display:inline; margin:0; padding:0;}

#submenu ul li a { padding:0 10px 0 0; margin:0 5px 0 0 ; list-style:none; display:block; float:left; height:34px; line-height:3em; font-size:1em; font-weight:bold; color:#787865; background-color:inherit; text-decoration:none;background:url(../images/menus/submenu_right.gif) no-repeat  right -34px; width:auto; font-family:Arial, Helvetica, sans-serif;}
#submenu ul li a span{ padding:0 0 0 10px; margin:0; list-style:none; display:block; float:left; height:34px; cursor:pointer;background:url(../images/menus/submenu_left.gif) no-repeat  left -34px; width:auto;}

#submenu ul li a:hover { background:url(../images/menus/submenu_right.gif) no-repeat  right 0;}
#submenu ul li a:hover span{ background:url(../images/menus/submenu_left.gif) no-repeat  left 0;}

#submenu ul li.active a, #submenu ul li.active a:hover{  background:url(../images/menus/submenu_right.gif) no-repeat  right 0; color:#787865; background-color:inherit;}
#submenu ul li.active a span, #submenu ul li.active a:hover span{ background:url(../images/menus/submenu_left.gif) no-repeat  left 0;}
 
/* ********************** */
/*        FULLPAGE       */
/* ******************** */

.fullpage { width:820px;  padding:20px 20px 0 20px; color:#787865 ; background-color:inherit; background:url(../images/interface/fullpage.gif) no-repeat 0 0; }
.articles { color:#333333; background-color:inherit;}

/* styles globaux */
.fullpage p { margin:0 0 15px 0; padding:0; clear:both; float:none; font-size:1.1em; font-family:'Trebuchet MS', Trebuchet, trebuchet, Arial, Helvetica, sans-serif; width:auto;}
.fullpage p.biggreen { background-color:#f1efe3; padding:3px 5px 3px 5px; color:#333333;}
.fullpage p .vignette { float:left; padding:0 5px 5px 0; width:auto;}
.fullpage p img.vignette { width:85px; height:50px;}
.fullpage p.ensavoirplus a { background:url(../images/interface/a_link.gif) no-repeat 0 5px; padding-left:7px;}

.fullpage a { color:#CE4242; background-color:inherit; text-decoration:none;}
.articles a { color:#CE4242; background-color:inherit;}
.fullpage a:hover { text-decoration:underline;}

.fullpage ul { margin:0 0 10px 20px; text-align:left;}

/* titres */
.fullpage h2 { font-size:1.4em; clear:both; float:none; margin:0; padding:15px 0 5px 0; color:#6c6f5c; background-color:inherit; width:auto; text-align:left;}
.fullpage h2.titre { color:#665f4d; background:#f8f7f2 url(../images/interface/h3.gif) no-repeat 6px 10px; padding:5px 0 5px 22px; margin:0 0 10px 0;}
.articles h2 {color:#333333; background-color:#FFFFFF; text-transform:none; text-align:left;}
.articles h2.titre { color:#333333; background:#f8f7f2 url(../images/interface/h3_article.gif) no-repeat 6px 10px; padding:2px 0 2px 24px; margin:0 0 10px 0; font-size:1.3em;}

.fullpage h3 { font-size:1.4em; clear:both; float:none; margin:0; padding:15px 0 5px 0; color:#6c6f5c; background-color:inherit; width:auto; text-align:left;}
.fullpage h3.titre { color:#665f4d; background:#f8f7f2 url(../images/interface/h3.gif) no-repeat 6px 10px; padding:5px 0 5px 22px; margin:0 0 10px 0;}
.articles h3 {color:#333333; background-color:#FFFFFF; text-transform:none; text-align:left;}
.articles h3.titre { color:#333333; background:#f8f7f2 url(../images/interface/h3_article.gif) no-repeat 6px 10px; padding:2px 0 2px 24px; margin:0 0 10px 0; font-size:1.3em;}

/* Introduction fullpage */
.fullpage .intro { padding:10px 0 0 0; margin:0 0 25px 0;  }
.fullpage .intro div {min-height:130px; margin:0 0 0 10px;}
.fullpage .intro h1 { font-size:1.8em;  margin:0 ; padding:0 0 10px 180px; color:#6c6f5c; background-color:inherit;    }
.fullpage .intro p { margin:0; font-weight:bold; color:#abb50b; background-color:inherit; width:500px;  padding:0 30px 0 182px; text-align:left; font-size:1.1em;font-family:Arial, Helvetica, sans-serif;}
.fullpage .intro p a {color:#abb50b; background-color:inherit; text-decoration:underline;}

/* Introduction articles */
.articles .intro h1 { color:#333333; background-color:inherit;}
.articles .intro p {color:#333333; background-color:inherit;}

/* icones */
.intro1 { background:url(../images/interface/intro1.jpg) no-repeat 0 0;}
.intro2 { background:url(../images/interface/intro2.jpg) no-repeat 0 0;}
.intro3 { background:url(../images/interface/intro3.jpg) no-repeat 0 0;}
.intro4 { background:url(../images/interface/intro4.jpg) no-repeat 0 0;}
.intro5 { background:url(../images/interface/intro5.jpg) no-repeat 0 0;}
.intro6 { background:url(../images/interface/intro6.jpg) no-repeat 0 0;}
.intro7 { background:url(../images/interface/intro7.jpg) no-repeat 0 0;}
.intro8 { background:url(../images/interface/intro8.jpg) no-repeat 0 0;}
.intro9 { background:url(../images/interface/intro9.jpg) no-repeat 0 0;}

/* colonnage */
.fullpage .colgauche { width:370px; float:left; margin-left:10px; text-align:justify;}

.fullpage .coldroite { width:370px; float:right; text-align:justify;}
.fullpage .coldroite ul { margin-left:0;}

.fullpage .block10 { width:800px; padding:0 10px 15px 0;}
  
/* block3liste */
.fullpage .block3liste { width:100%; clear:both; float:none; margin:0 0 10px 0;}
.fullpage .block3liste .top { background:url(../images/interface/block3liste_top.gif) no-repeat 0 bottom; width:100%; height:9px;}
.fullpage .block3liste .contenu { background:url(../images/interface/block3liste.gif) no-repeat 0 bottom;}

.fullpage .linkbox h4 { font-family:Arial, Helvetica, sans-serif; margin:0 0 5px 5px; background:url(../images/interface/linkbox.gif) no-repeat 0 0; padding:3px 0 5px 10px; color:#6c6f5c; background-color:inherit; font-size:1.2em;}
.fullpage .linkbox h4 a {color:#6c6f5c; background-color:inherit; text-decoration:none;}
.fullpage .linkbox h4 a:hover { text-decoration:underline;}

.fullpage .linkbox p  { font-family:Arial, Helvetica, sans-serif; padding:0 0 0 15px; width:233px;}
.fullpage .linkbox p.texte { min-height:60px;}
* html .fullpage .linkbox p.texte { height:60px;}
.fullpage .linkbox p a { font-family:Arial, Helvetica, sans-serif; padding:0 0 0 10px; background:url(../images/interface/fleche.gif) no-repeat 0 2px; font-size:0.9em; color:#0fb2c6; background-color:inherit;}  

.fullpage .linkbox1 { width:260px; margin:0 20px 0 0; float:left;}
.fullpage .linkbox2 { width:260px; margin:0 20px 0 0; float:left;}
.fullpage .linkbox3 { width:260px; float:left;}

.fullpage  p.introliste { padding:0 0 5px 0; font-weight:bold; margin:0; font-size:1.1em;}

/* simple liste */
.fullpage ul.simpleliste { margin:0 0 15px 0;}
.fullpage ul.simpleliste li { padding:3px 0 2px 22px; margin:0 0 5px 0; background:#f8f7f2  url(../images/interface/simpleliste_li.gif) no-repeat 2px 3px; min-height:17px; font-size:1.1em; color:#42441F;}
.articles  ul.simpleliste li {  background:#fff url(../images/interface/articles_simpleliste.gif) no-repeat 7px 10px;  font-size:1.1em; color:#42441F; padding:3px 5px 3px 17px;}

/* listesanspuces */
.fullpage ul.listesanspuces {  margin:0 0 15px 15px; background-color:#FFFFFF; color:#787865; background-image:none;}
.fullpage ul.listesanspuces li { list-style:none; padding:0 0 5px 0;}

/* listes centree */ 
.fullpage ul.centre { width:100%; text-align:center; margin:0; padding:0;}
.fullpage ul.centre li{ margin:0; padding:0;}

/* megacenter */
ul.megacenter { text-align:center; margin:0 auto; font-size:1.2em;}
/* Plan du site */
.fullpage .titredesection { margin:0 0 0 15px; padding:0 0 10px 0; font-weight:bold;}

.fullpage ul.listeplan { margin:0 0 15px 15px;}
.fullpage ul.listeplan li { background:url(../images/interface/listeplan.gif) no-repeat 0 5px; padding:0 0 7px 10px; color:#5397be; background-color:inherit; }
.fullpage ul.listeplan li a {  color:#5397be; background-color:inherit; text-decoration:none;}
.fullpage ul.listeplan li a:hover{ text-decoration:underline;}

/* Page de referencement */
.fullpage ul.listepartenaires {margin:0 0 15px 15px; text-align:center;}
.fullpage ul.listepartenaires li { list-style:none; padding:0 0 8px 0}

.fullpage ul.references { clear:both; float:none; width:100%;}
.fullpage ul.references li { display:inline;}
.fullpage ul.references li a {display:block; width:242px; height:101px; border:4px solid #cdccc6; text-align:center; font-size:21px; font-weight:bold;background-color:#e3e2dd; color:#fff; text-decoration:none; float:left; margin:0 10px 20px 0;}
.fullpage ul.references li a:hover { }
.fullpage ul.references li a img{width:242px; height:101px; }
 
/* ********************* */
/*   FORMULAIRE         */
/* ******************* */

.formcontact{ font-family:Arial, Helvetica, sans-serif; width:100%; color:#8f9082; background-color:inherit;}
 
.formcontact .f1 p { width:100%; height:25px; clear:both; float:none; margin:0 0 15px 0;}
.formcontact .f1 label { display:block; float:left; width:130px; margin:0 0 4px 0; }
.formcontact .f1 .input { display:block; float:left; width:220px; height:14px;  border:1px solid #8f9082; padding:2px 0 0 3px; font-family:"Courier New", Courier, monospace; font-size:0.9em}
 
.formcontact .f2 { position: relative; width:100%;}
.formcontact .f2 p { clear:both; float:none; width:100%;  margin:3px 0; }
.formcontact .f2 label { padding:0 0 6px 0; display:block; width:100%; }
.formcontact .f2 .textarea { width:350px; height:169px; border:1px solid #8f9082; padding:2px 0 0 3px; font-family:"Courier New", Courier, monospace; font-size:0.9em;}

.formcontact .f3 p{ clear:both; float:none; width:100%; padding:1px}
.formcontact .f3 p em { font-size:0.8em;}
.formcontact .f3 .bouton{  background:url(../images/interface/btn_envoyer.gif) no-repeat; border:none; text-align:center; font-weight:bold; width:113px; height:31px;  display:block; margin-top:10px; margin-left:auto; margin-right:auto; color:#646643; background-color:inherit; cursor: pointer;}
 
/* **************** */
/* lightblock      */
/* ************** */

/* integration dans les pages */
#gallery ul { width:800px; clear:both; float:none; padding:0 0 15px 0;}
#gallery ul li{ float:left; width:177px; height:90px; display:block; margin:0 10px 10px; border:6px solid #cdccc6;}

 
/* ********************* */
/*   FOOTER             */
/* ******************* */

.miseajour { clear:both; float:none; width:100%; margin:0; padding:10px 0 0 0; font-size:0.9em; font-family:Arial, Helvetica, sans-serif}
.miseajour p{color:#CE4242; background-color:inherit;  background:url(../images/interface/miseajour.gif) no-repeat 0 5px;  padding:0 0 0 10px}


#footer{  width:880px;clear:both; float:none;  text-align:left; margin:30px 0 0 0; font-size:0.9em }
#footer .top { width:100%; background:#e1e3d6 url(../images/interface/footer_top.gif) no-repeat 0 0; height:19px; font-size:1px; color:#333333;}

#footer .contenu { width:860px; margin-left:10px; background-color:#e1e3d6; color:#414142;}

#footer .contenu a{  color:#414142; background-color:inherit; text-decoration:none; }
#footer .contenu a:hover{  color:#414142; background-color:inherit; text-decoration:underline; }
#footer .contenu ul li{ list-style:none;}
#footer .contenu .sitemap { width:100%; border-bottom:1px dotted #c3c5b9;}
#footer .contenu .sitemap ul { width:100%; text-align:center; padding:0 0 10px 0}
#footer .contenu .sitemap ul li { list-style:none; display:inline;}

#footer .contenu .copyright { width:300px; float:right; text-align:right; padding:20px; }
#footer .contenu .copyright ul { padding:0 0 10px 0}

#footer .contenu .addresse  { width:300px; float:left; padding:20px;   }

#footer .contenu  ul.validationw3c li { display:inline; padding-right:5px;}

}