/********************************************************************************************************************/
/*            ICONES                                                                                                */
/********************************************************************************************************************/
.preview, .delete, .edit, .croixrouge, .cocheverte
{
  height : 16px;
  vertical-align : middle;
  display : inline-block;
  width : 16px;
}

.preview { background : url(/StructurePortail/promodis/images/gestion/preview-16.png) 0 50% no-repeat; }
.delete { background : url(/StructurePortail/promodis/images/gestion/poubelle-16.png) 0 50% no-repeat; }
.edit { background : url(/StructurePortail/promodis/images/gestion/crayon-16.png) 0 50% no-repeat; }
.croixrouge { background : url(/StructurePortail/promodis/images/gestion/croix-rouge-16.png) 0 50% no-repeat; }
.cocheverte { background : url(/StructurePortail/promodis/images/gestion/coche-verte-16.png) 0 50% no-repeat; }


/********************************************************************************************************************/
/*            BOUTONS                                                                                                */
/********************************************************************************************************************/

.buttonLink
{
  background : #A2A2A2 none no-repeat 5px 50%;
  border: 1px solid #959595;
  border-radius : 3px;
  color: #FFFFFF;
  cursor: pointer;
  font-size: 0.9em;
  height: 25px;
  line-height: 25px;
  padding: 0 10px 0 26px;
  text-transform: uppercase;
  vertical-align: middle;
  display : inline-block;
  margin-left : 10px;
  position: relative;
}

.buttonLinkSmall
{
  background : #C2C2C2 none no-repeat 5px 50%;
  color: #FFFFFF;
  font-size: 0.8em;
  height: 20px;
  line-height: 20px;
}

.buttonLink:hover
{
  color: #EEEEEE;
}
.buttonLink:hover::before
{
  content: '';  
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
  background-color: rgba(255,255,255,0.4);
}

.processingButton{background-image : url(/StructurePortail/promodis/images/gestion/ajax-loader-minibar.png) !important; }
.addButton {background-image : url(/StructurePortail/promodis/images/gestion/ajouter-16.png) !important; }
.deleteButton {background-image : url(/StructurePortail/promodis/images/gestion/supprimer-16.png) !important; }
.codeButton {background-image : url(/StructurePortail/promodis/images/gestion/page-white-code-16.png) !important; }
.editImageButton { background-image : url(/StructurePortail/promodis/images/gestion/picture-edit-16.png) !important; } 
.editButton { background-image : url(/StructurePortail/promodis/images/gestion/crayon-16.png) !important; } 
.previewButton { background-image : url(/StructurePortail/promodis/images/gestion/preview-16.png) !important; }
.croixrougeButton { background-image : url(/StructurePortail/promodis/images/gestion/croix-rouge-16.png) !important; }
.cocheverteButton { background-image : url(/StructurePortail/promodis/images/gestion/coche-verte-16.png) !important; }
.enveloppeflecheButton { background-image : url(/StructurePortail/promodis/images/gestion/enveloppe-fleche-16.png) !important; }
.selectallButton { background-image : url(/StructurePortail/promodis/images/gestion/select-all-16.gif) !important; }
.unselectallButton { background-image : url(/StructurePortail/promodis/images/gestion/unselect-all-16.gif) !important; }
/**************************************************************************************************************************/

.pageslist
{
 margin : 0 auto;
 text-align : center;
 line-height : 26px;
 border-collapse : collapse;
}
.pageslist td {
  border-bottom : 1px dotted #808080;
}


.visibilityButton
{
  border : 0px;
  height : 24px;
  width : 24px;
  background : url(/StructurePortail/promodis/images/gestion/croix-rouge-16.png) no-repeat 50% 50%;
}

.visibilityButton:hover {
    background-color: #FBE3E4;
    border: 1px solid #FBC2C4;
}

