/*
 * Feuille de style externe permettant de definir des styles css utiles pour l'ensemble des pages de l'application
 */

.a_titre1
{
    display: none !important;
}

/* Permet de cacher un élément */
.cacherElement
{
    display: none !important;
}

/* Permet de réaliser un alignement horizontal de plusieurs éléments */
.alignementHorizontal
{
    display:inline-block;
	vertical-align:middle; 
	*display:inline;		/* Pour IE7 et versions inférieures */
	*zoom: 1;               /* Pour IE7 et versions inférieures */     
}

/* Permet de centrer un conteneur et d'autoriser un centrage des éléments fils */
.centrerConteneurEtCentrerFils
{
    margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	margin-top: 10px; 
	text-align:center;
}

/**********************************************************************************************
 * STYLE CSS pour gérer le calque pour freezer une page (si besoin)
    Exemple : lors d'un traitement ajax par exemple
 **********************************************************************************************/
/*Position */
#idCalqueFreezePage {    
    height: 100%;
    left: 0;    
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
    /*opacity: 0.1; */
}
	
/*Couleur du calque lors d'un freeze */
.calqueFreezePage {
	/*background-color: #021333; /*Bleu ciel*/
	/*background-color: #FFFFFF; /*Blanc*/
}

/* Gestion de la zone de saisie des sliders (de tous les écrans) */
.inputBubbleSlider {
    background-color: #FFFFFF;
    border: 1px solid #ABABAB !important;
    border-radius: 3px 3px 3px 3px;
    margin-bottom: 16px !important;
    margin-top: -4px !important;
	padding: 3px !important;
    color: black;
    text-align: center;
    width: 55px;
}

.parentBubleContent {
    z-index: 1 !important;
}

/* Style du bouton de validation du montant saisie au clavier lié à un slider */
.boutonValidationSaisieClavierSlider {
    cursor: pointer;
    position: absolute;
}

/* Style du bouton de validation du montant saisie lors du passage de la souris sur l'élément */
.boutonValidationSaisieClavierSlider:hover {
    opacity: 0.8;
}

/**********************************************************************************************
 * STYLE CSS pour gérer les styles des formulaires (sous forme de lightbox)
 **********************************************************************************************/
.conteneurLightBox {
    margin-left: 16px;
    text-align: left;
}

.styleIntituleChampFormulaire {
    text-align: right;
    width: 61px;
}

.styleChampFormulaire {
    width: 175px !important;
}

.ChampFormulaireErreur {
    border: 1px double red;
}


.styleBtnValiderFormulaire {
    margin-right: 20px;
}

.ligneFormulaire {
    margin-bottom: 10px;
}

/************************************************
 * STYLE CSS pour gérer les styles des pastilles
 ************************************************/
 
 /*Style de la pastille*/
 .pastilleInformation {
    border-color: white;        /*Couleur de la bordure de la pastille */

    font-size: 11px;            /* Taille du texte dans la pastille */
    font-weight: bold;       

    border-style: solid;
    border-width: 2px;
             
    display: inline-block;
    position: absolute;  
    text-align: center;

    height: 20px;
    width: 22px;

    margin-left: -1px;
    margin-top: -17px;   
    margin-top: -22px\9;  /* IE8 */ 
    *margin-top: -22px;   /* IE7 */

    z-index:1;

    /*CSS3*/
    border-radius: 13px;
    -moz-border-radius: 13px;      
    -webkit-border-radius: 13px;      
    -moz-border-radius: 2px 3px rgba(19, 44, 47, 0.5);
    -webkit-box-shadow: 2px 3px rgba(19, 44, 47, 0.5);     
    box-shadow: 2px 3px rgba(19, 44, 47, 0.5);
}


 /*Style de la pastille*/
 .pastilleInformation:hover {
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
	
	-o-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
}


/*Position de la valeur dans la pastille*/
.valeurPastille {
    margin-top: 3px;
}

