/*******************************************
/*   
/*  Feuille de style pour Presiglande
/*  (c) 2004-2005-2006
/*
/*******************************************/

/* debuggage. */
/*
div {
  border: 1px solid;
  padding: 1px;
  margin: 1px;
}
*/



body
{
  background-color:	#CED5D3; /* white;*/
  margin:		0pt 0pt 0pt 0pt;
  padding:		0pt 0pt 0pt 0pt;
  font-family:		Helvetica, Verdana, Arial, sans-serif;
  color:		black;
  font-size:		90%;
  min-width:		950px;
}

img
{
  vertical-align: middle;
  margin: 1px;
}

form
{
  margin: 0px;
}

form input {
  font-size: 100%;
}
form select {
  font-size: 100%;
}

.small
{
  font-size: 70%;
}
/****** Liens *******/
a, a:visited, span.link
{
  font-weight:		bold;
  color:		#4466AA; /* #2F3FEE; entre ca et bleu*/
  text-decoration:	none;
}
span.link {
  cursor: pointer;
}
a:hover, span.link:hover
{
  font-weight:		bold;
  color:		#4466AA; /* #2F3FEE; entre ca et bleu*/
  text-decoration:	underline;
}

ul
{
  padding: 0px;
  margin: 0.5em 1em 0em 2em;
}

/******* Page d'accueil ************/
.accueil-login
{ 
  color:        #2E75AB;
  font-size:    100%;
  font-family:	Helvetica, Verdana, Arial, sans-serif;
}


/******* Colonne de gauche: date, avatar et menus **************/
/*
 * Colonne de gauche (menu): float left
 * Note: les margin/padding left/right doivent rester a 0, sinon IE fait chier.
 */
div#colonne-menu
{
  width: 170px;
  margin: 0;
  padding: 2px 0;
  background-color: #A9B4B3;
  text-align: center;
  float: left;
  margin-bottom: 5px;
}
table#date-meteo
{
  font-size: 80%;
  border: none;
  margin: 0 auto;
  padding: 0 2px;
  background: transparent;
}
table#date-meteo td
{
  text-align: center;
  vertical-align: middle;
}
td#date
{
}
td#meteo
{
  width: 40px;
}
table#date-meteo td#imgtemperat
{
   vertical-align: bottom;
   text-align: left;
   background-image: url('temperature.gif');
   background-position: bottom left;
   background-repeat: no-repeat;
   height: 30px;
   width:17px;
   padding: 0 0 8px 3px !important; /* prepare to fuck ie */
   padding: 0 0 4px 3px;  /* fucked ie, others declined proposal */
   margin: 0;
}
td#imgtemperat img
{
  margin: 0px;
  padding: 0px;
  width: 2px;
  border: none;
}
table#date-meteo td#temperature
{
  width: 2.5em;
  text-align: left;
  padding-left: 2px;
  white-space: nowrap;
}

.menu
{
  border:  3px solid #778BAA;
  margin:  5px; /*0pt 0pt 0pt 0pt;*/
  padding: 0px;
/*  padding :	2pt 10pt 2pt 10pt;*/
  text-align: left;
  background-color:	#3171A1;
  color: #AACFEE;
}
.titre-menu
{
  background-color:	#778BAA;
  margin:		0pt 0pt 0pt 0pt;
  padding:		2pt 5pt 2pt 2pt;
  font-size:		100%;
  font-family:		Helvetica, Arial, sans-serif; /* fantasy */
  font-weight:		bold;
  text-align:		right;
  color:		black;
  font-size: 110%;
}
.menu ul,
.menu ul.menu-candidat,
.menu ul.menu-communaute
{
  border: 1px none #778BAA;
  margin: 2px;
  padding:		5pt 2pt 5pt 8pt;
}
.menu ul li
{
  font-size:		85%;
  list-style-type: none;
  list-style-image: none;
  padding-left: 25px;
  padding-bottom: 5px;
  padding-top: 4px;
  margin: 0px;
  position: relative;
}

