/*
 * CSS commune aux prestations AFCeL.
 */

#divWait {
	background: #ffffff;
	position: absolute;
	left: 40%;
	top: 45%;
	display: none;
}

/* spinner (cf méthode showSpinner) */
/* -------------------------------- */
#spinner{
  padding : 10px;
  display: none;
  position: absolute;
  z-index:20;
}


/** class par défaut du container */
.spinner-container{
}

/** class du container version opaque*/
.spinner-container-opaque{
  background-color:white;
}

#spinner-image-container {
}

/* image pour attente */
.spinner-image {	
  background-image: url('../../../images/loading.gif');
  margin-left:auto;
  margin-right:auto;
  width:32px;
  height:32px;
  z-index: 20;
}


/* image pour download */
.download-image { 
  background-image: url('../../../images/download-arrows.gif');  
  margin-left:auto;
  margin-right:auto;
  width:160px;
  height:24px;
  z-index: 20;
}

/* div text */
.spinner-text{
  font-variant: small-caps; 
  font-family: sans-serif; 
  font-size: 1.4em;
}

/* overlay */
.frozen {
    background: #FFFFFF;
    opacity: 0.3;
    filter: alpha(opacity=30);	
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 10;
}

/** spinner dans un champ input */
.inner-spinner {
  background-image: url('../../../images/spinner_16x16.gif');
  background-repeat: no-repeat;  
  background-position: center center; 
}

/** -- **/


#nav {
	clear: both;
	width: 95%;
	text-align: right;
}

.leftFilterDiv {
	margin-top: 5px;
	text-align: left;
}

.leftFilterDiv div {
	float: left;
	display: block;
	font-weight: bold;
	margin-left: 6px;
	margin-bottom: 5px;
}

form input,select {
	font-size: 0.9em;
}

form input[type="image"],form img {
	vertical-align: middle;
	cursor: pointer;
	position: relative;
	top: -1px;
}

/** pour aligner le bouton radio et le texte du label */
form input[type="radio"]{
margin-top:-4px;
vertical-align:middle;
}

/** styles pour la taglib afcel-form **/
/** -------------------------------- **/

/* supprime la mg du 1er radio button pour aligner avec les autres champs */
.lvl1_col2_2 span:first-child .blockradiobuttonsRadio{
	margin-left:0px;
}
/* ajout mg pour espacement entre 2 rb (0 par défaut sur i.e)*/
.blockradiobuttonsRadio{
	margin-left:1em;
}

/** icone aide du tag blocradiobuttons */
.blocradiobuttonsHelp{
	top:0px;
	vertical-align: text-bottom; /* aligne l'icone et radio */ 
	margin-left: 0.25em;		 
}

/** icone aide du tag  bloccheckbox */
.bloccheckboxHelp{
  top: -2px;
  vertical-align: text-bottom;
  margin-left: 0.25em;
}

/** fin styles pour la taglib afcel-form  **/
/** ------------------------------------- **/


.titleDiv {
	margin-bottom: 25px;
	clear: left;
}

.subTitleDiv {
	margin-bottom: 5px;
	clear: left;
}

.pageHelpBody {
	margin-top: 10px;
	border: #a4ccd8 1px solid;
	margin-left: 5px;
	padding: 3px;
	font-size: 0.98em;
	font-weight: normal;
	margin-bottom: 10px;
	clear: both;
}

/* text en bleu vert dans des blocs d'aide (p2) */
.pageHelpRequiredFields {
    color: #0C6A89;
    margin-bottom: 3px;
    margin-top: 3px;
}

.context {
	margin-top: 10px;
	margin-left: 5px;
	padding: 3px;
	margin-bottom: 10px;
	clear: both;
}

.context legend {
	color: #3D88A1;
	font-weight: bold;
}

.pageHelpBodyRed {
	background: url("../../../images/ko.png") no-repeat 6px 2px;
	margin-top: 10px;
	border: red 1px solid;
	/*margin-left: 5px;*/
	padding: 3px;
	font-size: 0.98em;
	font-weight: normal;
	margin-bottom: 10px;
	clear: both;
	color: red;
	padding-left: 31px;
}