/********************************************************************
 * STYLE CSS pour gérer le bouton de pliage et de dépliage de zones
 ********************************************************************/
.btnActionPliageDepliage
{
    height: 48px;
    margin-left: 3px;
    margin-top: -36px;
    position: absolute;
    width: 17px;
    z-index: 99;
}

.iconeBtnPlusDepliage {
    background: url("../img/utile/img-btn-plus-green-white-16px.png") no-repeat scroll left bottom transparent;
    cursor: pointer;
}

.iconeBtnMoinsPliage {
    background: url("../img/utile/img-btn-moins-red-white-16px.png") no-repeat scroll left bottom transparent;
    cursor: pointer;
}

/********************************************************************
 * STYLE CSS pour gérer le styles des inputs des bulles des sliders
 ********************************************************************/
.contentInputBubleSlider
{
    margin-bottom: 0px !important;
    width: 55px !important;
    text-align: right;

    /*FTS*/
    border:none !important;
    /*FTS*/
}

/********************************************************************
 * STYLE CSS pour gérer le style des tooltips (informations survolées) de manière personnalisée
 ********************************************************************/
 /*Etat par défaut d'un élément qui détient un tooltip*/
.hastip {
    position: relative;
    text-decoration: none;
    z-index: 9;
}

/*Style au survol d'un élément qui détient un tooltip*/
.hastip:hover{
    cursor: pointer;
}

/*Permet de ne pas afficher le tooltip au survol du tooltip lui-même */
.tip:hover
{
    display:none\9; /*IE7*/
    *display:none;  /*IE8*/
}

/*Style de l'information à survoler pour afficher le tooltip */
.text_on_tip
{
    background-color: black; 
    border-radius: 5px 5px 5px 5px;
    color: white;
    display: inline-block;
    font-size: 15px;
    font-weight: 700;
    height: 20px;
    line-height: 19px;
    margin-top: -3px;
    position: absolute;
    text-align: center;
    width: 17px;  
    *z-index: 999 !important;  /*Force le contenu du tooltip au 1er plan pour IE7*/
}

/*Gestion des couleurs des tooltips*/
.tip_color {
    background-color: #000000; 
}

/*Permet de définir la position du tooltip*/
.tip_position
{
	display: none;
    /*Gère la position et le placement du tooltip*/
    position: absolute;
    /*Positionne par défaut le tooltip sur la droite de l'élément survolé sur le plan xy*/
    left: 27px; 
    top: -2px;
    /*Postionne le tooltip sur le plan z*/
    z-index: 9 !important; /*Pour les navigateurs différents de IE7 et IE8*/   
    z-index: 901\9 !important;  /*Pour IE8*/
    *z-index: 901 !important;  /*Pour IE7*/
}

/* Affiche l'information survolée au centre-gauche de la page */
.tip_position_top_left {
    left: -323px !important;
    top: -27px !important;
}

/*Permet de cacher la flèche de l'information survolée */
.arrow_tip_hidden:before {
    border-color: transparent transparent transparent transparent !important;
}