/* infobulle, src: http://forum.alsacreations.com/faq/#item11 */
a span.infobulle {
 display: none;
 }
a:hover
{
  background: none; /* aux chiottes IE */
}
a:hover span.infobulle {
 text-decoration: none; /* non pris en compte par Safari... */
 position: absolute;
 left: 75px;
/* width: 200px;*/
 background-color: #FFFF99;
 padding: 5px;
 display: inline;
 color: black;
 margin-top: 10px;
/* font-weight: bold;*/
font-family: Tahoma;
 font-size: 90%;
 border: 1px outset #778BAA;
 z-index: 5;
}



.menu ul.menuadmin
{
  padding: 2px;
  margin: 2px;
  margin-left: 15px;
}
.menu ul.menuadmin li
{
  list-style: disc;
  padding: 0px;
  margin: 2px;
}
.menu a, .menu a:visited
{
  font-weight:		bold;
  color:		white; 
  text-decoration:	none;
}
.menu a:hover
{
  font-weight:		bold;
  color:		white;
  text-decoration:	underline;
}

#footer
{
  margin-top: 5px;
  border-top: 2px ridge; 
  clear: both;
}


/********** avatar **********/
/* tous les elements a l'interieur de l'avatar sont en absolute. */
div.avatar
{
  height: 180px;
  width:  160px;
  position: relative;
  margin: 2px auto;
  padding: 0;
}
.avatar * { position: absolute; }
.avatar .image {
  width:  100px;
  height: 130px;
  top: 23px;
  left: 24px;
  z-index: 4;
}
.avatar .cadre {
  width: 144px;
  height: 176px;
  top: 0px;
  left: 3px;
  z-index: 10;
}
.avatar .icones {
  top: 32px;
  left: 27px;
  z-index: 5;
  padding: 0px;
  margin: 0px;
}
.avatar .barre-popu {
  bottom: 15px;
  left: 0px;
  width: 15px;
  background-color : #60ff60; /* vert */
  z-index: 1;
}
.avatar .barre-popuNeg {
  top: 15px;
  left: 0px;
  width: 15px;
  background-color: #ff6060; /* rouge */
  z-index: 1;
}
.avatar .barre-energie {
  bottom: 15px;
  right: 0px;
  width: 15px;
  background-color: #ffff60; /* jaune */
  z-index: 1;
}
.avatar .barre-texte {
  width: 9px;
  bottom: 16px;
  z-index: 2;
}
/*.avatar * {border: 1px dotted red}*/


div.avatarPetit
{
  height: 60px;
  width:  53px;
  position: relative;
  margin: 1px auto;
  padding: 0;
}
.avatarPetit * { position: absolute; }
.avatarPetit .image {
  width:  33px;     /* l'image doit etre 1px plus grande, sinon y'a un blanc. */
  height: 43px;
  top: 7px;
  left: 9px;
  z-index: 4;
}
.avatarPetit .cadre {
  width: 48px;
  height: 58px;
  top: 0px;
  left: 2px;
  z-index: 10;
}
.avatarPetit .icones {
  top: 11px;
  left: 9px;
  z-index: 5;
  padding: 0px;
  margin: 0px;
}
/*.avatar * {border: 1px dotted red}*/




/******** Fenetre principale ******************/
#main
{
/*border: 1px solid red;*/
  margin: 0 0 0 175px;    /* largeur du menu +5 */
  padding: 10px;
/*  min-width: 770px;	   950 - 180 (menu) */
}

#main-auxchiottesie /* sinon IE ne sait pas positionner les elements en absolute */
{
  padding: 0;
  margin: 0;
  width: 99%; /* ce width ne peut etre dans le #main, sinon IE foire l'affichage. Je crois pas l'avoir dit: aux chiottes IE */
}