.visibilityButton.checked
{
   color: #529214;
  background-color: #F5F5F5;
  background : url(/StructurePortail/promodis/images/gestion/coche-verte-16.png) no-repeat 50% 50%;
}
.visibilityButton.checked:hover {
    background-color: #E6EFC2;
    border-color : #C6D880;
}
.visibilityButton.waiting
{
   color: #202020;
  background-color: #c0c0c0;
  background-image : url(/StructurePortail/promodis/images/gestion/ajax-loader-minibar.gif) no-repeat 50% 50%;
}

.btnCancel
{
  background-color: red;
  border: 0 none;
  color: #FFFFFF;
  cursor: pointer;
  font-size: 0.9em;
  height: 27px;
  line-height: 27px;
  padding: 0 10px;
  text-transform: uppercase;
  vertical-align: middle;
  display : inline-block;
  margin-left : 10px;
}

.btnCancel:hover {
  color: #FFFFFF;
  background-color: #FF5050;
}

.btnSettings
{
  background : #A2A2A2 url(/StructurePortail/promodis/images/gestion/engrenage-crayon-16.png) no-repeat 5px 50%;
  border: 0 none;
  color: #FFFFFF;
  cursor: pointer;
  font-size: 0.9em;
  height: 27px;
  line-height: 27px;
  padding: 0 10px 0 26px;
  text-transform: uppercase;
  vertical-align: middle;
  display : inline-block;
  margin-left : 10px;
}
.btnSettings:hover
{
  color: #EEEEEE;
}



/**********************************************************************************************************************/
/*                                 NAVIGATION                                                                         */
/**********************************************************************************************************************/
.buttonAddNavigationItem { background-image : url(/StructurePortail/promodis/images/gestion/menu_item_add-16.png);}

.buttonDeleteNavigationItem { background-image : url(/StructurePortail/promodis/images/gestion/menu_item_delete-16.png);}

.buttonPreviewPage { background-image : url(/StructurePortail/promodis/images/gestion/preview-16.png); }