.pageHelpBodyGreen {
	background: url("../../../images/ok.png") no-repeat 6px 2px;
	margin-top: 10px;
	border: green 1px solid;
	/*margin-left: 5px;*/
	padding: 3px;
	font-size: 0.98em;
	font-weight: normal;
	margin-bottom: 10px;
	clear: both;
	color: green;
	padding-left: 31px;
}

.warningMessage {	
	border: red 1px solid;
	padding: 3px;
	font-size: 0.98em;
	font-weight: normal;
	/*margin-left: 3px;*/
	margin-top: 10px;
	margin-bottom: 10px;
	clear: both;
	color: red;
	background-color: #F8E0E6;
}

.error {
	font-weight: normal;
	color: red;
}

.text_central_internal {
	BORDER: #cbdfe6 1px solid;
	FLOAT: left;
	MARGIN: 5px 5px 5px 0px;
	WIDTH: 14px;
	HEIGHT: 14px;
}


/** surcharge des css tooltip définies dans jquery-ui.custom.css */

.ui-tooltip {	
	position: absolute;
	z-index: 3000;
	border: 1px solid black;
	color: #0C6A89;
	background-color: #f5f5f5;
	padding: 5px;
	opacity: 1;
	max-width: 350px;
	-webkit-box-shadow: 0 0 5px #aaa;
	box-shadow: 0 0 5px #aaa;
}

body .ui-tooltip {
	border-width: 1px;
}

h3 .ui-tooltip {	
	margin: 0;
	color: #0C6A89;
	letter-spacing: 0px;
	text-transform: none;
	font-size: 13px;
	line-height: 1em;
	font-weight: normal;
	-webkit-box-shadow: 0 0 5px #aaa;
	box-shadow: 0 0 5px #aaa;
}

/** classes pour les tooltips draggables  */

/**
supprime shadow quand le tooltip est draguable
*/
.ui-tooltip.ui-draggable {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	border-color: #f5f5f5;
	-webkit-transition: box-shadow 0.5s ease-in-out, border-color 0.2s linear;
	-moz-transition: box-shadow 0.5s ease-in-out, border-color 0.2s linear;
	transition: box-shadow 0.5s ease-in-out, border-color 0.2s linear;
}

/**
opacité réduite du contenu qd le tooltip est draggué 
*/
.ui-draggable-dragging > .ui-tooltip-content {
	opacity: 0.50;
	outline: rgba(128, 128, 128, 0.2) dotted 2px;
}

/**
poignée du drag
*/
.tooltipDragHandle {
	display: block;
	visibility: hidden;
	cursor: move;
	position: absolute;
	height: 100%;
	margin: 0px;
	padding: 0;
	top: 0px;
	left: 0px;
	width: 0px;
	background-color: #f5f5f5;
	background: url('../../../images/tooltiphandle.png');
	opacity: 0;
	z-index:1;
}

/**
div contenant le texte du tooltip (fond +zindex pour apparaitre au dessus de la poignée)
*/
.tooltipDragHandle + div {
	position: relative;
	background-color: #f5f5f5;
	z-index:2;
}

/**
fait apparaître la poignée de drag quand le tooltip est draggable
*/
.ui-tooltip.ui-draggable  .tooltipDragHandle{
	visibility:visible;
	left:-10px;
	width: 10px;
	-webkit-transition: left 0.5s ease-in-out,opacity 0.5s ease-in-out;
	-moz-transition:  left 0.5s ease-in-out,opacity 0.5s ease-in-out;
	transition: left 0.5s ease-in-out,opacity 0.5s ease-in-out;
	opacity: 1;
}



/**
 * Le style pour une image dans un tooltip.
 */
#imageTooltip {
	position:absolute;
	border:1px solid #000000;
	background:#F3F7F9;
	padding:1px;
	display:none;
	color:#0C6A89;
	
}

/**
 * style de bouton plat, bleu clair avec texte bold bleu foncé (1ere generation) 
 */
button.buttonGE1 {
	position: relative;
	margin-top: 10px;
	background-color: #F3F7F9;
	border: 1px solid #64A0B4;
	border-top: 1px solid #eee;
	border-left: 1px solid #eee;
	font-family: Arial, Verdana, sans-serif;
	font-size: 100%;
	line-height: 130%;
	text-decoration: none;
	font-weight: bold;
	color: #0C6A89;
	cursor: pointer;
	padding: 5px 10px 6px 7px; /* Links */
	width: auto;
	overflow: visible;
	padding: 4px 10px 3px 7px; /* IE6 */
}
/**
* alignement à droite d'un buttonGE1
**/
.buttons button.buttonGE1 {
	left: -25px;
	float: right;
}


