/*
  Styles CSS

  Le layout est comme suit et nécessite une largeur minimale de fenêtre d'environ
  760 pixels (design imposé de 800 x 600).


  +-----------------------------------------+
  | Bandeau / logo                          |
  +---------------------------------+-------+
  |                                 |       |
  |                                 | right |
  |                                 | panel |
  | Contenu                         |       |
  |                                 +-------+
  |                                 |
  |                                 |
  |                                 |
  |                                 |
  +---------------------------------+

*/



/* quick hack du menu qui disparait !! */
.top {

  display: none ;

}


/* Pitié pour les images ! On dégage ce cadre infâme des liens incluant des IMG. */
a img, a:link img, a:visited img, a:hover img, a:active img {

  border: none ;
  text-decoration: none ;

}


a, a:visited, a:active {

  color: #000000 ;  /* ils sont (presque) en blanc */
  text-decoration: none ; /* ils ne sont pas soulignés */

}


a:hover {

  color: #007b54;  /* l'arrière plan passe en bleu */
  text-decoration: underline;

}




table {

  table-layout: auto ;
  border-collapse: collapse;
  width:100%;

}


th {

  background-color: #A1CAA3 ;
  border-top: 2px solid #f7f7f0 ;
  border-left: 2px solid #f7f7f0 ;
  border-right: 2px solid #f7f7f0 ;
  font-weight: bold ;
  text-align: center;
  color: #000000 ;


}

td {

  border-right: 2px solid #f7f7f0 ;
  border-bottom: 2px solid #f7f7f0 ;

}



.crlf { /* L'équivalent du <br clear="both"> */

  clear: both ;

}

.contactLine {

  background-color: #FBECC1 ;
  color: #000000 ;
  text-align: center;
  font-weight: bold ;
  font-size: 120%;

}



.colorLine1 {

  background-color: #FBECC1 ;
  color: #000000 ;

}

.colorLine2 {

  background-color: #FEF7E4 ;
  color: #000000 ;

}


.colorLine3 {

  background-color: #999999 ;
  color: #000000 ;

}


.obligatoire {

 font-weight: bold ;

}



.leftAlign {

  text-align: left;

}

.rightAlign {

  text-align: right;

}


.colorSSTotal {

  background-color: #FFD48D;

}



.tabred {

  border-left: 2px solid #cc0000 ;
  padding-left: 4px ;

}


.tabgreen {

  border-left: 2px solid #00cc00 ;
  padding-left: 4px ;

}

.tabredup {

  border-top: 2px solid #cc0000 ;
  padding-top: 2px ;

}

.tabgreenup {

  border-top: 2px solid #00cc00 ;
  padding-top: 2px ;

}

.tabreddown {

  border-bottom: 2px solid #cc0000 ;
  padding-bottom: 2px ;

}

.tabgreendown {
  border-bottom: 2px solid #00cc00 ;
  padding-bottom: 2px ;

}

.ligneVide {

  height: 15px;
  border: none;

}




/* S'applique à toute la page */
@media screen, print {

  div.css2 {

    display: none ;

  }

}


