/* Structure de la page */
body {
  margin: 10px 0;
  padding: 0;
  font-family: Verdana, Arial, Helvetica, Sans-Serif;
  color: #000000;
  background: #EBEBEB url("images/fond.png") fixed;
  background-color: #FFFFFF;
  text-align: center;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

a#contenu:link, a#contenu:visited  {
  color: #5151FF;
  text-decoration: none;
  font-weight: bold;
}

a#contenu:hover, a#contenu:active {
  color: #777777;
  text-decoration: none;
}

em {
  text-decoration: underline;
  font-weight: bold;
}

ul {
  padding-left: 0;
  margin-left: 15px;
}

abbr {
  border-bottom: 1px dotted;
  cursor: help;
  font-style: normal;
}

dt {
  font-weight: bold;
}

img {
  border: 0;
}

/* Styles pour les décorations de texte */
.souligne {
  text-decoration: underline;
}

.gras {
  font-weight: bold;
}

.italique {
  font-style: italic;
}

.texte {
  height: 22px;
  background: url("images/fond_input.png") repeat-x;
  border: 1px solid #5FBEF9;
  color: #0F7FD0;
  font-family: Verdana, Arial, Helvetica, Sans-Serif;
}

.texte:focus {
  background: url("images/fond_input_focus.png") repeat-x;
}

.bouton {
  height: 25px;
  border: 0;
  background: url("images/bouton_milieu.png") repeat-x;
  color: #25AAF7;
  font-weight: bold;
  cursor: pointer;
}

.bouton:hover, .bouton:active {
  border: 1px dashed #5151FF;
  color: #777777;
}

/*Calques */
/* Contenu de la page */
#contenu {
  z-index: 2;
  position: relative;
  width: 800px;
  padding: 0;
  margin-left: auto;
  margin-right: auto;
  /* border: 1px solid #000000; */
  border: 1px dotted #FAFAFA;
  text-align: justify;
  background: #FFFFFF url("images/fond_texte.png") repeat-y;
}

/* Textes de fond */

#texte_fond_gauche, #texte_fond_droite {
  z-index: 1;
  position: absolute;
  width: 150px;
  height: auto;
  top: 0;

  font-size: 13px;
  text-align: center;
  font-weight: bold;
  color: #BDF;
  /*color: #FFF;*/
  line-height: 25px;
}

#texte_fond_gauche {
  left: -150px;
}

#texte_fond_droite {
  right: -150px;
}

/* Entête du site */
#entete h1 {
  left: 200px;
  width: 800px;
  height: 150px;
  margin-top: 0px;
  margin-bottom: 25px;
  background: transparent url("images/banniere3.jpg") no-repeat;
  padding: 20px;
  font-size: 30pt;
  color: #00FFEF;
}

#entete h1 span {
  display: none;
}

/* Adresse de Mesotech */
#adresse {
  position: absolute;
  margin-left: 600px;
  width: 200px;
  font-size: 12px;
  color: #B9B9B9;
  line-height: 20px;
  padding: 0 5px 5px 5px;
  text-align: center;
  bottom: 25px;
  z-index: 2;
}

#adresse b {
  color: #A8A8A8;
}

/* Bandeau pour les nouveautés  */
#nouveautes {
  margin-left: 20px;
  margin-bottom: 20px;
  color: #5151FF;
  font-weight: bold;
  font-size: 14px;
  border: dashed 1px #007ACC;
  background-color: #EAF4FF;
  width: 500px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 5px;
}

#nouveautes span {
  color: #FF8040;
}

#nouveautes a {
  color: #5151FF;
  text-decoration: none;
}

/* Contenus de la page */
#presentation, #liste_contacts, #demo, #install {
  margin-top: -60px;
}

#presentation, .produits, #telechargement, #contact, #documentation, #liste_contacts, #demo, #install {
  padding: 10px;
  width: 580px;
  font-size: 13px;
  /*color: #0F7FD0;*/
  color: #007ACC;
}