#tree { float : left; max-width : 340px; }  
#tree a { white-space:normal !important; height: auto; padding:1px 2px; }
#tree li > ins { vertical-align:top; }
#tree .jstree-hovered, #tree .jstree-clicked { border:0; }
.jstree-default.jstree-focused  
{
  background: -moz-linear-gradient(center top , #FFFFFF 30%, #E6E6E6 100%) repeat scroll 0 0 transparent !important;
  border: 1px solid #B8B8B8;
  border-radius: 7px 7px 7px 7px;
  box-shadow: 1px 3px 3px 0 #B8B8B8;
  display: inline-block;
  margin-bottom: 3px; 
  padding : 10px 0 10px 0;
}

#itemEditor { float : right; max-width : 400px; }
 
/**********************************************************************************************************************/
/*                                 FORMULAIRES                                                                        */
/**********************************************************************************************************************/
   

.formRazorHelper { padding : 10px 0px 0px 10px; }

/* FormRazorHelper : editor-label   */
.formRazorHelper .editor-label
{
  float : left; clear : left; padding-bottom : 5px; width : 100px;
}
/*#navigationEditor .formRazorHelper .editor-label { width : 100px;}*/
#promoEditor .formRazorHelper .editor-label { width : 200px;}
/*#itemEditor .formRazorHelper .editor-label { width : 100px; }*/
#devisMaterielEditor .formRazorHelper .editor-label { width : 200px; }
#formReference .formRazorHelper .editor-label { width : 80px;}

/* FormRazorHelper : editor-field */
.formRazorHelper .editor-field { /*float : left;*/ padding-bottom : 8px !important; display : inline; width : 250px;}
#navigationEditor .formRazorHelper .editor-field { width : 550px; }
#promoEditor .formRazorHelper .editor-field { width : 450px; }
#itemEditor .formRazorHelper .editor-field  { width : 250px; }
#devisMaterielEditor .formRazorHelper .editor-field  { width : 250px; }
#formReference .formRazorHelper .editor-field { width : 60px;}

#navigationEditor form { width : 98%;}

/*#navigationEditor form input[type="submit"], 
#itemEditor form input[type="submit"],
#promoEditor form input[type="submit"]  */


#navigationEditor form input[type="radio"], 
#itemEditor form input[type="radio"] ,
#promoEditor form input[type="radio"] 
{ margin-right : 10px;}

#navigationEditor form .editor-field input,
#promoEditor form .editor-field input
{ min-width : 450px; }

#itemEditor form .editor-field input { min-width : 240px; max-width : 240px;}
#promoEditor form .editor-field input { min-width : 240px; max-width : 240px;}
#formReference form .editor-field input { min-width : 80px; max-width : 80px;}

#navigationEditor form .editor-field select { min-width : 450px; max-width : 450px;}
#itemEditor form .editor-field select { min-width : 240px; max-width : 240px;}

.formRazorHelper .editor-label-right { float : left; padding-bottom : 5px; width : 250px; display : inline; }
.formRazorHelper .editor-field-left { float : left; clear : left; padding-bottom : 5px; width : 23px; display : inline; }
.formRazorHelper div.editor-label-right label { font-weight: bold; }


/**********************************************************************************************************************/
/*                                       DATATABLE                                                                    */
/**********************************************************************************************************************/
table.dataTable tr.odd { background-color: #EAEAEA !important; }
table.dataTable tr.even { background-color: white !important; }
table.dataTable tr:hover 
{
  background-color: #FFDDDD !important; 
}

table.dataTable tr
{
  -moz-transition : background-color 0.4s ease;
  -o-transition : background-color 0.4s ease;
  -webkit-transition : background-color 0.4s ease;
  transition : background-color 0.4s ease;
}

table.dataTable tr td.sorting_1 { background-color: rgba(205,205,205,0.3) !important; }


/**********************************************************************************************************************/
/*                                       CMP                                                                          */
/**********************************************************************************************************************/

ul.dynatree-container a:hover {
    background-color: #F2A3AC !important;
    border-color: #E2001A !important;
}

#form-categorie label, #form-categorie input { display:block; }
#form-categorie input.text { margin-bottom:12px; width:95%; padding: .4em; }
#form-categorie select 
{
  display: inline-block;
  margin-bottom: 12px;
  margin-right: 12px;
  height: 25px;
}
#form-categorie option { padding-right: 1em;}
#form-categorie fieldset { padding:0; border:0; margin-top:10px; }

#form-sscategorie label, #form-sscategorie input, #form-update-sscategorie label, #form-update-sscategorie input { display:block; }
#form-sscategorie input.text, #form-update-sscategorie input.text { margin-bottom:12px; width:95%; padding: .4em; }
#form-sscategorie select, #form-update-sscategorie select 
{
  display: inline-block;
  margin-bottom: 12px;
  margin-right: 12px;
  height: 25px;
}
#form-sscategorie option, #form-update-sscategorie option { padding-right: 1em;}
#form-sscategorie fieldset, #form-update-sscategorie fieldset { padding:0; border:0; margin-top:10px; }

.ui-autocomplete {
	max-height: 100px;
	overflow-y: auto;
	/* prevent horizontal scrollbar */
	overflow-x: hidden;
	/* add padding to account for vertical scrollbar */
	padding-right: 20px;
}

#treeCMP {margin-top: 15px; position: relative;}

ul.dynatree-container span.td {
  position: absolute;
  display: inline;
  border-size: 1px;
  overflow: hidden;
}
ul.dynatree-container span.td:nth-child(1) {
  position: static;
}
ul.dynatree-container span.td:nth-child(2) {
  color: blue;
  left: 350px;
}

#accordion
{
    margin-bottom: 20px;
}

.attention
{
  background: url("/StructurePortail/promodis/images/attention.png") no-repeat scroll 10px 1em transparent !important;
}

.attention > *
{
  padding-left: 65px;
}

/**********************************************************************************************************************/
/*                                       Marques                                                                      */
/**********************************************************************************************************************/

#tabMarques img.logo
{
  position: relative;
  margin-left: 50%;
  left: -40px;
}

#tabMarques span
{
  text-align: center;
  display: block; 
}

#tabMarques img.photoMatos
{
  position: relative;
  margin-left: 50%;
  left: -75px;
}

.admin
{
  border: 2px dashed #b8b8b8;
  border-radius: 5px;
  box-shadow: none;
  margin: -1px;
}

.admin img
{
  margin-top: 50%;
}

#formCatalogueCMP label, #formCatalogueCMP input { display:block; }
#formCatalogueCMP input.text { margin-bottom:12px; width:95%; padding: .4em; }
#formCatalogueCMP select 
{
  display: inline-block;
  margin-bottom: 12px;
  margin-right: 12px;
  height: 25px;
}
#formCatalogueCMP option { padding-right: 1em;}
#formCatalogueCMP fieldset { padding:0; border:0; margin-top:10px; }

#ListeCatalogueMateriels a.edit
{
  background: url('/StructurePortail/promodis/images/files_edit_32.png') no-repeat;
  display: block;
  position: absolute;
  height: 32px;
  width: 32px;
  top: -15px;
  left: -5px;
}

#ListeCatalogueMateriels a.delete
{
  background: url('/StructurePortail/promodis/images/remove_32.png') no-repeat;
  display: block;
  position: absolute;
  height: 32px;
  width: 32px;
  top: -15px;
  right: -10px;
}

/************************************************************************************************************
    FORMULAIRES DE CREATION ET EDITION DE PROMOTIONS
*************************************************************************************************************/

#FormCreatePromo .editor-label { width : 200px; }
#FormCreatePromo .editor-field { width : 500px; }
#FormCreatePromo input[type="text"], #FormCreatePromo select, #FormCreatePromo textarea,
#FormEditPromo input[type="text"], #FormEditPromo select, #FormEditPromo textarea
{ min-width : 350px;}

/**************************************************************************************************************
    SUIVI DES TRAITEMENTS DE MESSAGES
***************************************************************************************************************/
/*
#suivimessages td.group {
  background-color : #92C31B;
  color : #FFF;
}
#suivimessages td.group a:hover{
  color : #FFF;
}
#suivimessages td.group span.raisonSociale {
  font-weight : bold;
}
#suivimessages td.group span.emails {
  float : right;
}*/


.suiviMessageSocietaire span.raisonSociale {
  font-weight : bold;
}
.suiviMessageSocietaire span.mail {
  float : right;
}

.suiviMessageSocietaire header {
  background-color : #92C31B;
  color : #FFF;
  text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
  line-height : 27px;
  padding-left:  1em;
}
.suiviMessageSocietaire header a {
  color : #FFF;
}
.suiviMessageSocietaire header a:hover {
  color : #EEE;
}
.suiviMessageSocietaire header a.rouge {
  color : Red;
}

.suiviMessageSocietaire ul {
  list-style-type : none;
  padding-left : 0;
  margin-left : 2em;
  margin-top : 0.5em;
  width : 780px;
}

.suiviMessageSocietaire ul li span {
  display : inline-block;
}
.suiviMessageSocietaire .objet {
  width : 500px;
}
.suiviMessageSocietaire .envoi {
  width : 130px;
}
.suiviMessageSocietaire .envoi:before {
  content : "transmis le";
  font-size : 0.9em;
  color : #CCC;
  font-style : italic;
  display : block;
}
.suiviMessageSocietaire .rappel{
  width : 130px;
}
.suiviMessageSocietaire .rappel:before {
  content : "rappel envoyé le";
  font-size : 0.9em;
  color : #CCC;
  font-style : italic;
  display : block;
}
.suiviMessageSocietaire .buttonLink {
  float : right;
}
.suiviMessageSocietaire header input[type="checkbox"] {
  vertical-align : middle;
  margin-right : 10px;
}
#formSuiviMessages label {
  font-weight : bold;
  margin-right : 10px;
  margin-left : 10px;
}
#formSuiviMessages input[type="text"] {
  width : 80px;
}
#formSuiviMessages input[type="submit"] {
  margin-left : 20px;
}

#formMessageReseau {
  width : 750px;
}

#formMessageReseau .editor-field {
  width : 600px;
}

#formMessageReseau input[type="text"],
#formMessageReseau textarea {
  width : 600px;
}

#formMessageReseau textarea {
  height : 400px;
}