.button {
	background-color: #F3F7F9;
	border: 1px solid #64A0B4;
	border-top: 1px solid #eee;
	border-left: 1px solid #eee;
	font-family: Arial, Verdana, sans-serif;
	font-size: 100%;
	line-height: 130%;
	font-weight: bold;
	color: #0C6A89;
	cursor: pointer;
	padding: 2px 10px 4px 7px; /* haut droite bas gauche */
	vertical-align: middle;
}

.button:active {
	border: 1px solid #64A0B4;
	border-bottom: 1px solid #eee;
	border-right: 1px solid #eee;
}

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

button[type].buttonGE1 {
	padding: 5px 10px 5px 7px; /* Firefox */
	line-height: 17px; /* Safari */
}

*:first-child+html button[type].buttonGE1 {
	padding: 4px 10px 3px 7px; /* IE7 */
}

button:active.buttonGE1,.buttons a:hover {
	background-color: #F3F7F9;
	border: 1px solid #0C6A89;
	border-bottom: 1px solid #eee;
	border-right: 1px solid #eee;
	color: #0C6A89;
}

button[disabled]:active.buttonGE1,button[disabled].buttonGE1 {
	background-color: #D8D8D8;
	color: #989898;
	cursor: default;
	border: medium none;
}

.buttons button.buttonGE1 img,.buttons a img {
	margin: 0px !important;
	padding: 0px;
	border: none;
	width: 16px;
	height: 16px;
}

div.pageHelpBody div p,div.pageHelpBody p {
	margin-top: 0px;
	margin-bottom: 0px;
}


.dottedText {
	border-bottom: 1px dotted;
}


/*  watermarks et placeholders   */
/** --------------------------  **/
.watermark {
	color: gray;
}

.watermark_container {
	font-weight: normal;
	font-style: italic;
}

 
::-webkit-input-placeholder { 
  color: gray;
  font-weight: normal;
  font-style: italic;
  transition: opacity 250ms ease-in-out;
}
:focus::-webkit-input-placeholder {
  opacity: 0.5;
}

:-ms-input-placeholder { 
  color: gray;
  font-weight: normal;
  font-style: italic;
  transition: opacity 250ms ease-in-out;
}
:focus:-ms-input-placeholder {
  opacity: 0.5;
}

::-moz-placeholder { /* Firefox 19+ */
color: gray;
  font-weight: normal;
  font-style: italic;
  opacity: 1;
  transition: opacity 250ms ease-in-out;
}
:focus::-moz-placeholder {
  opacity: 0.5;
}

:-moz-placeholder {  /* Firefox 18- */
  color: gray;
  font-weight: normal;
  font-style: italic;
  opacity: 1;
  transition: opacity 250ms ease-in-out;
}
:focus:-moz-placeholder {
  opacity: 0.5;
}


/** -- bandeau contexte mandat -- **/
/**    -----------------------    **/

/* div bandeau contexte mandat */
div#bandeau_contexte {
	border-width: 1px;
	border-style: solid;
	border-color: #0C6A89;
	color: white;
	font-weight:bold;
	background: #64A0B4;
	padding: 3px;
	height: 22px;
	box-shadow: 2px 4px 6px #AAA;
	margin-top: 12px;
	margin-bottom: 12px;
	vertical-align: middle;
}

/* div affichage bouton changer dans bandeau contexte mandat */
div#changerContribuable {
	float: right;
	line-height: 22px; /* Pour centrer verticalement le texte, on renseigne une hauteur. */
}

div#changerContribuable span {
	line-height: 22px; /* Pour centrer verticalement le texte, on renseigne une hauteur. */
}

/* ligne dotted entre les 2 boutons du mandat */
#changerContribuable_bouton_changer{
    border-radius: 2px 0 0 2px;
    border-right: dotted 1px #C0C2C4;
}