/* Titres */
#presentation h2 {
  margin-top: 10px;
  margin-bottom: 20px;
  text-align: left;
  font-weight: bold;
  color: #FF8040;
  width: 570px;
  font-size: 24px;
}

.produits h2, #telechargement h2, #contact h2, #documentation h2, #liste_contacts h2, #demo h2 , #install h2 {
  margin-top: 10px;
  margin-bottom: 20px;
  text-align: left;
  font-weight: bold;
  color: #FF8040;
  width: 570px;
  font-size: 18px;
}

#presentation hr, .produits hr, #documentation hr {
  border: 0 hidden #FFFFFF;
  clear: both;
  background-color: transparent;
  color: white;
}

/* Style pour les présentations d'applications */
#presentation li a {
  color: #5151FF;
  text-decoration: underline;
}

#presentation li a:hover {
  color: #777777;
}

/* Style pour les pages des applications */

#application {
  margin-top: -60px;
  padding: 10px;
  width: 580px;
  font-size: 11px;
  /*color: #0F7FD0;*/
  color: #007ACC;
  text-align: left;
}

#application h2 {
  padding-left: 140px;
  height: 50px;
  padding-top: 8px;
  background: url("images/logo_application.gif") left no-repeat;
  margin-top: 10px;
  margin-bottom: 20px;
  text-align: left;
  font-weight: bold;
  color: #000000;
  width: 570px;
  font-size: 28px;
}

#application h3, #presentation h3 {
  font-weight: normal;
  font-size: 20px;
}

#application h4 {
  text-transform: uppercase;
  font-weight: normal;
  font-size: 12px;
  font-style: italic;
  text-decoration: underline;
}

#application hr, #demo hr, #install hr {
  height: 10px;
  border: 0 hidden transparent;
  border-bottom: 1px solid #FF9900;
  width: 575px;
  clear: both;
  background-color: transparent;
  color: white;
}

#application img {
  margin-left: 5px;
  margin-right: 5px;
}

/* Style pour la page des services */
#services {
  margin-top: -60px;
  padding: 10px;
  width: 580px;
  font-size: 11px;
  color: #007ACC;
  text-align: left;
}

#services h2 {
  color: #FF9900;
  font-size: 28px;
}

#services h3 {
  font-weight: normal;
  font-size: 20px;
}

#services h4 {
  font-weight: bold;
  font-size: 14px;
  color: #FF9900;
}

#services hr {
  height: 10px;
  border: 0 hidden transparent;
  border-bottom: 1px solid #FF9900;
  width: 575px;
  clear: both;
  background-color: transparent;
  color: white;
}

.cadre_orange {
  text-align: left;
  width: 450px;
  margin: auto auto 15px 50px;
  border: 1px solid #FF9900;
  padding: 15px;
}

.boite_lien {
  text-align: center;
  border-top: 1px solid #FF9900;
  border-bottom: 1px solid #FF9900;
  margin: 30px 0;
  padding: 20px 0;
}

.boite_lien a {
  color: #5151FF;
  text-decoration: none;
}

.boite_lien a:hover {
  text-decoration: underline;
  color: #777777;
}

.boite_lien_gauche {
  background: url("images/fleche_boite_lien_gauche.gif") 0% 4px no-repeat;
  padding-left: 43px;
}

.boite_lien_droite {
  background: url("images/fleche_boite_lien_droite.gif") 100% 4px no-repeat;
  padding-right: 43px;
}

.coche {
  list-style-image: url("images/coche.gif");
}

.coche ul {
  list-style-image: none;
  list-style-type: disc;
  margin-left: 15px;
}

.coche_mauve {
  list-style-image: url("images/coche_mauve.gif");
}

.orange {
  list-style-image: url("images/orange.gif");
}

.orange ul {
  list-style-image: url("images/orange2.gif");
  margin-left: 15px;
}

.mauve {
  list-style-image: url("images/mauve.gif");
}

.mauve ul {
  list-style-image: url("images/mauve2.gif");
  margin-left: 15px;
}

.bleu {
  list-style-image: url("images/bleu.gif");
  padding-left: 0;
}

