* {padding:0; margin:0;}
body {background-color: #ffffff;background-image: url(../images/fondTrait.gif);background-attachment:fixed;background-repeat: repeat-x;
		font-size: 12px; font-family: "Trebuchet MS", Arial, Helvetica;}

li {list-style-type: none;}
h1 {font-size: 13px; position:absolute;top:38px;left:550px;width: 170px;text-align: left;color: #000000;}
h2 {font-size: 32px; padding-bottom: 30px;margin-left: 300px;text-align: left;}
h3 {font-size: 18px; padding-bottom: 10px;}
h4 {font-size: 14px; padding-bottom: 10px;}
a:visited, a:link, a:hover {text-decoration: none;}
hr {height: 1px;margin: -0.5em 0;padding: 0;border: 0;}
hr.dotted {border-top: 1px dotted #ffffff; margin: 40px 20px 10px 20px;}
td {padding: 10px 0 10px 0;}
img.bottom {vertical-align:text-bottom;}

.arial {font-family: Arial, Helvetica;}
.fleft {float: left;}
.fright {float: right;}
.clear {clear: both;}
.center {margin-left:auto; margin-right:auto;}
.ta-center {text-align: center;}
.ta-left {text-align: left;}
.ta-right {text-align: right;}
.bold {font-weight: bold;}
.indent {margin-left: 40px;}
.indent450 {margin: 10px 0px 10px 450px;}
.indent400 {margin: 10px 0px 10px 400px;}
.indent350 {margin: 10px 0px 10px 350px;}
.width49 {width: 49%;}
.width100 {width: 100%;}

.noContentRight {padding-top: 200px;}
.contentRight {padding-top: 140px;}

.required {color: #66218c; margin: 0 5px; font-weight: bold;}
.bouton {background-color: #66218c; border: 1px solid #FFFFFF;cursor: pointer; font-weight: bold;
    padding: 5px 10px; color: #FFFFFF; text-align: center;font-family:courier; font-size: 14px;}
.commander {width: 400px;}
.errorMessage {padding-bottom: 10px; text-align: left; margin-left: 190px;clear:both;}
.illustration {position: absolute; left: 40px; top: 40px;}
.legend {clear:both; font-size: 11px; text-align:right;}
.sousTitre {font-size: 14px; margin: 0px 0px 20px 0px;}
.smallText {font-size: 12px;}
.chapo {font-size: 16px; font-weight: bold;}
.textBody {width: 400px; text-align: justify;margin-left: 300px;}
.textBody600 {width: 600px; text-align: justify;margin-left: 300px;}
.response {width: 500px; text-align: justify;margin-left: 300px; font-size: 14px; margin-bottom: 20px;}


/* Container global */
#conteneur {position: relative;width: 995px;margin: 0 auto;}
#header {background-image: url(../images/header.gif);width: 995px; height: 341px;}
#center {overflow: auto; padding-bottom: 60px;position: relative;color: #ffffff;}
#ab {position:absolute;top:100px;left:550px;}

/* Login */
#loginDiv {position: absolute; top: 15px; right: 0px; width: 400px;font-size: 10px;}
#loginDiv label, #loginDiv input {float: right; margin: 0px 5px 5px 5px;}
#loginDiv input {width: 80px;}
p.bonjour {margin-left: 150px; margin-bottom: 5px; font-size: 12px;}
p.linkLogin {margin-left: 150px;}
p.linkLogin a:visited, p.linkLogin a:link, p.linkLogin a:hover {text-decoration: underline;color: #cccc33;font-size: 10px;}
#go {position:absolute; cursor: pointer; text-align: center; color: #ee8ca7;top:53px;right:12px;font-size: 16px;}
a:hover div#go {color: #ffffff;}

/* Pied de page */
#footerContact {position: absolute;  bottom: 20px; right: 40px;}
#footerContact a:visited, #footerContact a:link, #footerContact a:hover {text-decoration: none;color: #ffffff; font-size: 12px; font-weight: bold;}
ul.footerBar li {background:url(../images/oignon.png) no-repeat 0 0; height: 20px;padding-left: 30px;padding-top: 4px;}

#footer {position: absolute;  bottom: 10px; font-size: 11px; left: 280px;}
#footer a:visited, #footer a:link, #footer a:hover {text-decoration: none;color: #ffffff; font-size: 11px}

/* Menu */
#cQuoiMenu, #cCombienMenu, #cOuMenu, #cMoiMenu, #cUtileMenu {position:absolute;height: 60px;cursor: pointer;
										padding-top: 20px; text-align: center;line-height: 16px;color: #ffffff;}
#cQuoiMenu {top:216px;left:90px;width: 110px; height: 90px;padding-top: 0px;}
a:hover div#cQuoiMenu {color: #6a2194;}
#cCombienMenu {top:254px;left:261px;width: 190px;}
a:hover div#cCombienMenu {color: #000000;}
#cOuMenu {top:228px;left:550px;width: 100px;}
a:hover div#cOuMenu {color: #d4e24f;}
#cUtileMenu {top:242px;left:692px;width: 150px;}
a:hover div#cUtileMenu {color: #b4ff57;}
#cMoiMenu {top:182px;left:856px;width: 100px;}
a:hover div#cMoiMenu {color: #000000;}


#cQuoiBody, #cMoiBody, #cUtileBody, #cOuBody {padding-top: 30px;background-repeat: no-repeat; width: 100%; height: 100%;}
#cOuGauche, #cOuDroit, #cMoiGauche, #cMoiDroit, #cCombienGauche, #cCombienDroit {background-repeat: no-repeat;height: 100%;}
#cOuGauche, #cMoiGauche, #cCombienGauche {float: left; padding-top: 35px; width: 736px;}
#cOuDroit, #cMoiDroit, #cCombienDroit {float: right; width: 259px;}

#cQuoiBody {background-image: url(../images/headerCQuoi.gif);}
#cOuBody {background-image: url(../images/headerCOu.gif);}
#cMoiBody {background-image: url(../images/headerCMoi.gif);}
#cUtileBody {background-image: url(../images/headerCUtile.gif);}


#cOuGauche {background-image: url(../images/headerGaucheOu.gif); background-color: #6a2194;}
#cOuDroit {background-image: url(../images/headerDroitOu.gif); background-color: #6a2194;}

#cMoiGauche {background-image: url(../images/headerGaucheMoi.gif); background-color: #df9f3b;}
#cMoiDroit {background-image: url(../images/headerDroitMoi.gif); background-color: #df9f3b;}

/* C Quoi*/
.footerQuoi {width: 100%; text-align: center; font-size: 16px;color: #6a2194;}
#quoiText p {line-height: 18px;}
#quoiText span {font-size: 14px; font-weight: bold;}

/* C Combien ? */
#cCombienGauche {background-image: url(../images/headerGaucheCombien.gif); background-color: #749e40;}
#cCombienDroit {background-image: url(../images/headerDroitCombien.gif); background-color: #749e40;}
table#abonnement {margin:20px 0px 20px 80px;}
ul.puce {margin: 10px 0 10px 40px;}
ul.puce li {list-style-type: disc; font-size: 16px;}
table#abonnement th {text-align: center;border: 1px dotted #FFFFFF; background-color:#6a2194;font-size: 14px;height: 60px;}
table#abonnement td {text-align: center;border-right: 1px dotted #FFFFFF; border-bottom: 1px dotted #FFFFFF;width: 200px;}
table#abonnement td.legend {text-align: right;border: 0px; color: #000000;padding-right: 3px;}
p.infoCarto {text-align: center; margin: 10px 0 20px 0;font-weight: bold;font-size: 16px;color: red;}
#map {width:650px; height:500px;}
a.dateLivraison:visited, a.dateLivraison:link, a.dateLivraison:hover {text-decoration: none; color:#66218c; font-size:11px;}
li.jour {list-style-type: disc; color: #000000; font-size: 12px;}
div.jours {text-align: left;margin-left: 40px;}
#commande p.legend {clear:both; font-size: 11px;width: 620px; text-align:right;color: #000000;}
.prixUnite {color: #000000; font-size: 10px;}

.recapSelection {color: #6a2194; font-size: 13px; font-weight: bold;}
th.souligne {border-bottom: 1px double #ffffff; font-size: 14px;}
td.souligne {border-bottom: 1px dotted #ffffff;}
td.surligne {border-top: 1px solid #ffffff;}

#paiement input, #paiement label {float:left;} 
#paiement input {text-align: right; width: 60px;}
#paiement label {text-align: left; width: 120px;}

#recette, #telCommande {position: absolute; top: 30px; right: 70px;width: 150px; height:150px;}
#recette {background-image: url(../images/ideesRecettes.png);}
a:hover div#recette {background-image: url(../images/ideesRecettesOn.png);}
#telCommande {background-image: url(../images/telCommande.png);}
a:hover div#telCommande {background-image: url(../images/telCommandeOn.png);}

/* C Ou ?*/
div.pointRelais {clear:both; margin: 20px 50px 10px 50px;}
.period	{font-weight: bold;font-size:16px;}
.data1	{width: 150px;font-weight: bold;border-left: 1px dotted #FFFFFF;border-right: 1px dotted #FFFFFF;}
.data2	{width: 400px;border-right: 1px dotted #FFFFFF;}
#relais	{font-size: 12px;vertical-align:middle;text-align:left; margin-left: 250px;}
#relais	td	{padding: 5px;border-bottom: 1px dotted #FFFFFF;vertical-align:top;}
div.ville {width: 95%; text-align:right; font-size: 18px; font-weight: bold;float: left;}
.top {background-image: url(../images/topOff.png); width: 16px; height:16px;margin: 2px 0px 0px 5px;}
a:hover div.top {background-image: url(../images/topOn.png);}

/* C Utile*/
a.linkUtile:visited {color: #ffffff;font-size: 14px;}
a.linkUtile:link, a.linkUtile:hover {color: #cccc33;font-size: 14px;}
#calendar, #recettes {font-size: 12px;vertical-align:top;text-align:center;color:#FFFFFF; width: 950px;margin-left: 20px;}
#calendar th, #recettes th {border: 1px dotted #FFFFFF; background-color:#6a2194;}
#calendar td {width:20%;border-bottom: 1px dotted #FFFFFF;border-right: 1px dotted #FFFFFF;padding: 10px;vertical-align:top;}
.calendar1 {background-color:#CCCC33;border-left: 1px dotted #FFFFFF;color:#000000;font-size:18px;font-weight:bold;}
.calendar2 {background-image:url(../images/fdCalendar.png);background-repeat:repeat-y;color:#000000;}
#calendar li {text-align:left;line-height:18px;font-size:12px;list-style-type:disc;margin-left: 40px;}
.calendrier {width: 950px;margin-left: 20px;}
h3.utile {font-size: 18px; padding-bottom: 30px; margin-left: 20px;}
div#menuUtile {width: 450px; text-align: justify;margin:0 0 65px 300px;}

#recetteTable {font-size: 12px;vertical-align:top;text-align:center;color:#FFFFFF; width: 950px;margin-left: 20px;}
#recetteTable th {background-color:#6a2194;}
#recetteTable td {border-bottom: 1px dotted #FFFFFF;border-right: 1px dotted #FFFFFF;padding: 10px;vertical-align:top;}
th.titreRecette {height: 30px;text-align: left; padding-left: 10px; font-size:18px; border-left: 1px dotted #FFFFFF; border-top: 1px dotted #FFFFFF;}
th.tempsRecette {height: 30px;text-align: right; padding-right: 10px; font-size:12px; border-right: 1px dotted #FFFFFF; border-top: 1px dotted #FFFFFF;}
.recette1 {width: 250px;background-color:#CCCC33;border-left: 1px dotted #FFFFFF;color:#000000;}
.recette2 {width: 500px;background-color:#CCCC33;background-image:url(../images/fdCalendar.png);background-repeat:repeat-y;color:#000000;text-align: left;vertical-align:top;}
#recetteTable li {text-align:left;line-height:18px;font-size:12px;list-style-type:disc;margin-left: 20px;}
.recette2 p {margin-bottom: 5px;}
h5 {font-size:18px;font-weight:bold;margin-bottom: 10px;}

.contenu2 {width: 250px;background-color:#CCCC33;background-image:url(../images/fdCalendar.png);background-repeat:repeat-y;color:#000000;text-align: center;}

ul.puceRecette li {list-style-type: disc; margin-left: 17px;}
ul.puceRecette li a:visited, ul.puceRecette li a:link {text-decoration: none; color: #000000;}
ul.puceRecette li a:hover {text-decoration: underline; color: #ffffff;}

/* C Moi*/
a.linkMoi:visited {color: #000000;font-size: 13px;}
a.linkMoiSelected:visited {color: #6a2194;font-size: 13px;}
a.linkMoi:link, a.linkMoi:hover, a.linkMoiSelected:link, a.linkMoiSelected:hover {color: #6a2194;font-size: 13px;}
.menuMoi {width: 450px; text-align: justify;margin:0 0 65px 300px;}
#cMoiGauche, #cMoiBody {color: #000000;}
#formIdentification label {float: left;width: 40%;margin: 0 10px 5px 0;font-size: 12px;}
.numContact {position: absolute; left: 40px; top: 290px; width: 217px; text-align: center; font-size: 14px; font-weight: bold;}
#passwordDiv {padding: 10px; height: 140px;}
.commandeHeader {background-color:#6a2194; height: 30px; color: #ffffff;border: 1px dotted #ffffff; text-align: center;}
.commandeTd {border: 1px dotted #ffffff;}
#noCommande {margin-bottom: 150px;}
#commande {margin-bottom: 110px;}

/* Couleur */
.cOuColor {color: #6a2194;}
.cOuBg {background-color: #6a2194;}

.cQuoiColor {color: #cccc33;}
.cQuoiBg {background-color: #cccc33;}

.cUtileColor {color: #1b7247;}
.cUtileBg {background-color: #00743b;}

.cMoiColor {color: #df9f3b;}
.cMoiBg {background-color: #df9f3b;}

.cCombienColor {color: #749e40;}
.cCombienBg {background-color: #749e40;}

.white {color: #ffffff;}
.noir {color: #000000;}
.gris {color: #333333;}

/* Devis */
#promo {margin: 100px 30px 0 0; }

#devis {margin-top: 60px; font-family:courier;}
.devisCorps {background-image:url(../images/devisFond.png);background-repeat:repeat-y;color: #000000;}
.devisCorps p, .devisCorps h3  {margin-right: 30px;}
.devisCorps h3 {text-align: center;margin-bottom: 10px;}
.devisHaut {background-image:url(../images/devisHaut.png); width:240px; height:25px}
.devisBas {background-image:url(../images/devisBas.png); width:240px; height:25px;}
td.libelle {padding-left: 10px;padding-bottom: 0px;text-align: left;} 
td.nb {text-align: center;padding-bottom: 0px;} 
td.prix {padding-right: 10px; padding-bottom: 0px; text-align: right;}

#livraison {margin-top: 30px; font-family:courier; text-align: center;}
.livraison {width: 200px;margin: 10px 0 0 5px;}

/* Contact */
#formContact {margin: 30px 0 100px 300px;}
#formContact p {height: 30px;}
#formContact p label {float: left;width: 20%;margin: 0 10px 5px 0;font-size: 13px;}
.width600 {width: 600px;}
.smallInput, .mediumInput, .bigInput, .textInput {border: none;font-family:courier;color:#333333;padding-bottom: 0px;}
.smallInput {width: 200px;height: 22px;}
.mediumInput {width: 250px;height: 22px;}
.bigInput {width: 450px;}

/* Inscription */
#formInscription {margin-left: 300px;}
#formInscription p {height: 30px;}
#formInscription p.errorMessage {height: 15px; color: #ffffff;}
#formInscription p label {float: left;width: 40%;margin: 0 10px 5px 0;font-size: 13px;}
#monCompte {margin-bottom: 20px;}
#formInscription p.legend {clear:both; font-size: 11px;width: 100%; text-align:right;}
.width440 {width: 440px;}

/* Html */
.popup { text-align: justify; padding: 10px;}

#cgv h4 {margin-top: 30px;}
#cgv p {margin-top: 5px;color: #333333;}

