CSS - http://www.dinec.be

/* ---------------------- balises primaires ---------------------- */
body {
	font-size:70%;
	font-family:Verdana, Geneva, Arial, Helvetica, sans-serif, Swiss, SunSans-Regular;
	margin:0;
	text-align:center;
}
#bodyDeco {
	background-image:url(../img/conteneur_bckgrnd.gif);
	background-repeat:repeat-x;
}
strong {
	font-weight:bold;
}
em {
	font-style:italic;
}
p, li, input {
	font-size:90%;
}
h1{
	color:#ef891c;
	font-size:100%;
	text-transform:uppercase;
	font-weight:bold;
}
h2 {
	/*color:#789ba4;*/
	color:#3399CC;
	font-style:italic;
	font-weight:bold;
	font-size:90%;
}
img.imgLeft {
	clear:both;
	text-align:left;
	display:block;
    margin-bottom:10px;
}
img.imgCenter {
	clear:both;
    text-align: center;
    display : block;
    margin-bottom: 10px;
}
img.imgRight {
	clear:both;
    text-align: right;
    display : block;
    margin-bottom: 10px;
}
img.imgAlignLeft {
	float:left;
    margin : 0 5px 5px 0
}
img.imgAlignRight {
	float:right;
    margin : 0 0 5px 5px
}
.invisible{
	display:none;
}
img {
	border:0;
}
form {
	margin:3px;
	padding:0;
}
table.border {
	border:1px solid #3399cc;
}

/* ---------------------- blocs principaux ---------------------- */
table#generale {
	width:100%;
	text-align:left;
	padding:0px;
}
#conteneur {
	margin:0px;
	padding:0px;
	width:100%;
	color:#666666;
}
#liensRapides {
	display:none;
}
#entete {
	margin:0px;
	padding:0px;
	height:70px;
	background-image:url(../img/entete_backgrnd.gif);
	background-repeat:no-repeat;
	background-position:left;
	background-color:#3399cc;
	width:99%;
}
#menuGeneral {
	padding:0;
	margin:3px 0px 0px 0px;
	float:right;
	width:500px;
}
#piedDePage{
	margin:0px;
}

/* ---------------------- second niveau ---------------------- */
/* ----------- contenu et style du bloc #entete ----------- */
#logo {
	margin:4px 0px 0px 8px;
	padding:0;
	float:left;
}
#menuGeneralContentStart {
	text-align:center;
	font-style:normal;
	float:left;
	margin:0px 20px 0px 0px;
	width:80px;
}
#menuGeneralContent {
	text-align:center;
	float:left;
	margin:0px 20px 0px 0px;
	width:80px;
}
#menuGeneralContentEnd {
	text-align:center;
	float:left;
	margin:0px 20px 0 0;
	width:80px;
}
#menuGeneralContent h2, #menuGeneralContentStart h2, #menuGeneralContentEnd h2 {
	font-size:70%;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	margin:0px;
}

/* ----------- contenu et style du bloc #contenu ----------- */
table#contenu {
	margin:0px;
	padding:0px;
	background-color:#FFFFFF;
	width:100%;
}
#zoneB {
	width:0%;
	display:none;
}
#ligneStructure{
	display:none;
}
#imageDeco {
	display:none;
}
#zoneA {
	margin:0px;
	padding:0px;
	width:100%;
	background-color:#FFFFFF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
#zoneAContent {
	clear:left;
	float:left;
	margin:0px;
	padding:0px 0px 15px 18px;
	width:97%;
}
#zoneA ul{
	padding:0px;
	margin:0px 0px 0px 5px;
	font-size:90%;
	list-style-image:url(../img/li_deco.gif);
}
#zoneA ol {
	padding:0px;
	margin:0px 0px 0px 5px;
	font-size:90%;
	list-style-image:none;
	list-style-type:decimal !important;
}
#zoneA li{
	color:#666666;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 20px;
}
#zoneA h1 {
	color:#ef891c;
	font-size:100%;
	text-transform:uppercase;
	margin:0px;
	padding:0px 5px 10px 0px;
}
#zoneA h2 {
	clear:both;
	color:#3399cc;
	font-style:italic;
	font-weight:bold;
	font-size:90%;
	margin:0;
	padding:0;
}
#zoneA h3 {
	clear:both;
	color:#ef891c;
	font-style:italic;
	font-weight:bold;
	font-size:80%;
	margin:2px 0 2px 10px;
	padding:0;
}
#zoneA h4 {
	clear:both;
	color:#666666;
	font-weight:bold;
	border-bottom:1px solid dcedf6;
	border-top:1px solid dcedf6;
	font-size:80%;
	margin:0;
	padding:2px 0 2px 0;
}
#zoneA p {
	color:#666666;
	font-size:75%;
	margin:0px;
	padding:5px 5px 5px 0px;
}
#zoneA a, a:visited {
	color:#28779f;
	text-decoration:underline;
}
#zoneA a:hover {
	color:#3399cc;
	text-decoration:underline;
}
#contenuBottom {
	margin:0px;
	padding:0px;
	background-image:url(../img/zoneA_backdBottom.gif);
	background-repeat:repeat-x;
	background-position:right;
	height:2px;
}