/* Pour le multicol, il nous faut un div englobant. Ne pas me demander pourquoi. */
/* Chaque colonne a aussi un div 'inner' pcq le padding est parfois pas compris dans le width... */
.multicol,
.colonne-gauche,
.colonne-droite,
.colonne-centre,
.colonne-gauche-inner,
.colonne-droite-inner,
.colonne-centre-inner
{
	  padding: 0;
	  margin: 0;
border: none;
}
.multicol { float: right; width: 100%;}
.colonne-gauche,
.colonne-droite,
.colonne-centre
{
  display: table; /* evite que le contenu 'deborde' */
}

.colonne-gauche {  float:	left;     }
.colonne-gauche-inner     {  padding-right: 10px; }
.colonne-droite {  float:	left;     }
.colonne-droite-inner     {  padding-left: 10px; }
.colonne-centre {  float:	left;     }
.colonne-centre-inner     { }


.multicol .clearer,
.clearer
{
  clear: both;
}


/***** separation dans un groupe d'action *****/
/***** ligne pointillee bleue au dessus du groupe ****/
.action-separation
{
   border-top:   1px dotted #4a88be;
}
hr.action-separation {
  border: none;
  border-top:   1px dotted #4a88be;
  margin: 10px 10px 10px 5px;
  background: transparent;
}


h1
{
  margin:	0 0 20px 0;
  padding:	2pt 0pt 2pt 10pt;
  font-size:	190%;
  font-weight:	bold;
  font-variant: small-caps;
  font-family:	sans-serif; /* fantasy */
  text-align:	center;
  color:	#4466AA;
  background-color: white;
}

h4
{
  margin-top: 0px;
}


/* bloc d'erreur: on change juste le bloc englobant et le titre */
.bloc-erreur
{
  background-color:	#ffd7d7; /*#ffb6ac; /*#E2E2DD; #D9D9D9; #EEEEDD;*/
  border: 2px solid #ff5845;
  margin:		0px 0px 15px 0px;
  padding:		0px;
  color:		black;
}
.bloc-erreur h2
{
  background-color: #ff5845;
  padding:	2px 2px 2px 10px;
  margin: 0px;
  font-family:	sans-serif; /* fantasy; */
  font-weight:	bold;
  color:	white;
  font-size: 1em;
}

.bloc-erreur p
{
  border: none;
  margin:		0px;
  margin-top: 5px;
  padding:		5px;
  font-size:		90%;  
}

/* pareil que .content, sans le padding */
table
{
  background-color:	#EAEAEA; /*#E2E2DD; #D9D9D9; #EEEEDD;*/
  color:		black;
}


table, table td
{
/*border: 1px dotted;*/
}
.content-table90
{
  background-color:	#EAEAEA; /*#E2E2DD; #D9D9D9; #EEEEDD;*/
  color:		black;
  font-size:		90%;
}

table td.actionNom,
table td.actionDonnees,
table td.actionBouton
{
  padding-right: 10px;
}
table td.actionDonnees,
table td.actionBouton,
table td.actionNecessite
{
  padding-left: 10px;
}
table td.actionNecessite
{
  white-space:nowrap;
}

ul.listeActions
{
}



/**************************************************
 *
 * Pages specifiques
 *
 **************************************************/

/********** Page principale **********/

/****** Liste objectifs ******/
ul li.objAtteint
{
  list-style-image: url("../img/check.gif");
  color:     green;
}
ul li.objNonAtteint
{
  list-style-image: url("../img/croix.gif");
  color:     red;
}

/****** Infos administratives *****/
dl.infosAdministratives
{
  margin: 0px;
}
.infosAdministratives dt
{
  display: inline;
  font-weight:          bold;
  float: left;
  padding-right: 2px;
}
.infosAdministratives dd
{
  margin-left: 12em;
}




/********** Forum, messagerie **********/
.authorLogin
{
/*  font-weight: bold;*/
  text-align: center;
/*border: 1px solid red;*/
/*width: 50%;*/
z-index: 20;
}