/*Etat par défaut du tooltip */
.tip {
    /*Fait disparaitre le tooltip grâce à l'opacité (état par défaut) */
    opacity: 0;                   /* Gestion de l'opacité pour tous les navigateurs compatibles sauf IE */
    filter: alpha(opacity='0');   /* Gestion de l'opacité pour IE seulement */
    /*Espacement extérieur*/
    padding: 6px 9px 6px 9px;
    /*Hauteur et largeur*/
    width: 300px;
    height: auto;
    /*Positionnement en hauteur à l'intérieur du tooltip*/
    line-height: 17px;
    /*Taille du texte*/
    font-size: 11px;
    /*Style du texte*/
    font-weight: bold;
    text-align: left;
    /*Couleur du texte du tooltip*/
    color: #FFFFFF;
    /*Affiche l'ensemble du texte dans le tooltip (pour une seule ligne utiliser nowrap) */
    white-space: normal;
    /*Gère la couleur et la taille de la bordure*/
    border: 1px solid #8F8F8F;
    /*Gère l'arrondi de la bordure*/
    -webkit-border-radius:    6px;
    -moz-border-radius:    6px;
    -o-border-radius:    6px;
    border-radius:        6px;
    /*Ajoute un dégradé de couleur
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,.27)), to(rgba(0,0,0,0)), color-stop(0.3, rgba(0,0,0,.27)));
    background-image: -webkit-linear-gradient(top, rgba(0,0,0,.10) 30%, rgba(0,0,0,0));
    background-image: -moz-linear-gradient(top, rgba(0,0,0,.10) 30%, rgba(0,0,0,0));
    background-image: -o-linear-gradient(top, rgba(0,0,0,.10) 30%, rgba(0,0,0,0));
    background-image: linear-gradient(top, rgba(0,0,0,.10) 30%, rgba(0,0,0,0));*/
    /*Ajoute de l'ombre sur le tooltip en CSS3*/
    -webkit-box-shadow:    inset 0 1px 1px rgba(255,255,255,.7), 0 4px 7px #191919;
    -moz-box-shadow:    inset 0 1px 1px rgba(255,255,255,.7), 0 4px 7px #191919;
    -o-box-shadow:        inset 0 1px 1px rgba(255,255,255,.7), 0 4px 7px #191919;
    box-shadow:        inset 0 1px 1px rgba(255,255,255,.7), 0 4px 7px #191919;
    /*Fait disparaitre le tooltip en réduisant sa taille au minimum en CSS3*/
    -webkit-transform:    scale(0);
    -moz-transform:        scale(0);
    -o-transform:        scale(0);
    transform:        scale(0);
    /*Gère la transition de disparition en CSS3*/
    -webkit-transition:    opacity .3s ease-in-out,top .3s ease-in-out,-webkit-transform 0s linear .4s;
    -moz-transition:    opacity .3s ease-in-out,top .3s ease-in-out,-moz-transform 0s linear .4s;
    -o-transition:        opacity .3s ease-in-out,top .3s ease-in-out,-o-transform 0s linear .4s;
    transition:        opacity .3s ease-in-out,top .3s ease-in-out,transform 0s linear .4s;
}



/*Lorsque qu'un élément qui a un tooltip est survolé ou actif */
.hastip:hover .tip, .hastip:active .tip {
	display: inline-block;
    /*Fait apparaitre le tooltip grâce à l'opacité*/
    opacity: 1;                                                      /* Gestion de l'opacité pour tous les navigateurs compatibles sauf IE */
    filter: alpha(opacity='100');                                  /* Gestion de l'opacité pour IE seulement */
    /*Positionne le tooltip sur le plan xy*/
    top: -2px;
    left: 27px; /* Si la pointe est à gauche du tooltip dirigée vers la gauche */
    /*Positionne le tooltip en profondeur sur l'axe z*/
    z-index: 40;
    /*Fait apparaitre le tooltip en agrandissant sa taille jusqu'à sa taille réelle en CSS3*/
    -webkit-transform:    scale(1);
    -moz-transform:        scale(1);
    -o-transform:        scale(1);
    transform:            scale(1);
    /*Gère la transition d'apparition en CSS3*/
    -webkit-transition:    opacity .3s ease-in-out, top .3s ease-in-out;
    -moz-transition:    opacity .3s ease-in-out, top .3s ease-in-out;
    -o-transition:        opacity .3s ease-in-out, top .3s ease-in-out;
    transition:            opacity .3s ease-in-out, top .3s ease-in-out;
}

/*Mise en place de la pointe et de la bordure sous le tooltip*/
.tip:before, .tip:after {
    content: '';
    display: block;
    position: absolute;
    left: 109px; /* Si la pointe est à gauche du tooltip dirigée vers la gauche */
    width: 0;
    height: 0;
}

