.sel-cel {border-color:#CB4335;color:#FFFFFF;border-width:2px; border-style:dotted ;box-sizing: border-box;}

.abs-val {
    position:relative;
    display:inline-block;
}

.abs-val:before {
						top:0;
						Left:-2px;
						Right:-2px;
						bottom:0;
						z-Index: -1;
						transform: skewX(-20deg);
}


/*   le cadre qui entour la cellule qui est en déplacement et sans validation */
.cadre-dep {
	border-color:#F1C40F !important ; border-width:3px !important; border-style:solid !important ;
}

/*   le cadre qui entour la cellule provisoir qui est en déplacement et sans validation */
.cadre-provisoir {
	border-color:#ff6cff !important ; border-width:3px !important; border-style:solid !important ;
}

/*   le cadre qui entour la cellule qui va être déplacer  */
.cadre-sel {
	border-color:#000000 !important ; border-width:3px !important; border-style:solid !important ;
}

/* ----------------------------------------------*/
/* effet rotation 01  */
/* ----------------------------------------------*/
/*
.dropeffet {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.dropeffet:hover {
  -webkit-transform: rotate(-15deg);
  transform: rotate(-15deg);
}
*/

/* ----------------------------------------------*/
/* effet Morph */
/* ----------------------------------------------*/

.dropeffet {
  width: 200px;
  height: 150px;
  -webkit-filter: grayscale(0) blur(0px);
  filter: grayscale(0) blur(0px);
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
 
.dropeffet:hover {
  width: 150px; /* on affiche l'image au carré */
  height: 150px;
  -webkit-transform: rotate(360deg); /* rotation de l'image */
  transform: rotate(360deg);
}


/* ----------------------------------------------*/
/* Halo lumineux */
/* ----------------------------------------------*/
/*
.dropeffet {
	position: relative;
}
.dropeffet::before {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	display: block;
	content: '';
	width: 0;
	height: 0;
	background: rgba(255,255,255,.2);
	border-radius: 100%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	opacity: 0;
}
.dropeffet:hover::before {
	-webkit-animation: circle .75s;
	animation: circle .75s;
}
@-webkit-keyframes circle {
	0% {
		opacity: 1;
	}
	40% {
		opacity: 1;
	}
	100% {
		width: 200%;
		height: 200%;
		opacity: 0;
	}
}
@keyframes circle {
	0% {
		opacity: 1;
	}
	40% {
		opacity: 1;
	}
	100% {
		width: 200%;
		height: 200%;
		opacity: 0;
	}
}
*/


/* ----------------------------------------------*/
/*  reloocker les tables Extjs  */
/* ----------------------------------------------*/

.x-panel-header-default {

background-color: #2980B9 !important;
background-image: none !important;

}


.x-panel-header-title-default {

color:#FFFFFF !important; 
/*plann !important;*/
font-weight: 400 !important;
line-height: 20px !important;
/*text-align:center !important;*/

}

.x-column-header {

color:#FFFFFF !important; 
background-color: #2980B9 !important;
/*font-size: 18px !important;
font-weight: 400 !important;
line-height: 20px !important;*/
text-align:center !important;

}


/* ----------------------------------------------*/
/*  reloocker les tables format planning */
/* ----------------------------------------------*/

.tableplanning .x-column-header {

color:#FFFFFF !important; 
background-color: #E67E22 !important;
font-size: 11px !important;
font-weight: bold !important;
font-weight: 400 !important;
line-height: 200% !important;
text-align:center !important;

}


.x-grid-cell-inner {
font-size: 11px !important;
}