/*** La table suivante est surtout utilisee pour la previsualisation. ***/
table.forum
{
  width: 100%;
  border: none;
  background-color: #4a88be;
}
table.forum th
{
  color: white;
  white-space: nowrap;
}
table.forum td
{
  background-color: #EAEAEA;
  margin:		0pt 0pt 0pt 0pt;
  padding:		5pt 5pt 5pt 5pt;
  color:		black;
}




.quote {
  border: #4a88be;
  padding: 5px;
  border-style: dotted;
  border-left-width: 1px;
  border-top-width:  1px;
  border-right-width: 1px;
  border-bottom-width: 1px
}

/**** Messagerie ****/
/* fenetre composition */
table.editionMessage {}

table.editionMessage td.fieldName
{
  font-weight: bold;
  width: 4em;
  vertical-align: top;
}
table.editionMessage td.fieldValue
{
  vertical-align: top;
}

div.toJoueurOrListe {
  float: left;
  height: 6em;
  margin-right: 1em;
}



td.ThreadFieldName
{
  font-weight: bold;
  width: 4em;
}
td.ThreadFieldValue
{
}


div.ThreadVisible
{
position: relative;
padding-left: 0;
}

div.ThreadInvisible
{
position: relative;
}

span.ThreadNbMsg
{
  position: absolute;
  top: 2px;
  right: 50px;
  font-weight: bold;
  color: white;
}
span.voirThread {
  position: absolute;
  top: 20px;
  right: 50px;
  font-weight: bold;
}
span.voirThread a
{
  color: white;
}


/**** Messages ****/
ul.Messages {
  margin: 0px;
  padding: 0px 7px;
}

li.FullMessage ul.Messages
{
  padding-right: 0;
  padding-left: 2em;
  padding-bottom: 5px;
}

li.FullMessage {
  padding-top: 10px;
  list-style-type: none;
}

/* message contents */

.MsgHeaderLeft {
  margin: 0;
  padding: 0px;
  width: 150px;
  float: left;
z-index: 5;

}

.MsgHeaderTop {
  padding: 0px;
  margin: 0px;
  margin-left: 150px;
  padding-left: 0px;
  padding-right: 2em;
  position: relative;
  display: block;
/*  background-image: url(MIP_headertop.png);
  background-repeat: repeat-y;
*/
text-align: right;
  white-space: nowrap;
}


.MsgHeaderTop,
.MsgHeaderTop .sujet,
.MsgHeaderTop .to
{ 
  background-color: #7caadd;
}

.MsgHeaderTop .sujet,
.MsgHeaderTop .to
{
  width: 30%;
  float: left;
  text-align: left;
  margin: 0;
  white-space: nowrap;
  padding-right:1em;
  overflow: hidden;
  padding-top: 0.2em; 
  padding-bottom: 0;
}

.fieldName {
  font-weight: bold;
  padding-right: 2em;    /* marche pas avec un span... */
  display: inline;
}


.MsgHeaderTop  img { margin: 0; }

.operations
{
float: right;
}



.MsgBody {
  margin-left: 155px;
  margin-right: 8em;
margin-top: 5px;
margin-bottom: 5px;
}



/* visibility of messages, and style depending on the status */
.MessageVisible,
.MessageConfirmDelete
{
  margin-right: 0;
  border: 1px solid #4a88be;
  background-image: url(coulbloc.gif);
  background-position: 60px 0;
  background-repeat: repeat-y;
}
.MessageInvisible
{
  border: 1px solid #4a88be;
  margin: 0;
}

.MessageInvisible  .MsgBody,
.MessageInvisible  .avatarPetit
{
  display: none;
}

.MessageVisible .operations {
  padding-top: 3px;
  padding-right: 5px;
  text-align: left;
}

.MessageInvisible .operations { display: none; }
.MessageInvisible .actionVoir { display: inline; }
.MessageInvisible .actionCacher { display: none; }