/*Création de la bordure proche de la pointe*/
.tip:before {
    border-style: solid;
    border-width: 10px;
    /* Si la pointe est à gauche du tooltip dirigée vers la gauche */
    top: 8px;
    margin-left: -130px;
}


/********************************************************************
 * STYLE CSS pour gérer la mise en avant ou la mise en retrait de zone
Exemple d'utilisation : survol d'une zone pour la mettre en avant par rapport à une autre zone
 ********************************************************************/
 
 /*Permet de mettre en avant une zone en modifiant son opacité*/
 .miseEnAvantVisuel
 {
     opacity: 1.0 !important;                /*Tous les navigateurs sauf IE*/
     /*filter: alpha(opacity='100') !important;/*IE toutes versions */
     /*background-color :#FFFFFF; */             /*Permet de régler le problème du lissage du texte sous IE*/
 }
 
 /*Permet de mettre en retrait une zone en modifiant son opacité*/
 .miseEnRetraitVisuel
 {
     opacity: 0.4 !important;                /*Tous les navigateurs sauf IE*/
     /*filter: alpha(opacity='40')!important;  /*IE toutes versions*/
     /*background-color :#FFFFFF;*/              /*Permet de régler le problème du lissage du texte sous IE*/
 }
 
 
 /*
 * Feuille de style externe permettant de definir le style CSS du composant personnalisé "BasDePage"
 */
 
/**********************************************************************************************
 * STYLE CSS du conteneur des notes de bas de page
 **********************************************************************************************/
.zoneConteneurNoteBasDePage 
{
    /*background-image: url("../img/bas_de_page/background_note_bas_de_page.png");
    background-repeat: repeat; 
    min-height: 35px;
    width: 100%;*/    
    margin-bottom:10px;
    margin-top: 15px;
}

.conteneurLogoEtTitreNoteBasDePage 
{
    margin-left: 10px;
    margin-right: 20px;
    padding-top: 0px;
}

.conteneurLogoNoteBasDePage 
{
    float: left;
    height: 12px;
    margin-left: 0px;
    margin-top: 0px;
    width: 13px;
}

.logoNoteBasDePage 
{
    background-color: transparent;
    background-image: url("../img/bas_de_page/logo_note_bas_de_page.png");
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
}

.titreNoteBasDePage {
    color: rgb(160,160,160);
    font-size: 1em !important;
    font-style: italic;
    font-weight: normal;
    margin-left: 0px;
}




/*
 * Feuille de style externe permettant de definir des styles css pour gérer l'en-tête d'une page
 */
 
.conteneurHautTitrePrincipalApplication
{
    background-image: url("../img/en_tete/background_zone_titre_principal_application_centre.png");
    background-repeat: repeat-x;
    height: 51px;
    width: 100%;
}

/*Arrière-plan gauche du titre de l'application */
.backgroundTitrePrincipalApplicationGauche {
    background-image: url("../img/en_tete/background_zone_titre_principal_application_gauche.png");
    background-position: left 9px;
    background-repeat: no-repeat;
    float: left;
    height: 100%;

    margin-top: -9px;

    width: 247px;
}

/*Arrière-plan central du titre de l'application */
.backgroundTitrePrincipalApplicationCentre {
   
}

/*Arrière-plan droit du titre de l'application */
.backgroundTitrePrincipalApplicationDroite {
    background-image: url("../img/en_tete/background_zone_titre_principal_application_droite.png");
    background-position: left 9px;
    background-repeat: no-repeat;
    float: right;
    height: 100%;
    margin-top: -9px;
    max-width: 247px;
    min-width: 180px
}

/* Permet de définir le style de d'arrière-plan dégradé en dessous du titre de l'application */
.backgroundSousTitreApplication
{
    background-image: url("../img/background/background_degrade_sous_titre_accueil.png"); 
    background-repeat:repeat-x; 
    height:17px;        
    margin-top: -9px;    
    *margin-top:-11px;   /* Pour IE7 et versions inférieures */
    width:100%;
}


.tipInfoDetenu {
    width: 200px;
}