.bleu ul {
  list-style-image: url("images/bleu2.gif");
  margin-left: 15px;
  padding-left: 0;
}

.bleu2 {
  list-style-image: url("images/bleu2.gif");
  padding-left: 0;
}

.bleu2 ul {
  list-style-image: url("images/bleu.gif");
  margin-left: 15px;
  padding-left: 0;
}

.fleche_mauve {
  list-style-image: url("images/fleche_mauve.gif");
}

.fleche_bleu {
  list-style-image: url("images/fleche_bleu.gif");
}

.info_bleu {
  list-style-image: url("images/info_bleu.gif");
}

#infosappli, #infosappli2 {
  float: right;
  margin-top: -65px;
  font-size: 12px;
  font-weight: bold;
  width: 280px;
  text-align: center;
}

#infosappli ul {
  margin-top: 0;
}

/* Tableau de contact */
#contact table, #liste_contacts table, #demo table {
  font-size: 13px;
  color: #0F7FD0;
  width: 90%;
  margin-left: 10px;
  margin-right: auto;
  border: 1px dashed #5FBEF9;
}

.nomchamp_contact {
  width: 25%;
}

.champ_contact {
  width: 75%;
}

.pied_contact {
  font-size: 10px;
}

/* Documentation */
#documentation li {
  list-style-type: none;
  margin-bottom: 5px;
}

/* Barre */
#barre {
  padding-left: 20px;
  padding-top: 2px;
  padding-bottom: 2px;
  width: 780px;
  top: 150px;
  height: 17px;
  font-size: 12px;
  position: absolute;
  /*border-bottom: 1px dashed #25AAF7;*/
  background: url('images/fond_barre.gif') left no-repeat;
  background-color: #FFFFFF;
}

#barre a {
  margin-right: 5px;
  color: #999999;
  font-weight: normal;
  padding-right: 10px;
  background: url('images/barre_barre.gif') right no-repeat;
}

#barre a:hover {
  color: #FF8040;
  background-color: #FFFFEE;
}

/* Note */
#note {
  position: absolute;
  margin-left: 610px;
  top: 350px;
  padding: 10px;
  z-index: 1;
  width: 160px;
  font-size: 10pt;
  color: #FF0000;
  border: solid 1px #FF0;
  /*background: url('images/punaise.png') 98% 2% no-repeat;*/
  background-color: #FCFFCC;
  text-align: left;

  /* Masque les notes au chargement */
  visibility: hidden;
}

#noteapres {
  position: absolute;
  margin-left: 610px;
  top: 350px;
  padding: 10px;
  z-index: 1;
  width: 160px;
  font-size: 10pt;
  color: #336699;
  border: solid 1px #FF0;
  /*background: url('images/punaise.png') 98% 2% no-repeat;*/
  background-color: #FCFFCC;
  text-align: left;
  visibility: hidden;
}

/*Menu */

/* Nouvelle version des menus */
/* Refusé par Hervé :'-(
#menu {
  position: absolute;
  margin-left: 590px;
  top: 160px;
  padding: 10px;
  z-index: 3;
}

#menu a {
  color: black;
  background: url("images/puce_menu.gif") left no-repeat;
  padding-left: 10px;
}

#menu a:hover {
  background-image: url("images/puce_menu_over.gif");
}

#menu ul {
  width: 180px;
  margin: 0 0 0 10px;
  list-style-type: none;
  border: 1px solid #25AAF7;
}

#menu ul li {
  background-color: #CCE6FF;
  font-size: 13px;
  padding-left: 2px;
  padding-right: 0;
}

#menu ul ul {
  width: 173px;
  margin: 0;
  background-color: #E5F3FF;
  margin-top: 3px;
  border: none;
  margin-left: 5px;
}

#menu ul ul li {
  background-image: none;
  background-color: #E5F3FF;
  font-size: 11px;
  margin: 0;
}
*/

/* Ancienne version des menus */

#menu {
  position: absolute;
  margin-left: 590px;
  top: 160px;
  padding: 10px;
  z-index: 1;
}