.MessageVisible .operations { display: block; }
.MessageVisible .actionVoir { display: none; }
.MessageVisible .actionCacher { display: inline; }

.MessageConfirmDelete .actionCacher,
.MessageConfirmDelete .actionVoir
{ display: none; }
.MessageConfirmDelete .operations
{ visibility: hidden; }


.MessageVisible .operations *
{
  white-space: nowrap;
  display: block;
}

.MessageVisible .actionVoir { display: none; }

a.actionVoir,
a.actionCacher
{
  padding-left: 1em;
  padding-right: 0.5em;

}


a.actionVoir,
a.actionCacher,
a.actionVoir:hover,
a.actionCacher:hover,
a.actionVoir:visited,
a.actionCacher:visited
{
  color: white;
}


.MessageConfirmDelete,
.MessageConfirmDelete .MsgHeaderTop,
.MessageConfirmDelete .MsgHeaderTop *
{
  background-color: #ff9797;
}



.MessageDeleted *
{ display: none; }

.MessageDeleted ul.Messages {
  display: block;
}






.popup-titre
{
  padding:	2px 2px 2px 2px;
  font-family:	Helvetica, sans-serif; /* fantasy; */
  font-weight:	bold;
  color:	white;
  text-align:   center;
  background-color: #4a88be;
}

div#popup-colonne
{
  width: 170px;
  margin: 0;
  padding: 2px 0;
  background-color: #CED5D3;
  text-align: center;
  float: left;
  margin-bottom: 5px;
}
/********** parti **********/

/***** resume des actions: cf "prochains meetings" *****/
.resume
{
  padding-left: 1em;
  margin-top:0px;
  padding-top: 0px;
}

ul li.resume-ok
{
  list-style-image: url("../img/check.gif");
}

ul li.resume-ko
{
  list-style-image: url("../img/croix.gif");
}



/********** Agenda **********/
table.agenda
{
  background-color:	#4a88be;
}
table.agenda td
{ vertical-align: top}

.agenda-entete
{
  background-color: white;
  color:           #000066;
  font-weight:     bold;
}
.agenda-entete-mois
{
  color:           white;
  font-weight:     bold;
  font-size:       110%;
}
.agenda-evt-today
{
  color:            white;
  background-color: #ff006a;
  font-weight:      bold;
}
.agenda-today
{
  background-color: #FFCC99;
}
.agenda-evt
{
  background-color: #AACFEE;
}
.agenda-day
{
  background-color: white;
}
.agenda-day-free
{
  background-color: #8fefa2;
}
.agenda-empty
{
  background-color: white;
}


/********** Finance, impots **********/
.finance-cadre
{
  border: 1px dotted #4a88be;
  margin-top:0;
  margin-right: 5px;
  margin-left: 5px;
  margin-bottom: 10px;
}
.fincance-cadre ul
{
  padding-left:2em;
}

.impot-declaration
{
  border: 1px solid #4a88be;  
  background-color: white;
/*  background-color:	#E2E2DD;*/
/*  font-size: 90%;*/
  padding: 0 20px 10px 20px ;
  margin-top:0px;
  margin-right: 5px;
  margin-left: 5px;
  margin-bottom: 10px;
}

.impot-entete
{
  margin:	0pt 0pt 10pt 0pt;
  padding:	2pt 0pt 2pt 10pt;
  font-weight:	bold;
  font-family:  fantasy;
  text-align:	center;
  color:	#4466AA;
  background-color: white;
}

.impot-entete h1
{
  font-variant: small-caps;
  font-style: italic;
  font-size: 190%;
  font-weight: normal;
}

.impot-cadre
{
  background-color:	#4a88be;
  padding:	4px 2px 2px 20px;
  font-family:	sans-serif; /* fantasy; */
  font-weight:  bold;
  color:	white;
}

.impot-declaration h3
{
  background-color:	#4a88be;
  margin-top: 0px;
  padding:	4px 2px 2px 20px;
  font-family:	sans-serif; /* fantasy; */
  color:	white;
}