/*Contenu********************************************************/
#intro {
	font-weight:bold;
	color:#666666;
	font-size:70%;
}
#interne {
	margin:15px 5% 0 5%;
	padding:0px 0px 5px 0px;
	font-size:80%;
	width:400px;
	border:1px solid #efd2b4;
}
#interne h3{
	margin:0px;
	border-bottom:1px solid #FFFFFF;
	padding:3px 3px 3px 20px;
	font-size:90%;
	color:#ef891c;
	height:14px;
	background-image:url(../img/picto_blocInterne.gif);
	background-repeat:no-repeat;
	background-position:left;
}
#interne ul li{
	margin-top:5px;
	color:#666666;
}
#interne ul li a:link, #interne ul li a:visited, #interne ul li a:active{
	color:#666666;
	text-decoration:none;
	font-weight:normal;
}
#interne ul li a:hover{
	color:#ef891c;
	text-decoration:underline;
}
#externe{
	margin:15px 5% 0 5%;
	padding:0px 0px 5px 0px;
	font-size:80%;
	width:400px;
	border:1px solid #d1dde0;
}
#externe h3{
	margin:0px;
	border-bottom:1px solid #FFFFFF;
	padding:3px 3px 3px 20px;
	font-size:90%;
	color:#789ba4;
	height:14px;
	background-image:url(../img/picto_blocExterne.gif);
	background-repeat:no-repeat;
	background-position:left;
}
#externe ul li{
	margin-top:5px;
	color:#666666;
}
#externe ul li a{
	color:#666666;
	text-decoration:none;
	font-weight:normal;
}
#externe ul li a:hover{
	color:#ef891c;
	text-decoration:underline;
}
#doc {
	margin:15px 5% 0 5%;
	padding:0px 0px 5px 0px;
	font-size:80%;
	width:400px;
	border:1px solid #dedede;
}
#doc h3{
	margin:0px;
	border-bottom:1px solid #FFFFFF;
	padding:3px 3px 3px 20px;
	font-size:90%;
	color:#989898;
	height:14px;
	background-image:url(../img/picto_blocDoc.gif);
	background-repeat:no-repeat;
	background-position:left;
}
#doc ul li{
	margin-top:5px;
	color:#666666;
}
#doc ul li a{
	color:#666666;
	text-decoration:none;
	font-weight:normal;
}
#doc ul li a:hover{
	color:#ef891c;
	text-decoration:underline;
}
#menuFlottant {
	float:right;
	width:30%;
	border:1px dashed #efd1b0;
	margin:5px 5px 2px 2px;
	clear:none;
}
#menuFlottant h3{
	background-color:#ef891c;
	color:#FFFFFF;
	padding:3px;
	border-bottom:1px dashed #FFFFFF;
	font-size:70%;
	margin:0px;
}
#menuFlottant li{
	font-size:70%;
	margin-top:5px;
	color:#666666;
	padding:0px 2px 5px 0px;
}
#menuFlottant li a:link, #menuFlottant li a:visited, #menuFlottant li a:active{
	color:#666666;
	text-decoration:none;
	font-weight:normal;
}
#menuFlottant li a:hover{
	color:#ef891c;
	text-decoration:underline;
}

/* ---------- formulaire de la newsletter ---------- */
#formulaireNewsletter {
	float:left;
	background-color:#ebf0f1;
	border:1px dashed #5C87A7;
	width:380px;
	margin:25px 0px 20px 20px;
}
table#formulaireNewsletterTable {
	float:left;
	margin:0px;
}
#formulaireNewsletter p {
	text-align:right;
}
#formulaireNewsletter h3{
	background-color:#789ba4;
	color:#FFFFFF;
	padding:4px;
	font-size:70%;
	margin:0px;
}
.boutonNewsletter {
	background-color:#789ba4;
	font-size:90%;
	color:#FFFFFF;
	font-weight:bold;
	border-bottom:1px solid #2a5e7f;
	cursor:pointer;
	text-align:center;
}
.champ_newsletter {
	text-align:left;
	color:#666666;
}