#menu ul {
  margin: 10px;
  width: 200px;
  padding: 0;
  line-height: 28px;
}

#menu li {
  list-style-type: none;
  display: block;
  font-size: 13px;
  color: #B9B9B9;
  padding-top: 2px;
  padding-bottom: 2px;
  height: 30px;
  margin-bottom: 5px;
}

#menu a {
  color: #25AAF7;
  padding-left: 20px;
  background: url("images/puce.gif") left no-repeat;
  font-weight: bold;
}

#menu a:hover, #menu  a:active {
  color: #777777;
  padding-left: 20px;
  background: url("images/puce_on.gif") left no-repeat;
}

/* Flèches pour le haut de la page */
.haut {
  float: right;
  position: absolute;
  left: 570px;
  margin-top: 5px;
}

.haut img {
  border: 0;
}

/* Liste des applicatifs */
#liste_applicatifs {
  list-style-type: none;
  font-size: 16px;
}

#liste_applicatifs li {
  margin-bottom: 10px;
}

#liste_applicatifs li a {
  background: left center no-repeat;
  padding-left: 35px;
  vertical-align: middle;
  text-decoration: none;
  line-height: 28px;
}

/* Pied de page */
#pied {
  color: #777777;
  font-size: 12px;
  position: absolute;
  margin: 5px -1px;
  padding-left: 5px;
  width: 802px;
  height: 25px;
}

#pied a {
  color: #555555;
}

#pied a:hover {
  color: #777777;
}

#pied img {
  vertical-align: bottom;
  border: none;
}

#pied div {
  position: absolute;
  top: 0;
  width: 200px;
  left: 600px;
  text-align: right;
  font-size: 10px;
}

/* Tableaux */
.tableau {
  position: relative;
  left: 5%;
  right: 5%;
  width: 90%;
}

.titretableau th {
  color: #FFFFFF;
  font-size: 14px;
  background-color: #86CDF9;
  white-space: nowrap;
}

.tableau td {
  padding: 0;
  margin: 2px;
  top: 0;
  font-size: 10px;
  text-align: center;
}

/* Tableau des produits */
.tableauproduit {
  width: 100%;
  overflow: hidden;
}

.tableauproduit a {
  color: #000000;
  font-weight: normal;
}

.tableauproduit a:hover {
  text-decoration: none;
}

.tableauproduit th {
  text-align: left;
  vertical-align: bottom;
  font-size: 14px;
  padding-right: 40px;
  max-width: 33%;
  overflow: hidden;
  background: url('images/fleche.gif') 75% 100% no-repeat;
}

.sansfleche {
  background-image: none;
}

.tableauproduit th a {
  font-weight: bold;
  width: 100%;
  text-decoration: none;
}

.tableauproduit td {
  text-align: left;
  font-size: 10px;
  padding-right: 40px;
  vertical-align: top;
  max-width: 33%;
  overflow: hidden;
}

.tableauproduit td a {
  color: #804000;
  width: 100%;
  text-decoration: none;
}

.tableauproduit td img {
  margin-left: 22px;
  border: 1px solid #0080FF;
  margin-bottom: 10px;
  height: 49px;
  width: 117px;
}

.produitimage1 {
  background: url('images/bordure2.jpg') left 1px no-repeat;
}

.produitimage2 {
  background: url('images/bordure5.jpg') left 1px no-repeat;
}

.produitimage3 {
  background: url('images/bordure4.jpg') left 1px no-repeat;
}

/* Tableau des types d'archives  */
.tableau_zip {
  font-size: 9px;
  width: 300px;
  background-color: #CCE6FF;
}

.tableau_zip th, .tableau_zip td {
  text-align: center;
}

.tableau_zip th {
  background-color: #25AAF7;
}

.tableau_zip td {
  background-color: #84CBF4;
}

/* Tableau pour l'historique */
.tableauhist {
  border-collapse: collapse;
  font-size: 11px;
}

.tableauhist thead th {
  border-bottom: 3px solid #6EA0B0;
  text-align: left;
}