@media screen {

  body { /* aspect général */

    overflow-y: hidden ;

    margin-left   : 145px;  /* la page est réduite à la zone centrale */
    margin-right  : 0px;
    margin-top    : 114px;
    margin-bottom : 0px;

    padding: 0px; /* donc pas de marge ni d'espacements sur les 4 cotés */

    background-color: #f7f7f0; /* couleur de la charte graphique bnp */

    font-size: 12px;  /* taille par défaut de la police */

    font-family: "Arial", "Verdana", sans-serif ; /* polices à utiliser */
    text-align : justify; /* par défaut les textes sont justifiés */

  }

  #logobnp { /* logo en haut de la page */

    position: absolute; /* le logo est toujours dans le coin haut gauche */
    left: 0px;
    top : 0px;

    background-color: #007a55 ;

    width : 775px; /* le logo est aussi large que la page */
    height: 80px ; /* hauteur du logo */

    background-image: url(../images/borderTopC05.jpg); /* le logo */
    background-repeat: no-repeat;
    background-position: left top;

  }

  #logomut { /* texte sur le logo (Mutuelle) */

    position: absolute;
    left: 180px;
    top : 10px;

    font-size     : 48px ;  /* le texte est très gros */
    letter-spacing: 2px ;    /* espacé */
    font-weight   : bold ;   /* et en gras */

    color: #eeffee ;    /* couleur de la charte graphique */

  }

  #textmut { /* texte sur le logo (du groupe BNP PARIBAS) */

    font-size   : 20px;       /* police de taille moyenne */
    font-variant: small-caps; /* le texte est en petites majuscules */

  }

  #menuhori { /* menu horizontal */

    position: absolute;
    left: 0px;
    top : 82px;

    width : 775px ;  /* il est aussi large que la page */
    height: 27px ;  /* hauteur du menu horizontal */
    vertical-align:  center;

    background-color: #007a55 ; /* couleur de la carge graphique */

  }

  #menuhori ul {

    display: inline ;
    list-style: none ;
    float: right;
    background-color: #007a55 ;

  }

  #menuhori li {

    display: inline;
    color: #00eeee ;
    background-color: #007a55 ;

  }

  #menuhori li a {

    color: #eeffee ;
    text-decoration: none ;

  }

  #menuhori li a:hover {

    background-color: #2586d7;

  }

  #menu { /* menu à gauche */

    position: absolute;
    left: 0px;
    top : 111px;

  	width : 140px;
    height:100%;


    background-color: #007a55 ;

    text-align: left ;  /* le texte du menu est aligné à gauche */

    background-image   : url(../images/bezier.jpg); /* l'image d'arrière plan */
    background-repeat  : no-repeat ;                /* est la fameuse courbe */
    background-position: left top;                  /* de bériez */

  }

  #menu ul {  /* le liste du menu à gauche */

    list-style: none ;  /* pas de puces */

    margin : 0px; /* pas de marge */
    padding: 0px; /* pas de décalage */

  }

  #menu li {  /* les elements de la liste du menu à gauche */

  	margin-top   : 12px ; /* espacés en haut et en bas de 12 pixels */
  	margin-bottom: 12px ;

  	color: #00ffee ;  /* couleur de la charge BNP */

  }


  #menu li a {  /* liens du menu à gauche */

    color: #eeffee ;  /* ils sont (presque) en blanc */
    text-decoration: none ; /* ils ne sont pas soulignés */

  }


  #menu li a:hover {  /* lorsqu'on passe au dessus d'un lien du menu à gauche */

    background-color: #2586d7;  /* l'arrière plan passe en bleu */

  }

  #rightpanel { /* menu à droite */

    position: absolute;
    left: 640px;
    top : 114px;

    padding-top  : 10px ;
    padding-left : 10px ;
    padding-right: 5px ;

    width : 120px; /* largeur du menu = 120 pixels */
    height:100%;

    font-size: 11px;  /* petite police */

    background-image: url(../images/fd2.gif); /* arrière plan assez joli */
    background-repeat: no-repeat;
    background-position: left top;

  }

  .loginLabel {

    color: #007b54;
    font-size: 12px;
    font-weight: bold;

  }

  .divFieldString {

    text-align: left ;
    margin-left: 4px;

  }

  .divFieldButton input:hover {

    background-color: #007b54;
    color: #eee ;

  }

  .loginText {

    font-size: 9px;

  }


  #rightpanel a {

    color: #000000 ;
    text-decoration: none ;
    text-weight: lighter ;

  }

  #rightpanel a:hover {   /* Si la souris est sur la zone */

    color: #007b54;
    text-decoration: underline ;

  }



  #content {

    width : 490px;
    background-image: url(../images/fd2.gif);
    background-repeat: no-repeat;
    background-position: left top;

    height: 100%;

    overflow: auto;

  }

  #inside {

    height: 100%;

    padding-top  : 10px;
    padding-left : 10px;
    padding-right: 10px;

  }

  .contentError {

    background-image: url(../images/fd3.gif);
    background-repeat: no-repeat;
    background-position: left top;

    padding-left: 24px ;
    padding-top: 10px;
    margin-bottom: 1.5em ;

  }


  .contentInfo {

    background-image: url(../images/fd2.gif);
    background-repeat: no-repeat;
    background-position: left top;

    padding-left: 24px ;
    padding-top: 10px;
    margin-bottom: 1.5em ;

  }

  .maintenance  {

    background-image: url(../images/fd3.gif);
    background-repeat: no-repeat;
    background-position: left top;
    text-align: center;
    font-size: 15px;
    font-weight: bold;

    padding-left: 24px ;
    padding-top: 10px;
    margin-bottom: 1.5em ;

  }

  .contentTitle {

    color: #B3275A;
    font-weight: bold ;
    font-size: 14px;

  }



  .contentTwoColHeaderLeft {  /* Titres sur deux colonnes à gauche*/

  	width: 210px ;
    float: left ;
    background-image: url(../images/fd2.gif);
    background-repeat: no-repeat;
    background-position: left top;
  	margin-bottom: 1.5em ;
  	padding-left: 10px;
    padding-top: 10px;

  }

  .contentTwoColHeaderRight { /* Titres sur deux colonnes à droite */

  	width: 220px ;
    float: right ;
    background-image: url(../images/fd2.gif);
    background-repeat: no-repeat;
    background-position: left top;
  	margin-bottom: 1.5em ;
  	padding-left: 10px;
    padding-top: 10px;

  }

  .contentTwoColBody { /* Contenu sur deux colonnes */

    width: 210px ;
  	margin-bottom: 1.5em ;

  }


  /* Numero de telephone */
  #tabnumero {

    padding: 1px ;
    text-align: left;
    color: #000000 ;
    font-size: 11px ;

  }

  .basMenu {

    color: #B3275A;
    font-weight: bold ;
    font-size: 13px ;

  }

  #tabrbst, #tabdetails {

      padding: 1px ;
      text-align: center;
      width: 100% ;
      font-size: 13px ;

  }

}






@media print {

  body {

    font-size: 13pt ;
    font-family: "Arial", "Verdana", sans-serif ;
    margin: 0pt;
    color: #000000 ;
    background: #ffffff;
    text-align: justify ;

  }

  #logobnp, #logomut, #rightpanel, #menu, #menuhori, .basMenu,
  #inside form, .navbar, .tocblock {

    display: none ;

  }

  #content {

    width  : 100%;
    height : 100%;

  }

  .contentTitle {

    color: #B3275A;
    font-weight: bold ;
    font-size: 14pt;

  }


  .contentHeader, .contentError, .contentInfo, .maintenance,
  .contentTwoColHeaderLeft, .contentTwoColHeaderRight {

    background: none ;

  }

  .contentTwoColHeaderLeft {  /* Titres sur deux colonnes à gauche*/

    float: left ;
    width: 45%;

  }

  .contentTwoColHeaderRight { /* Titres sur deux colonnes à droite */

    float: right ;
    width: 45%;

  }

  #tabrbst, #tabdetails {

      padding: 1pt ;
      text-align: center;
      width: 100% ;
      font-size: 13pt ;

  }


}