/* ---------- plan du site ----------- */
#planSite {
	margin-left:20px;
	padding:5px;
}
#planSite h2  {
	color:#666666;
	padding:5px 3px 3px 10px;
	margin:0;
}
#blocTitre1  {
	float:left;
	margin-top:10px;
	margin-bottom:5px;
	height:26px;
	width:6px;
}
#blocTitre2  {
	float:left;
	margin-top:10px;
	margin-bottom:5px;
	border-top:1px solid #789ba4;
	border-bottom:1px solid #789ba4;
	height:26px;
	padding:1px 0 0 0;
}
#blocTitre3  {
	float:left;
	margin-top:10px;
	margin-bottom:5px;
	height:26px;
	width:8px;
}
#clear {
	clear:both;
}
#planSite h2 a:link, a:visited{
	color:#666666;
	text-decoration:none;
}
#planSite h2 a:hover{
	color:#789ba4;
	text-decoration:none;
}
ul.planSite{
	padding:0px;
	margin:0px;
}
li.planSiteLi{
	color:#789ba4;
	list-style-image:url(../img/li_deco.gif);
	margin:0px 0px 5px 30px;
	padding:0px;
}
a.lienPlanSite, a.lienPlanSite:visited{
	font-size:90% !important;
	color:#789ba4 !important;
	text-decoration:none !important;
}
a.lienPlanSite:hover{
	color:#789ba4 !important;
	text-decoration:underline !important;
}

/* ---------- Login/Extranet ----------- */
#login{
	border:1px dashed #d9eaf4;
	background-color:#f9fcfd;
	padding:5px;
	margin:20px 0px 20px 30px;
	width:40%;
}
#loginBloc{
	background-color:#4396ca;
	color:#FFF;
	font-size:80%;
	font-weight:bold;
	padding:0 1px 0 1px;
	border:1px solid #789ba4;
	margin:4px 4px 5px 0px;
}
.connecter {
	background-color:#FFF;
	font-size:90%;
	color:#4396ca;
	border:1px solid #4396ca;
	cursor:pointer;
	text-align:center;
}
.champ_connecter {
	width:80%;
	color:#666666;
}
a.lienMotdepasse, a.lienMotdepasse:visited {
	color:#306c92;
	font-size:80%;
	text-decoration:underline;
	background-image:url(../img/picto_lienMotpasse.gif);
	background-position:left;
	background-repeat:no-repeat;
	padding:0 0 0 20px;
}
a.lienMotdepasse:hover {
	color:#4396ca;
	font-style:italic;
}

/* ---------- Contact ----------- */
#form_1 {
	margin:0px;
	padding:0px;
}
#form_1 p {
	color:#666666;
	font-size:70%;
	text-align:right;
}
.champs_contact {
	color:#666666;
}
.boutton_contact {
	float:left;
	margin:5px 0px 10px 200px;
	background-color:#789ba4;
	font-size:90%;
	color:#FFFFFF;
	font-weight:bold;
	border-bottom:1px solid #2a5e7f;
	cursor:pointer;
	text-align:center;
}
.champsOblig {
	color:#ef891c;
	font-size:70%;
}

/* ---------- news ----------- */
a.btRetourNews, a.btRetourNews:visited {
	color:#FFFFFF !important;
	text-decoration:none !important;
	background-color:#3399CC;
	padding:5px;
}
a.btRetourNews:hover {
	color:#FFFFFF;
	text-decoration:underline;
	background-color:#EF891C;
}
#newsContent {
	clear:left;
	float:left;
	margin:0px 0px 20px 0px;
	padding:0px 2px 10px 2px;
	width:450px;
}
#newsContent p {
	color:#666666;
	font-size:75%;
}
#newsContent h2 {
	background-color:#ebf0f1;
	padding:5px;
	margin:2px 0px 0px 0px;
}

/* ----------- contenu et style du bloc #piedDePage ----------- */
#piedBloc1 {
	float:left;
	/*width:700px;*/
	width:97%;
	margin:0px;
}
#piedDePage p{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:70%;
	margin:0px;
	padding:5px 0px 0px 0px;
	color:#28779f;
	text-align:center;
}
#piedBloc2 {
	float:right;
	text-align:right;
	margin:0px;
	padding:14px 0px 0px 0px;
}
.logoAtoms {
	margin:0 0 0 10px;
	padding:2px 0 0 0;
}