.impot-notes
{
  font-size: 75%;
}

.impot-decl-champs
{
  margin-left: 10px;
  margin-top:  5px;
  margin-bottom: 5px;
}

/* Autres idees de couleurs pour le fond du titre : 
   #4466AA #AACFEE #353657 #6A809E #778BAA #7A70AE #AC005F #919ca2 #F99403 #010767 #6C0192 #52636b #016754 #4a88be
*/


#passageNiveau p {
  margin-top: 0.5em;
  margin-bottom: 0;
}
#passageNiveau quote {
  text-indent: 0;
  padding: 0em 3em 1em 3em;
  font-style: italic; 
  display: block;
}


div.legendElection
{
  width: 1em;
  height: 1em;
  border: 1px outset #EAEAEA;
}

div.votePresigland {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 50px;
  margin-bottom: 50px;
}


/****** anciens styles ****/
.table-menu
{
  background-color:	#778BAA;  /*#333355; #353657; #003792; #4a88be;*/
  margin:		5pt 0pt 10pt 0pt;
  padding:		2px 2px 2px 2px;
}


.bloc-wrapper {
  margin:  0px 0px 15px 0px;
  padding: 0px;
}

.bloc-wrapper .top {
  background: transparent url(Bloc_Top_Left.png) no-repeat top left ;
  margin-right: 27px;
}

.bloc-wrapper .top h2 {
  background: transparent url(Bloc_Top_RightCorner.png) no-repeat top right ;
  height: 27px;
  margin: 0px;
  margin-right: -27px;
  padding: 0px 20px 0px 20px;

  line-height: 20px;   /* vertical centering of text */
  font-family:	sans-serif;
  font-size: 1em;
  font-weight:	bold;
  color:	black;
  position: relative;
  white-space: nowrap;
}

.bloc-wrapper h2 .texte-droite
{
  position: absolute;
  top:0px;
  right: 100px;
  padding: 0px;
}

.bloc-wrapper .content-l,
.bloc-wrapper .separation-l {
  margin-right: 10px;
}
.bloc-wrapper .content-l .content-r,
.bloc-wrapper .separation-l .separation-r {
  margin-right: -10px;
}

.bloc-wrapper .content-l {
  background: #eaeaea url(Bloc_Content_Left.png) repeat-y top left;
}
.bloc-wrapper .content-l .content-r {
  background: transparent url(Bloc_Content_Right.png) repeat-y top right;
  padding: 3px 10px 2px 6px;
}

.bloc-wrapper .bottom-l {
  background: transparent url(Bloc_Bottom_Left.png) no-repeat top left;
  margin-right: 17px;
}
.bloc-wrapper .bottom-l .bottom-r {
  background: transparent url(Bloc_Bottom_RightCorner.png) no-repeat top right;
  height: 17px;
  margin-right: -17px;
}


.bloc-wrapper .separation-l {
  background: url(Bloc_Separation_Left.png) top left no-repeat;
  font-size: 1px;   /* aux chiottes IE */
}
.bloc-wrapper .separation-l .separation-r {
  background: url(Bloc_Separation_Right.png) top right no-repeat;
  height: 5px;
}


/**** Table integree dans le bloc (avec des bords bleus) ****/
table.table-bloc
{
  width: 100%;
  background-color: transparent;
  margin: 0;
  margin-bottom: -11px!important;     /* aux chiottes IE: le -11px ne marche pas pour cet imbecile => les lignes verticales n'iront pas jusqu'en bas. */
  margin-bottom: 0px;  		      /* aux chiottes IE */
}

table.table-bloc th
{
  color: white;
  white-space: nowrap;
  background-color: #4a88be;
  border: 1px solid #4a88be;
}

table.table-bloc td
{
  background-color: transparent;
  margin:		0pt 0pt 0pt 0pt;
  padding:		5pt 5pt 5pt 5pt;
  color:		black;
  border-top: 1px solid #4a88be;
  border-left: 1px solid #4a88be;
}