.tableauhist tbody td {
  border-bottom: 1px solid #DAE7EB;
}

.tableauhist td {
  vertical-align: top;
  text-align: left;
}

.tableauhist td ul {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 20px;
  list-style-image: url("images/bleu.gif");
}

/* Tableau pour les clients */
.tableauclient {
  width: 100%;
}

.tableauclient tr {
  border-bottom: dotted 1px #5FBEF9;
  margin-bottom: 20px;
}

.tableauclient td {
  padding-left: 20px;
  padding-bottom: 20px;
  padding-top: 20px;
}

.logo {
  width: 25%;
  text-align: center;
  font-size: 8pt;
}

.logo img {
  border: none;
}

/* Styles des liens spéciaux */
.doc {
  padding-left: 20px;
  height: 16px;
  background: url("images/word.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.xls {
  padding-left: 20px;
  height: 16px;
  background: url("images/excel.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.ppt {
  padding-left: 20px;
  height: 16px;
  background: url("images/powerpoint.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.pdf {
  padding-left: 20px;
  height: 16px;
  background: url("images/pdf.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.txt {
  padding-left: 20px;
  height: 16px;
  background: url("images/txt.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.zip {
  padding-left: 20px;
  height: 16px;
  background: url("images/zip.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.exe {
  padding-left: 20px;
  height: 16px;
  background: url("images/exe.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.wmv {
 	padding-left: 20px;
 	height: 16px;
 	background: url("images/film.png") left no-repeat;
 	font-weight: bold;
 	color: #5151FF;
}

.install {
  padding-left: 68px;
  line-height: 66px;
  padding-top: 32px;
  padding-bottom: 32px;
  background: url("images/install-off.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.install:hover {
  background: url("images/install-on.gif") left no-repeat;
}

.email {
  padding-left: 20px;
  height: 16px;
  background: url("images/email.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.retour {
  padding-left: 20px;
  height: 16px;
  background: url("images/retour.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.externe {
  padding-left: 20px;
  height: 16px;
  background: url("images/globe.gif") left no-repeat;
  font-weight: bold;
  color: #5151FF;
}

.doc:hover, .xls:hover, .ppt:hover, .pdf:hover, .txt:hover, .zip:hover, .exe:hover, .email:hover, .retour:hover, .externe:hover, .install:hover  {
  color: #777;
}

.liste_txt {
  list-style-image: url("images/txt.gif");
}

.liste_txt li {
  margin-bottom: 3px;
  vertical-align: top;
  font-family: Verdana;
}

.image_install {
  float: left;
  border: 0 hidden;
  margin: 5px;
}
.icone {
  margin-top: 10px;
  margin-left: 20px;
}

.icone span {
  position: absolute;
  margin-top: 20px;
  color: #000000;
}

.icone img {
  padding: 5px;
}

/*
  DROITS D'AUTEUR ET COPYRIGHT
  ============================

L'ensemble de ce site relève  de la législation française et  internationale sur
le droit d'auteur  et la propriété  intellectuelle. Tous droits  de reproduction
sont réservés, y compris pour les documents photographiques.

La reproduction de tout  ou partie de ce  site sur un support  électronique quel
qu'il soit est formellement interdite sauf autorisation expresse du directeur de
la publication.

La reproduction des textes de ce site sur un support papier est autorisée,  tout
particulièrement dans le  cadre pédagogique, sous  réserve du respect  des trois
conditions suivantes :
  * Gratuité de la diffusion.
  * Respect de l'intégrité  des documents  reproduits :  pas de  modification ni
    altération d'aucune  sorte.
  * Citation claire et lisible de la source.
    Par exemple :
    "Ce  document  provient   du  site  internet   MESOTECH.eu,  les  droits  de
    reproduction sont réservés et strictement limités.".

L'adresse Internet du site doit impérativement figurer dans la référence.
*******************************************************************************
*******************************************************************************
style.css - Feuille de style en cascade pour l'affichage du site Web de Mesotech
Copyright © 2007 PLAIS Lionel
lionel.plais@ilp-web.net
*/