/********************************** Liens *********************************************/
a.liensFixes:link, a.liensFixes:visited {
	color:#FFFFFF;
	text-decoration:none;
}
a.liensFixes:hover {
	text-decoration:underline;
}
a.liensFixes:active {
	color:#789ba4;
	text-decoration:underline;
}
a.menuGeneralLiens:link, a.menuGeneralLiens:visited {
	font-style:normal !important;
	color:#FFFFFF;
	text-decoration:none;
}
a.menuGeneralLiens:hover {
	text-decoration:underline;
}
a.ligneStructureLiens:link, a.ligneStructureLiens:visited {
	color:#3399cc;
	text-decoration:underline;
}
a.ligneStructureLiens:hover {
	color:#ef891c;
	text-decoration:underline;
}
a.piedDePageLiens:link, a.piedDePageLiens:visited {
	color:#28779f;
	text-decoration:underline;
}
a.piedDePageLiens:hover {
	color:#ef891c;
	text-decoration:underline;
}
a.blocNewsLiens:link, a.blocNewsLiens:active, a.blocNewsLiens:visited {
	color:#3399cc;
	font-size:85%;
	margin-left:75px;
	font-style:italic;
	text-decoration:none;
}
a.blocNewsLiens:hover {
	color:#ef891c;
	text-decoration:underline;
}
a.blocRubriquesLiens:link {
	color:#3399cc;
	text-decoration:none;
}
a.blocRubriquesLiens:active {
	color:#297aa3;
	text-decoration:underline;
}
a.blocRubriquesLiens:visited {
	color:#3399cc;
	text-decoration:none;
}
a.blocRubriquesLiens:hover {
	color:#297aa3;
	text-decoration:underline;
}
a.rechercheLiens:link, a.rechercheLiens:visited {
	color:#789ba4;
	font-size:90%;
	text-decoration:underline;
	padding-left:5px;
	padding-right:5px;
}
a.rechercheLiens:hover {
	color:#ef891c;
}

/*  ------------------- classes html ------------------------------- */
table.border {
	border:1px solid #99A9BC !important;
}
td.border {
	border:1px solid #99A9BC !important;
}
tr.border {
	border:1px solid #99A9BC !important;
}
dl{
}
dt {
	font-weight:bold;
	font-style:italic;
}
dd{
	border-left:1px solid #CCCCCC;
	margin:3px 0 5px 20px;
	padding-left:5px;
}
hr {
	height:1px;
	color:#E0ECF1;
	margin-top:10px;
	margin-bottom:0px;
}
hr.newsletter {
height:10px;
color:#E0ECF1;
margin-top:20px;
margin-bottom:10px;
}

/****************** Ajouts ***********************/
table#listeGamme {

}
table#listeGamme td {
	border-bottom:1px solid #d5e0e2;
	border-right:1px solid #d5e0e2;
	margin:0;
	padding:2px;
}
table#listeGamme h2 {
	color:#789ba4;
	font-weight:bold;
	font-style:normal;
	font-size:80%;
	text-align:center;
	margin:0;
	padding:0;
}
table#listeGamme p {
	margin:0;
	padding:0 0 0 20px;
}
table#listeGamme a, a:visited {
	color:#666666;
	text-decoration:underline;
}
table#listeGamme a:hover {
	text-decoration:none;
}
.tdNomsGammes {
	text-align:left;
	vertical-align:top;
}
/*Liste Produits*/
table#listeproduits {
	border-top:1px solid #d5e0e2;
	border-left:1px solid #d5e0e2;
	width:510px;
	margin:0;
	padding:5px;
}
table#listeproduits a, a:visited {
	color:#666666;
	text-decoration:underline;
}
table#listeproduits a:hover {
	text-decoration:none;
}
table#listeproduits h2 {
	color:#789ba4;
	font-weight:bold;
	font-style:normal;
	font-size:80%;
	text-align:center;
	margin:0;
	padding:0;
}
table#listeproduits td {
	border-bottom:1px solid #d5e0e2;
	border-right:1px solid #d5e0e2;
	margin:0;
	padding:2px;
}
.tdCouleurGamme {
	background-color:#003366; /*A DEFINIR DANS HTML et donc à supprimer d'ici*/
	width:3px !important;
	margin:0;
	padding:0;
}
.tdImgVignette {
	width:50px;
	height:50px;
	margin:0;
	padding:2px;
}
.tdNoms {
	width:150px;
	text-align:center;
	vertical-align:top;
}
.tdDes {
	text-align:left;
	vertical-align:top;
}
/*FICHE détail*/
#Detailproduits {
}
#Detailproduits h3 {
	color:#789ba4;
	font-weight:bold;
	font-style:normal;
	font-size:80%;
	margin:5px 0 0 0;
	padding:0;
}
#Detailproduits p {
	margin:4px 0 25px 0;
	padding:0;
}
span.texte_rouge
	{
color:#FF0000;
}
.articleSummary
{
	background-color:#ebf0f1;
	padding:5px;
	margin:2px 0px 0px 0px;
	color:#666666;
	font-size:13px;
}
#zoneA table {
}
#zoneA table p {
	>font-size:100%;
}
li ul li.arborescence {
	font-size:100%;
	list-style-image:none;
	list-style-type:none;
}