#changerContribuable_bouton_loupe{
	border-radius : 0 2px 2px 0;
}
/* petit bouton close sur la popup de recherche du mandat */
#changerContribuable_bouton_close{
    vertical-align: top!important;
    margin-left: 1.5em;
    font-size: 0.80em;
    color: #f8f8ff;
    cursor: pointer;
}


/* div affichage du nom dans bandeau contexte mandat */
div#contribuableSelectionne {
	float: left;
	line-height: 22px;      /* Pour centrer verticalement le texte, on renseigne une hauteur. */	
	overflow: hidden;		/* Les 4 props clipent la div (nom) pour laisser la place à la div changerContribuable (bouton changer) */
	text-overflow: ellipsis;    
    white-space: nowrap;
    width: 80%;  
}
/* div affichage du nom dans bandeau contexte mandat en l'absence bouton changer*/
div#bandeau_contexte > div#contribuableSelectionne:only-child{
	width: 100%;  /** pas de bouton changer, la div peut occuper 100% de la largeur */
}

/* formulaire poppup de changement de contexte*/
#popup_contexte_mandat {
	position:absolute;
	right:0px;
	margin-top: -5px;	
    background: #64a0b4 none repeat scroll 0 0;
    box-shadow: 2px 4px 6px #aaa;
    color: white;    
    padding: 0.3em;	
	z-index:30;
	display:none;
}
/* champ de saisie de la recherche du contexte*/
#popup_contexte_mandat #contexte_mandat_input{
	min-width:30em;
	vertical-align: bottom;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


/* aligne le contenu de la barre popup */
#popup_contexte_mandat  > * {
	vertical-align:middle;
}

/*  Dropdown list d'autocompletion (jquery-ui)*/ 

#popup_contexte_mandat_ui .ui-autocomplete {
    border-radius: 1px;
	max-height: 33%; 
	overflow-y: auto; 
	overflow-x: hidden;	
	box-shadow: 2px 4px 6px #aaa;
}

#popup_contexte_mandat_ui{
	/*display:table;*/
}

#popup_contexte_mandat_ui  .ui-autocomplete  .ui-menu-item {
    color: black;
    border: 1px solid #DDD;
	font-weight:normal;
	text-align: right;	
	display:inline-table;
	width:100%;
}

#popup_contexte_mandat_ui  .ui-autocomplete  .ui-menu-item  .colIcon{
	display: table-cell;
	margin-top: 3px;
	width:5%;
}

#popup_contexte_mandat_ui  .ui-autocomplete  .ui-menu-item  .colNumDpi{
	display: table-cell;
    text-align: center;
	width:10%;
}
#popup_contexte_mandat_ui  .ui-autocomplete  .ui-menu-item  .colNomDpi{
	display: table-cell;
    text-align: left;
    vertical-align: top;
	padding-left: 0.25em;
    word-wrap: break-word;
	width:65%;
}

#popup_contexte_mandat_ui  .ui-autocomplete  .ui-menu-item  .colTypeDpi{
	display: table-cell;
    vertical-align: top;    
	font-style:italic;
	padding-left: 0.25em;
	padding-right: 1em;
	width:20%;
}


#popup_contexte_mandat_ui  .ui-autocomplete  .ui-menu-item  .colNumRef{
	display: table-cell;
    width: 15%;
    text-align: center;
}
#popup_contexte_mandat_ui  .ui-autocomplete  .ui-menu-item  .colNomPersonne{
	display: table-cell;
    text-align: left;
    vertical-align: top;
    width: 75%;
	padding-left: 0.25em;
}


#popup_contexte_mandat_ui  .ui-menu-item:nth-child(odd) {
    background-color: #f3f7f9;
}

#popup_contexte_mandat_ui  .ui-menu-item:nth-child(even) {
    background-color: #dfeaef;
}

#popup_contexte_mandat_ui .ui-autocomplete .ui-state-focus, 
#popup_contexte_mandat_ui .ui-autocomplete .ui-state-active {
    color: black;
	background-color: #9ebece;
    border-radius: 2px;
    border: 1px dotted #808080;
}

