/* Portlet P1 */
.profilfoed {
	font: 13px/23px "Roboto", Arial, sans-serif;
	color: #303336;
	padding: 0 0;
}
.profilport {
	margin: 0 auto;
	height: 280px;
	background: white;
	border-radius: 3px;
	position: relative;
}
.informationfca {
	text-align: center;
	height:125px;
}

.photoTalentDiv{
	height:125px;
}

.fondhaut {
	height: 80px;
	background-color: #3bafda;
}
.tetetalent {
	background: url("") no-repeat;
	height: 122px;
	width: 122px;
	border-radius: 50%;
	top: 100px;
	left: 100px;
	background-size: cover;
	margin: -82px auto 15px;
	display: block;
	background-size: cover;
	animation-name: bounceIn;
	animation-duration: .75s;
	animation-duration: 1s;
	animation-fill-mode: both;
}


.nomcand {
	font-size: 22px;
	height:25px;
}
.jobcand {
	font-size: 16px;
	color: #8c98a8;
	height: 68px;
	
}
.statsfca {
	margin: auto;
	border-top: 1px solid #CED5E0;
	width: 100%;
}

.upperFirstBlockProfil{
	display:table-cell;

}

.upperSecondBlockProfil{
	display:table-cell;

}

.upperThirdBlockProfil{
	display:table-cell;
	width:100%;

}


.firstBlockProfil{
	border-right: 1px solid #CED5E0;
	padding-left:21px;
	padding-right:21px;
	padding-top:5px;
}
.secondBlockProfil{
	border-right: 1px solid #CED5E0;
	padding-left:10px;
	padding-right:10px;
	padding-top:5px;
}

.thirdBlockProfil{
	padding-top:5px;
	width:100%;
}

.statsfca .monprofil, .statsfca .dateprofil, .statsfca .stories {
	padding: 6px 10px 0;
}
.statsfca .monprofil, .statsfca .dateprofil {
	border-right: 1px solid #CED5E0;
}
.statsfca .value2fca {
	background: url("img/imgPortlet/eye.png") no-repeat;
	height: 24px;
	width: 24px;
	display: inline-block;
	vertical-align: middle;

}

.statsfca .monprofil2 {
	font-size: 14px;
	color: #8c98a8;
	white-space:nowrap;
	padding-left: 4px;
	padding-right: 4px;
}
.statsfca a:link, .monprofil2 a:link {
	font-size: 14px;
	color: #929ead;
}
.statsfca .value3 {
	background: url("img/imgPortlet/connexion.png") no-repeat;
	height: 24px;
	width: 24px;
	display: inline-block;
	vertical-align: middle;

}
.statsfca .value4 {
	background: url("img/imgPortlet/role.png") no-repeat;
	height: 24px;
	width: 24px;
	display: inline-block;
	vertical-align: middle;
}
/* fin Portlet P1 */

/* Portlet P2 */
.titrep2{
 	background: url(img/imgPortlet/bubble.png) no-repeat;
    background-position: 0px 126%;
    padding-top: 12px;
    background-repeat: no-repeat;
    padding-left: 32px;
    margin-bottom: 18px;
    width: 100%;
    margin-left: 10px;
    color: #3bafda;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.04em;    
    font-family: 'Roboto', sans-serif;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.fondp2{
 	    background-color: white;
}
/* .iconetitreblog {
 	
}
.iconetitreblog .portletTitre {
	background: url("../portlet/standard/img/bubble.png") no-repeat;
	background-position: 7px 150%;
	background-repeat: no-repeat;
	padding-left: 32px;
	margin-bottom: 18px;
	width: 100%;
	margin-top: 15px;
	
	margin-left: 10px;
	color: #3bafda ;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 16px;
	font-family: 'Roboto', sans-serif;
	-webkit-animation-name: bounceIn;
	animation-name: bounceIn;
	-webkit-animation-duration: .75s;
	animation-duration: .75s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
} */
@-webkit-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
 20% {
 -webkit-transform: scale3d(1.1, 1.1, 1.1);
 transform: scale3d(1.1, 1.1, 1.1);
}
 40% {
 -webkit-transform: scale3d(.9, .9, .9);
 transform: scale3d(.9, .9, .9);
}
 60% {
 opacity: 1;
 -webkit-transform: scale3d(1.03, 1.03, 1.03);
 transform: scale3d(1.03, 1.03, 1.03);
}
 80% {
 -webkit-transform: scale3d(.97, .97, .97);
 transform: scale3d(.97, .97, .97);
}
 100% {
 opacity: 1;
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
}
 @keyframes bounceIn {
 0%, 20%, 40%, 60%, 80%, 100% {
 -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
 0% {
 opacity: 0;
 -webkit-transform: scale3d(.3, .3, .3);
 transform: scale3d(.3, .3, .3);
}
 20% {
 -webkit-transform: scale3d(1.1, 1.1, 1.1);
 transform: scale3d(1.1, 1.1, 1.1);
}
 40% {
 -webkit-transform: scale3d(.9, .9, .9);
 transform: scale3d(.9, .9, .9);
}
 60% {
 opacity: 1;
 -webkit-transform: scale3d(1.03, 1.03, 1.03);
 transform: scale3d(1.03, 1.03, 1.03);
}
 80% {
 -webkit-transform: scale3d(.97, .97, .97);
 transform: scale3d(.97, .97, .97);
}
 100% {
 opacity: 1;
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
}
.timeline {
	line-height: 17px;
    list-style: none;
    margin: 0;
    height: 280px;
    background-color: white;
    padding-left: 13px;
    overflow: auto;
}
.timeline-item {
	padding-left: 0px;
	position: relative;
}
.timeline-content {
	padding-bottom: 10px;
	text-align: justify;
	line-height: 19px;
}
.timeline-titre {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	white-space: nowrap;
	color: #666666;
	font-family: 'Roboto', sans-serif;
}
.timeline-texte {
	color: #8c98a8;
	
	font-family: 'Roboto', sans-serif;
}
.buttonroundlire {
	background: #3bafda;
	margin-left: 8px;
	-webkit-border-radius: 50;
	-moz-border-radius: 50;
	border-radius: 50px;
	font-family: Roboto;
	color: #ffffff;
	font-size: 12px;
	padding: 2px 4px 2px 4px;
	text-decoration: none;
}
.buttonroundlire:hover {
	background: #3bafda;
}
/* Fin Portlet P2 */

/* Portlet compteur p3 */

.scnd-font-color {
	color: grey;
}
.titre_compteur {
	display: block_compteur;
	line-height: 60px;
	margin: 0;
	text-align: center;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}
.horizontal-list_compteur {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
	
.block_compteur {
	background: white;
	border-radius: 5px;
    width: 100%;
    text-align: -webkit-center;
    text-align: -moz-center;
    text-align:center;
    overflow: hidden;
}			
.bar1_compteur-percentages li {     
    color: white;
	width: 100%;	
	text-align: center;					
	background: white;
}
.bar1_compteur {
	margin: 0;
	padding: 10px 0 5px;
	font-size: 15px;		
}
.bar1_compteur.bar5_compteur {
	border-top: 4px solid #4fc4f6;
}
.bar1_compteur.bar4_compteur {
	border-top: 4px solid #4fc4f6;
}
.bar1_compteur.bar3_compteur {
	border-top: 4px solid #4fc4f6;
}
.bar1_compteur.bar2_compteur {
	border-top: 4px solid #4fc4f6;
}
.bar1_percentage_compteur {
	margin: 0;
	padding: 0 0 15px 0px;
	font-size: 25px;
	color: #3bafda ;
}
.donut-chart_compteur {
    position: relative;
    width: 172px;
    height: 172px;
    margin: 14px auto;
    border-radius: 100%;
 }
p.center-date_compteur {
  background: white;
  color: grey;
  position: absolute;
  text-align: center;
  font-size: 21px;
  top:0;left:0;bottom:0;right:0;
  width: 130px;
  height: 130px;
  margin: auto;
  border-radius: 50%;
  line-height: 79px;
  padding: 15% 0 0;
}
.center-date_compteur span.scnd-font-color {
 line-height: 1; 
}
.bar_cercle_compteur {
    border-radius: 50%;
    clip: rect(0px, 200px, 200px, 100px);
    height: 100%;
    position: absolute;
    width: 100%;
  }
.bar_rad_compteur {
    border-radius: 50%;
    clip: rect(0px, 100px, 200px, 0px);
    height: 100%;
    position: absolute;
    width: 100%;
    font-family: monospace;
    font-size: 1.5rem;
  }
#porcion1 {
    transform: rotate(0deg);
  }

#porcion1 .bar_rad_compteur {
    background-color: #4FC4F6;
    transform: rotate(76deg);
  }
#porcion2 {
    transform: rotate(76deg);
  }
#porcion2 .bar_rad_compteur {
    background-color: #4FC4F6;
    transform: rotate(140deg);
  }
#porcion3 {
    transform: rotate(215deg);
  }
#porcion3 .bar_rad_compteur {
    background-color: #4FC4F6;
    transform: rotate(113deg);
  }
#porcionFin {
    transform:rotate(-32deg);
  }
#porcionFin .bar_rad_compteur {
    background-color: #4FC4F6;
    transform: rotate(32deg);
  }
p.center-date_compteur2 {
    background: white;
    color: grey;
    position: absolute;
    text-align: center;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
        font-size: 16px;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 130px;
    height: 130px;
    margin: auto;
    border-radius: 50%;
    padding: 22% 0 0;
}

.scnd-font-color2 {
    color: #4FC4F6;
    font-size: 24px;
}



/* Add this attribute to the element that needs a tooltip */
[data-tooltip_compteur] {
  position: relative;
  z-index: 2;
  cursor: pointer;
}

/* Hide the tooltip content by default */
[data-tooltip_compteur]:before,
[data-tooltip_compteur]:after {
  visibility: hidden;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  pointer-events: none;
}

/* Position tooltip above the element */
[data-tooltip_compteur]:before {
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-bottom: 5px;
  margin-left: -80px;
  padding: 7px;
  width: 160px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #000;
  background-color: hsla(0, 0%, 20%, 0.9);
  color: #fff;
  content: attr(data-tooltip_compteur);
  text-align: center;
  font-size: 14px;
  line-height: 1.2;
}

/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip_compteur]:after {
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-left: -5px;
  width: 0;
  border-top: 5px solid #000;
  border-top: 5px solid hsla(0, 0%, 20%, 0.9);
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  content: " ";
  font-size: 0;
  line-height: 0;
  
}