table.table-bloc tr.lastRow td,
table.table-bloc tr.lastRow td.firstCol {
  border-top: none;
}
table.table-bloc tr.lastRow td.firstCol {
  border-left: none;
}


.bloc-wrapper-table .content-l {
  position: relative;
}
.bloc-wrapper-table .content-l .content-r {
  padding:  10px 7px 2px 0px;
}





/* deprecated: vieux design */
/********* Contenu ***************/
.bloc
{
  background-color:	#EAEAEA; /*#E2E2DD; #D9D9D9; #EEEEDD;*/
  border:  2px solid #4a88be;
  margin:  0px 0px 15px 0px;
  padding: 0px;
  color:   black;
}

.bloc h2
{
  background-color: #4a88be;
  padding:	2px 2px 2px 10px;
  margin: 0px 0px 0px 0px;
  font-family:	sans-serif; /* fantasy; */
  font-size: 1em;
  font-weight:	bold;
  color:	white;
  position: relative;
}
.bloc h2 .texte-droite
{
  position: absolute;
  top:0px;
  right: 100px;
  padding: 2px;
}
.bloc h2 a
{
  text-decoration: underline;
  color: white;
}
/* note: on ne peut pas utiliser <p> directement: une table ferme un paragraphe (firefox) ou le coupe en 2 (safari). */
.bloc div.first-paragraph
{
  border: none;
  margin:		0px;
  margin-top: 5px;
  padding:		5px;
  font-size:		90%;
}
.bloc div.next-paragraph
{
  margin:		0px;
  padding:		5px;
  font-size:		90%;
  border-top : 1px solid #4a88be;
}





/**** tabs ****/
/* example.css from tabber project. See http://www.barelyfitz.com/projects/tabber/ */

/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
  display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
}
.tabberlive {
  margin: 1em -3px 5px -3px;
  padding-left: 0px;
}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav
{
 margin:0;
 padding: 0;
 list-style: none;
 float: right;
 width: 100%;
  border-bottom: 1px solid #4384bc;
}

ul.tabbernav li
{
 float: left;
 background: transparent url(tab_left.png) no-repeat top left;
 margin-right: 7px;
}

ul.tabbernav li a
{
 display: block;
 margin: 0;
 background: transparent url(tab_right_border.png) no-repeat top right;
 margin-right: -6px;
 text-decoration: none;
 padding: 5px 5px 2px 5px;
}

ul.tabbernav li a:hover
{
 text-decoration: none;
 color: white;
}

ul.tabbernav li.tabberactive
{
 float: left;
 background: transparent url(tab_current_left.png) no-repeat top left;
 margin-right: 9px;
}

ul.tabbernav li.tabberactive a
{
 display: block;
 margin: 0;
 margin-right: -11px;
 padding: 3px 10px 4px 5px; 
 background: transparent url(tab_current_right_border.png) no-repeat top right;
 color: white;
}


ul.tabbernav li.tabberactive a:hover
{
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
 padding:0px;
 clear: right;
 background: transparent;
 margin: 2px;
 padding: 1em 2px 2px 5px;
 clear: right;
/*
 border-top:0;
*/
}

.tabberlive .tabbertab .tabberlive
{
 margin: 5px 15px 5px 10px;
 padding: 0;
}
.tabberlive .tabbertab .tabbernav
{
  border: none;
}

.tabberlive .tabbertab .tabberlive li
{
  margin-bottom: -1px;
  z-index: 10;
}
.tabberlive .tabbertab .tabberlive li a
{
  border-bottom: 1px solid #4384bc;
}


.tabberlive .tabbertab .tabberlive .tabbertab
{
  margin: 0;
  margin-top: -1px;
  border: 1px dotted #4384bc;
  border-right: none;
  padding-bottom: 1em;
}


/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
 display:none;
}
.tabberlive .tabbertab h3 {
 display:none;
}