#popup_contexte_mandat_ui .ui-autocomplete .icon-pp{
	background-image : url('../../../images/Ico16_CreerNouvellePersonne.jpg') !important;
	background-repeat: no-repeat;  
	background-position: left top; 
	padding-left: 18px !important;
}
#popup_contexte_mandat_ui .ui-autocomplete .icon-pm{
	background-image : url('../../../images/Ico16_Societe.jpg');
	background-repeat: no-repeat;  
	background-position: left top; 
	padding-left: 18px !important;
}



/**  fin bandeau contexte    **/       
/** ------------------------ **/
/** ------------------------ **/


.pageHelpBox {
	BORDER: #a4ccd8 1px solid;
	PADDING: 1px;
	height: auto;
	margin-left: 5px;
}

.formElmt {
	TEXT-ALIGN: left;
	PADDING: 5px;
	MARGIN: 5px 0px;
	LINE-HEIGHT: 1.7em;
	border: 1px none red;
}

.lvl1_col2_1 {
	width: 360px;
	display: block;
	float: left;
	vertical-align: top;
	border: 1px none green;
	text-align: right;
	margin-right: 8px;
}

.lbl {
	FONT-WEIGHT: normal;
}

.required {
	COLOR: red
}

.lvl1_col2_2 {
	width: 230px;
	display: block;
	float: left;
	border: 1px none green;
	white-space:nowrap;
}

.navButton {
	FONT-WEIGHT: bold;
	BACKGROUND: none transparent scroll repeat 0% 0%;
	CURSOR: pointer;
	COLOR: #4799b1;
	BORDER-STYLE: none ! important;
}

#nav-form {
	clear: both;
	text-align: center;
}

#buttonNewDemande {
	float: right;
	margin-bottom: 10px;
	margin-right: 4px;
}

#buttonNewDemande a, #buttonNewDemande a:link, #buttonNewDemande a:hover, #buttonNewDemande a:visited {
	text-decoration: none;
}


/* classes des montants numériques formatés (cf fonction bindMontantsFormates) */
.montantFormateInput{
text-align: right;
}
.montantFormateInputErreur{
text-align: right;
border-color: red red red red;
}

.textFormateInputErreur{
border-color: red red red red;
}


/* classe pour l'affichage des erreurs de saisies en regard des champs */
.localErrorField {
color:red;
}

/* indicateur de champ obligatoire  (même couleur que class body) */
.requiredIndicator {
color: color: rgb(102, 102, 102);
}

/* indicateur de champ obligatoire lorsqu'il est erreur */
.localErrorField .requiredIndicator {
color: red;
font-weight: bold;
}

/* pour l'affichage des erreurs spring sous forme de liste */
.springErrorsList{
  display: list-item;
  list-style-position:inside;
  color: red;
  font-weight: normal;
  list-style-type:square;
  list-style-image: url("../../../images/puce.gif");
  margin: 0.5em 0 0.5em 2em;
  padding: 0;
}


/* En ajoutant cette classe dans une div, la div suivante reprend le flux CSS normal : retour à la ligne */
.clearDiv:before, .clearDiv:after { content: ""; display: table; }
.clearDiv:after { clear: both; }
.clearDiv { zoom: 1; }



/* bordure "glowing" des champs d'édition  text et select */
.glowkit input[type=text], .glowkit input[type=radio], .glowkit textarea , .glowkit select {
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
}

.glowkit input[type=text], .glowkit textarea {
  padding: 3px 0px 3px 3px;
  margin: 0px 1px 3px 0px;
  border: 1px solid #DDDDDD; /* note : active aussi sur firefox le fond gris des cpts disabled!? */
}

.glowkit select {
  padding: 1px 0px 1px 0px;
  border: 1px solid #DDDDDD;
}
 
.glowkit input[type=text]:focus, .glowkit textarea:focus, .glowkit select:focus  {
  box-shadow: 0 0 5px #9CC2CF;
  border: 1px solid #9CC2CF;
}

.glowkit select:-moz-focusring { /* off du liseret des select*/
  color: transparent;
  text-shadow: 0 0 0 #000;
  -moz-transition: none;
}

/* disabledinput : classe d'affichage pour le rendu visuel de champs de saisie désactivés */
.disabledinput {
font-style:italic;
}

form select:disabled.disabledinput, form input[type="text"]:disabled.disabledinput {
background:#E0E0E0;
border-color: #E0E0E0;
}