/* Show tooltip content on hover */
[data-tooltip_compteur]:hover:before,
[data-tooltip_compteur]:hover:after {
  visibility: visible;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.profilport1 {
  margin: 0 auto;
  width: 100%;
  height: 270px;
  background: white;
  border-radius: 3px;
  position: relative;
	
}
.profilportcandidat {
  margin: 0 auto;
  width: 400px;
  height: 240px;
  background: white;
  border-radius: 3px;
  position: relative;
	
}
.information1 {
  text-align: center;
}
	.tetetalent32{
	background:url("") no-repeat ;
	height: 117px;
	width:117px;
	border-radius: 50%;
 margin: 0 auto;
  margin: -82px auto 15px;
  display: block;
	background-size: cover;
		 -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
	
}
.recrutement_candidat_tete{
	background:url(" img/imgPortlet/recrutement_icone.png") no-repeat ;
	height: 117px;
	width:117px;
	border-radius: 50%;
 margin: 0 auto;
  margin: -82px auto 15px;
  display: block;
	background-size: cover;
		 -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
	
}

.nomcand1 {
  font-size: 22px;
}

.jobcand1 {
  font-size: 16px;
  color: #8c98a8;
  margin-bottom: 24px;
}
.fondhaut1 {
height: 60px;
	
background-color: #3bafda;
}
.fondhautrecrutement {
height: 60px;
	
background-color: #F3921C;
}
.fondhautformation {
height: 60px;
	
background-color: #164479;
}
.stats1 {
  margin: auto;
  border-top: 1px solid #CED5E0;
  width: 100%;
  display: table;
  
}
.stats1 .monprofil1, .stats1 .dateprofil1, .stats1 .stories1 {
  display: inline-block;
  padding: 6px 10px 0;
}
.stats1 .monprofil1, .stats1 .dateprofil1 {
  border-right: 1px solid #CED5E0;
}
.stats1 .value1 {
  font-size: 18px;
  font-weight: 600;

}

.stats1 .value23 {
  background:url("img/imgPortlet/eye1.png") no-repeat ;
 height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.stats1 .value311 {
  background:url("img/imgPortlet/formation311.png") no-repeat ;
 height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}

.stats1 .value41 {
  background:url("img/imgPortlet/role1.png") no-repeat ;
 height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.stats1 .monprofil21 {
  display: block;
  font-size: 14px;
  color: #929ead !important;
}
.stats1 a:link, .monprofil21 a:link {
  display: block;
  font-size: 14px;
  color: #929ead !important;
}

 /* Portlet Coûts PREVUS, ENGAGES, REALISES par session  - fca3 - fca */

.portletprevengreafca {
    background: url(img/imgPortlet/euro_icone.png) no-repeat;
    height: 33px;
    width: 45px;
    display: inline-block;
    position: absolute;
    left: -15px;
    top: 122px;   
  }
  .portletprevengrea1fca {
    background: url(img/imgPortlet/euro_icone.png) no-repeat;
    height: 33px;
    width: 45px;
    display: inline-block;
    position: absolute;
    left: -15px;
    top: 75px;   
  }
   .portletprevengrea2fca {
    background: url(img/imgPortlet/euro_icone.png) no-repeat;
    height: 33px;
    width: 45px;
    display: inline-block;
    position: absolute;
    left: -15px;
    top: 210px;   
  }
  
  
  /*Pie couleur bleu portlet 11 -alerte_employabilite  - sql */
.pie {
  width: 0px;
  height: 0px;
  border: 40px solid  #e4e4e4;
  border-radius: 100%;
  position: relative;
  z-index: 0;
}

.pie:before {
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  border: 32px solid #FFFFFF;
  border-radius: 100%;
  position: absolute;
  top: -32px;
  left: -32px;
  z-index: 4;
}
.pie:after {
  display: block;
  content: attr(rel) "% ";
  font-size: 17px;
  position: absolute;
  height: 40px;
  left: -40px;
  line-height: 60px;
  text-align: center;
  top: -32px;
  width: 80px;
  z-index: 4;
}
.pie > section {
  border-left: 40px solid transparent;
  border-bottom: 40px solid transparent;
  content: '';
  width: 0px;
  height: 0px;
  border-radius: 100%;
  position: absolute;
  top: -41px;
  left: -40px;
  display: none;
  z-index: 1;
}
.pie .mask {
  border-top: 40px solid #e4e4e4;
  display: block;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  z-index: 2;
}
.pie .mask, .pie .one {
  border-right: 40px solid transparent;
}

.pie[rel="51"] .two, .pie[rel="52"] .two, .pie[rel="53"] .two, .pie[rel="54"] .two, .pie[rel="55"] .two, .pie[rel="56"] .two, .pie[rel="57"] .two, .pie[rel="58"] .two, .pie[rel="59"] .two, .pie[rel="60"] .two, .pie[rel="61"] .two, .pie[rel="62"] .two, .pie[rel="63"] .two, .pie[rel="64"] .two, .pie[rel="65"] .two, .pie[rel="66"] .two, .pie[rel="67"] .two, .pie[rel="68"] .two, .pie[rel="69"] .two, .pie[rel="70"] .two, .pie[rel="71"] .two, .pie[rel="72"] .two, .pie[rel="73"] .two, .pie[rel="74"] .two, .pie[rel="75"] .two, .pie[rel="76"] .two, .pie[rel="77"] .two, .pie[rel="78"] .two, .pie[rel="79"] .two, .pie[rel="80"] .two, .pie[rel="81"] .two, .pie[rel="82"] .two, .pie[rel="83"] .two, .pie[rel="84"] .two, .pie[rel="85"] .two, .pie[rel="86"] .two, .pie[rel="87"] .two, .pie[rel="88"] .two, .pie[rel="89"] .two, .pie[rel="90"] .two, .pie[rel="91"] .two, .pie[rel="92"] .two, .pie[rel="93"] .two, .pie[rel="94"] .two, .pie[rel="95"] .two, .pie[rel="96"] .two, .pie[rel="97"] .two, .pie[rel="98"] .two, .pie[rel="99"] .two, .pie[rel="100"] .two {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

.pie .one, .pie .two, .pie .three {
  border-top: 40px solid #164479;
}
.pie .two, .pie .three {
  border-top: 40px solid #164479;
  border-right: 40px solid #164479;
}
.pie .three {
  z-index: 3;
}
.pie[rel="1"] .one {
  display: block;
  transform: rotate(-41.4deg);
  -webkit-transform: rotate(-41.4deg);
}
.pie[rel="26"] .two {
  display: block;
  transform: rotate(-41.4deg);
  -webkit-transform: rotate(-41.4deg);
}
.pie[rel="2"] .one {
  display: block;
  transform: rotate(-37.8deg);
  -webkit-transform: rotate(-37.8deg);
}
.pie[rel="27"] .two {
  display: block;
  transform: rotate(-37.8deg);
  -webkit-transform: rotate(-37.8deg);
}
.pie[rel="3"] .one {
  display: block;
  transform: rotate(-34.2deg);
  -webkit-transform: rotate(-34.2deg);
}
.pie[rel="28"] .two {
  display: block;
  transform: rotate(-34.2deg);
  -webkit-transform: rotate(-34.2deg);
}
.pie[rel="4"] .one {
  display: block;
  transform: rotate(-30.6deg);
  -webkit-transform: rotate(-30.6deg);
}
.pie[rel="29"] .two {
  display: block;
  transform: rotate(-30.6deg);
  -webkit-transform: rotate(-30.6deg);
}
.pie[rel="5"] .one {
  display: block;
  transform: rotate(-27deg);
  -webkit-transform: rotate(-27deg);
}
.pie[rel="30"] .two {
  display: block;
  transform: rotate(-27deg);
  -webkit-transform: rotate(-27deg);
}
.pie[rel="6"] .one {
  display: block;
  transform: rotate(-23.4deg);
  -webkit-transform: rotate(-23.4deg);
}
.pie[rel="31"] .two {
  display: block;
  transform: rotate(-23.4deg);
  -webkit-transform: rotate(-23.4deg);
}
.pie[rel="7"] .one {
  display: block;
  transform: rotate(-19.8deg);
  -webkit-transform: rotate(-19.8deg);
}
.pie[rel="32"] .two {
  display: block;
  transform: rotate(-19.8deg);
  -webkit-transform: rotate(-19.8deg);
}
.pie[rel="8"] .one {
  display: block;
  transform: rotate(-16.2deg);
  -webkit-transform: rotate(-16.2deg);
}
.pie[rel="33"] .two {
  display: block;
  transform: rotate(-16.2deg);
  -webkit-transform: rotate(-16.2deg);
}
.pie[rel="9"] .one {
  display: block;
  transform: rotate(-12.6deg);
  -webkit-transform: rotate(-12.6deg);
}
.pie[rel="34"] .two {
  display: block;
  transform: rotate(-12.6deg);
  -webkit-transform: rotate(-12.6deg);
}
.pie[rel="10"] .one {
  display: block;
  transform: rotate(-9deg);
  -webkit-transform: rotate(-9deg);
}
.pie[rel="35"] .two {
  display: block;
  transform: rotate(-9deg);
  -webkit-transform: rotate(-9deg);
}
.pie[rel="11"] .one {
  display: block;
  transform: rotate(-5.4deg);
  -webkit-transform: rotate(-5.4deg);
}
.pie[rel="36"] .two {
  display: block;
  transform: rotate(-5.4deg);
  -webkit-transform: rotate(-5.4deg);
}
.pie[rel="12"] .one {
  display: block;
  transform: rotate(-1.8deg);
  -webkit-transform: rotate(-1.8deg);
}
.pie[rel="37"] .two {
  display: block;
  transform: rotate(-1.8deg);
  -webkit-transform: rotate(-1.8deg);
}
.pie[rel="13"] .one {
  display: block;
  transform: rotate(1.8deg);
  -webkit-transform: rotate(1.8deg);
}
.pie[rel="38"] .two {
  display: block;
  transform: rotate(1.8deg);
  -webkit-transform: rotate(1.8deg);
}
.pie[rel="14"] .one {
  display: block;
  transform: rotate(5.4deg);
  -webkit-transform: rotate(5.4deg);
}
.pie[rel="39"] .two {
  display: block;
  transform: rotate(5.4deg);
  -webkit-transform: rotate(5.4deg);
}
.pie[rel="15"] .one {
  display: block;
  transform: rotate(9deg);
  -webkit-transform: rotate(9deg);
}
.pie[rel="40"] .two {
  display: block;
  transform: rotate(9deg);
  -webkit-transform: rotate(9deg);
}
.pie[rel="16"] .one {
  display: block;
  transform: rotate(12.6deg);
  -webkit-transform: rotate(12.6deg);
}
.pie[rel="41"] .two {
  display: block;
  transform: rotate(12.6deg);
  -webkit-transform: rotate(12.6deg);
}
.pie[rel="17"] .one {
  display: block;
  transform: rotate(16.2deg);
  -webkit-transform: rotate(16.2deg);
}
.pie[rel="42"] .two {
  display: block;
  transform: rotate(16.2deg);
  -webkit-transform: rotate(16.2deg);
}
.pie[rel="18"] .one {
  display: block;
  transform: rotate(19.8deg);
  -webkit-transform: rotate(19.8deg);
}
.pie[rel="43"] .two {
  display: block;
  transform: rotate(19.8deg);
  -webkit-transform: rotate(19.8deg);
}
.pie[rel="19"] .one {
  display: block;
  transform: rotate(23.4deg);
  -webkit-transform: rotate(23.4deg);
}
.pie[rel="44"] .two {
  display: block;
  transform: rotate(23.4deg);
  -webkit-transform: rotate(23.4deg);
}
.pie[rel="20"] .one {
  display: block;
  transform: rotate(27deg);
  -webkit-transform: rotate(27deg);
}
.pie[rel="45"] .two {
  display: block;
  transform: rotate(27deg);
  -webkit-transform: rotate(27deg);
}
.pie[rel="21"] .one {
  display: block;
  transform: rotate(30.6deg);
  -webkit-transform: rotate(30.6deg);
}
.pie[rel="46"] .two {
  display: block;
  transform: rotate(30.6deg);
  -webkit-transform: rotate(30.6deg);
}
.pie[rel="22"] .one {
  display: block;
  transform: rotate(34.2deg);
  -webkit-transform: rotate(34.2deg);
}
.pie[rel="47"] .two {
  display: block;
  transform: rotate(34.2deg);
  -webkit-transform: rotate(34.2deg);
}
.pie[rel="23"] .one {
  display: block;
  transform: rotate(37.8deg);
  -webkit-transform: rotate(37.8deg);
}
.pie[rel="48"] .two {
  display: block;
  transform: rotate(37.8deg);
  -webkit-transform: rotate(37.8deg);
}
.pie[rel="24"] .one {
  display: block;
  transform: rotate(41.4deg);
  -webkit-transform: rotate(41.4deg);
}
.pie[rel="49"] .two {
  display: block;
  transform: rotate(41.4deg);
  -webkit-transform: rotate(41.4deg);
}
.pie[rel="25"] .one {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.pie[rel="50"] .two {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.pie[rel="51"] .three {
  display: block;
  transform: rotate(48.6deg);
  -webkit-transform: rotate(48.6deg);
}
.pie[rel="52"] .three {
  display: block;
  transform: rotate(52.2deg);
  -webkit-transform: rotate(52.2deg);
}
.pie[rel="53"] .three {
  display: block;
  transform: rotate(55.8deg);
  -webkit-transform: rotate(55.8deg);
}
.pie[rel="54"] .three {
  display: block;
  transform: rotate(59.4deg);
  -webkit-transform: rotate(59.4deg);
}
.pie[rel="55"] .three {
  display: block;
  transform: rotate(63deg);
  -webkit-transform: rotate(63deg);
}
.pie[rel="56"] .three {
  display: block;
  transform: rotate(66.6deg);
  -webkit-transform: rotate(66.6deg);
}
.pie[rel="57"] .three {
  display: block;
  transform: rotate(70.2deg);
  -webkit-transform: rotate(70.2deg);
}
.pie[rel="58"] .three {
  display: block;
  transform: rotate(73.8deg);
  -webkit-transform: rotate(73.8deg);
}
.pie[rel="59"] .three {
  display: block;
  transform: rotate(77.4deg);
  -webkit-transform: rotate(77.4deg);
}
.pie[rel="60"] .three {
  display: block;
  transform: rotate(81deg);
  -webkit-transform: rotate(81deg);
}
.pie[rel="61"] .three {
  display: block;
  transform: rotate(84.6deg);
  -webkit-transform: rotate(84.6deg);
}
.pie[rel="62"] .three {
  display: block;
  transform: rotate(88.2deg);
  -webkit-transform: rotate(88.2deg);
}
.pie[rel="63"] .three {
  display: block;
  transform: rotate(91.8deg);
  -webkit-transform: rotate(91.8deg);
}
.pie[rel="64"] .three {
  display: block;
  transform: rotate(95.4deg);
  -webkit-transform: rotate(95.4deg);
}
.pie[rel="65"] .three {
  display: block;
  transform: rotate(99deg);
  -webkit-transform: rotate(99deg);
}
.pie[rel="66"] .three {
  display: block;
  transform: rotate(102.6deg);
  -webkit-transform: rotate(102.6deg);
}
.pie[rel="67"] .three {
  display: block;
  transform: rotate(106.2deg);
  -webkit-transform: rotate(106.2deg);
}
.pie[rel="68"] .three {
  display: block;
  transform: rotate(109.8deg);
  -webkit-transform: rotate(109.8deg);
}
.pie[rel="69"] .three {
  display: block;
  transform: rotate(113.4deg);
  -webkit-transform: rotate(113.4deg);
}
.pie[rel="70"] .three {
  display: block;
  transform: rotate(117deg);
  -webkit-transform: rotate(117deg);
}
.pie[rel="71"] .three {
  display: block;
  transform: rotate(120.6deg);
  -webkit-transform: rotate(120.6deg);
}
.pie[rel="72"] .three {
  display: block;
  transform: rotate(124.2deg);
  -webkit-transform: rotate(124.2deg);
}
.pie[rel="73"] .three {
  display: block;
  transform: rotate(127.8deg);
  -webkit-transform: rotate(127.8deg);
}
.pie[rel="74"] .three {
  display: block;
  transform: rotate(131.4deg);
  -webkit-transform: rotate(131.4deg);
}
.pie[rel="75"] .three {
  display: block;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}
.pie[rel="76"] .three {
  display: block;
  transform: rotate(138.6deg);
  -webkit-transform: rotate(138.6deg);
}
.pie[rel="77"] .three {
  display: block;
  transform: rotate(142.2deg);
  -webkit-transform: rotate(142.2deg);
}
.pie[rel="78"] .three {
  display: block;
  transform: rotate(145.8deg);
  -webkit-transform: rotate(145.8deg);
}
.pie[rel="79"] .three {
  display: block;
  transform: rotate(149.4deg);
  -webkit-transform: rotate(149.4deg);
}
.pie[rel="80"] .three {
  display: block;
  transform: rotate(153deg);
  -webkit-transform: rotate(153deg);
}
.pie[rel="81"] .three {
  display: block;
  transform: rotate(156.6deg);
  -webkit-transform: rotate(156.6deg);
}
.pie[rel="82"] .three {
  display: block;
  transform: rotate(160.2deg);
  -webkit-transform: rotate(160.2deg);
}
.pie[rel="83"] .three {
  display: block;
  transform: rotate(163.8deg);
  -webkit-transform: rotate(163.8deg);
}
.pie[rel="84"] .three {
  display: block;
  transform: rotate(167.4deg);
  -webkit-transform: rotate(167.4deg);
}
.pie[rel="85"] .three {
  display: block;
  transform: rotate(171deg);
  -webkit-transform: rotate(171deg);
}
.pie[rel="86"] .three {
  display: block;
  transform: rotate(174.6deg);
  -webkit-transform: rotate(174.6deg);
}
.pie[rel="87"] .three {
  display: block;
  transform: rotate(178.2deg);
  -webkit-transform: rotate(178.2deg);
}
.pie[rel="88"] .three {
  display: block;
  transform: rotate(181.8deg);
  -webkit-transform: rotate(181.8deg);
}
.pie[rel="89"] .three {
  display: block;
  transform: rotate(185.4deg);
  -webkit-transform: rotate(185.4deg);
}
.pie[rel="90"] .three {
  display: block;
  transform: rotate(189deg);
  -webkit-transform: rotate(189deg);
}
.pie[rel="91"] .three {
  display: block;
  transform: rotate(192.6deg);
  -webkit-transform: rotate(192.6deg);
}
.pie[rel="92"] .three {
  display: block;
  transform: rotate(196.2deg);
  -webkit-transform: rotate(196.2deg);
}
.pie[rel="93"] .three {
  display: block;
  transform: rotate(199.8deg);
  -webkit-transform: rotate(199.8deg);
}
.pie[rel="94"] .three {
  display: block;
  transform: rotate(203.4deg);
  -webkit-transform: rotate(203.4deg);
}
.pie[rel="95"] .three {
  display: block;
  transform: rotate(207deg);
  -webkit-transform: rotate(207deg);
}
.pie[rel="96"] .three {
  display: block;
  transform: rotate(210.6deg);
  -webkit-transform: rotate(210.6deg);
}
.pie[rel="97"] .three {
  display: block;
  transform: rotate(214.2deg);
  -webkit-transform: rotate(214.2deg);
}
.pie[rel="98"] .three {
  display: block;
  transform: rotate(217.8deg);
  -webkit-transform: rotate(217.8deg);
}
.pie[rel="99"] .three {
  display: block;
  transform: rotate(221.4deg);
  -webkit-transform: rotate(221.4deg);
}
.pie[rel="100"] .three {
  display: block;
  transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
}
.pie .content {
  height: 160px;
  left: -80px;
  line-height: 160px;
  position: absolute;
  text-align: center;
  top: -80px;
  width: 160px;
  z-index: 4;
}
.pie .content span {
  display: inline-block;
  font-size: 1.2em;
  line-height: 1;
}
	/*Pie couleur vert*/
.pie {
  width: 0px;
  height: 0px;
  border: 40px solid  #e4e4e4;
  border-radius: 100%;
  position: relative;
  z-index: 0;
}

.pie:before {
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  border: 32px solid #FFFFFF;
  border-radius: 100%;
  position: absolute;
  top: -32px;
  left: -32px;
  z-index: 4;
}
.pie:after {
  display: block;
  content: attr(rel) "% ";
  font-size: 17px;
  position: absolute;
  height: 40px;
  left: -40px;
  line-height: 60px;
  text-align: center;
  top: -32px;
  width: 80px;
  z-index: 4;
}
.pie > section {
  border-left: 40px solid transparent;
  border-bottom: 40px solid transparent;
  content: '';
  width: 0px;
  height: 0px;
  border-radius: 100%;
  position: absolute;
  top: -41px;
  left: -40px;
  display: none;
  z-index: 1;
}
.pie .mask {
  border-top: 40px solid #e4e4e4;
  display: block;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  z-index: 2;
}
.pie .mask, .pie .onevert {
  border-right: 40px solid transparent;
}

.pie[rel="51"] .twovert, .pie[rel="52"] .twovert, .pie[rel="53"] .twovert, .pie[rel="54"] .twovert, .pie[rel="55"] .twovert, .pie[rel="56"] .twovert, .pie[rel="57"] .twovert, .pie[rel="58"] .twovert, .pie[rel="59"] .twovert, .pie[rel="60"] .twovert, .pie[rel="61"] .twovert, .pie[rel="62"] .twovert, .pie[rel="63"] .twovert, .pie[rel="64"] .twovert, .pie[rel="65"] .twovert, .pie[rel="66"] .twovert, .pie[rel="67"] .twovert, .pie[rel="68"] .twovert, .pie[rel="69"] .twovert, .pie[rel="70"] .twovert, .pie[rel="71"] .twovert, .pie[rel="72"] .twovert, .pie[rel="73"] .twovert, .pie[rel="74"] .twovert, .pie[rel="75"] .twovert, .pie[rel="76"] .twovert, .pie[rel="77"] .twovert, .pie[rel="78"] .twovert, .pie[rel="79"] .twovert, .pie[rel="80"] .twovert, .pie[rel="81"] .twovert, .pie[rel="82"] .twovert, .pie[rel="83"] .twovert, .pie[rel="84"] .twovert, .pie[rel="85"] .twovert, .pie[rel="86"] .twovert, .pie[rel="87"] .twovert, .pie[rel="88"] .twovert, .pie[rel="89"] .twovert, .pie[rel="90"] .twovert, .pie[rel="91"] .twovert, .pie[rel="92"] .twovert, .pie[rel="93"] .twovert, .pie[rel="94"] .twovert, .pie[rel="95"] .twovert, .pie[rel="96"] .twovert, .pie[rel="97"] .twovert, .pie[rel="98"] .twovert, .pie[rel="99"] .twovert, .pie[rel="100"] .twovert {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

.pie .onevert, .pie .twovert, .pie .threevert {
  border-top: 40px solid #16AAB6;
}
.pie .twovert, .pie .threevert {
  border-top: 40px solid #16AAB6;
  border-right: 40px solid #16AAB6;
}
.pie .threevert {
  z-index: 3;
}
.pie[rel="1"] .onevert {
  display: block;
  transform: rotate(-41.4deg);
  -webkit-transform: rotate(-41.4deg);
}
.pie[rel="26"] .twovert {
  display: block;
  transform: rotate(-41.4deg);
  -webkit-transform: rotate(-41.4deg);
}
.pie[rel="2"] .onevert {
  display: block;
  transform: rotate(-37.8deg);
  -webkit-transform: rotate(-37.8deg);
}
.pie[rel="27"] .twovert {
  display: block;
  transform: rotate(-37.8deg);
  -webkit-transform: rotate(-37.8deg);
}
.pie[rel="3"] .onevert {
  display: block;
  transform: rotate(-34.2deg);
  -webkit-transform: rotate(-34.2deg);
}
.pie[rel="28"] .twovert {
  display: block;
  transform: rotate(-34.2deg);
  -webkit-transform: rotate(-34.2deg);
}
.pie[rel="4"] .onevert {
  display: block;
  transform: rotate(-30.6deg);
  -webkit-transform: rotate(-30.6deg);
}
.pie[rel="29"] .twovert {
  display: block;
  transform: rotate(-30.6deg);
  -webkit-transform: rotate(-30.6deg);
}
.pie[rel="5"] .onevert {
  display: block;
  transform: rotate(-27deg);
  -webkit-transform: rotate(-27deg);
}
.pie[rel="30"] .twovert {
  display: block;
  transform: rotate(-27deg);
  -webkit-transform: rotate(-27deg);
}
.pie[rel="6"] .onevert {
  display: block;
  transform: rotate(-23.4deg);
  -webkit-transform: rotate(-23.4deg);
}
.pie[rel="31"] .twovert {
  display: block;
  transform: rotate(-23.4deg);
  -webkit-transform: rotate(-23.4deg);
}
.pie[rel="7"] .onevert {
  display: block;
  transform: rotate(-19.8deg);
  -webkit-transform: rotate(-19.8deg);
}
.pie[rel="32"] .twovert {
  display: block;
  transform: rotate(-19.8deg);
  -webkit-transform: rotate(-19.8deg);
}
.pie[rel="8"] .onevert {
  display: block;
  transform: rotate(-16.2deg);
  -webkit-transform: rotate(-16.2deg);
}
.pie[rel="33"] .twovert {
  display: block;
  transform: rotate(-16.2deg);
  -webkit-transform: rotate(-16.2deg);
}
.pie[rel="9"] .onevert {
  display: block;
  transform: rotate(-12.6deg);
  -webkit-transform: rotate(-12.6deg);
}
.pie[rel="34"] .twovert {
  display: block;
  transform: rotate(-12.6deg);
  -webkit-transform: rotate(-12.6deg);
}
.pie[rel="10"] .onevert {
  display: block;
  transform: rotate(-9deg);
  -webkit-transform: rotate(-9deg);
}
.pie[rel="35"] .twovert {
  display: block;
  transform: rotate(-9deg);
  -webkit-transform: rotate(-9deg);
}
.pie[rel="11"] .onevert {
  display: block;
  transform: rotate(-5.4deg);
  -webkit-transform: rotate(-5.4deg);
}
.pie[rel="36"] .twovert {
  display: block;
  transform: rotate(-5.4deg);
  -webkit-transform: rotate(-5.4deg);
}
.pie[rel="12"] .onevert {
  display: block;
  transform: rotate(-1.8deg);
  -webkit-transform: rotate(-1.8deg);
}
.pie[rel="37"] .twovert {
  display: block;
  transform: rotate(-1.8deg);
  -webkit-transform: rotate(-1.8deg);
}
.pie[rel="13"] .onevert {
  display: block;
  transform: rotate(1.8deg);
  -webkit-transform: rotate(1.8deg);
}
.pie[rel="38"] .twovert {
  display: block;
  transform: rotate(1.8deg);
  -webkit-transform: rotate(1.8deg);
}
.pie[rel="14"] .onevert {
  display: block;
  transform: rotate(5.4deg);
  -webkit-transform: rotate(5.4deg);
}
.pie[rel="39"] .twovert {
  display: block;
  transform: rotate(5.4deg);
  -webkit-transform: rotate(5.4deg);
}
.pie[rel="15"] .onevert {
  display: block;
  transform: rotate(9deg);
  -webkit-transform: rotate(9deg);
}
.pie[rel="40"] .twovert {
  display: block;
  transform: rotate(9deg);
  -webkit-transform: rotate(9deg);
}
.pie[rel="16"] .onevert {
  display: block;
  transform: rotate(12.6deg);
  -webkit-transform: rotate(12.6deg);
}
.pie[rel="41"] .twovert {
  display: block;
  transform: rotate(12.6deg);
  -webkit-transform: rotate(12.6deg);
}
.pie[rel="17"] .onevert {
  display: block;
  transform: rotate(16.2deg);
  -webkit-transform: rotate(16.2deg);
}
.pie[rel="42"] .twovert {
  display: block;
  transform: rotate(16.2deg);
  -webkit-transform: rotate(16.2deg);
}
.pie[rel="18"] .onevert {
  display: block;
  transform: rotate(19.8deg);
  -webkit-transform: rotate(19.8deg);
}
.pie[rel="43"] .twovert {
  display: block;
  transform: rotate(19.8deg);
  -webkit-transform: rotate(19.8deg);
}
.pie[rel="19"] .onevert {
  display: block;
  transform: rotate(23.4deg);
  -webkit-transform: rotate(23.4deg);
}
.pie[rel="44"] .twovert {
  display: block;
  transform: rotate(23.4deg);
  -webkit-transform: rotate(23.4deg);
}
.pie[rel="20"] .onevert {
  display: block;
  transform: rotate(27deg);
  -webkit-transform: rotate(27deg);
}
.pie[rel="45"] .twovert {
  display: block;
  transform: rotate(27deg);
  -webkit-transform: rotate(27deg);
}
.pie[rel="21"] .onevert {
  display: block;
  transform: rotate(30.6deg);
  -webkit-transform: rotate(30.6deg);
}
.pie[rel="46"] .twovert {
  display: block;
  transform: rotate(30.6deg);
  -webkit-transform: rotate(30.6deg);
}
.pie[rel="22"] .onevert {
  display: block;
  transform: rotate(34.2deg);
  -webkit-transform: rotate(34.2deg);
}
.pie[rel="47"] .twovert {
  display: block;
  transform: rotate(34.2deg);
  -webkit-transform: rotate(34.2deg);
}
.pie[rel="23"] .onevert {
  display: block;
  transform: rotate(37.8deg);
  -webkit-transform: rotate(37.8deg);
}
.pie[rel="48"] .twovert {
  display: block;
  transform: rotate(37.8deg);
  -webkit-transform: rotate(37.8deg);
}
.pie[rel="24"] .onevert {
  display: block;
  transform: rotate(41.4deg);
  -webkit-transform: rotate(41.4deg);
}
.pie[rel="49"] .twovert {
  display: block;
  transform: rotate(41.4deg);
  -webkit-transform: rotate(41.4deg);
}
.pie[rel="25"] .onevert {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.pie[rel="50"] .twovert {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.pie[rel="51"] .threevert {
  display: block;
  transform: rotate(48.6deg);
  -webkit-transform: rotate(48.6deg);
}
.pie[rel="52"] .threevert {
  display: block;
  transform: rotate(52.2deg);
  -webkit-transform: rotate(52.2deg);
}
.pie[rel="53"] .threevert {
  display: block;
  transform: rotate(55.8deg);
  -webkit-transform: rotate(55.8deg);
}
.pie[rel="54"] .threevert {
  display: block;
  transform: rotate(59.4deg);
  -webkit-transform: rotate(59.4deg);
}
.pie[rel="55"] .threevert {
  display: block;
  transform: rotate(63deg);
  -webkit-transform: rotate(63deg);
}
.pie[rel="56"] .threevert {
  display: block;
  transform: rotate(66.6deg);
  -webkit-transform: rotate(66.6deg);
}
.pie[rel="57"] .threevert {
  display: block;
  transform: rotate(70.2deg);
  -webkit-transform: rotate(70.2deg);
}
.pie[rel="58"] .threevert {
  display: block;
  transform: rotate(73.8deg);
  -webkit-transform: rotate(73.8deg);
}
.pie[rel="59"] .threevert {
  display: block;
  transform: rotate(77.4deg);
  -webkit-transform: rotate(77.4deg);
}
.pie[rel="60"] .threevert {
  display: block;
  transform: rotate(81deg);
  -webkit-transform: rotate(81deg);
}
.pie[rel="61"] .threevert {
  display: block;
  transform: rotate(84.6deg);
  -webkit-transform: rotate(84.6deg);
}
.pie[rel="62"] .threevert {
  display: block;
  transform: rotate(88.2deg);
  -webkit-transform: rotate(88.2deg);
}
.pie[rel="63"] .threevert {
  display: block;
  transform: rotate(91.8deg);
  -webkit-transform: rotate(91.8deg);
}
.pie[rel="64"] .threevert {
  display: block;
  transform: rotate(95.4deg);
  -webkit-transform: rotate(95.4deg);
}
.pie[rel="65"] .threevert {
  display: block;
  transform: rotate(99deg);
  -webkit-transform: rotate(99deg);
}
.pie[rel="66"] .threevert {
  display: block;
  transform: rotate(102.6deg);
  -webkit-transform: rotate(102.6deg);
}
.pie[rel="67"] .threevert {
  display: block;
  transform: rotate(106.2deg);
  -webkit-transform: rotate(106.2deg);
}
.pie[rel="68"] .threevert {
  display: block;
  transform: rotate(109.8deg);
  -webkit-transform: rotate(109.8deg);
}
.pie[rel="69"] .threevert {
  display: block;
  transform: rotate(113.4deg);
  -webkit-transform: rotate(113.4deg);
}
.pie[rel="70"] .threevert {
  display: block;
  transform: rotate(117deg);
  -webkit-transform: rotate(117deg);
}
.pie[rel="71"] .threevert {
  display: block;
  transform: rotate(120.6deg);
  -webkit-transform: rotate(120.6deg);
}
.pie[rel="72"] .threevert {
  display: block;
  transform: rotate(124.2deg);
  -webkit-transform: rotate(124.2deg);
}
.pie[rel="73"] .threevert {
  display: block;
  transform: rotate(127.8deg);
  -webkit-transform: rotate(127.8deg);
}
.pie[rel="74"] .threevert {
  display: block;
  transform: rotate(131.4deg);
  -webkit-transform: rotate(131.4deg);
}
.pie[rel="75"] .threevert {
  display: block;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}
.pie[rel="76"] .threevert {
  display: block;
  transform: rotate(138.6deg);
  -webkit-transform: rotate(138.6deg);
}
.pie[rel="77"] .threevert {
  display: block;
  transform: rotate(142.2deg);
  -webkit-transform: rotate(142.2deg);
}
.pie[rel="78"] .threevert {
  display: block;
  transform: rotate(145.8deg);
  -webkit-transform: rotate(145.8deg);
}
.pie[rel="79"] .threevert {
  display: block;
  transform: rotate(149.4deg);
  -webkit-transform: rotate(149.4deg);
}
.pie[rel="80"] .threevert {
  display: block;
  transform: rotate(153deg);
  -webkit-transform: rotate(153deg);
}
.pie[rel="81"] .threevert {
  display: block;
  transform: rotate(156.6deg);
  -webkit-transform: rotate(156.6deg);
}
.pie[rel="82"] .threevert {
  display: block;
  transform: rotate(160.2deg);
  -webkit-transform: rotate(160.2deg);
}
.pie[rel="83"] .threevert {
  display: block;
  transform: rotate(163.8deg);
  -webkit-transform: rotate(163.8deg);
}
.pie[rel="84"] .threevert {
  display: block;
  transform: rotate(167.4deg);
  -webkit-transform: rotate(167.4deg);
}
.pie[rel="85"] .threevert {
  display: block;
  transform: rotate(171deg);
  -webkit-transform: rotate(171deg);
}
.pie[rel="86"] .threevert {
  display: block;
  transform: rotate(174.6deg);
  -webkit-transform: rotate(174.6deg);
}
.pie[rel="87"] .threevert {
  display: block;
  transform: rotate(178.2deg);
  -webkit-transform: rotate(178.2deg);
}
.pie[rel="88"] .threevert {
  display: block;
  transform: rotate(181.8deg);
  -webkit-transform: rotate(181.8deg);
}
.pie[rel="89"] .threevert {
  display: block;
  transform: rotate(185.4deg);
  -webkit-transform: rotate(185.4deg);
}
.pie[rel="90"] .threevert {
  display: block;
  transform: rotate(189deg);
  -webkit-transform: rotate(189deg);
}
.pie[rel="91"] .threevert {
  display: block;
  transform: rotate(192.6deg);
  -webkit-transform: rotate(192.6deg);
}
.pie[rel="92"] .threevert {
  display: block;
  transform: rotate(196.2deg);
  -webkit-transform: rotate(196.2deg);
}
.pie[rel="93"] .threevert {
  display: block;
  transform: rotate(199.8deg);
  -webkit-transform: rotate(199.8deg);
}
.pie[rel="94"] .threevert {
  display: block;
  transform: rotate(203.4deg);
  -webkit-transform: rotate(203.4deg);
}
.pie[rel="95"] .threevert {
  display: block;
  transform: rotate(207deg);
  -webkit-transform: rotate(207deg);
}
.pie[rel="96"] .threevert {
  display: block;
  transform: rotate(210.6deg);
  -webkit-transform: rotate(210.6deg);
}
.pie[rel="97"] .threevert {
  display: block;
  transform: rotate(214.2deg);
  -webkit-transform: rotate(214.2deg);
}
.pie[rel="98"] .threevert {
  display: block;
  transform: rotate(217.8deg);
  -webkit-transform: rotate(217.8deg);
}
.pie[rel="99"] .threevert {
  display: block;
  transform: rotate(221.4deg);
  -webkit-transform: rotate(221.4deg);
}
.pie[rel="100"] .threevert {
  display: block;
  transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
}
.pie .content {
  height: 160px;
  left: -80px;
  line-height: 160px;
  position: absolute;
  text-align: center;
  top: -80px;
  width: 160px;
  z-index: 4;
}
.pie .content span {
  display: inline-block;
  font-size: 1.2em;
  line-height: 1;
}

/*Pie couleur rose*/
.pie {
  width: 0px;
  height: 0px;
  border: 40px solid  #e4e4e4;
  border-radius: 100%;
  position: relative;
  z-index: 0;
}

.pie:before {
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  border: 32px solid #FFFFFF;
  border-radius: 100%;
  position: absolute;
  top: -32px;
  left: -32px;
  z-index: 4;
}
.pie:after {
  display: block;
  content: attr(rel) "% ";
  font-size: 17px;
  position: absolute;
  height: 40px;
  left: -40px;
  line-height: 60px;
  text-align: center;
  top: -32px;
  width: 80px;
  z-index: 4;
}
.pie > section {
  border-left: 40px solid transparent;
  border-bottom: 40px solid transparent;
  content: '';
  width: 0px;
  height: 0px;
  border-radius: 100%;
  position: absolute;
  top: -41px;
  left: -40px;
  display: none;
  z-index: 1;
}

.pie .mask {
  border-top: 40px solid #e4e4e4;
  display: block;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  z-index: 2;
}
.pie .mask, .pie .onerose {
  border-right: 40px solid transparent;
}

.pie[rel="51"] .tworose, .pie[rel="52"] .tworose, .pie[rel="53"] .tworose, .pie[rel="54"] .tworose, .pie[rel="55"] .tworose, .pie[rel="56"] .tworose, .pie[rel="57"] .tworose, .pie[rel="58"] .tworose, .pie[rel="59"] .tworose, .pie[rel="60"] .tworose, .pie[rel="61"] .tworose, .pie[rel="62"] .tworose, .pie[rel="63"] .tworose, .pie[rel="64"] .tworose, .pie[rel="65"] .tworose, .pie[rel="66"] .tworose, .pie[rel="67"] .tworose, .pie[rel="68"] .tworose, .pie[rel="69"] .tworose, .pie[rel="70"] .tworose, .pie[rel="71"] .tworose, .pie[rel="72"] .tworose, .pie[rel="73"] .tworose, .pie[rel="74"] .tworose, .pie[rel="75"] .tworose, .pie[rel="76"] .tworose, .pie[rel="77"] .tworose, .pie[rel="78"] .tworose, .pie[rel="79"] .tworose, .pie[rel="80"] .tworose, .pie[rel="81"] .tworose, .pie[rel="82"] .tworose, .pie[rel="83"] .tworose, .pie[rel="84"] .tworose, .pie[rel="85"] .tworose, .pie[rel="86"] .tworose, .pie[rel="87"] .tworose, .pie[rel="88"] .tworose, .pie[rel="89"] .tworose, .pie[rel="90"] .tworose, .pie[rel="91"] .tworose, .pie[rel="92"] .tworose, .pie[rel="93"] .tworose, .pie[rel="94"] .tworose, .pie[rel="95"] .tworose, .pie[rel="96"] .tworose, .pie[rel="97"] .tworose, .pie[rel="98"] .tworose, .pie[rel="99"] .tworose, .pie[rel="100"] .tworose {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

.pie .onerose, .pie .tworose, .pie .threerose {
  border-top: 40px solid #164479;
}
.pie .tworose, .pie .threerose {
  border-top: 40px solid #164479;
  border-right: 40px solid #164479;
}
.pie .threerose {
  z-index: 3;
}
.pie[rel="1"] .onerose {
  display: block;
  transform: rotate(-41.4deg);
  -webkit-transform: rotate(-41.4deg);
}
.pie[rel="26"] .tworose {
  display: block;
  transform: rotate(-41.4deg);
  -webkit-transform: rotate(-41.4deg);
}
.pie[rel="2"] .onerose {
  display: block;
  transform: rotate(-37.8deg);
  -webkit-transform: rotate(-37.8deg);
}
.pie[rel="27"] .tworose {
  display: block;
  transform: rotate(-37.8deg);
  -webkit-transform: rotate(-37.8deg);
}
.pie[rel="3"] .onerose {
  display: block;
  transform: rotate(-34.2deg);
  -webkit-transform: rotate(-34.2deg);
}
.pie[rel="28"] .tworose {
  display: block;
  transform: rotate(-34.2deg);
  -webkit-transform: rotate(-34.2deg);
}
.pie[rel="4"] .onerose {
  display: block;
  transform: rotate(-30.6deg);
  -webkit-transform: rotate(-30.6deg);
}
.pie[rel="29"] .tworose {
  display: block;
  transform: rotate(-30.6deg);
  -webkit-transform: rotate(-30.6deg);
}
.pie[rel="5"] .onerose {
  display: block;
  transform: rotate(-27deg);
  -webkit-transform: rotate(-27deg);
}
.pie[rel="30"] .tworose {
  display: block;
  transform: rotate(-27deg);
  -webkit-transform: rotate(-27deg);
}
.pie[rel="6"] .onerose {
  display: block;
  transform: rotate(-23.4deg);
  -webkit-transform: rotate(-23.4deg);
}
.pie[rel="31"] .tworose {
  display: block;
  transform: rotate(-23.4deg);
  -webkit-transform: rotate(-23.4deg);
}
.pie[rel="7"] .onerose {
  display: block;
  transform: rotate(-19.8deg);
  -webkit-transform: rotate(-19.8deg);
}
.pie[rel="32"] .tworose {
  display: block;
  transform: rotate(-19.8deg);
  -webkit-transform: rotate(-19.8deg);
}
.pie[rel="8"] .onerose {
  display: block;
  transform: rotate(-16.2deg);
  -webkit-transform: rotate(-16.2deg);
}
.pie[rel="33"] .tworose {
  display: block;
  transform: rotate(-16.2deg);
  -webkit-transform: rotate(-16.2deg);
}
.pie[rel="9"] .onerose {
  display: block;
  transform: rotate(-12.6deg);
  -webkit-transform: rotate(-12.6deg);
}
.pie[rel="34"] .tworose {
  display: block;
  transform: rotate(-12.6deg);
  -webkit-transform: rotate(-12.6deg);
}
.pie[rel="10"] .onerose {
  display: block;
  transform: rotate(-9deg);
  -webkit-transform: rotate(-9deg);
}
.pie[rel="35"] .tworose {
  display: block;
  transform: rotate(-9deg);
  -webkit-transform: rotate(-9deg);
}
.pie[rel="11"] .onerose {
  display: block;
  transform: rotate(-5.4deg);
  -webkit-transform: rotate(-5.4deg);
}
.pie[rel="36"] .tworose {
  display: block;
  transform: rotate(-5.4deg);
  -webkit-transform: rotate(-5.4deg);
}
.pie[rel="12"] .onerose {
  display: block;
  transform: rotate(-1.8deg);
  -webkit-transform: rotate(-1.8deg);
}
.pie[rel="37"] .tworose {
  display: block;
  transform: rotate(-1.8deg);
  -webkit-transform: rotate(-1.8deg);
}
.pie[rel="13"] .onerose {
  display: block;
  transform: rotate(1.8deg);
  -webkit-transform: rotate(1.8deg);
}
.pie[rel="38"] .tworose {
  display: block;
  transform: rotate(1.8deg);
  -webkit-transform: rotate(1.8deg);
}
.pie[rel="14"] .onerose {
  display: block;
  transform: rotate(5.4deg);
  -webkit-transform: rotate(5.4deg);
}
.pie[rel="39"] .tworose {
  display: block;
  transform: rotate(5.4deg);
  -webkit-transform: rotate(5.4deg);
}
.pie[rel="15"] .onerose {
  display: block;
  transform: rotate(9deg);
  -webkit-transform: rotate(9deg);
}
.pie[rel="40"] .tworose {
  display: block;
  transform: rotate(9deg);
  -webkit-transform: rotate(9deg);
}
.pie[rel="16"] .onerose {
  display: block;
  transform: rotate(12.6deg);
  -webkit-transform: rotate(12.6deg);
}
.pie[rel="41"] .tworose {
  display: block;
  transform: rotate(12.6deg);
  -webkit-transform: rotate(12.6deg);
}
.pie[rel="17"] .onerose {
  display: block;
  transform: rotate(16.2deg);
  -webkit-transform: rotate(16.2deg);
}
.pie[rel="42"] .tworose {
  display: block;
  transform: rotate(16.2deg);
  -webkit-transform: rotate(16.2deg);
}
.pie[rel="18"] .onerose {
  display: block;
  transform: rotate(19.8deg);
  -webkit-transform: rotate(19.8deg);
}
.pie[rel="43"] .tworose {
  display: block;
  transform: rotate(19.8deg);
  -webkit-transform: rotate(19.8deg);
}
.pie[rel="19"] .onerose {
  display: block;
  transform: rotate(23.4deg);
  -webkit-transform: rotate(23.4deg);
}
.pie[rel="44"] .tworose {
  display: block;
  transform: rotate(23.4deg);
  -webkit-transform: rotate(23.4deg);
}
.pie[rel="20"] .onerose {
  display: block;
  transform: rotate(27deg);
  -webkit-transform: rotate(27deg);
}
.pie[rel="45"] .tworose {
  display: block;
  transform: rotate(27deg);
  -webkit-transform: rotate(27deg);
}
.pie[rel="21"] .onerose {
  display: block;
  transform: rotate(30.6deg);
  -webkit-transform: rotate(30.6deg);
}
.pie[rel="46"] .tworose {
  display: block;
  transform: rotate(30.6deg);
  -webkit-transform: rotate(30.6deg);
}
.pie[rel="22"] .onerose {
  display: block;
  transform: rotate(34.2deg);
  -webkit-transform: rotate(34.2deg);
}
.pie[rel="47"] .tworose {
  display: block;
  transform: rotate(34.2deg);
  -webkit-transform: rotate(34.2deg);
}
.pie[rel="23"] .onerose {
  display: block;
  transform: rotate(37.8deg);
  -webkit-transform: rotate(37.8deg);
}
.pie[rel="48"] .tworose {
  display: block;
  transform: rotate(37.8deg);
  -webkit-transform: rotate(37.8deg);
}
.pie[rel="24"] .onerose {
  display: block;
  transform: rotate(41.4deg);
  -webkit-transform: rotate(41.4deg);
}
.pie[rel="49"] .tworose {
  display: block;
  transform: rotate(41.4deg);
  -webkit-transform: rotate(41.4deg);
}
.pie[rel="25"] .onerose {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.pie[rel="50"] .tworose {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.pie[rel="51"] .threerose {
  display: block;
  transform: rotate(48.6deg);
  -webkit-transform: rotate(48.6deg);
}
.pie[rel="52"] .threerose {
  display: block;
  transform: rotate(52.2deg);
  -webkit-transform: rotate(52.2deg);
}
.pie[rel="53"] .threerose {
  display: block;
  transform: rotate(55.8deg);
  -webkit-transform: rotate(55.8deg);
}
.pie[rel="54"] .threerose {
  display: block;
  transform: rotate(59.4deg);
  -webkit-transform: rotate(59.4deg);
}
.pie[rel="55"] .threerose {
  display: block;
  transform: rotate(63deg);
  -webkit-transform: rotate(63deg);
}
.pie[rel="56"] .threerose {
  display: block;
  transform: rotate(66.6deg);
  -webkit-transform: rotate(66.6deg);
}
.pie[rel="57"] .threerose {
  display: block;
  transform: rotate(70.2deg);
  -webkit-transform: rotate(70.2deg);
}
.pie[rel="58"] .threerose {
  display: block;
  transform: rotate(73.8deg);
  -webkit-transform: rotate(73.8deg);
}
.pie[rel="59"] .threerose {
  display: block;
  transform: rotate(77.4deg);
  -webkit-transform: rotate(77.4deg);
}
.pie[rel="60"] .threerose {
  display: block;
  transform: rotate(81deg);
  -webkit-transform: rotate(81deg);
}
.pie[rel="61"] .threerose {
  display: block;
  transform: rotate(84.6deg);
  -webkit-transform: rotate(84.6deg);
}
.pie[rel="62"] .threerose {
  display: block;
  transform: rotate(88.2deg);
  -webkit-transform: rotate(88.2deg);
}
.pie[rel="63"] .threerose {
  display: block;
  transform: rotate(91.8deg);
  -webkit-transform: rotate(91.8deg);
}
.pie[rel="64"] .threerose {
  display: block;
  transform: rotate(95.4deg);
  -webkit-transform: rotate(95.4deg);
}
.pie[rel="65"] .threerose {
  display: block;
  transform: rotate(99deg);
  -webkit-transform: rotate(99deg);
}
.pie[rel="66"] .threerose {
  display: block;
  transform: rotate(102.6deg);
  -webkit-transform: rotate(102.6deg);
}
.pie[rel="67"] .threerose {
  display: block;
  transform: rotate(106.2deg);
  -webkit-transform: rotate(106.2deg);
}
.pie[rel="68"] .threerose {
  display: block;
  transform: rotate(109.8deg);
  -webkit-transform: rotate(109.8deg);
}
.pie[rel="69"] .threerose {
  display: block;
  transform: rotate(113.4deg);
  -webkit-transform: rotate(113.4deg);
}
.pie[rel="70"] .threerose {
  display: block;
  transform: rotate(117deg);
  -webkit-transform: rotate(117deg);
}
.pie[rel="71"] .threerose {
  display: block;
  transform: rotate(120.6deg);
  -webkit-transform: rotate(120.6deg);
}
.pie[rel="72"] .threerose {
  display: block;
  transform: rotate(124.2deg);
  -webkit-transform: rotate(124.2deg);
}
.pie[rel="73"] .threerose {
  display: block;
  transform: rotate(127.8deg);
  -webkit-transform: rotate(127.8deg);
}
.pie[rel="74"] .threerose {
  display: block;
  transform: rotate(131.4deg);
  -webkit-transform: rotate(131.4deg);
}
.pie[rel="75"] .threerose {
  display: block;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}
.pie[rel="76"] .threerose {
  display: block;
  transform: rotate(138.6deg);
  -webkit-transform: rotate(138.6deg);
}
.pie[rel="77"] .threerose {
  display: block;
  transform: rotate(142.2deg);
  -webkit-transform: rotate(142.2deg);
}
.pie[rel="78"] .threerose {
  display: block;
  transform: rotate(145.8deg);
  -webkit-transform: rotate(145.8deg);
}
.pie[rel="79"] .threerose {
  display: block;
  transform: rotate(149.4deg);
  -webkit-transform: rotate(149.4deg);
}
.pie[rel="80"] .threerose {
  display: block;
  transform: rotate(153deg);
  -webkit-transform: rotate(153deg);
}
.pie[rel="81"] .threerose {
  display: block;
  transform: rotate(156.6deg);
  -webkit-transform: rotate(156.6deg);
}
.pie[rel="82"] .threerose {
  display: block;
  transform: rotate(160.2deg);
  -webkit-transform: rotate(160.2deg);
}
.pie[rel="83"] .threerose {
  display: block;
  transform: rotate(163.8deg);
  -webkit-transform: rotate(163.8deg);
}
.pie[rel="84"] .threerose {
  display: block;
  transform: rotate(167.4deg);
  -webkit-transform: rotate(167.4deg);
}
.pie[rel="85"] .threerose {
  display: block;
  transform: rotate(171deg);
  -webkit-transform: rotate(171deg);
}
.pie[rel="86"] .threerose {
  display: block;
  transform: rotate(174.6deg);
  -webkit-transform: rotate(174.6deg);
}
.pie[rel="87"] .threerose {
  display: block;
  transform: rotate(178.2deg);
  -webkit-transform: rotate(178.2deg);
}
.pie[rel="88"] .threerose {
  display: block;
  transform: rotate(181.8deg);
  -webkit-transform: rotate(181.8deg);
}
.pie[rel="89"] .threerose {
  display: block;
  transform: rotate(185.4deg);
  -webkit-transform: rotate(185.4deg);
}
.pie[rel="90"] .threerose {
  display: block;
  transform: rotate(189deg);
  -webkit-transform: rotate(189deg);
}
.pie[rel="91"] .threerose {
  display: block;
  transform: rotate(192.6deg);
  -webkit-transform: rotate(192.6deg);
}
.pie[rel="92"] .threerose {
  display: block;
  transform: rotate(196.2deg);
  -webkit-transform: rotate(196.2deg);
}
.pie[rel="93"] .threerose {
  display: block;
  transform: rotate(199.8deg);
  -webkit-transform: rotate(199.8deg);
}
.pie[rel="94"] .threerose {
  display: block;
  transform: rotate(203.4deg);
  -webkit-transform: rotate(203.4deg);
}
.pie[rel="95"] .threerose {
  display: block;
  transform: rotate(207deg);
  -webkit-transform: rotate(207deg);
}
.pie[rel="96"] .threerose {
  display: block;
  transform: rotate(210.6deg);
  -webkit-transform: rotate(210.6deg);
}
.pie[rel="97"] .threerose {
  display: block;
  transform: rotate(214.2deg);
  -webkit-transform: rotate(214.2deg);
}
.pie[rel="98"] .threerose {
  display: block;
  transform: rotate(217.8deg);
  -webkit-transform: rotate(217.8deg);
}
.pie[rel="99"] .threerose {
  display: block;
  transform: rotate(221.4deg);
  -webkit-transform: rotate(221.4deg);
}
.pie[rel="100"] .threerose {
  display: block;
  transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
}
.pie .content {
  height: 160px;
  left: -80px;
  line-height: 160px;
  position: absolute;
  text-align: center;
  top: -80px;
  width: 160px;
  z-index: 4;
}
.pie .content span {
  display: inline-block;
  font-size: 1.2em;
  line-height: 1;
}
	/*Pie couleur marine*/
.pie {
  width: 0px;
  height: 0px;
  border: 40px solid  #e4e4e4;
  border-radius: 100%;
  position: relative;
  z-index: 0;
}

.pie:before {
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  border: 32px solid #FFFFFF;
  border-radius: 100%;
  position: absolute;
  top: -32px;
  left: -32px;
  z-index: 4;
}
.pie:after {
  display: block;
  content: attr(rel) "% ";
  font-size: 17px;
  position: absolute;
  height: 40px;
  left: -40px;
  line-height: 60px;
  text-align: center;
  top: -32px;
  width: 80px;
  z-index: 4;
}
.pie > section {
  border-left: 40px solid transparent;
  border-bottom: 40px solid transparent;
  content: '';
  width: 0px;
  height: 0px;
  border-radius: 100%;
  position: absolute;
  top: -41px;
  left: -40px;
  display: none;
  z-index: 1;
}
.pie .mask {
  border-top: 40px solid #e4e4e4;
  display: block;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  z-index: 2;
}
.pie .mask, .pie .onemarine {
  border-right: 40px solid transparent;
}

.pie[rel="51"] .twomarine, .pie[rel="52"] .twomarine, .pie[rel="53"] .twomarine, .pie[rel="54"] .twomarine, .pie[rel="55"] .twomarine, .pie[rel="56"] .twomarine, .pie[rel="57"] .twomarine, .pie[rel="58"] .twomarine, .pie[rel="59"] .twomarine, .pie[rel="60"] .twomarine, .pie[rel="61"] .twomarine, .pie[rel="62"] .twomarine, .pie[rel="63"] .twomarine, .pie[rel="64"] .twomarine, .pie[rel="65"] .twomarine, .pie[rel="66"] .twomarine, .pie[rel="67"] .twomarine, .pie[rel="68"] .twomarine, .pie[rel="69"] .twomarine, .pie[rel="70"] .twomarine, .pie[rel="71"] .twomarine, .pie[rel="72"] .twomarine, .pie[rel="73"] .twomarine, .pie[rel="74"] .twomarine, .pie[rel="75"] .twomarine, .pie[rel="76"] .twomarine, .pie[rel="77"] .twomarine, .pie[rel="78"] .twomarine, .pie[rel="79"] .twomarine, .pie[rel="80"] .twomarine, .pie[rel="81"] .twomarine, .pie[rel="82"] .twomarine, .pie[rel="83"] .twomarine, .pie[rel="84"] .twomarine, .pie[rel="85"] .twomarine, .pie[rel="86"] .twomarine, .pie[rel="87"] .twomarine, .pie[rel="88"] .twomarine, .pie[rel="89"] .twomarine, .pie[rel="90"] .twomarine, .pie[rel="91"] .twomarine, .pie[rel="92"] .twomarine, .pie[rel="93"] .twomarine, .pie[rel="94"] .twomarine, .pie[rel="95"] .twomarine, .pie[rel="96"] .twomarine, .pie[rel="97"] .twomarine, .pie[rel="98"] .twomarine, .pie[rel="99"] .twomarine, .pie[rel="100"] .twomarine {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

.pie .onemarine, .pie .twomarine, .pie .threemarine {
  border-top: 40px solid #4c5667;
}
.pie .twomarine, .pie .threemarine {
  border-top: 40px solid #4c5667;
  border-right: 40px solid #4c5667;
}
.pie .threemarine {
  z-index: 3;
}
.pie[rel="1"] .onemarine {
  display: block;
  transform: rotate(-41.4deg);
  -webkit-transform: rotate(-41.4deg);
}
.pie[rel="26"] .twomarine {
  display: block;
  transform: rotate(-41.4deg);
  -webkit-transform: rotate(-41.4deg);
}
.pie[rel="2"] .onemarine {
  display: block;
  transform: rotate(-37.8deg);
  -webkit-transform: rotate(-37.8deg);
}
.pie[rel="27"] .twomarine {
  display: block;
  transform: rotate(-37.8deg);
  -webkit-transform: rotate(-37.8deg);
}
.pie[rel="3"] .onemarine {
  display: block;
  transform: rotate(-34.2deg);
  -webkit-transform: rotate(-34.2deg);
}
.pie[rel="28"] .twomarine {
  display: block;
  transform: rotate(-34.2deg);
  -webkit-transform: rotate(-34.2deg);
}
.pie[rel="4"] .onemarine {
  display: block;
  transform: rotate(-30.6deg);
  -webkit-transform: rotate(-30.6deg);
}
.pie[rel="29"] .twomarine {
  display: block;
  transform: rotate(-30.6deg);
  -webkit-transform: rotate(-30.6deg);
}
.pie[rel="5"] .onemarine {
  display: block;
  transform: rotate(-27deg);
  -webkit-transform: rotate(-27deg);
}
.pie[rel="30"] .twomarine {
  display: block;
  transform: rotate(-27deg);
  -webkit-transform: rotate(-27deg);
}
.pie[rel="6"] .onemarine {
  display: block;
  transform: rotate(-23.4deg);
  -webkit-transform: rotate(-23.4deg);
}
.pie[rel="31"] .twomarine {
  display: block;
  transform: rotate(-23.4deg);
  -webkit-transform: rotate(-23.4deg);
}
.pie[rel="7"] .onemarine {
  display: block;
  transform: rotate(-19.8deg);
  -webkit-transform: rotate(-19.8deg);
}
.pie[rel="32"] .twomarine {
  display: block;
  transform: rotate(-19.8deg);
  -webkit-transform: rotate(-19.8deg);
}
.pie[rel="8"] .onemarine {
  display: block;
  transform: rotate(-16.2deg);
  -webkit-transform: rotate(-16.2deg);
}
.pie[rel="33"] .twomarine {
  display: block;
  transform: rotate(-16.2deg);
  -webkit-transform: rotate(-16.2deg);
}
.pie[rel="9"] .onemarine {
  display: block;
  transform: rotate(-12.6deg);
  -webkit-transform: rotate(-12.6deg);
}
.pie[rel="34"] .twomarine {
  display: block;
  transform: rotate(-12.6deg);
  -webkit-transform: rotate(-12.6deg);
}
.pie[rel="10"] .onemarine {
  display: block;
  transform: rotate(-9deg);
  -webkit-transform: rotate(-9deg);
}
.pie[rel="35"] .twomarine {
  display: block;
  transform: rotate(-9deg);
  -webkit-transform: rotate(-9deg);
}
.pie[rel="11"] .onemarine {
  display: block;
  transform: rotate(-5.4deg);
  -webkit-transform: rotate(-5.4deg);
}
.pie[rel="36"] .twomarine {
  display: block;
  transform: rotate(-5.4deg);
  -webkit-transform: rotate(-5.4deg);
}
.pie[rel="12"] .onemarine {
  display: block;
  transform: rotate(-1.8deg);
  -webkit-transform: rotate(-1.8deg);
}
.pie[rel="37"] .twomarine {
  display: block;
  transform: rotate(-1.8deg);
  -webkit-transform: rotate(-1.8deg);
}
.pie[rel="13"] .onemarine {
  display: block;
  transform: rotate(1.8deg);
  -webkit-transform: rotate(1.8deg);
}
.pie[rel="38"] .twomarine {
  display: block;
  transform: rotate(1.8deg);
  -webkit-transform: rotate(1.8deg);
}
.pie[rel="14"] .onemarine {
  display: block;
  transform: rotate(5.4deg);
  -webkit-transform: rotate(5.4deg);
}
.pie[rel="39"] .twomarine {
  display: block;
  transform: rotate(5.4deg);
  -webkit-transform: rotate(5.4deg);
}
.pie[rel="15"] .onemarine {
  display: block;
  transform: rotate(9deg);
  -webkit-transform: rotate(9deg);
}
.pie[rel="40"] .twomarine {
  display: block;
  transform: rotate(9deg);
  -webkit-transform: rotate(9deg);
}
.pie[rel="16"] .onemarine {
  display: block;
  transform: rotate(12.6deg);
  -webkit-transform: rotate(12.6deg);
}
.pie[rel="41"] .twomarine {
  display: block;
  transform: rotate(12.6deg);
  -webkit-transform: rotate(12.6deg);
}
.pie[rel="17"] .onemarine {
  display: block;
  transform: rotate(16.2deg);
  -webkit-transform: rotate(16.2deg);
}
.pie[rel="42"] .twomarine {
  display: block;
  transform: rotate(16.2deg);
  -webkit-transform: rotate(16.2deg);
}
.pie[rel="18"] .onemarine {
  display: block;
  transform: rotate(19.8deg);
  -webkit-transform: rotate(19.8deg);
}
.pie[rel="43"] .twomarine {
  display: block;
  transform: rotate(19.8deg);
  -webkit-transform: rotate(19.8deg);
}
.pie[rel="19"] .onemarine {
  display: block;
  transform: rotate(23.4deg);
  -webkit-transform: rotate(23.4deg);
}
.pie[rel="44"] .twomarine {
  display: block;
  transform: rotate(23.4deg);
  -webkit-transform: rotate(23.4deg);
}
.pie[rel="20"] .onemarine {
  display: block;
  transform: rotate(27deg);
  -webkit-transform: rotate(27deg);
}
.pie[rel="45"] .twomarine {
  display: block;
  transform: rotate(27deg);
  -webkit-transform: rotate(27deg);
}
.pie[rel="21"] .onemarine {
  display: block;
  transform: rotate(30.6deg);
  -webkit-transform: rotate(30.6deg);
}
.pie[rel="46"] .twomarine {
  display: block;
  transform: rotate(30.6deg);
  -webkit-transform: rotate(30.6deg);
}
.pie[rel="22"] .onemarine {
  display: block;
  transform: rotate(34.2deg);
  -webkit-transform: rotate(34.2deg);
}
.pie[rel="47"] .twomarine {
  display: block;
  transform: rotate(34.2deg);
  -webkit-transform: rotate(34.2deg);
}
.pie[rel="23"] .onemarine {
  display: block;
  transform: rotate(37.8deg);
  -webkit-transform: rotate(37.8deg);
}
.pie[rel="48"] .twomarine {
  display: block;
  transform: rotate(37.8deg);
  -webkit-transform: rotate(37.8deg);
}
.pie[rel="24"] .onemarine {
  display: block;
  transform: rotate(41.4deg);
  -webkit-transform: rotate(41.4deg);
}
.pie[rel="49"] .twomarine {
  display: block;
  transform: rotate(41.4deg);
  -webkit-transform: rotate(41.4deg);
}
.pie[rel="25"] .onemarine {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.pie[rel="50"] .twomarine {
  display: block;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.pie[rel="51"] .threemarine {
  display: block;
  transform: rotate(48.6deg);
  -webkit-transform: rotate(48.6deg);
}
.pie[rel="52"] .threemarine {
  display: block;
  transform: rotate(52.2deg);
  -webkit-transform: rotate(52.2deg);
}
.pie[rel="53"] .threemarine {
  display: block;
  transform: rotate(55.8deg);
  -webkit-transform: rotate(55.8deg);
}
.pie[rel="54"] .threemarine {
  display: block;
  transform: rotate(59.4deg);
  -webkit-transform: rotate(59.4deg);
}
.pie[rel="55"] .threemarine {
  display: block;
  transform: rotate(63deg);
  -webkit-transform: rotate(63deg);
}
.pie[rel="56"] .threemarine {
  display: block;
  transform: rotate(66.6deg);
  -webkit-transform: rotate(66.6deg);
}
.pie[rel="57"] .threemarine {
  display: block;
  transform: rotate(70.2deg);
  -webkit-transform: rotate(70.2deg);
}
.pie[rel="58"] .threemarine {
  display: block;
  transform: rotate(73.8deg);
  -webkit-transform: rotate(73.8deg);
}
.pie[rel="59"] .threemarine {
  display: block;
  transform: rotate(77.4deg);
  -webkit-transform: rotate(77.4deg);
}
.pie[rel="60"] .threemarine {
  display: block;
  transform: rotate(81deg);
  -webkit-transform: rotate(81deg);
}
.pie[rel="61"] .threemarine {
  display: block;
  transform: rotate(84.6deg);
  -webkit-transform: rotate(84.6deg);
}
.pie[rel="62"] .threemarine {
  display: block;
  transform: rotate(88.2deg);
  -webkit-transform: rotate(88.2deg);
}
.pie[rel="63"] .threemarine {
  display: block;
  transform: rotate(91.8deg);
  -webkit-transform: rotate(91.8deg);
}
.pie[rel="64"] .threemarine {
  display: block;
  transform: rotate(95.4deg);
  -webkit-transform: rotate(95.4deg);
}
.pie[rel="65"] .threemarine {
  display: block;
  transform: rotate(99deg);
  -webkit-transform: rotate(99deg);
}
.pie[rel="66"] .threemarine {
  display: block;
  transform: rotate(102.6deg);
  -webkit-transform: rotate(102.6deg);
}
.pie[rel="67"] .threemarine {
  display: block;
  transform: rotate(106.2deg);
  -webkit-transform: rotate(106.2deg);
}
.pie[rel="68"] .threemarine {
  display: block;
  transform: rotate(109.8deg);
  -webkit-transform: rotate(109.8deg);
}
.pie[rel="69"] .threemarine {
  display: block;
  transform: rotate(113.4deg);
  -webkit-transform: rotate(113.4deg);
}
.pie[rel="70"] .threemarine {
  display: block;
  transform: rotate(117deg);
  -webkit-transform: rotate(117deg);
}
.pie[rel="71"] .threemarine {
  display: block;
  transform: rotate(120.6deg);
  -webkit-transform: rotate(120.6deg);
}
.pie[rel="72"] .threemarine {
  display: block;
  transform: rotate(124.2deg);
  -webkit-transform: rotate(124.2deg);
}
.pie[rel="73"] .threemarine {
  display: block;
  transform: rotate(127.8deg);
  -webkit-transform: rotate(127.8deg);
}
.pie[rel="74"] .threemarine {
  display: block;
  transform: rotate(131.4deg);
  -webkit-transform: rotate(131.4deg);
}
.pie[rel="75"] .threemarine {
  display: block;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}
.pie[rel="76"] .threemarine {
  display: block;
  transform: rotate(138.6deg);
  -webkit-transform: rotate(138.6deg);
}
.pie[rel="77"] .threemarine {
  display: block;
  transform: rotate(142.2deg);
  -webkit-transform: rotate(142.2deg);
}
.pie[rel="78"] .threemarine {
  display: block;
  transform: rotate(145.8deg);
  -webkit-transform: rotate(145.8deg);
}
.pie[rel="79"] .threemarine {
  display: block;
  transform: rotate(149.4deg);
  -webkit-transform: rotate(149.4deg);
}
.pie[rel="80"] .threemarine {
  display: block;
  transform: rotate(153deg);
  -webkit-transform: rotate(153deg);
}
.pie[rel="81"] .threemarine {
  display: block;
  transform: rotate(156.6deg);
  -webkit-transform: rotate(156.6deg);
}
.pie[rel="82"] .threemarine {
  display: block;
  transform: rotate(160.2deg);
  -webkit-transform: rotate(160.2deg);
}
.pie[rel="83"] .threemarine {
  display: block;
  transform: rotate(163.8deg);
  -webkit-transform: rotate(163.8deg);
}
.pie[rel="84"] .threemarine {
  display: block;
  transform: rotate(167.4deg);
  -webkit-transform: rotate(167.4deg);
}
.pie[rel="85"] .threemarine {
  display: block;
  transform: rotate(171deg);
  -webkit-transform: rotate(171deg);
}
.pie[rel="86"] .threemarine {
  display: block;
  transform: rotate(174.6deg);
  -webkit-transform: rotate(174.6deg);
}
.pie[rel="87"] .threemarine {
  display: block;
  transform: rotate(178.2deg);
  -webkit-transform: rotate(178.2deg);
}
.pie[rel="88"] .threemarine {
  display: block;
  transform: rotate(181.8deg);
  -webkit-transform: rotate(181.8deg);
}
.pie[rel="89"] .threemarine {
  display: block;
  transform: rotate(185.4deg);
  -webkit-transform: rotate(185.4deg);
}
.pie[rel="90"] .threemarine {
  display: block;
  transform: rotate(189deg);
  -webkit-transform: rotate(189deg);
}
.pie[rel="91"] .threemarine {
  display: block;
  transform: rotate(192.6deg);
  -webkit-transform: rotate(192.6deg);
}
.pie[rel="92"] .threemarine {
  display: block;
  transform: rotate(196.2deg);
  -webkit-transform: rotate(196.2deg);
}
.pie[rel="93"] .threemarine {
  display: block;
  transform: rotate(199.8deg);
  -webkit-transform: rotate(199.8deg);
}
.pie[rel="94"] .threemarine {
  display: block;
  transform: rotate(203.4deg);
  -webkit-transform: rotate(203.4deg);
}
.pie[rel="95"] .threemarine {
  display: block;
  transform: rotate(207deg);
  -webkit-transform: rotate(207deg);
}
.pie[rel="96"] .threemarine {
  display: block;
  transform: rotate(210.6deg);
  -webkit-transform: rotate(210.6deg);
}
.pie[rel="97"] .threemarine {
  display: block;
  transform: rotate(214.2deg);
  -webkit-transform: rotate(214.2deg);
}
.pie[rel="98"] .threemarine {
  display: block;
  transform: rotate(217.8deg);
  -webkit-transform: rotate(217.8deg);
}
.pie[rel="99"] .threemarine {
  display: block;
  transform: rotate(221.4deg);
  -webkit-transform: rotate(221.4deg);
}
.pie[rel="100"] .threemarine {
  display: block;
  transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
}
.pie .content {
  height: 160px;
  left: -80px;
  line-height: 160px;
  position: absolute;
  text-align: center;
  top: -80px;
  width: 160px;
  z-index: 4;
}
.pie .content span {
  display: inline-block;
  font-size: 1.2em;
  line-height: 1;
}
.portletfca3 {
    color: #16AAB6 ;
	text-transform: uppercase;
    font-size: 16px;
    font-weight: 600;
	font-family: 'Roboto', sans-serif;
}
.portletfca32 {
     color: #BABABA;
	 font-size: 12px;
	 text-align:right !important;
	text-transform: none;
	 margin-top : -25px;
	text-align: right !important;
	font-family: 'Roboto', sans-serif;	
}
.alerte_med_text {
    color: #164479 ;	
    font-size: 23px;
    font-weight: 600;
	margin-top : -22px;
	font-family: 'Roboto', sans-serif;
}
/*profil admin portail page RH*/


.profilfoed1rh {
	font: 13px/23px "Roboto", Arial, sans-serif;
    color: #303336;
    background-color: white;
    padding: 0 0;
    height: 100%;
}

.profilport1rh {
  margin: 0 auto;
  width: 100%;
/*   height: 258px; */
  background: white;
  border-radius: 3px;
  position: relative;
	
}
.information1rh {
  text-align: center;
}
	.tetetalent32rh{
	background:url(" img/imgPortlet/avatar-1212.jpg") no-repeat ;
	height: 122px;
	width:122px;
	border-radius: 50%;
 margin: 0 auto;
  margin: -82px auto 15px;
  display: block;
	background-size: cover;
		 -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
	
}

.nomcand1rh {
  font-size: 22px;
}

.jobcand1rh {
  font-size: 16px;
  color: #8c98a8;
  margin-bottom: 24px;
}
.fondhaut1rh {
height: 60px;
	
background-color: #3bafda;
}
.stats1rh {
  margin: auto;
  border-top: 1px solid #CED5E0;
  width: 100%;
}

.stats1rh .monprofil1rh, .stats1rh .dateprofil1rh, .stats1rh .stories1rh {
  display: inline-block;
  padding: 6px 10px 0;
}
.stats1rh .monprofil1rh, .stats1rh .dateprofil1rh {
  border-right: 1px solid #CED5E0;
}
.stats1rh .value311rh {
  font-size: 18px;
  font-weight: 600;

}
.stats1rh .value21rh {
  background:url("img/imgPortlet/eye.png") no-repeat ;
 height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.stats1rh .value23rh {
  background:url("img/imgPortlet/eye1.png") no-repeat ;
 height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.stats1rh .value311rh {
  background:url("img/imgPortlet/alerte_cddtable.png") no-repeat ;
 height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.stats1rh .value41rh {
  background:url("img/imgPortlet/organigramme_icone2.png") no-repeat ;
 height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}

.stats1rh .value421rh {
  background:url("img/imgPortlet/entretien_icone.png") no-repeat ;
 height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.stats1rh .monprofil21rh {
  display: block;
  font-size: 14px;
  color: #8c98a8;
}
.stats1rh a:link  .monprofil21rh a:link {
  display: block;
  font-size: 14px;
  color: #929ead !important;
}
.stats1rh  a:visited, .monprofil21rh  a:visited {
  display: block;
  font-size: 14px;
  color: #929ead !important;
}
.stats1rh  a:active, .monprofil21rh  a:active {
  display: block;
  font-size: 14px;
  color: #929ead !important;
}
/* portail page admin page rh */

/* icone + titre des portlets */
.iconetitre{
	
}

.iconetitre .portletTitre{
	 background: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" ><defs><style>.a{fill:none;}.b{fill:#797979;}</style></defs><title>chart_icon</title><path class="a" d="M-1,0H23V24H-1Z" transform="translate(1)"/><path class="b" d="M11,20h4V4H11ZM5,20H9V12H5ZM17,9V20h4V9Z" transform="translate(1)"/></svg>')  no-repeat; 
	 background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill%3Anone%3B%7D.b%7Bfill%3A%23797979%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Echart_icon%3C%2Ftitle%3E%3Cpath%20class%3D%22a%22%20d%3D%22M-1%2C0H23V24H-1Z%22%20transform%3D%22translate(1)%22%2F%3E%3Cpath%20class%3D%22b%22%20d%3D%22M11%2C20h4V4H11ZM5%2C20H9V12H5ZM17%2C9V20h4V9Z%22%20transform%3D%22translate(1)%22%2F%3E%3C%2Fsvg%3E')  no-repeat; 
	background-position: 0 -3px;	
	background-repeat: no-repeat;
	padding-left: 25px;
	margin-bottom: 10px;
    width: 100%;
	margin-top:10px;
	margin-left:10px;
    color: #797979 !important;
	text-transform: uppercase;
    font-size: 14px;
        border-left: 0px solid rgb(86, 212, 235) !important;
    font-weight: 600;
	letter-spacing: 0.04em;
    line-height: 16px;
	font-family: 'Roboto', sans-serif;
	 -webkit-animation-name: bounceIn;
	  animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
 }
 .iconetitreport1{
	 background: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" ><defs><style>.a{fill:none;}.b{fill:#797979;}</style></defs><title>chart_icon</title><path class="a" d="M-1,0H23V24H-1Z" transform="translate(1)"/><path class="b" d="M11,20h4V4H11ZM5,20H9V12H5ZM17,9V20h4V9Z" transform="translate(1)"/></svg>')  no-repeat; 
	 background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill%3Anone%3B%7D.b%7Bfill%3A%23797979%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Echart_icon%3C%2Ftitle%3E%3Cpath%20class%3D%22a%22%20d%3D%22M-1%2C0H23V24H-1Z%22%20transform%3D%22translate(1)%22%2F%3E%3Cpath%20class%3D%22b%22%20d%3D%22M11%2C20h4V4H11ZM5%2C20H9V12H5ZM17%2C9V20h4V9Z%22%20transform%3D%22translate(1)%22%2F%3E%3C%2Fsvg%3E')  no-repeat; 
	background-position: 0 -3px;	
	background-repeat: no-repeat;
	padding-left: 25px;
	margin-bottom: 10px;
    width: 100%;
	margin-top:10px;
	margin-left:10px;
    color: #797979 !important;
	text-transform: uppercase;
    font-size: 14px;
        border-left: 0px solid rgb(86, 212, 235) !important;
    font-weight: 600;
	letter-spacing: 0.04em;
    line-height: 16px;
	font-family: 'Roboto', sans-serif;
	 -webkit-animation-name: bounceIn;
	  animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
 }
/* PORTLET 11-PORTAIL - Picto 4 Raccourcis (FR)  - fca */
.formation-manager{
	background:url("img/imgPortlet/formation_icone1.png") no-repeat ;
	height : 70px;
	width: 91px;
	background-position: center;-webkit-animation-name: bounceIn;
	animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
 	 animation-duration: .75s;
  	-webkit-animation-duration: 1s;
  	animation-duration: 1s;
  	-webkit-animation-fill-mode: both;
  	animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  	0%, 20%, 40%, 60%, 80%, 100% {
  	-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  	transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
}
.organi-manager{
	background:url("img/imgPortlet/organigramme_icone1.png") no-repeat ;
	height : 70px;
	width: 91px;
	background-position: center;-webkit-animation-name: bounceIn;
 	animation-name: bounceIn;
 	-webkit-animation-duration: .75s;
 	animation-duration: .75s;
 	-webkit-animation-duration: 1s;
 	animation-duration: 1s;
 	-webkit-animation-fill-mode: both;
 	animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
}
.formation-manager-check{
	background:url("img/imgPortlet/formation_icone_chek1.png") no-repeat ;
	height : 70px;
	width: 91px;
	  background-position: center;-webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
}
.equipe-manager{
	background:url("img/imgPortlet/equipe_manager1.png") no-repeat ;
	height : 70px;
	width: 91px;
	background-position: center;-webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);

  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
  }
  @keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
  opacity: 0;
  -webkit-transform: scale3d(.3, .3, .3);
  transform: scale3d(.3, .3, .3);
  }
  20% {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
  -webkit-transform: scale3d(.9, .9, .9);
  transform: scale3d(.9, .9, .9);
  }
  60% {
  opacity: 1;
  -webkit-transform: scale3d(1.03, 1.03, 1.03);
  transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
  -webkit-transform: scale3d(.97, .97, .97);
  transform: scale3d(.97, .97, .97);
  }
  100% {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  }
	
}
.wp-caption {
position: relative;
padding: 0;
margin: 0;
}
.wp-caption img {
display: block;
max-width: 100%;
height: auto;
color: #fff !important;	
    font-size: 12px; 
	font-family: 'Roboto', sans-serif;
}
.wp-caption-text {
	opacity: 0;
    position: absolute;
    width: 69px;
    color: #fff !important;
    font-size: 12px;
    font-family: 'Roboto', sans-serif;
    left: 13px;
    bottom: -70px;
    font-weight: 300;
    z-index: 2;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: rgba(0,0,0,.7);
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    height: 71px;
}
.wp-caption:hover .wp-caption-text {
opacity: 1;
}
.wp-caption2 {
position: relative;
padding: 0;
margin: 0;
}
.wp-caption2 img {
display: block;
max-width: 100%;
height: auto;
color: #fff !important;	
    font-size: 12px; 
	font-family: 'Roboto', sans-serif;
}
.managtext {
    color: #fff  !important;
	
    font-size: 12px;
    font-weight: 300;
	font-family: 'Roboto', sans-serif;
}
.iconetitre7 .portletTitre{
	  background:url("img/imgPortlet/raccourci_icone.png") no-repeat ;
	background-position: 0 -3px;	
	background-repeat: no-repeat;
	padding-left: 25px;
	margin-bottom: 10px;
    width: 100%;
	margin-top:10px;
	margin-left:10px;
    color: #797979 !important;
	text-transform: uppercase;
    font-size: 14px;
        border-left: 0px solid rgb(86, 212, 235) !important;
    font-weight: 600;
	letter-spacing: 0.04em;
    line-height: 16px;
	font-family: 'Roboto', sans-serif;
	 -webkit-animation-name: bounceIn;
	  animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  
}
.iconetitrepie .portletTitre{
	  background:url("img/imgPortlet/pie.png") no-repeat ;
	background-position: 0 -3px;	
	background-repeat: no-repeat;
	padding-left: 25px;
	margin-bottom: 10px;
    width: 100%;
	margin-top:10px;
	margin-left:10px;
    color: #797979 !important;
	text-transform: uppercase;
    font-size: 14px;
        border-left: 0px solid rgb(86, 212, 235) !important;
    font-weight: 600;
	letter-spacing: 0.04em;
    line-height: 16px;
	font-family: 'Roboto', sans-serif;
	 -webkit-animation-name: bounceIn;
	  animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.iconetitre6 .portletTitre{
	background:url("img/imgPortlet/contrat_icone.png") no-repeat ;
	background-position: 0 1px;	
	background-repeat: no-repeat;
	padding-left: 25px;
	margin-bottom: 10px;
    width: 100%;
	margin-top:10px;
	margin-left:10px;
    color: #797979 !important;
	text-transform: uppercase;
    font-size: 14px;
    border-left: 0px solid rgb(86, 212, 235) !important;
    font-weight: 600;
	letter-spacing: 0.04em;
    line-height: 16px;
	font-family: 'Roboto', sans-serif;
	-webkit-animation-name: bounceIn;
	 animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
  	animation-duration: .75s;
 	 -webkit-animation-duration: 1s;
	 animation-duration: 1s;
	 -webkit-animation-fill-mode: both;
 	 animation-fill-mode: both;
}
.iconetitreborderbottom .portletTitre{
	border-bottom: 1px solid #b9b9b9;
	padding-left: 25px;
	margin-bottom: 10px;
    width: 100%;
	margin-top:10px;
	margin-left:10px;
    color: #797979 !important;
	text-transform: uppercase;
    font-size: 14px;
    border-left: 0px solid rgb(86, 212, 235) !important;
	letter-spacing: 0.04em;
    line-height: 16px;
	-webkit-animation-name: bounceIn;
	 animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
  	animation-duration: .75s;
 	 -webkit-animation-duration: 1s;
	 animation-duration: 1s;
	 -webkit-animation-fill-mode: both;
 	 animation-fill-mode: both;
}

.iconetitretransp .portletTitre{
	background-position: 0 1px;	
	background-color: transparent;
	background-repeat: no-repeat;
	padding-left: 25px;
	margin-bottom: 10px;
    width: 100%;
	margin-top:10px;
	margin-left:10px;
    color: transparent !important;
	text-transform: uppercase;
    font-size: 14px;
    border-left: 0px solid rgb(86, 212, 235) !important;
    font-weight: 600;
	letter-spacing: 0.04em;
    line-height: 16px;
	font-family: 'Roboto', sans-serif;
	-webkit-animation-name: bounceIn;
	 animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
  	animation-duration: .75s;
 	 -webkit-animation-duration: 1s;
	 animation-duration: 1s;
	 -webkit-animation-fill-mode: both;
 	 animation-fill-mode: both;
}
.iconetitre4 .portletTitre{
	background:url("img/imgPortlet/listtable.png") no-repeat ;
	background-position: 0 -2px;	
	background-repeat: no-repeat;
	padding-left: 25px;
	margin-bottom: 10px;
    width: 100%;
	margin-top:10px;
	margin-left:10px;
    color: #797979 !important;
	text-transform: uppercase;
    font-size: 14px;
    border-left: 0px solid rgb(86, 212, 235) !important;
    font-weight: 600;
	letter-spacing: 0.04em;
    line-height: 16px;
	font-family: 'Roboto', sans-serif;
	-webkit-animation-name: bounceIn;
	 animation-name: bounceIn;
  	-webkit-animation-duration: .75s;
  	animation-duration: .75s;
 	 -webkit-animation-duration: 1s;
	 animation-duration: 1s;
	 -webkit-animation-fill-mode: both;
 	 animation-fill-mode: both;
}

.titrefca   #containerPortail tr.ev_dhx_skyblue {
    border-bottom: 1px solid #F6F8F8;
    border-top: none;
    border-left: none;
    border-right: none;
    background-color: white !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 12px;
    color: #BABABA !important;
    vertical-align: middle;
    text-align: left;
}

/* Portlet Inscriveurs des stagiaires à une session */
.inscriveuricone {
    background: url(img/imgPortlet/perso_formation.png) no-repeat;
    height: 24px;
    width: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -5px;
    padding-right: 10px;
    margin-top: -2px;
}  
/* Portlet tablelist */
#containerPortail tr.ev_dhx_skyblue td {
    color: #696969;
    border-bottom: 0px solid #e8e8e8;
    background-color: white;
}
div.gridbox_dhx_skyblue table.obj.row20px tr td {
    color: #696969 !important;
    border-bottom: 0px solid #e8e8e8;
    
}
div.gridbox_dhx_skyblue table.hdr td {
    background-color: white;
    font-size: 14px;
    vertical-align: middle;
    text-align: left;
    font-family: Roboto, sans-serif;
    color: #686868;
    font-weight: bolder;
    border-bottom: 1px solid rgb(246, 248, 248);
    border-top: none;
    border-left: none;
    border-right: none;
}
/* Fin Portlet tablelist */


/* Nombre d'employés sur 3 ans - fca5 */
.nbremploy3anfca {
	background: url(img/imgPortlet/user-tiefca.png) no-repeat;
    height: 69px;
    width: 41px;
  /*   background-position-y: -6px;
    background-position-x: 1px; */
    display: inline-block;
    vertical-align: middle;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-left: 14px;
    background-color: #69c3e4;
    padding-right: 10px;
    margin-top: -52px;
    background-position: 1px -6px;
    
} 
.nbremploy3anfca2 {
     height: 49px;
    width: 95px;
    font-size: 21px;
    text-align: center;
    display: table;
    padding-top: 6px;
    color: white;
    position: absolute;
    font-family: 'Roboto', sans-serif;
    background-color: #45b5df;
    border-top-left-radius: 5px;
    top: -40px;
    left: -110px;
  }
  
  .nbremploy3anfca21 {
    height: 15px;
    width: 95px;
    font-size: 12px;
    text-align: center;
    color: black;
    position: absolute;
    font-family: 'Roboto', sans-serif;
    background-color: #45b5df;
    /* border-top-left-radius: 5px; */
    border-bottom-left-radius: 5px;
    top: 2px;
    left: -78px;
  }
/* FORMATION - TB annuel des évaluation (Indice impact par formation) */
 .tbindiceimp {
    height: 15px;
    width: 203px;
    font-size: 11px;
    text-align: center;
    color: white;
    position: absolute;
    font-family: 'Roboto', sans-serif;
    background-color: #45b5df;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    top: -54px;
    left: -138px;
  }
  
.tbindiceimp2 {
    height: 54px;
    width: 152px;
    font-size: 21px;
    text-align: center;
    display: table;
/*     padding-top: 6px; */
    color: white;
    position: absolute;
    font-family: 'Roboto', sans-serif;
    background-color: #45b5df;
    border-top-left-radius: 5px;
    top: -96px;
    left: -170px;
  }
.tbindiceimp21 {
	background: url(img/imgPortlet/user-tiefca.png) no-repeat;
    height: 69px;
    width: 41px;
    background-position-y: -6px;
    background-position-x: 1px;
    display: inline-block;
    vertical-align: middle;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-left: 14px;
    background-color: #69c3e4;
    padding-right: 10px;
    margin-top: -108px;
    
} 
  
  /* Portlet Répartition H/F - fca */
.portletrepartitionhommefca {
   background: url(img/imgPortlet/man.png) no-repeat;
	height: 37px;
	width: 24px;
	display: inline-block;
	position: absolute;
	left: 36px;
    top: 86px;     
  }
  
  /* Portlet Répartition H/F sur 3 ans   ### fca */
  .portletrepartitionhommefca12 {
   background: url(img/imgPortlet/man.png) no-repeat;
	height: 37px;
	width: 24px;
	display: inline-block;
	position: absolute;
	left: -20px;
    top: -13px;		   
  }
  /* Portlet Répartition H/F sur 3 ans   ### fca */
  .portletrepartitionfemmefca12 {
   background: url(img/imgPortlet/woman.png) no-repeat;
	height: 37px;
	width: 24px;
	display: inline-block;
	position: absolute;
	left: -25px;
    top: -13px;		   
  }
 
  /* Portlet P0007-REPARTITION H/F DES STAGIAIRES DE FORMATION PAR TRANCHES D?ANCIENNETE  ### fca */
  .portletrepartitionfemmefca123 {
    background: url(img/imgPortlet/woman.png) no-repeat;
    height: 82px;
    background-position-y: 2px;
    width: 62px;
    background-position-x: 8px;
    font-size: 21px;
    padding-left: 33px;
    text-align: center;
    display: table;
    padding-top: 6px;
    margin-left: -23px;
    color: white;
    position: absolute;
    font-family: 'Roboto', sans-serif;
    background-color: #69c3e4;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    top: -111px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px; 
  }
   .portletrepartitionhommefca123 {
	background: url(img/imgPortlet/man.png) no-repeat;
	height: 34px;
    width: 40px;
    background-position-x: 6px;
    font-size: 21px;
    display: inline-block;
    padding-left: 37px;
    /* padding-right: 72px; */
    margin-left: -64px;
    padding-top: 6px;
    font-family: 'Roboto', sans-serif;
    text-align: center;
    color: white;
    position: absolute;
    /* background-color: #69c3e4; */
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    top: -67px;  			   
  }
   .titrerepartitionstage { 
    display: inline-block;
    vertical-align: middle;
    margin-left: 2px;
    color: #69c3e4;
    font-family: 'Roboto', sans-serif;
    margin-top: -151px;
    font-weight: 500;
    font-size: 22px;
 }
 /* Portlet Répartition H/F - fca */
.portletrepartitionfemmefca {
   background: url(img/imgPortlet/woman.png) no-repeat;
	height: 37px;
	width: 24px;
	display: inline-block;
	position: absolute;
	left: 22px;
    top: 168px;     
  }
 
  
/*   P0031-TC répartition H/F par structure administrative 1 */
.portletrepartitionfemmestrucad {
   background: url(img/imgPortlet/woman.png) no-repeat;
	height: 37px;
	width: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -5px;
    padding-right: 10px;
    margin-top: -5px;     
  }
.portletrepartitionhommestrucad {
   background: url(img/imgPortlet/man.png) no-repeat;
	height: 37px;
	width: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -5px;
    padding-right: 10px;
    margin-top: -5px;		   
  }
/* fin  P0031-TC répartition H/F par structure administrative 1 */



   /* P0035-Ancienneté moyenne des employés */
.portletAnciennetemaxfca {
    background: url(img/imgPortlet/ancienetemax.png) no-repeat;
    height: 33px;
    width: 94px;
    background-position-x: 23px;
    display: inline-block;
    position: absolute;
    left: 355px;
    top: 262px;
    padding-top: 31px;
    text-align: center;
  }
  .portletAnciennetemoyennefca {
    background: url(img/imgPortlet/ancienetemoy.png) no-repeat;
    height: 33px;
    width: 120px;
    display: inline-block;
    position: absolute;
    left: 41px;
    padding-top: 30px;
    top: 263px;
    text-align: center;
    background-position-x: 35px;
    
  }
  
  /*Page portlet personne manager fca*/

.profilfoed1 {
  font: 13px/23px "Roboto", Arial, sans-serif;
  color: #303336;
  padding: 0 0;
}
 /*fin Page portlet personne manager fca*/
 

.Messagefca {
  display: table;
  width: 100%;
  
}

.Messagefca-iconfca {
	background:url("img/imgPortlet/alerte_cdd.png") no-repeat ;
  display: table-cell;
    vertical-align: middle;
    width: 34px;
    background-size: 70%;
    padding: 30px;
    text-align: center;
  /*   background-color: #2bb1bc; */
}
.Messagefca1-iconfca1 {
	background:url("img/imgPortlet/alerte_habili.png") no-repeat ;
  display: table-cell;
    vertical-align: middle;
    width: 34px;
    background-size: 70%;
    padding: 30px;
    text-align: center;
/*     background-color: #2bb1bc; */
}
.Messagefca2-iconfca2 {
	background:url("img/imgPortlet/alerte_essai_dark.png") no-repeat ;
	display: table-cell;
    vertical-align: middle;
    background-size: 70%;
    width: 34px;
    padding: 30px;
    text-align: center;
/*     background-color: #2bb1bc; */
}
.timeline2 {
    line-height: 17px;
    list-style: none;
    margin: 0;
    height: 95px;
    background-color: white;
    padding-left: 13px;
    overflow: auto;
}

/* Portlet p0064 alerte sur */

.alerte_med_table {
 	background:url("img/imgPortlet/alerte_med_table.png") no-repeat ;
 	height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.buttonround {
  	background: #9CCC65;
  	margin-left:8px !important; 
  	-webkit-border-radius: 50;
  	-moz-border-radius: 50;
  	border-radius: 50px;
  	font-family: Arial;
  	color: #ffffff;
  	font-size: 12px;
  	padding: 5px 8px 4px 8px;
  	text-decoration: none;
}

.buttonround:hover {
  	background: #558B2F;
}

.buttonroundbleu {
  	background: #3bafda;
  	margin-left:8px !important; 
  	-webkit-border-radius: 50;
  	-moz-border-radius: 50;
  	border-radius: 50px;
  	font-family: Arial;
  	color: #ffffff;
  	font-size: 12px;
  	padding: 5px 8px 4px 8px;
  	text-decoration: none;
}
.alerte_essai_table {
 	background:url("img/imgPortlet/alerte_essaitable.png") no-repeat ;
 	height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.alerte_cdd_table {
	background:url("img/imgPortlet/alerte_cddtable.png") no-repeat ;
 	height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.alerte_habili_table {
 	background:url("img/imgPortlet/alerte_habili_table.png") no-repeat ;
 	height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-2px;
}
.iconetitre8 .portletTitre {
    background: url("img/imgPortlet/alerte_icone.png") no-repeat;
    background-position: 0 150%;
    background-repeat: no-repeat;
    padding-left: 25px;
    margin-bottom: 10px;
    width: 100%;
    margin-top: 10px;
    margin-left: 10px;
    color: #797979 !important;
    border-left: 0px solid rgb(86, 212, 235) !important;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 16px;
    font-family: 'Roboto', sans-serif;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
/* P0068-PORTAIL - Entretiens professionnels à réaliser */
.personne_icone {
 	background:url("img/imgPortlet/personne_icone.png") no-repeat ;
 	height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-5px;
}
.buttondate {
    background: url(img/imgPortlet/date2.png) no-repeat;
    height: 24px;
    width: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -5px;
    margin-top: 4px;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.buttondateblanc {
    background: url(img/imgPortlet/dateblanc.png) no-repeat;
    height: 24px;
    width: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -5px;
    margin-top: 4px;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}



.buttonlist {
    background-color: #D0292C;
    border: none;
    color: white;
    padding: 3px 5px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    margin-right: 10px;
    transition: all 0.5s;
    cursor: pointer;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

/* P0039-Répartition H/F */
.portletrepartitionsessHommefca {
    background: url(img/imgPortlet/man.png) no-repeat;
    height: 33px;
    width: 99px;
    /* display: inline-block; */
    position: absolute;
    left: 351px;
    padding-top: 36px;
    top: 262px;
    text-align: center;
    background-position-x: 40px; 
  }
  
 .portletrepartitionsessFemmefca {
    background: url(img/imgPortlet/woman.png) no-repeat;
    height: 33px;
    width: 94px;
    background-position-x: 34px;
    position: absolute;
    left: 53px;
    top: 263px;
    padding-top: 37px;
    text-align: center;
  } 
  
  /* P0039-Répartition H/F */
.portletrepartitionsessMalefca {
    background: url(img/imgPortlet/man.png) no-repeat;
    height: 33px;
    width: 99px;
    /* display: inline-block; */
    position: absolute;
    left: 351px;
    padding-top: 36px;
    top: 262px;
    text-align: center;
    background-position-x: 40px; 
  }
  
 .portletrepartitionsessFemalefca {
    background: url(img/imgPortlet/woman.png) no-repeat;
    height: 33px;
    width: 94px;
    background-position-x: 34px;
    position: absolute;
    left: 53px;
    top: 263px;
    padding-top: 37px;
    text-align: center;
  } 
  
  /*fin Portlet Répartition H/F - fca */
  
  /* P0005 - Inscriveurs des stagiaires à une session */
  .stagiaire-chap {
 	background:url("img/imgPortlet/formation311.png") no-repeat ;
 	height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-5px;
}
  .personne_icone-cravat {
 	background:url("img/imgPortlet/personne_icone-cravat.png") no-repeat ;
 	height: 24px;
	width:24px;
	display:inline-block;
	vertical-align:middle;
	margin-right:-5px;
	padding-right:10px;
	margin-top:-5px;
}

  /* fin P0005 - Inscriveurs des stagiaires à une session */  
 /*  #containerPortail .jFoedPanel-gridTd {
    padding: 0px;
    border-radius: 0px;
    background-color: white !important;
    -webkit-box-shadow: 2px 2px 5px -1px rgba(161,156,161,1);
    -moz-box-shadow: 2px 2px 5px -1px rgba(161,156,161,1);
    box-shadow: 2px 2px 5px -1px rgba(161,156,161,1);
} */



/* P0042 - Pictogramme Bourse à l'emploi */
 
 .firstinfobourseemp {

  display: flex;
  justify-content: center;
  align-items: center;
   flex-direction: row;
  z-index: 2;
  position: relative;
   border-radius: 50%;
}

.contentbourseemp {
  position: relative;
  animation: animatop 0.9s cubic-bezier(0.425, 1.14, 0.47, 1.125) forwards;
  width: 466px;
}

.cardbourseemp {
    background-color: white;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
    position: relative;
    overflow: hidden;
}
.cardbourseemp:after {
  content: '';
  display: block;
  width: 190px;
  height: 300px;
  background: cadetblue;
  position: absolute;
  animation: rotatemagic 0.75s cubic-bezier(0.425, 1.04, 0.47, 1.105) 1s both;
}
/*couleur pour portlet P0184 */
.cardbourseempbleu {
    background-color: white;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
    position: relative;
    overflow: hidden;
}
.cardbourseempbleu:after {
  content: '';
  display: block;
  width: 190px;
  height: 300px;
  background: #bfd9e8;
  position: absolute;
  animation: rotatemagic 0.75s cubic-bezier(0.425, 1.04, 0.47, 1.105) 1s both;
}
/* fin couleur pour portlet P0184 */

.firstinfobourseemp .profileinfobourseemp {
  padding: 0px 20px;
  width: 444px;
}

.titrebourseemp {
  font-size: 1.3em;
}
.textebourseemp {
  font-size: 1.2em;
  color: #009688;
  font-style: italic;
}

/*couleur pour portlet P0184 */
.textebourseempbleu {
  font-size: 1.2em;
  color: #51afda;
  font-style: italic;
}
/* fin couleur pour portlet P0184 */

.biobourseemp {
  padding: 10px 0px;
  color: #5A5A5A;
  line-height: 1.2;
  font-style: initial;
}
/*image pour portlet P0184 */
.imgbourseemppersonne {
	 background:url("img/imgPortlet/personne-icon.png") no-repeat ;
    height: 99px;
    width: 131px;
}
/* fin image pour portlet P0184 */

 .imgbourseemp {
	 background:url("img/imgPortlet/briefcase-icon.png") no-repeat ;
    height: 99px;
    width: 131px;
}

@keyframes animatop {
  0% {
    opacity: 0;
    bottom: -500px;
  }
  100% {
    opacity: 1;
    bottom: 0px;
  }
}
@keyframes animainfos {
  0% {
    bottom: 10px;
  }
  100% {
    bottom: -42px;
  }
}
@keyframes rotatemagic {
  0% {
    opacity: 0;
    transform: rotate(0deg);
    top: -24px;
    left: -253px;
  }
 
  100% {
    transform: rotate(-30deg);
    top: -24px;
    left: -78px;
  }
}
/* Portlet date */

.iconecalendrier {
    margin: 11px;
    width: 92px;
    height: 79px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0px 2px 21px rgba(0, 0, 0, 0.2);
    border-radius: 5px;
    position: relative;
    background: #f5f5f5;
    }

.iconecalendrierhaut {
    height: 25px;
    background: #2381d8;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    border-top-right-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    border-top-left-radius: 5px;
    width: 100%;
    text-align: center;
    font-size: 14px;
    color: #FFF;
    line-height: 26px;
    }

.iconecalendrierjour {
    font-size: 36px;
    color: #333;
    height: 34px;
    text-align: center;
    }
    .iconecalendriermois {
    height: 14px;
    font-size: 16px;
    color: #333;
    text-align: center;
    }

.iconecalendrierhaut:before {
    background: white;
    height: 1px;
    width: 1px;
    content: "";
    display: block;
    position: absolute;
    top: 4px;
    left: 3px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    padding: 4px;
    }

.iconecalendrierhaut:after {
    background: white;
    height: 1px;
    width: 1px;
    content: "";
    display: block;
    position: absolute;
    top: 4px;
    right: 3px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    padding: 4px;
    }
    .cardcalendrier {
    background-color: white;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
    position: relative;
    overflow: hidden;
}
.firstinfobourseempcal {

  display: flex;
  justify-content: center;
  align-items: center;
   flex-direction: row;
  z-index: 2;
  position: relative;
   border-radius: 50%;
}

.contentbourseempcal {
  position: relative;
  animation: animatop 0.9s cubic-bezier(0.425, 1.14, 0.47, 1.125) forwards;
  width: 100%;
}

.firstinfobourseempcal .profileinfobourseempcal {
  padding: 0px 20px;
  width: 100%;
}

.titrebourseempcal {
  font-size: 1.3em;
}
.textebourseempcal {
  font-size: 1.2em;
  color: #009688;
  font-style: italic;
}
.biobourseempcal {
  padding: 10px 0px;
  color: #5A5A5A;
  line-height: 1.2;
  font-style: initial;
}
/*     Fin portlet date */

/* P0092 */

.btnevalchaud {
    display: inline-block;
    /* box-shadow: 2px 2px 8px #888888; */
    background: #fff;
    border-radius: 4px;
    width: 100%;
    height: 106px;
    line-height: 97px;
    text-align: center;
    font-size: 15px;
    color: #323334;
    position: relative;
    /* margin: 31px 86px; */
    -webkit-transition: all ease 300ms;
    transition: all ease 300ms;
    -webkit-animation: appear 300ms;
    animation: appear 300ms;
}

.btnevalchaud .notifievalchaud {
    position: absolute;
    top: 9px;
    right: 17px;
}

.notifievalchaud {
  border-radius: 50%;
  width: 35px;
  height: 35px;
  line-height: 37px;
  color: #fff;
  font-size: 1.5rem;
  -webkit-animation: bounceIn 700ms;
          animation: bounceIn 700ms;
}
.imgevalchaud {
    background: url(img/imgPortlet/checklisteval.png) no-repeat;
    height: 88px;
    /* margin-left: 16px; */
    width: 107px;
    float: right;
    display: inline-block;
    margin-top: 22px;
    /* vertical-align: middle; */

}
.notifievalchaud.notifievalchaud-redeval {
  background: red;
}
.notifievalchaud.notifievalchaud-blueeval {
  background: #4285f4;
}


/* fin P0092 */

/* proposition2 */

.cardsevalchaud {
	width: 100%;
    height: 12.5rem;
    background-color: #f9fbfb;
    /* border-radius: 4px; */
    position: relative;
    /* margin: 21px 33px; */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    color: #5a6c7a;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .05rem;
    /* box-shadow: 2px 2px 8px #888888; */
}
.cardsevalchaudimgcentre {
  height: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: end;
  -ms-flex-align: end;
   align-items: flex-end;
}
.cardsevalchaudimg { 
 	background: url("img/imgPortlet/checklisteval.png") no-repeat;
    height: 64px;
    margin-left: 18px;
    width: 107px;
}
.cardsevalchaud__count-container {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.cardsevalchaudindicateur {
  text-transform: uppercase;
  font-size: 3rem;
  font-weight: 300;
}
.cardsevalchaudtext12 {
    text-align: left;
    position: absolute;
    margin-left: 10px;
    color: #5a6c7a;
    font-weight: 500;
    text-transform: uppercase;
    z-index: 1;
    margin-top: 40px;

}
.cardsevalchaud__stuff-container {
  margin: 0 auto;
  width: 90%;
  height: 15%;
  border-top: 2px solid #e7edef;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.cardsevalchaud__stuff-icon, .cardsevalchaud__stuff-text {
  display: inline-block;
}

.cardsevalchaud__stuff-text {
  text-transform: uppercase;
  margin-left: .4rem;
  -webkit-transform: translate(0, -0.2rem);
          transform: translate(0, -0.2rem);
}
/* proposition 3 */

.cardevalchaudbleu1 {
 /*  margin-top: 24px; */
  width: 100%;
}
.cardevalchaudbleu2 {
  /*   border-radius: 4px; */
    color: white;
/*     margin: 11px; */
    width: 100%;
}
.cardevalchaudbleu2  {
  color: white;
  font-size: 28px;
  right: 13px;
  top: 13px;
}
.cardsevalchaudimg2 {
 	background: url("img/imgPortlet/checklisteval.png") no-repeat;
    height: 64px;
    width: 107px;
    display: unset;
    margin-top: 7px;
    float: right;
}
.cardevalchaudbleu2 .titre2evalchaudbleu2 {
	border-top: 1px solid rgba(255, 255, 255, 0.3);
    font-size: 12px;
    text-align: center;
    margin-top: 25px;
    padding: 10px 10px 8px;
    text-transform: uppercase;
}
.cardevalchaudbleu2 .titreevalchaudbleu2 {
  display: inline-block;
  font-size: 12px;
  padding: 10px 10px 0;
  text-transform: uppercase;
}
.cardevalchaudbleu2 .nbreevalchaudbleu2 {
    font-size: 26px;
    padding: 0 10px;

}
.cardevalchaudbleu2.blueevaluchaud2 {
  background-color: #66b4ef;
}
/* proposition4 */

.evalchaud2container {
    padding: 20px;
   /*  margin: 36px 11px 0 11px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); */
    background: white;
}
.evalchaud2container .nbre3evalchaud,
.evalchaud2container .titreevalchaud3 {
  display: block;
  position: relative;
  color: #515d6e;
  text-align: right;
  z-index: 10;
}

.evalchaud2container .titreevalchaud3 {
  font-size: 1.2em;
  font-weight: 300;
  text-transform: uppercase;
}
.evalchaud2container .nbre3evalchaud {
  font-size: 2.1em;
  font-weight: 600;
  margin-top: 5px;
}

.radevalchaudimg2 {
 	background: url("img/imgPortlet/checklisteval.png") no-repeat;
    height: 64px;
    width: 107px;
    float: left;
}
/* Portlet menu lafarge */
    
    .cardmenuraccourci {
    border-radius: 3px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
    transition: 0.3s;
    }
	 .iconecpflaf {
		background: url("img/imgPortlet/picto_cpf.png") no-repeat;
		height: 37px;
		width: 33px;
		display: inline-block;
		vertical-align: middle;
    }
	 .iconeorganilaf {
		background: url("img/imgPortlet/pictoorganigramme_icone2.png") no-repeat;
		height: 37px;
		width: 33px;
		display: inline-block;
		vertical-align: middle;
    }
	 .iconedonneeindivlaf {
		background: url("img/imgPortlet/picto_donneindiv.png") no-repeat;
		height: 37px;
		width: 33px;
		display: inline-block;
		vertical-align: middle;
    }
	.iconecalandlaf {
		background: url("img/imgPortlet/picto_caland.png") no-repeat;
		height: 37px;
		width: 33px;
		display: inline-block;
		vertical-align: middle;
    }
	.iconesuiviformlaf {
		background: url("img/imgPortlet/picto_suiviform.png") no-repeat;
		height: 37px;
		width: 33px;
		display: inline-block;
		vertical-align: middle;
    }
		
		.iconesuvihabililaf {
		background: url("img/imgPortlet/picto_habililaf.png") no-repeat;
		height: 37px;
		width: 33px;
		display: inline-block;
		vertical-align: middle;
    }
	.iconesemployesansformlaf {
		background: url("img/imgPortlet/picto_employesansform.png") no-repeat;
		height: 37px;
		width: 33px;
		display: inline-block;
		vertical-align: middle;
    }
    .boutonmenuraccourci {
    margin:  0;
    padding: 0;
    list-style: none;
    display: table;
    table-layout: fixed;
    width: 100%;
    font-family: Arial;
    }
    .buttonitemmenuraccourci {
    display: table-cell;
    vertical-align: middle;	
    }
    .buttonlinkmenuraccourci {
    display: block;
    }
    .iconnavmenuraccourci {
    text-align: center;
    overflow: hidden;	
    }
    .iconnavmenuraccourcia {
    background: white;
    color: #1693f2;
    height: 52px;
    min-width: 40px;
    margin: 5px;
    padding: 1em;
    padding-top: 1.5em;
    font-size: 10px;
    font-weight: normal;
    text-decoration: none;
    border-bottom: 6px solid transparent;
    text-transform: uppercase;
    text-align: center;
    transition: 0.6s;
    }
    .iconnavmenuraccourcia:hover {
    border-bottom: 6px solid #1693f2;  
    transition: all 0.4s;
    }
/* Portlet logo entreprise */


#btnslogoentrep2slogoentrep {

  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
}

.btnslogoentrep2 {

  width: 100%;
  font-size: 26px;
  font-family: open sans;
  text-align: center;
}


.btnslogoentrep2-innerlogoentrep2,
.btnslogoentrep2-innerlogoentrep2:hover .btnslogoentrep2-bottom {
  background-color: #3989da;
}

.btnslogoentrep2 .btnslogoentrep2-innerlogoentrep2 {
  position: relative;
  min-height: 124px;
  border: 1px solid #ddd;
  overflow: hidden;
}

.btnslogoentrep2 .btnslogoentrep2-top {
  width: 100%;
  padding:  0;
  position: absolute;
  top: 0px;
  background-color: #fff;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.btnslogoentrep2 .btnslogoentrep2-bottom {
  width: 100%;
  position: absolute;
  bottom: -310px;
  height: 100%;
  padding: 20px 15px 20px 15px;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}



/* Hover Styles */
.btnslogoentrep2 .btnslogoentrep2-innerlogoentrep2:hover .btnslogoentrep2-bottom {
  bottom: 0;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.btnslogoentrep2 .btnslogoentrep2-innerlogoentrep2:hover .btnslogoentrep2-top {
  top: -200px;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

/* p0219 */


.containerp0219 {
  margin: 0 auto;
  max-width: 960px;
  width: 100%;
}

.panelp0219 {
background-color: #fff;
    position: relative;
    width: 100%;
    z-index: 10;
}

.encartp0219 {
 
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: center;
  text-transform: uppercase;
}

@media (min-width: 900px) {
  .encartp0219 {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}


.encart2p0219 {
  border-bottom: 1px solid #e1f1ff;
  padding: 10px;

}

@media (min-width: 900px) {
  .encart2p0219 {
    border-bottom: none;
    border-right: 1px solid #e1f1ff;
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;

  }
}

.titrep0219 {
  color: #888;
  font-weight: 600;
	font-size: 12px;
}

.titrenomp0219 {
  color: #016FF9;
  font-weight: 600;
  letter-spacing: 1px;
  margin: 30px 0 25px;
}

.titrenomp0219-item {
  border-top: 1px solid #e1f1ff;
  font-size: 12px;
  line-height: 1.5;
  padding: 15px 0;
}

.titrenomp0219-item:last-child {
  border-bottom: 1px solid #e1f1ff;
}

.telp0219 {
  color: #016FF9;
  display: block;
  font-size: 17px;
  font-weight: 700;
}

/* P0220 */

.boxnonforme {
  background: white;
  border-left: 6px solid #ADCF4F;
  padding-left: 15px;
  margin: 0px;
  position: relative;
  height:100%;
  color: #ADCF4F;
  line-height: 1.3;
}

.recnonforme {
  background: white;
  color: #ADCF4F;
  line-height: 1.3;
  position: relative;
  top: 50%;
  transform: translateY(-50%);

}

.recnonformetitre1 {
  font-size: 20px;
}

.recnonformetitre2 {
  font-size: 15px;
  color: #2A2C2B;
  font-weight: bold;
}

.recnonformenbre {
	webkit-border-radius: 50;
	-moz-border-radius: 50;
    border-radius: 50px;
    font-family: Arial;
    color: #ffffff;
    font-size: 20px;
    padding: 5px 8px 4px 8px;
    text-decoration: none;
    position: absolute;
    top: 0px;
    right: 12px;
    background: #9CCC65;
    text-align: center;
    line-height: 41px;
    font-weight: 600;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}
/* P0221 */
.portletwebwrapper{
	height: auto;
	margin: 0 auto;
    position: relative;
}

.portletwebimg{
    width: 100%;
    height: 200px;
    background: url("img/imgPortlet/student.jpg") no-repeat center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    overflow: hidden;
}

.portletwebimg .portletwebcaption{
    margin-top: 20px;
	text-align:center;
	
}

.portletwebimg .portletwebcaption p{
    display: inline-block;
    color: #000;
    font-weight: lighter;
    font-size: 35px;
    background: rgba(255, 255, 255, 0.6);
    margin-bottom: 2px;
    text-transform: uppercase;
    z-index: 8888;
}


.portletwebfeatures{
    width: 100%;
    padding-top: 20px;
    background: #f7f7f7;
    padding-left: 25px;
    overflow: hidden;
}
.portletwebfeatures3{
    width: 100%;
    padding-top: 20px;
    background: #f7f7f7;
    overflow: hidden;
}

.portletwebfeatures .portletwebfeature{
    display: block;
    width: 28.83333333333333%;
    height: auto;
    float: left;
    margin-right: 6.666666666666667%;
    margin-bottom: 50px;
}

.portletwebfeatures3 .portletwebfeature3{
    display: block;
    width: 28.83333333333333%;
    height: auto;
	    margin-left: 159px;
    float: left;
    margin-right: 6.666666666666667%;
    margin-bottom: 50px;
}
.portletwebfeatures31 .portletwebfeature31{
    display: block;
    width: 100%;
    height: auto;
    float: left;
    background-color: white;

}

.portletwebfeatures .portletwebfeature:nth-child(3n+0)
{
    margin-right: 0;
}
.portletwebfeatures3 .portletwebfeature3:nth-child(3n+0)
{
    margin-right: 0;
}
.portletwebfeatures31 .portletwebfeature31:nth-child(3n+0)
{
    margin-right: 0;
}

.portletwebfeature3 .portletwebficon{
    display: block;
	padding-top: 8px;
    width: 18.78612716763006%;
    float: left;
}

.portletwebfeature31 .portletwebficon{
    display: block;
    margin-left:4%;
	padding-top: 8px;
    width: 4%;
    float: left;
}
.portletwebfeature .portletwebficon{
    display: block;
	padding-top: 8px;
    width: 18.78612716763006%;
    float: left;
}
.portletwebfeature2 .portletwebficon2{
	display: block;
    padding-left: 34px;
    width: 42px;
    float: left;
}

.portletwebfeature .portletwebdetails_exp{
    display: block;
    width: 69.36416184971098%;
    float: left;
}

.portletwebfeature3 .portletwebdetails_exp{
    display: block;
    width: 69.36416184971098%;
    float: left;
}
.portletwebfeature31 .portletwebdetails_exp{
    display: block;
    width: 69.36416184971098%;
    float: left;
}
.portletwebfeature3 h3{
    margin-bottom: 4px;
    color: #767575;
	
    font-weight: bold;
}
.portletwebfeature31 h3{
    margin-bottom: 4px;
    color: #767575;
	
    font-weight: bold;
}
.portletwebfeature h3{
    margin-bottom: 4px;
    color: #767575;
	
    font-weight: bold;
}

.portletwebfeature p{
    margin-bottom: 20px;
    color: #9e9e9e;
    font-size: 15px;
    line-height: 22px;

}
.portletwebfeature3 p{
    margin-bottom: 20px;
    color: #9e9e9e;
    font-size: 15px;
    line-height: 22px;

}
.portletwebfeature31 p{
    margin-bottom: 20px;
    color: #9e9e9e;
    font-size: 15px;
    line-height: 22px;

}
.portletwebfeature3 a{
    color: #848484;
    font-size: 12px;
    text-decoration: none;
    letter-spacing: .5px;
}
.portletwebfeature31 a{
    color: #848484;
    font-size: 12px;
    text-decoration: none;
    letter-spacing: .5px;
}
.portletwebfeature a{
    color: #848484;
    font-size: 12px;
    text-decoration: none;
    letter-spacing: .5px;
}

.portletwebfeature3 a:hover{
    color: #353434;
}
.portletwebfeature31 a:hover{
    color: #353434;
}
.portletwebfeature a:hover{
    color: #353434;
}

.portletwebfeature a span{
    font-family: arial;
    margin-left: 10px;
}

.portletwebfeature3 a span{
    font-family: arial;
    margin-left: 10px;
}
.portletwebfeature31 a span{
    font-family: arial;
    margin-left: 10px;
}

.portletwebinfo{
    width: 100%;
    overflow: hidden;
    background: #3b3b3b;
}

.portletwebinfo_pic{
    display: block;
    width: 50%;
    height: 405px;
    float: left;
    background: url("img/imgPortlet/workspace.jpg") no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

.portletwebinfo_details{
    display: block;
    width: 50%;
    height: 245px;
    float: left;
    padding: 40px 0;
}

.portletwebinfo_details h3{
    color: #fff;    
    font-size: 20px;
    font-weight: bold;
    font-weight: bold;
    text-transform: uppercase;
    margin: 0 0 3.333333333333333% 40px;
    letter-spacing: 1px;
    line-height: 40px;
}

.portletwebinfo_details p{
    color: #ededed;
    font-size: 16px;
    max-width: 560px;
    margin: 0 0 3.333333333333333% 40px;
    letter-spacing: 1px;
    line-height: 30px;
}

.portletwebinfo_details a{
    color: #fff;
    font-size: 16px;
    margin: 0 0 0 40px;
    text-decoration: none;
}
.portletwebinfo_details2 a{
    color: #fff;
	    margin: 0;
    font-size: 16px;
    text-decoration: none;
}

.portletwebinfo_details a span{
    margin-left: 10px;
}

.tempsmoydem {
  width: 100%;
  vertical-align: middle;
  margin-right: 0.3125em;
  font-size: 16px;
  opacity: 1;
  transition: opacity .2s ease;
}


.tempsmoydemdetail {
  padding: 10px;
  background: white;

}
.tempsmoydemjours 
.tempsmoydemjourstitre {
  display: block;
}

.tempsmoydemjours {
  font-size: 1.5em;
  color: #383838;
}

.tempsmoydemjourstitre {
    font-size: 14px;
    text-align: center;
}

.tempsmoydemjourstitre2 {
  position: relative;
  display: block;
  padding: .6em;
  font-size: 16px;
  text-decoration: none;
  color: rgba(0, 0, 0, 0.6);
}

.tempsmoydemdiv .tempsmoydemjourstitre2 {
  background: #a7d155;
      text-align: center;
    font-weight: bold;
}



.tempsmoydemjourstitre2:before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  display: block;
  width: 0;
  height: 0;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-style: solid;
}

.tempsmoydemdiv .tempsmoydemjourstitre2:before {
  border-color: transparent transparent #a7d155;
}






/* portail collaborateur fca 22-11-22 */
.illustration-header  { 
    display: flex; 
    align-items: center; 
    padding: 10px; 
    border-radius: 8px; 
    background: white; 

} 
.illustration-header1  { 
    padding: 10px; 
    border-radius: 8px; 
    background: #FCF1DB; 
} 
.illustration-header12_violet  { 
    border-radius: 8px; 
    background: #1E3658; 
    height: 100%;
	 min-height: -moz-available;
} 
.illustration-header12_bleu  { 
  	height: 100%;
    border-radius: 8px; 
    background: #f0fcff; 
} 
.illustration-header12  { 
    padding: 10px; 
    border-radius: 8px; 
    background: #F6D32A; 
} 
.illustration-header123  { 
	padding: 10px;
    border-radius: 8px;
    background: white;
    width: 50%; 
}
.cards_port_2  { 
display :flex;
background-color: #F1F4F8;
}
.illustration-header1234 {
    padding: 10px;
    border-radius: 8px;
    background: white;
    margin-right: 11px;
} 
.d-flex { 
    display: flex !important;
} 

.flex-column { 
    flex-direction: column !important;
} 
.button_forma_wid {
background-color: #FFA800;
    border: none;
    color: white !important;
    padding: 8px 6px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    margin: 4px 2px;
    border-radius: 8px;
    cursor: pointer;
}


.body1 { 
    display:  flex; 
    margin:    0px; 
    font-family:    Poppins, Helvetica, "sans-serif"; 
    font-size:    13px !important; 
    font-weight:    400; 
    line-height:    var(--bs-body-line-height); 
    color:   #181C32;
    text-align:    var(--bs-body-text-align); 
    /* background-color:  #F5F8FA; */
    -webkit-text-size-adjust:    100%; 
    -webkit-tap-highlight-color:    rgba(0, 0, 0, 0);
    height:   100%; 
    padding:   0px; 
    -webkit-font-smoothing:   antialiased; 
    -moz-osx-font-smoothing:   grayscale;
    flex-direction:  column; 
} 

.html1 { 
    font-family:  Poppins, Helvetica, "sans-serif"; 
    text-size-adjust:  100%; 
    -webkit-text-size-adjust:  100%; 
    -webkit-tap-highlight-color:  rgba(0, 0, 0, 0);
    margin: 0px; 
    padding: 0px; 
    font-size: 13px !important; 
    font-weight: 400; 
    -webkit-font-smoothing: antialiased; 
    -moz-osx-font-smoothing: grayscale;
} 


.flex-wrap { 
    flex-wrap: wrap !important;
} 

.mb-3 { 
    margin-bottom: 0.75rem !important;
} 

@media (min-width: 576px){ 
  .flex-sm-nowrap { 
    flex-wrap: nowrap !important;
  } 
}     

.overflow-auto { 
    overflow: auto !important;
} 

.h-55px { 
    height: 55px !important;
} 

.me-7 { 
    margin-right: 1.75rem !important;
	padding-left: 4px;
    padding-top: 4px;
} 
.flex-grow-1 { 
    flex-grow: 1 !important;
} 

.flex-nowrap { 
    flex-wrap: nowrap !important;
} 

.fs-5 { 
    font-size: 1.15rem !important;
} 

.fw-bolder { 
    font-weight: 600 !important;
} 

.border-transparent { 
    border-color: transparent !important;
} 


.position-relative { 
    position: relative !important;
} 


.justify-content-between { 
    justify-content: space-between !important;
} 

.align-items-start { 
    align-items: flex-start !important;
} 

.mb-2 { 
    margin-bottom: 0.5rem !important;
} 

.flex-stack { 
    justify-content: space-between; 
    align-items: center;
} 

.symbol.symbol-100px.symbol-fixed > img  { 
    width: 100px; 
    height: 100px; 
    max-width: auto;
} 

@media (min-width: 992px){ 
  .symbol.symbol-lg-160px.symbol-fixed > img  { 
    width: 155px; 
    height: 155px; 
    max-width: auto;
	border-radius: 8px;
  } 
}     

.translate-middle { 
    transform: translate(-50%, -50%) !important;
} 

.border { 
    border: 1px solid #EFF2F5 !important;
} 

.border-white { 
    border-color: #ffffff !important;
} 

.border-4 { 
    border-width: 4px !important;
} 

.bg-success { 
    --bs-bg-opacity: 1; 
    background-color: #51cd89 !important;
} 

@media (min-width: 576px){ 
  .w-sm-300px { 
    width: 300px !important;
  } 
}     

.me-6 { 
    margin-right: 1.5rem !important;
} 

.me-3 { 
    margin-right: 0.75rem !important;
} 

.me-0 { 
    margin-right: 0 !important;
} 

.w-100 { 
    width: 100% !important;
} 

.mt-auto { 
    margin-top: auto !important;
} 

.h-5px { 
    height: 5px !important;
} 

.bg-light { 

    background-color:  #f5f8fa !important;
} 

.me-1 { 
    margin-right: 0.25rem !important;
} 

.fs-2 { 
    font-size: calc(1.275rem + 0.3vw) !important;
} 


.me-5 { 
    margin-right: 1.25rem !important;
} 

.text-gray-400 { 
    color: #8e8e93 !important;
} 
.py-3 { 
    padding-top: 0.75rem !important; 
    padding-bottom: 0.75rem !important;
} 
.py-3_header { 
    padding-top: 1.75rem !important; 
    padding-bottom: 0.75rem !important;
}

.px-4 { 
    padding-right: 1rem !important; 
    padding-left: 1rem !important;
} 

.rounded { 
    border-radius: 0.475rem !important;
} 

.min-w-125px { 
    min-width: 125px !important;
} 
.min-w-190px { 
    min-width:165px !important;
} 
.border-gray-300 { 
    border-color: #E4E6EF !important;
} 

.border-dashed { 
    border-style: dashed !important; 
    border-color: #E4E6EF;
} 


.text-hover-primary {
   background-color: #E8FFF3;
   margin-top: -8px;
    border-radius: 8px;
    padding-left: 9px;
    padding-top: 9px;
    padding-right: 9px;
    padding-bottom: 6px;
    color: #51CD89 !important;
}
.me-1c {
margin-left: 8px !important;
    margin-top: 1px;
}
.prog { 
    color: black !important;
} 

.haut_svg_img { 
    width: 280px !important;
    left: 30px;
    top: 11px;
    position: relative;
} 
.padd_butt  { 
     padding-top: 37px;
} 

/* portlet tablelist tache */

/* #main-panel-body_4  .gridbox_dhx_skyblue {  */
/*     background-color: #5D78FB !important; */
/*     padding-left: 59% !important; */
/*     padding-top: 2px; */
/*     background: url("img/imgPortlet/formation12.svg") no-repeat; */
/* }  */

/* #main-panel-body_4 {  */
/*     overflow: hidden !important; */
/* } */
/* #main-panel-body_4   tr.ev_dhx_skyblue {  */
/*      background-color: transparent !important; */
    
/* }  */
/* #main-panel-body_4   div.gridbox_dhx_skyblue table.hdr td {  */
/*      background-color: #5D78FB !important; */
/*      border-bottom: 0px !important; */
/*      color: white !important; */
/*      font-size: 21px !important; */
    
/* }  */


/* #main-panel-body_4  div.gridbox .objbox div.gridbox_dhx_skyblue table.obj.row20px tr td  {  */
/*      background-color: transparent !important;     */
/* }  */
/* #main-panel-body_4  div.gridbox_dhx_skyblue .odd_dhx_skyblue {  */
/*      background-color: transparent !important;     */
/* }  */
/* #main-panel-body_4   div.gridbox_dhx_skyblue table.obj.row20px tr td  {  */
/*      background-color: transparent !important;   */
/*      border-bottom: 0px  !important;   */
/*      color: white !important; */
/* }  */
/* #main-panel-body_4  div.gridbox .objbox  {  */
/*      background-color: transparent !important;     */
/*      overflow-x: hidden !important; */
/*      color: white !important; */
/* } */
/* #main-panel-body_4  div.gridbox_dhx_skyblue .ftr, div.gridbox_dhx_skyblue .xhdr { */

/*     border-bottom: 0px solid #E4E4E4 !important; */
/* } */
/* #main-panel-body_4  .ev_dhx_skyblue, .odd_dhx_skyblue { */

/*     height: 0px !important; */
/* } */

/* #main-panel-body_4, #containerPortail .jFoedPanel-gridTd div.main-panel-body {  */
/*      background-color: #F1F4F8 !important;     */

/* } */

/* #portlet_376_616-maintdValue {  */
/*      background-color: #F1F4F8 !important;     */

/* } */
#portlet_376_61-tdMain  {
    top: -199px;
    position: relative;
    background-color: transparent !important;
}

.alerte_habili_table2 {   
    height: 11px;
    width: 3px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 12px;
    border-radius: 34px;   
    padding-top: 9px;
    margin-left: 13px;
    background-color: #ffa800;
}
.odd_dhx_skyblue .alerte_habili_table2 {
    height: 13px !important;
}
 .ev_dhx_skyblue  .alerte_habili_table2 {
    height: 13px !important;
}
div.gridbox_dhx_skyblue .ftr, div.gridbox_dhx_skyblue .xhdr {
    background-color: #ffffff !important;
  }
  
  
/*   07/07/2023 portlet header liens*/
.illustration-header_liens  { 

    align-items: center; 
    padding: 10px; 
    border-radius: 10px; 
    background: white; 

}
#containerPortail .jFoedPanel-gridTd {
    border-radius: 8px !important;
}
.circle {
	display: inline-table;
    vertical-align: middle;
    width: 110px;
    height: 110px;
    background-color: #E7F4FE;
    border-radius: 50%;
    left: 15%;
    position: relative;
    top: 14%;
}

.circle__content {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-size: 40px;
}
.alerterefonte .portletTitre{
    background: url(img/imgPortlet/alerte_icone.svg) no-repeat;
    background-position: 0 -2px;
    background-repeat: no-repeat;
    padding-left: 31px;
    height: 30px;
    width: 100%;
    top: 9px;
    left: 10px;
    position: relative;
    margin-left: 10px;
    color: #181C32 !important;
    font-size: 15px;
    border-left: 0px solid rgb(86, 212, 235) !important;
    font-family: Poppins, Helvetica, "sans-serif";
    font-weight: 400;
}
.envconsorefonte .portletTitre{
    background: url(img/imgPortlet/env_conso_icone.svg) no-repeat;
    background-position: 0 -2px;
    background-repeat: no-repeat;
    padding-left: 31px;
    height: 49px;
    width: 100%;
    top: 9px;
    left: 10px;
    position: relative;
    margin-left: 10px;
    color: #181C32 !important;
    font-size: 15px;
    border-left: 0px solid rgb(86, 212, 235) !important;
    font-family: Poppins, Helvetica, "sans-serif";
    font-weight: 400;
}
.barchartrefonte .portletTitre{
    background: url(img/imgPortlet/bar_chart_refonte.svg) no-repeat;
    background-position: 0 -2px;
    background-repeat: no-repeat;
    padding-left: 31px;
    height: 49px;
    width: 100%;
    top: 9px;
    left: 10px;
    position: relative;
    margin-left: 10px;
    color: #181C32 !important;
    font-size: 15px;
    border-left: 0px solid rgb(86, 212, 235) !important;
    font-family: Poppins, Helvetica, "sans-serif";
    font-weight: 400;
}
.bilan6ansrefonte .portletTitre{
    background: url(img/imgPortlet/bilan6ans.svg) no-repeat;
    background-position: 0 -2px;
    background-repeat: no-repeat;
    padding-left: 31px;
    height: 49px;
    width: 100%;
    top: 9px;
    left: 10px;
    position: relative;
    margin-left: 10px;
    color: #181C32 !important;
    font-size: 15px;
    border-left: 0px solid rgb(86, 212, 235) !important;
    font-family: Poppins, Helvetica, "sans-serif";
    font-weight: 400;
}

.ok_inscription {
    background: url(img/imgPortlet/ok_inscrit1.png) no-repeat;
    height: 16px;
    width: 20px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -5px;
    padding-right: 10px;
    margin-top: -2px;
}

.ko_inscription {
    background: url(img/imgPortlet/ko_inscrit1.png) no-repeat;
    height: 16px;
    width: 20px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -5px;
    padding-right: 10px;
    margin-top: -2px;
}