@import url(https://fonts.googleapis.com/css?family=Lato);
@import url('https://fonts.googleapis.com/css?family=Quicksand');



.loader {
    border: 8px solid #f3f3f3;
    border-top: 8px solid red;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    animation: spin 2s linear infinite;
  }
  
  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }


/* Style spécifique pour Firefox */
.firefox-style {
    padding-right: 10px;
}

/***************************/
/* Hide scrollbar for Chrome, Safari and Opera */
.scroll-hide::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.scroll-hide {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.input-hide::-webkit-inner-spin-button, ::-webkit-outer-spin-button { 
	-webkit-appearance: none;
}

.not-scroll-hide {
    scrollbar-width: auto;
}


/**************************/
.lds-spinner {
  background: transparent;
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-spinner div {
  transform-origin: 40px 40px;
  animation: lds-spinner 1.2s linear infinite;
}
.lds-spinner div:after {
  content: " ";
  display: block;
  position: absolute;
  top: 3px;
  left: 37px;
  width: 6px;
  height: 18px;
  border-radius: 20%;
  background: linear-gradient(347.05deg, rgb(253, 49, 89) 9.84%, rgb(253, 80, 90) 91.14%);
}
.lds-spinner div:nth-child(1) {
  transform: rotate(0deg);
  animation-delay: -1.1s;
}
.lds-spinner div:nth-child(2) {
  transform: rotate(30deg);
  animation-delay: -1s;
}
.lds-spinner div:nth-child(3) {
  transform: rotate(60deg);
  animation-delay: -0.9s;
}
.lds-spinner div:nth-child(4) {
  transform: rotate(90deg);
  animation-delay: -0.8s;
}
.lds-spinner div:nth-child(5) {
  transform: rotate(120deg);
  animation-delay: -0.7s;
}
.lds-spinner div:nth-child(6) {
  transform: rotate(150deg);
  animation-delay: -0.6s;
}
.lds-spinner div:nth-child(7) {
  transform: rotate(180deg);
  animation-delay: -0.5s;
}
.lds-spinner div:nth-child(8) {
  transform: rotate(210deg);
  animation-delay: -0.4s;
}
.lds-spinner div:nth-child(9) {
  transform: rotate(240deg);
  animation-delay: -0.3s;
}
.lds-spinner div:nth-child(10) {
  transform: rotate(270deg);
  animation-delay: -0.2s;
}
.lds-spinner div:nth-child(11) {
  transform: rotate(300deg);
  animation-delay: -0.1s;
}
.lds-spinner div:nth-child(12) {
  transform: rotate(330deg);
  animation-delay: 0s;
}
@keyframes lds-spinner {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}


/**************************/

#my-react-component-date3 {
    position: relative;
}
#my-react-component-date3 .react-datepicker-component  {
    border: none;
    height: 31px;
    background: rgb(229, 235, 239);
    border-radius: 3px;
}
#my-react-component-date3 .react-datepicker-component .react-datepicker-input input {
    font-family: "Lato";
    font-size: 11px;
    color: #363636;
}
#my-react-component-date3 .react-datepicker .react-datepicker-container .react-datepicker-top  {
    background: linear-gradient(#FE526C, #FE5250);
    border-top: 1px solid #FFFFFF;
    border-left: 1px solid #FFFFFF;
    border-right: 1px solid #FFFFFF;
	width:400px;
}
#my-react-component-date3 .react-datepicker .react-datepicker-container .react-datepicker-body  {
	border-left: none;
    border-right: none;
	width:400px;
}
/**************************
** INPUT TYPE DATE START **
***************************/
#my-react-component-date {
    position: relative;
}
#my-react-component-date .react-datepicker-component .react-datepicker-input {
    border: none;
    height: 31px;
    background: rgb(229, 235, 239);
    border-radius: 3px;
}
#my-react-component-date .react-datepicker-component .react-datepicker-input input {
    font-family: "Lato";
    font-size: 11px;
    color: #363636;
}
#my-react-component-date .react-datepicker .react-datepicker-container .react-datepicker-top {
    background: linear-gradient(#FE526C, #FE5250);
    border-top: 1px solid #FE5250;
    border-left: 1px solid #FE5250;
    border-right: 1px solid #FE5250;
}
/**************************
** INPUT TYPE DATE START **
***************************/
#my-react-component-date2 {
    position: relative;
}
#my-react-component-date2 .react-datepicker-component .react-datepicker-input {
    border: none;
    height: 0px;
    width: 0px;
    background: rgb(229, 235, 239);
    border-radius: 3px;
}
#my-react-component-date2 .react-datepicker-component .react-datepicker-input input {
    font-family: "Lato";
    font-size: 11px;
    color: #363636;
    width:0;
    height:0;
    overflow: hidden;
}
#my-react-component-date2 .react-datepicker .react-datepicker-container .react-datepicker-top {
    background: linear-gradient(#FE526C, #FE5250);
    border-top: 1px solid #FE5250;
    border-left: 1px solid #FE5250;
    border-right: 1px solid #FE5250;
}

/**************************
** INPUT TYPE DATE START **
***************************/
#my-react-component-date21 {
    position: relative;
    
}
#my-react-component-date21 .react-datepicker-component .react-datepicker-input {
    border: none;
    height: 0px;
    width: 0px;
    background: rgb(229, 235, 239);
    border-radius: 3px;
}
#my-react-component-date21 .react-datepicker-component .react-datepicker-input input {
    font-family: "Lato";
    font-size: 11px;
    color: #363636;
    width:0;
    height:0;
    overflow: hidden;
}
#my-react-component-date21 .react-datepicker .react-datepicker-container .react-datepicker-top {
    background: linear-gradient(#FE526C, #FE5250);
    border-top: 1px solid #FE5250;
    border-left: 1px solid #FE5250;
    border-right: 1px solid #FE5250;
}

#my-react-component-date21 .react-datepicker-component .react-datepicker {
    right: -150px;
}
/************************
** INPUT TYPE DATE END **
*************************/

/**************************
** INPUT TYPE DATE START **
***************************/
#my-react-component-date211 {
    position: relative;
}
#my-react-component-date211 .react-datepicker-component .react-datepicker-input {
    border: none;
    height: 0px;
    width: 0px;
    background: rgb(229, 235, 239);
    border-radius: 3px;
}
#my-react-component-date211 .react-datepicker-component .react-datepicker-input input {
    font-family: "Rubik";
    font-size: 11px;
    color: #363636;
    width:0;
    height:0;
    overflow: hidden;
}
#my-react-component-date211 .react-datepicker .react-datepicker-container .react-datepicker-top {
    background: linear-gradient(#FE526C, #FE5250);
    border-top: 1px solid #FE5250;
    border-left: 1px solid #FE5250;
    border-right: 1px solid #FE5250;
}

#my-react-component-date211 .react-datepicker-component .react-datepicker {
    right: -150px;
}

/************************
** INPUT TYPE DATE END **
*************************/


/**************************
** INPUT TYPE DATE START **
***************************/
#my-react-component-date22 {
    position: relative;
    
}
#my-react-component-date22 .react-datepicker-component .react-datepicker-input {
    border: none;
    height: 0px;
    width: 0px;
    background: rgb(229, 235, 239);
    border-radius: 4px;
}
#my-react-component-date22 .react-datepicker-component .react-datepicker-input input {
    font-family: Rubik;
    font-size: 11px;
    color: #363636;
    width:0;
    height:0;
    overflow: hidden;
}
#my-react-component-date22 .react-datepicker .react-datepicker-container .react-datepicker-top {
    background: linear-gradient(#FE526C, #FE5250);
    border-top: 1px solid #FE5250;
    border-left: 1px solid #FE5250;
    border-right: 1px solid #FE5250;
}

#my-react-component-date22 .react-datepicker-component .react-datepicker {
	top:25px;
	right: 5px;
}
/************************
** INPUT TYPE DATE END **
*************************/

/************************
** FOOTER BOUTTON **
*************************/
.footer-boutton{
	display:flex;
	width:100%;
	height:77px;
	justify-content:center;
	align-items:center;
	background-color:rgba(216, 216, 216, 0.29);
	position:fixed;
	bottom:0
}

/*----------------------------------------------------------------------------------------
										commons
-----------------------------------------------------------------------------------------*/
@font-face {
 font-family: "Lato";
    src : url('/fonts/Lato-Regular.ttf');
}
@font-face {
    font-family: "lato";
       src : url('/fonts/Lato-Regular.ttf');
   }

@font-face {
 font-family: "Lato-Bold";
    src : url('/fonts/Lato-Bold.ttf');
}

@font-face{
    font-family : "Lato-Light";
    src : url('/fonts/Lato-Light.ttf');
}

@font-face{
    font-family : "Lato-Black";
    src : url('/fonts/Lato-Black.ttf');
}

@font-face{
    font-family : "Lato Black";
    src : url('/fonts/Lato-Black.ttf');
}

@font-face{
    font-family : "Lato-SemiBold";
    src : url('/fonts/Lato-SemiBold.ttf');
}

@font-face{
    font-family : "Roboto-Bold";
    src : url('/fonts/Roboto-Bold.ttf');
}

@font-face{
    font-family : "Lato-Medium";
    src : url('/fonts/Lato-Medium.ttf');
}

@font-face{
    font-family : "Rubik";
    src : url('/fonts/Rubik-Regular.ttf');
}

@font-face{
    font-family : Rubik-Medium;
    src : url('/fonts/Rubik-Medium.ttf');
}

@font-face{
    font-family : Rubik-Light;
    src : url('/fonts/Rubik-Light.ttf');
}

::-moz-placeholder {
  opacity: 1;
}

p{
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.no-map-user{
    font-family: Rubik-Light;
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 150%;
    color: #7F7F7F;
}

.project-detail-title{
    font-family: Rubik;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #FFFFFF;
}

.cta-text{
    font-family: Rubik;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #FFFFFF;
}

.menu-navigation-wrapper-active-not{
    height: 41px;
    display: flex;
    flex-direction: column;
    padding: 6px 16px; 
    margin: 0 17px;
}

.drag-drop-selected-broadcast{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
    text-align: center;
    color: #9C9CAC;
}

.broadcast-sequence{
    font-family: Rubik-Medium;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #000000;
}

.broadcast-course{
    font-family: Rubik-Medium;
    font-style: normal;
    font-weight: 500;
    font-size: 28px;
    line-height: 33px;
    color: #000000;
    margin-bottom: 8px;
}

.title-listing{
    font-family: Rubik-Medium;
    font-style: normal;
    font-weight: 500;
    font-size: 28px;
    line-height: 32px;
    color: #000000;
}

.menu-navigation-wrapper-active{
    height: 41px;
    display: flex;
    flex-direction: column;
    padding: 6px 16px;
    background: linear-gradient(339.69deg, #FD3159 15.38%, #FD5250 88.37%);
    border-radius: 4px;
    margin: 0 17px;
}

.menu-navigation-subtitle{
    font-family: Rubik;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #BFBFBF;
}

.menu-navigation-title{
    font-family: Rubik;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #FFFFFF;
}

.project-description-title-section{
    font-family: Rubik-Medium;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #000000;
}

.project-description-info-section{
    font-family: Rubik;
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 150%;
    color: #7F7F7F;
}

.project-miniature-info{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #FFFFFF;
}

.notif-text-bold{
    font-family: Rubik-Medium;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #000000;
}

.notif-text{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 20px;
    color: #000000;
}

.cta-wrapper{
    display: flex;
    flex-direction: row;
    padding: 12px 32px;
    background: linear-gradient(347.05deg, #FD3159 9.84%, #FD505A 91.14%);
    box-shadow: 0px 4px 8px rgba(253, 49, 89, 0.2);
    border-radius: 4px;
    cursor: pointer;
}

.none{
    display:none;
}

.trash-cta{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 20px;
    color: #7F7F7F;
}

.course-title-search{
    font-family: Rubik;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    color: #000000;
}

.type-title-broadcast{
    font-family: Rubik;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    display: flex;
    align-items: center;
    color: #000000;
}

.select-rubik{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 150%;
    color: #FD5250;
}

.type-information-broadcast{
    font-family: Rubik;
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 150%;
    color: #7F7F7F;
}

.etoile-evaluation{
      display:flex;flex:0;flex-direction:row; justify-content:center;align-items:center;margin:0px 2px 0px 0px;
      color: #FFCB28;font-size: 16px;
   }
.alert-text{
	color: #FD9800;	
	font-family: Lato;	
	font-size: 13px;	
	line-height: 21px;
	margin:0;
}

.alert-text-name{
	margin:0;
	color: #FD9800;	
	font-family: Lato-Bold;	
	font-size: 13px;	
	line-height: 21px;
}

.select-text{
   color: #363636;	
    font-family: Lato-Bold;	
    font-size: 11px;
    line-height: 13px;
    margin:0;
    font-weight: initial;
}

.activity-competence{
    margin:0;
    color: #FD9800;	
    font-family: Lato-Bold;	
    font-size: 14px;	
    line-height: 18px;
}

.reponse-tx{
    margin:0;
    color: #417505;	
    font-family: Lato-Medium;	
    font-size: 12px;	
    line-height: 18px;	
    text-align: center;
}

.alt-word{
    margin:0;
    color: #797979;	
    font-family: Lato;	
    font-size: 10px;	
    font-style: italic;	
    line-height: 12px;	
    text-align: center;
}

.activity-main{
    margin:0;
    color: #000000;	
    font-family: Lato-Bold;	
    font-size: 14px;
    line-height: 18px;
}
.activity-other{
    margin:0;
    color: #000000;	
    font-family: Lato;	
    font-size: 14px;	
    line-height: 18px;
}
.number-404{
    color: #DEB01E;	
    font-family: Lato-Black;	
    font-size: 100px;	
    letter-spacing: 10.77px;	
    line-height: 100px;
    margin:0;
}

@keyframes float {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(-20px);
	}
	100% {
		transform: translatey(0px);
	}
}

.number-animation{
	transform: translatey(0px);
	animation: float 3.2s ease-in-out infinite;
}

.number-error{
    margin:0;
    color: #828282;	
    font-family: Lato-Light;	
    font-size: 36px;	
    letter-spacing: 1px;	
    line-height: 44px;	
    text-align: center;
}

.video-time{
    color: #B9BDD0;	
    font-family: Lato-SemiBold;	
    font-size: 12px;	
    line-height: 15px;
    margin:0;
}

.link-input{
    background-color: #E5EBEF;
    color: #363636;	
    margin:0;
    font-family: Lato-SemiBold;	
    font-size: 12px;	
    line-height: 15px;
}

.link-inactive{
    margin:0;
    color: #FE5250;	
    font-family: Lato-Bold;	
    font-size: 10px;	
    line-height: 12px;
}

.video { 
position: fixed; right: 0; bottom: 0;
min-width: 100%; min-height: 100%;
width: auto; height: auto; z-index: 0;
background-size: cover; 
}

.video-title{
    color: #FFFFFF;	
    font-family: Lato-Bold;	
    font-size: 16px;
    line-height: 18px;
    margin:0;
}

.autoeval-checkbox{
    cursor: pointer;
    box-sizing: border-box;	
    max-height: 19px;	
    min-width: 19px;	
    border: 1px solid #E4E4E4;	
    border-radius: 3px;	
    background-color: #E9EAEB;
}

.autoeval-checkbox-checked{
    max-height: 19px;	
    cursor: pointer;
    min-width: 19px;	
    border-radius: 3px;	
    background-color: #FE5250;
}

.video-name{
    color: #FFFFFF;	
    font-family: Lato-Bold;	
    font-size: 12px;
    line-height: 25px;
    margin:0;
}

.close-icone-texte{
    color: #B9BDD0;	
    font-family: Lato-SemiBold;	
    font-size: 12px;	
    line-height: 15px;
    margin:0;
}

.projet-lie{
    margin:0;
    color:#000000;
    font-family:Lato-Bold; 
    font-size:14px; 
    line-height:25px;
}

.projet-lie-title{
    color: #000000;	
    margin:0;
    font-family: Lato;	
    font-size: 12px;	
    line-height: 18px;
}

.identite-title {
	color: #000000;	
	font-family: Lato;	
	font-size: 12px;	
	font-weight: bold;	
    line-height: 18px;
}

.projet-create-nom{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 108%;
    margin-left: 8px;
}

.pdf-reponse-wrapper{
    width:14px;
    height:14px;
    border-radius:7px;
    background-color:#E9766A;
}

.pdf-jauge-wrapper{
    display:flex;
    flex-direction:column;
    margin:10px 0px 0px 0px;
}

.pdf-jauge-reponse-wrapper{
    display:flex;
    flex-direction:column;
    border:#F2F2F2 1px solid;
    background-color:#FFFFFF;
    border-radius:14px;
    width:175px;
    height:30px;
    justify-content:center;
    align-items:center;
}

.pdf-jauge-value-wrapper{
    display:flex;
    flex-direction:row;
    width:100%;
    justify-content:center;
    align-items:center;
    position:absolute;
    background-color:rgba(255, 0, 0, 0.5);
    z-index:1;
}

.pdf-question-name{
    color:#363636;
    font-family:Lato;
    font-size:11px;
    line-height:16px;
}

.type-select{
    margin: 0;
    color: #979797;	
    font-family: Lato;	
    font-size: 11px;	
    line-height: 13px; 
}

.pdf-question-wrapper2{
    display:flex;
    flex-direction:row;
    height:83px;
}

.pdf-question-wrapper{
    display:flex;
    flex-direction:column; 
    width:196px;
    justify-content:flex-start;
    margin:11px;
}
.pdf-words-wrapper{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}

.pdf-word{
    color: #363636;	
    font-family: Roboto-Bold;
    font-size: 8px;
    letter-spacing: 0.2px;
    line-height: 10px;
    margin: 0;
    margin-right: 4px;
}

.pdf-word-wrapper{
    border: 1px solid #D6D6D6;	
    border-radius: 10px;	
    background-color: #FFFFFF;
    padding:4px 8px 4px 8px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom: 5px;
    margin-right: 5px;
}

.pdf-word-number{
    color: #E9766A;	
    font-family: Roboto-Bold;	
    font-size: 8px;
    letter-spacing: 0.2px;
    line-height: 10px;
    margin:0;
}

.dayline-no-stat{
    color: #828282;	
    font-family: Lato;
    font-size: 13px;
    font-style: italic;
    line-height: 25px;
    text-align: center;
    margin:0;
}

.moderation-text{
    color: #FE5250;	
    font-family: Lato-Bold;	
    font-size: 12px;
    line-height: 15px;
    margin:0;
}

.categorie-title-detail{
    font-family: Roboto-Bold;	
    font-size: 13px;
    line-height: 18px;	
    text-align: center;
    margin:0;
    color:#FFFFFF;
}

.pdf-question-number{
    color:#A5A5A5;
    font-family:Lato-Bold;
    font-size:10px;
    line-height:18px;
    margin:0;
}

.pdf-question-text-wrapper{
    display:flex;
    justify-content:center;
    align-items:center;
    margin:11px;
    width:105px;
}

.pdf-question-text{
    color:#919191;
    font-family:Lato;
    font-size:12px;
    line-height:11px;
    margin:0;
}

.pdf-question-jauge-wrapper{
    display:flex;
    align-items:center;
    flex:1;
}

.pdf-jauge-value{
    display:flex;
    height:4px;
    width:2px;
    background-color:#E9766A; 
    position:absolute;
}

.pdf-reponse-wrapper3{
    width:128px;
    border-radius:4px;
    height:4px;
    background-color:#CCCCCC;
    display:flex;
}

.pdf-reponse-wrapper2{
    border-radius:4px;
    height:4px;
    background-color:#403B4E;
    position:absolute;
    display:flex;
    justify-content:flex-end;
    align-items:center;
}

.pdf-reponse{ 
    color:#E9766A;
    font-family:lato;
    font-size:14px;
    line-height:16px;
    width:27px;
    position:absolute;
    margin:-22px 0px 0px 0px;
}

.pdf-jauge-termes-wrapper{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    width:175px;
    margin:2px 0px 0px 0px;
}

.pdf-jauge-terme-wrapper{
    display:flex;
    justify-content:center;
    align-items:center;
    height:27px;
    border-radius:10px;
    border:#F2F2F2 1px solid;
    background-color:#FFFFFF;
}

.pdf-jauge-terme{
    color:#363636;    
    font-size:9px;
    letter-spacing:0.2px;
    line-height:10px;
    font-family:roboto black;
    padding:7px 5px 5px 5px;
}

.pdf-subtitle{
    margin:0;
    color:#403B4E;
    font-family:Lato;
    font-size:11px;
    line-height:18px;
}

.pdf-wrapper-min{
    display:flex; 
    margin:36px 0 25px 20px;
}

.pdf-wrapper-min-max{
    display:flex; 
    flex-direction:column; 
    margin:20px 0 45px 0; 
    background-color:#FFF; 
}

.pdf-wrapper-max{
    display:flex; 
    margin:22px 0 25px 20px;
}

.pdf-questions-wrapper{
    display:flex;
    flex-direction:column;
    width:529px;
}

.pdf-min-max-title{
    margin:0;
    color:#E9766A;
    font-family:Lato;
    font-size:18px;
    font-weight:bold;
    line-height:22px;
}

.pdf-221{
     width:221px;
}
.pdf-105{
     width:105px;
}
.pdf-192{
     width:192px;
}

.pdf-subtitles-wrapper{
    display:flex;
    flex-direction:row;
    margin-bottom:8px;
}

.pdf-subtitle-wrapper{
    display:flex;
    justify-content:flex-start; 
    align-items:center;
    height:34px;
    border-radius:5px;
    background-color:rgba(255, 255, 255, 0.4);
    margin-right:5px;
    padding-left: 12.8px;
}

.pdf-date{
    color:#403B4E;
    font-family:Lato-Medium;
    font-size:10px;
    letter-spacing:0.83px;
    line-height:12px;
}

.pdf-header-wrapper{
    display:flex;
    flex-direction:column;
    width:595px;
    justify-content:center;
    align-items:center;
    height:162px;
    background-color:#FFF;
    margin-bottom:33px;
}

.pdf-titre{
    color:#403B4E;
    font-family:Lato-Light;
    font-size:25px;
    letter-spacing:1.25px;
    line-height:30px;
}

.pdf-body{
    background-color:#F2F1F7;
    display:flex;
    align-items:center;
    flex-direction:column;    
}

.titre-pdf {
    color:#E9766A;	
    font-family:Lato-Bold;	
    font-size:18px;
    line-height: 22px;
}

.pdf-titre-background{
    display:flex; 
    flex-direction:column; 
    width:90%;
    background-color:#FFF;
    margin-bottom:33px;
}

.identite-subtitle {
	color: #919191;	
	font-family: Lato;	
	font-size: 10px;	
	line-height: 18px;
}

.subTitle-bold{
    color: #797979;	
    font-family: Lato-Bold;	
    font-size: 11px;	
    line-height: 13px; 
    margin:0;
}

.text-tail{
	text-overflow:ellipsis;
	overflow:hidden; 
	white-space:nowrap;
	margin: 0
}

.identite-photo {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    min-width: 54px;
}

.identite-text-wrapper{
	overflow:hidden;
    padding-left:18px;
}

.broadcast-parcours-placeholder-search{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    color: #89889B;
}

.identite-wrapper{
    display:flex; 
    align-items:center;
    overflow: hidden;
}

.search-add {
    min-width: 34px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background-color: #FE5250;
}

.search-added {
    min-width: 34px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background-color: transparent;
    border-color: #DEB01E;
    border-width: 1px;
    border-style: solid;
}

.check-circle{
    font-size: 14px;
    color: #DEB01E;
}

.plus-white{
    font-size: 14px;
    color: #FFFFFF;
}

.search-element {
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: pointer;
    height: 85px;
    min-height: 85px;
    padding: 0px 49px 0px 24px;
    justify-content: space-between;
}

.none{
    display: none;
}

.placeholder{
    color: #979797;
    font-family: lato;
    font-size: 11px;
    font-weight: 500;
    line-height: 13px;
    padding: 0px 0px 0px 22px;
    border-width: 0px;
    width: 100%;
    height: 31px;
    border-radius: 3px;
    background-color: #E5EBEF;
}

.search-list{
    display: flex;
    flex-direction: column;
    width: 340px;
    margin: 15px 0px 0px;
    background-color: #F4F7F9;
    max-height: 260px;
    overflow-y: auto;
    position: absolute;
    border-radius: 0px 0px 10px 10px;
    z-index: 2;
}

.role{
    font-family: lato;
    font-size: 12px;
    line-height: 12px;
    margin: 0px;
    font-weight: bold;
}

.role-point{
    color: #A7A7A7;
    font-family: Lato;
    font-size: 9px;
    font-weight: bold;
    margin: 0px 3px;
    padding-top: 2px;
}



.search {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 17px 0px 18px;
    width: 340px;
}

.title{
    color: #979797;	
    font-family: Lato;	
    font-size: 11px;	
    font-weight: bold;	
    line-height: 13px;
    padding-right: 22px;
}

.scroll-container{
    height: 150px;
    width: 100%;
    overflow: hidden;
}

.scroll-child{
    display: flex;
    flex-flow: row wrap;
    height: 100%;
    overflow-y: scroll;
    width: 100%;
    padding-right: 17px;
    justify-content: space-between;
}

.title-modal{
    color: #000000;
    font-family:'lato';
    font-size: 16px;
    font-weight: bold;
    line-height: 18px;
    margin-left: 52px;
}

.modal-header{
    display: flex;
    flex-direction: row;
    height: 101px;	
    border-radius: 10px 10px 0 0;	
    background-color: #F0F3F5;	
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12);
    align-items:center;
    width:100%;
}

#modal-footer{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 13px 0px 26px;
}

.modal-confirm{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 33px;
    width: 129px;
    border-radius: 100px;
    background-color: #FE5250;
    color: #FFFFFF;
    font-family: lato;
    font-size: 12px;
    font-weight: bold;
    line-height: 15px;
    cursor: pointer;
}

.modal-cancel{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 33px;
    width: 115px;
    border-radius: 100px;
    color: #979797;
    font-family: lato;
    font-size: 12px;
    font-weight: bold;
    line-height: 15px;
    cursor: pointer;
}

.modal{
    display:flex; 
    flex-direction:column;
    justify-content:flex-start;
    margin:0;
}

#modal-content{
    display: flex;
    flex-direction: column;
    padding: 0px 67px 0px 68px;
}

.modal-info{
    display: flex;
    font-family: lato;
    font-size: 11px;
    line-height: 24px;
    text-align: center;
    white-space: pre-wrap;
}

.titre-delete-branch{
    color: #000000;	
    font-family: Lato;	
    font-size: 16px;	
    font-weight: bold;	
    line-height: 18px;
    margin : 0;
}

.icone-wrapper{
    min-height: 34px; 
    border-radius:50%;	
    min-width: 34px;	
    border-width:1px; 
    border-style:solid;
    border-color:#363636; 
    display:flex; 
    align-items:center;
    justify-content:center;
}

.modal-gestion{
    display: flex;
    flex-direction: column;
    width: 165px;
    border-radius: 8px;
    background-color: #FFFFFF;
    box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 2px 0px;
    position: absolute;
    margin: 0px 0px 0px 75px;
}

.modal-element{
    color: #000000;
    font-family: lato;
    font-size: 11px;
    line-height: 24px;
    font-weight: 400;
    margin: 0;
    padding-left:15px;
}

.modal-element:hover {
  background-color: #F0F3F5;
}

 /* Hide scrollbar for Chrome, Safari and Opera */
.scrollbar-hidden::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.scrollbar-hidden {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
} 

.underline-hover:hover{
    text-decoration: underline;
}

.notif-element{
  background-color: #FFFFFF;   
}

.notif-element:hover {
  background-color: #F2F3F5;
}


.competence-texte{
    color: #363636;	
    font-family: Lato-Bold;	
    font-size: 12px;	
    line-height: 15px;
    padding:7px 17px 8px 7px;
}

.competence-icone{
    min-width: 18px;
    height: 18px;
    border-radius: 50%;
    color: #FD9800;
    margin:6px 0 6px 10px;
}

.tag-icone{
    min-width: 18px;
    height: 18px;
    border-radius: 50%;
    color: #DFB734;
    margin:6px 0 6px 10px;
}

.competence-wrapper{
    display: flex;
    height: 30px;
    border-radius: 3px;
    background-color: rgba(151, 151, 151, 0.1);
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    margin-bottom: 10px;
	width: 100%;
}

.competence-wrapper-no-margin{
    display: flex;
    height: 30px;
    border-radius: 3px;
    background-color: rgba(151, 151, 151, 0.1);
    align-items: center;
    justify-content: center;
}

.competence-wrapper-no-margin-white{
    display: flex;
    height: 30px;
    border-radius: 3px;
    background-color: #FFFFFF;
    align-items: center;
    justify-content: center;
}

.element-choose:hover {
    background-color: #F4F7F9;
}

.element-dropdown:hover{
    background-color: #F0F3F5;
}
.element-menu:hover{
    background-color:#F2F3F5;
}
.element-dropdown{
    background-color: #FCFCFC;	
    margin:0;
    cursor:pointer;
    padding:4px 29px 4px 25px;
	min-height:40px;
	display:flex;
	flex-direction:row;
	align-items:center;
}

.element-dropdown:hover > div > p{
     color: #000000;
	 font-family:Rubik-Medium;
	 font-size:14px;
	 line-height:16px;
}

.menu-dropdown{
   display: none;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    background-color: #FFFFFF;
    border-radius: 8px;
    box-shadow:  0px 8px 16px rgba(20, 10, 34, 0.16);
    padding: 11px 0px;
    top:60px;
	right:52px;
    z-index: 9999;
}

.submenu-text-inactive{
    font-family: Lato;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #7F7F7F;
}

.submenu-text-active{
    font-family: Rubik;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #FD5250;
}

.element-dropdown-text{
    color: #828282;	
    font-family: Rubik;
    font-size: 14px;	
    line-height: 16px;
    margin:0;
    white-space: nowrap;
}


.label-choose {
	color: #828282;
	font-family: Lato;
	font-size: 12px;
	font-weight: bold;
	line-height: 15px;
}

.connexion-field{
    display:flex;
    flex-direction: row;
    align-items: center;
}

.connexion-label{	
    color: #979797;	
    font-family: Lato;	
    font-size: 12px;	
    font-weight: bold;	
    line-height: 15px;
    width:121px;
    margin: 0;
}

.card-connexion{
    height: 250px;	
    width: 539px;	
    border-radius: 10px;	
    background-color: #FFFFFF;
    padding:73px 0 0 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.container2{
    width: 100%;
    height: 100%;
}

.connexion-text-button {
    color: #FFFFFF;	
    font-family: Lato;	
    font-size: 12px;	
    font-weight: bold;	
    line-height: 15px;
    margin: 0;
}

.connexion-button {
    height: 33px;	
    padding:0 17px 0 17px;
    border-radius: 100px;	
    background-color: #FE5250;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor:pointer;
}

.connexion-password-forget{	
    color: #DEB01E;	
    font-family: Lato;	
    font-size: 11px;	
    font-weight: bold;	
    line-height: 18px;
    cursor:pointer;
}

.password-info{	
    color: #000000;	
    font-family: Lato;	
    font-size: 12px;	
    font-weight: bold;	
    line-height: 25px;
    margin:0;
}

.password-info-sub{	
   color: #363636;	
   font-family: Lato;	
   font-size: 12px;	
   line-height: 18px;
   margin:0;
}

.connexion-error-texte{
    color: #FE5250;	
    font-family: Lato;	
    font-size: 11px;	
    line-height: 18px;	
    margin:0;
}

.connexion-error-container{	
    border-radius: 0 0 10px 10px;	
    background-color: #FFF7F7;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.connect-title{	
    color: #000000;	
    font-family: Lato;	
    font-size: 14px;	
    font-weight: bold;	
    line-height: 18px;	
    margin:0;
}

.connect-card{
    height: 36px;	
    padding: 0 15.46px 0 15.54px;	
    border-radius: 10px;	
    background-color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
}

.connexion-background{
    padding-top: 122px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url("../images/background_connexion.jpg");
    background-size: 100vw 21vw;
    background-repeat: no-repeat;
}

.connexion-background2{
    padding-top: 122px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url("../images/background_connexion.png");
    background-size: 100vw 21vw;
    background-repeat: no-repeat;
}


.entreprise-publicateur-info{
    color: #A2A2A2;	
    font-family: Lato;	
    font-size: 11px;	
    line-height: 16px;
    margin:0;
}

.entreprise-publicateur{
    margin:0;
    color: #000000;	
    font-family: Lato;	
    font-size: 12px;	
    font-weight: 500;	
    line-height: 15px;
}

.actived{
    margin:0;
    color: #FE5250;	
    font-family: Lato;	
    font-size: 10px;	
    font-weight: bold;	
    line-height: 12px;
}

.toggle-wrapper{
    height: 18px;	
    width: 33px;	
    border-radius: 9px;	
    background-color: #E5EBEF;
}
.toggle-wrapper1{
    height: 18px;	
    width: 44px;	
    border-radius: 9px;	
    background-color: #FEEDED;
}

.toggle{
    height: 19px;	
    width: 19px;	
    border-radius: 9px;	
    background-color: #FE5250;
}

.publicateur-header{
    color: #000000;	
    font-family: Lato;	
    font-size: 16px;	
    font-weight: bold;	
    line-height: 18px;
}

.irreversible-action{
    margin:20px 22px 39px 22px;	
    border-radius: 10px;	
    background-color: #F5F7FC;
    display:flex;
    justify-content: center;
    align-items: center;
    padding:7px 0 28px 0;
}

.irreversible-text{
    color: #797979;	
    font-family: Lato;	
    font-size: 13px;
}

.title-invitation{
		color: #363636;	
		font-family: Quicksand;	
		font-size: 21px;	
		font-weight: bold;	
		line-height: 34px;	
}

.white-button{
	color: #FFFFFF;	
	font-family: Quicksand;	
	font-size: 19px;	
	font-weight: 500;	
	line-height: 24px;
	margin:0;
}

.red-button{
	display: flex;
	align-items: center;
	justify-content: center;
		height: 60px;	
		width: 179px;	
		border-radius: 35px;	
		background-color: #FE5250;	
		box-shadow: 0 2px 70px 0 rgba(163,163,163,0.5);
		cursor: pointer
}

.input-init{
	padding-left: 24px;
	height: 60px;	
	width: 306px;	
	border: 2px solid #EBEBEB;	
	border-radius: 7px;	
	background-color: #FFFFFF;	
	box-shadow: 0 2px 70px 0 rgba(163,163,163,0.5);
}

.menu-element-text{
    font-family: Lato;	
    font-size: 14px;	
    font-weight: bold;	
    line-height: 24px;
    margin: 0;
}

.menu-element{
    color: #828282;
    display: flex;
    align-items: center;
    height:36.48px;
    cursor: pointer;
    padding-left: 25px;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12);
}

.menu-element:hover {
    background-color: #F0F3F5;	
    color: #000000;	
}

/* styles for '...' */ 
.block-with-text {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */
  line-height: 18px;
  /* max-height = line-height (1.2) * lines max number (3) */
  max-height: 54px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: justify;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 1em;
}
.block-with-text3 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */
  line-height: 18px;
  /* max-height = line-height (1.2) * lines max number (3) */
  max-height: 86px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: justify;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 1em;
}
.block-with-text3-16 {
    /* hide text if it more than N lines  */
    overflow: hidden;
    /* for set '...' in absolute position */
    position: relative; 
    /* use this value to count block height */
    line-height: 18px;
    /* max-height = line-height (1.2) * lines max number (3) */
    max-height: 59px; 
    /* fix problem when last visible word doesn't adjoin right side  */
    text-align: justify;  
    /* place for '...' */
    margin-right: -1em;
    padding-right: 1em;
  }
.block-with-text4-16 {
    /* hide text if it more than N lines  */
    overflow: hidden;
    /* for set '...' in absolute position */
    position: relative; 
    /* use this value to count block height */
    line-height: 18px;
    /* max-height = line-height (1.2) * lines max number (3) */
    max-height: 80px; 
    /* fix problem when last visible word doesn't adjoin right side  */
    text-align: justify;  
    /* place for '...' */
    margin-right: -1em;
    padding-right: 1em;
  }  
.block-with-text1 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */
  line-height: 5px;
  /* max-height = line-height (1.2) * lines max number (3) */
  max-height: 22px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: left;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 0.7em;
}
/* create the ... */
.block-with-text:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
}

.block-with-text3:before {
  /* points in the end */
  content: '...';  padding-bottom:0.5em;
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
}
.block-with-text3-16:before {
    /* points in the end */
    content: '...';  padding-bottom:0em;
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of block */
    right: 0;
    bottom: 0;
  }
/* create the ... */
.block-with-text1:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
}
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text3:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
  background: transparent;
}
.block-with-text3-16:after {
    /* points in the end */
    content: '';
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of text */
    right: 0;
    /* set width and height */
    width: 1em;
    height: 1em;
    margin-top: 0.8em;
    /* bg color = bg color under block */
    background: transparent;
  }
.block-with-text:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
  background: transparent;
}
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text1:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
  background: transparent;
}
.block-with-text-line1 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */
  line-height: 16px;
  /* max-height = line-height (1.2) * lines max number (3) */
  max-height: 18px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: left;  
  /* place for '...' */
  margin-right: 1em;
  padding-right: 0.7em;
}
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text-line1:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: relative;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 0.5em;
  height: 1em;
  /* bg color = bg color under block */
  background: transparent;
}
/* create the ... */
.block-with-text-line1:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 1;
}

.information{
    color: #CDCDCD;	
    font-family: Lato;	
    font-size: 11px;	
    font-weight: 500;	
    line-height: 21px;
}

.button-step-active{
    border-radius: 10px;	
    background-color: #FFFFFF;
    margin-right: 10px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:0 10px 0 10px;
}

.button-step{
    height: 40px;
    border-radius: 10px;	
    background-color: #FFFFFF;
    opacity: 0.5;
    margin-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:0 10px 0 10px;
}

.button-step-text-active{
    color: #000000;	
    font-family: Lato;	
    font-size: 13px;	
    font-weight: bold;	
    line-height: 18px;
    margin:0;
}

.space-between{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.button-step-text{
    margin:0;
   color: #B2B3B3;	
    font-family: Lato;	
    font-size: 13px;	
    font-weight: bold;	
    line-height: 18px;
}

.button-load{
    margin:0;
    color: #FFFFFF;	
    font-family: Lato;	
    font-size: 12px;	
    font-weight: bold;	
    line-height: 15px;
}

.icone-load{	
    color: #FFFFFF;
    font-size: 15px;	
    line-height: 15px;        
}

.button-load-wrapper{
    border-radius: 100px;
    background-color: #FFFFFF;
    margin-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:9px 19px 9px 24px;
}

.button-load-wrapper-image{
    border-radius: 100px;
    background-color: #FFFFFF;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}


.button-close-wrapper{
    background-color: #FFFFFF;
    display: flex;
    align-items: center;
    height: 26px;
}

.text-button-load{
    height: 13px;	
    width: 90px;	
    color: #979797;	
    font-family: Lato;	
    font-size: 11px;	
    font-weight: bold;	
    line-height: 13px;
}

.action-info{
    display: flex;
    color: #A2A2A2;	
    font-family: Lato;	
    font-size: 10px;	
    line-height: 12px;
    white-space: pre-wrap;
}

.white-card{
    border-radius: 10px;
    background-color: #FFFFFF;
}

/*------------------------------
		Style Recherche
--------------------------------*/
.rechercher-menu {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    cursor: pointer;
   
}

.rechercher-menu-text {
    height: 16px;
    width: 66px;
    color: #B4B4B4;
    font-family: Lato;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    cursor: pointer;
    margin: 0 0 0 10px;
    
}

.recherche{
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 43px;	
    width: 960px;
    border-style: none;	
    border-radius: 21.5px;	
    background-color: #F1F3F5;
    outline: none;
    padding: 3px 0px 3px 65px;
}

.recherche:focus{
    box-shadow: 0px 1px 5px rgba(104, 114, 143, 1);
    padding: 3px 0px 3px 65px;
    border: 1px solid rgba(104, 114, 143, 1);
}

.fermer{
    display: flex;
    flex-direction: row;
    justify-content: end;
    align-items: center;
}

.colonne{
    display: flex;
    flex-direction: column;
}
.colonne-contenu{
    display: flex;
    flex-direction: column;
    width: 100%;
}


.text_history{
    height: 17px;
    width: auto;
    color: #828282;
    font-family: Lato;
    font-size: 14px;
    line-height: 17px;
    margin: 0 0 0 10px;
}

.titre_history{
    height: 24px;	
    width: 223px;	
    color: #6F6F6F;	
    font-family: Lato;	
    font-size: 20px;	
    line-height: 24px;
    margin: 0 0 0 12px;
}

.text_filtre{
    height: 18px;	
    width: auto;	
    color: #6F6F6F;	
    font-family: Lato;	
    font-size: 15px;	
    line-height: 18px;
}

.text_filtre_active{
    height: 18px;	
    width: auto;	
    color: #363636;	
    font-family: Lato;	
    font-size: 15px;	
    font-weight: bold;	
    line-height: 18px;
}

.menu_contenu{
    display: flex;
    flex-direction: row;
    width: 100%;
}

.contenu{
    display: flex;
    flex-direction: column;
    margin: 0px 0 0 20px;
    width: 100%;
}
/*------------------------------
		Style Formulaire
--------------------------------*/
.label-champ{
    padding-top:8px;
    min-width: 88px;	
    color: #979797;	
    font-family: Lato;	
    font-size: 11px;	
    font-weight: bold;	
    line-height: 13px;
    margin: 0 ;
    padding-right: 13px;
}

.search-delete {
    min-width: 34px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background-color: transparent;
    border-color: rgb(158, 155, 146);
    border-width: 1px;
    border-style: solid;
    margin-left: 10px;
}
.delete-circle{
    width: 10px;
    height: 10px;
    color: rgb(158, 155, 146);
}

.list-element {
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: pointer;
    height: 50px;
    padding: 0px 0px 0px 10px;
    margin-bottom: 10px;
    justify-content: space-between;
    width: 250px;
}

.list-element-tag {
    display: flex;
    flex-direction: row;
    cursor: pointer;
    padding: 0px 0px 0px 10px;
    margin-right: 10px;
    justify-content: space-between;
}

.search-element-tag {
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: pointer;
    padding: 0px 49px 0px 24px;
    justify-content: space-between;
}

.bouton-dayline{
    margin-top: 40px;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.bouton-formulaire-text{
    margin:0;
    color: #979797;	
    font-family: Lato;	
    font-size: 12px;	
    font-weight: bold;
    line-height: 15px;
}

.bouton-formulaire{	
    cursor: pointer;
    padding:9px 44.5px 9px 44.5px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #979797;	
    border-radius: 100px;
}

/*------------------------------
		END Style Formulaire
--------------------------------*/

.list-select{
    color: #FE5250;	
    font-family: Lato;	
    font-size: 10px;	
    font-weight: bold;	
    line-height: 12px;
    margin:12px 0 0px 0;
    cursor: pointer;
}

.list-icone{
    color: #FE5250;	
    height: 6px;
    width: 6px;
}

.list-not-selected{
    color: #FE5250;	
    font-family: Lato;	
    font-size: 10px;	
    font-weight: bold;	
    line-height: 18px;
    margin:0;
    cursor:pointer;
}

.list{
    padding:1px 16px 14px 7px;
    position:absolute;
    border-radius: 3px;	
    background-color: #F1F6FA;
}

.select-wrapper{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border-bottom: 1px solid #FE5250;
    cursor: pointer;
    padding-right: 5px;
}

.content-title{
    margin: 0;
    color: #000000;	
    font-family: Lato-Bold;	
    font-size: 14px;	
    line-height: 25px;
}

.main-menu-element-text {
    padding:0 8px;
    margin:0;
    color: #828282;	
    font-family: Lato-Bold;	
    font-size: 14px;	
    line-height: 17px;
    white-space: nowrap;
}

.main-menu-element-icone {
    color: #828282;	
    font-size: 11px;
    line-height: 11px;
    margin:0;
}

.main-menu-element {
    cursor : pointer;
    padding: 0 14px;
    display: flex;
    align-items: center;
    position: relative;
}

.main-menu-icone{
    cursor : pointer;
    padding: 0 25px;
    display: flex;
    align-items: center;
    position: relative;
}

.cta-main{
    margin-right: 13px;
}

.recherche-main{
    display: flex;
    margin-right: 24px;
    margin-left:27px;
}

.mask-1280{
        display: flex;
    }
    .display-1280{
        display: none;
    }

.wrapper-menu-main{
    display: flex;
}

@media screen and (max-width: 1394px) {
    .flex-curriculum{
        min-height: 111px;
        flex-direction: column;
    }
}

@media screen and (max-width: 2000px) {
    .wrapper-menu-main{
        display: flex;
        width: 100%;
    }
    .main-menu-icone {
        padding: 0 18.5px;
    }
    .recherche-main{
        margin-right: -4.5px;
    }
    .mask-1280{
        display: none;
    }
    .display-1280{
        display: flex;
    }
    .cta-main{
        margin-right: 38px;
    }
}

 /* TOOL MENU */
 .menu-tool:link {
    color: #828282;
    font-family: Lato;
    font-size: 14px;
    font-weight: bold;
    line-height: 17px;
    text-decoration: none;
    text-align: center;
    align-items: center;
    display: flex;
    padding: 20px;
 }

 .menu-noText:hover {
    text-decoration: none;
 }

.menu-tool-active {
    color: #363636;
    border-bottom: 2px solid #393939;
}
.action-photo{
    margin:22px 0 48px 0;
    height: 74px;	
    width: 99px;	
    border-radius: 10px;
}

.action-titre{	
    color: #000000;	
    font-family: Lato;	
    font-size: 12px;	
    font-weight: bold;	
    line-height: 25px;
    margin:0;
}

.nom-dayline{
    color: #363636;	
    font-family: Lato;	
    font-size: 13px;	
    font-weight: 500;	
    line-height: 20px;
    margin:0;
}

.progress-component{
    text-anchor:middle;
    font-weight:bold
}

.session-progress{
    margin:0;
    color: #000000;	
    font-family: Lato-Bold;	
    font-size: 12px;	
    line-height: 15px;
}

.type-title{
    margin:0;
    color: #FFFFFF;	
    font-family: Lato-Bold;	
    font-size: 12px;	
    line-height: 15px;
}

.cercle{
    border-radius: 50%;
}

.wrapper-icones-content{
    align-self: flex-start;
    display: flex;
    margin-top: -22.5px;
    justify-content: flex-start;
    align-items: center;
}

.icone-content{
    margin-left: 21px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #FFFFFF;
}

.icone-mobile{
    margin-left: 7px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFFFFF;
    width: 30px;
    height: 30px;
    border-radius: 15px;
}

.content-image-thumb{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px 10px 0px 0px;
    height: 134px;
    min-height: 134px;
    width: 100%;
}

.icone-option{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color:#FE5250;
    width: 36px;
    height: 36px;
    border-radius: 18px;
    font-size: 15px;
    cursor: pointer;
    margin-bottom: 12px;
    color:#FFFFFF;
}

.wrapper-options{
    display:flex;
    flex-direction:column; 
    position:absolute; 
    right:-18px;
    top:20px;
}

.wrapper-thumb-content{
    height: 314px;
    width: 214px;
    background-color: #FFFFFF;
    border-radius: 10px;
    cursor: pointer;
    position: relative;
    display: flex;
    flex-direction: column;
}
    
.wrapper-type-title{
    display:flex;
    justify-content:center; 
    align-items:center; 
    padding:5px 13px 5px 13px; 
    border-radius:10px;
    background-color:rgba(85, 85, 85, 0.7);
}

.session-nom{
    margin: 0;
    color: #000000;	
    font-family: Lato;	
    font-size: 14px;	
    font-weight: bold;	
    line-height: 25px;
}

.action-miniature-header{
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 8px;
}

.action-description{
    color: #838383;	
    font-family: Lato;	
    font-size: 10px;	
    line-height: 19px;
    margin:0;
    max-height: 76px;
}

.action-description-wrapper{
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #FFFFFF 100%);
    left: 0px;
    right: 0px;
    position: absolute;
    height: 45px;
    top:10px;
}

#options-parent:hover #options {
    position: relative;
    right: -50px;
    display: flex;
    align-items: center;
}

#options {
  display:none;
}

.action-icone{
    font-size: 13px;
    color: white;
}

.icone-div{
    margin:6px 0 6px 0;
    display: flex;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #FE5250;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.icone-div-ordre{
    margin:6px 0 6px 0;
    display: flex;
    width: 36px;
    height: 36px;
    border: 1px;
    border-radius: 50%;
    background-color: #EEE5E5;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-size: 13px;
    color: #FE5250;
}


.icone-div-ordre:active {
    color: #FFFFFF;
    background-color: #FE5250;
    border-color: #EEE5E5;
    outline: 0 none;
}

.competence-number{
    color: #363636;	
    font-family: Lato;	
    font-size: 12px;	
    font-weight: bold;	
    line-height: 15px;
}

.competence-remove{
    color: #FD9800;	
    font-size: 12px;	
    line-height: 18px;	
    text-align: center;
}

.camps-information{
    color: #797979;	
    font-family: Lato;	
    font-size: 10px;	
    font-weight: bold;	
    line-height: 12px;
    margin:0;
}

.date-session{	
    color: #797979;	
    font-family: Lato;	
    font-size: 10px;	
    font-weight: 500;	
    line-height: 12px;
    margin:0;
}

.commentaire{	
    color: #A2A2A2;	
    font-family: Lato;	
    font-size: 10px;	
    line-height: 16px;
    margin:0;
}

.commentaire-info{
    color: #1C1C1C;	
    font-family: Lato;	
    font-size: 10px;	
    font-weight: 600;	
    line-height: 16px;
    margin:0
}

.competence-map{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #000000;
}

.weight-info{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
}

.commentaire-not{
    color: #6F6F6F;
    font-family: lato;
    font-size: 11px;
    font-weight: 400;
    line-height: 15px;
    margin: 0px;
}

/*Slider*/
/*Chrome*/
@supports (-webkit-tap-highlight-color:currentcolor) and (not (-webkit-background-composite:clear)) and (not (-ms-accelerator:true)) and (not (overflow:-webkit-marquee)) and (not (-moz-appearance:none)) {    input[type='range'] {
      overflow: hidden;
      width: 129px;
      -webkit-appearance: none;
    }
    
    input[type='range']::-webkit-slider-runnable-track {
      height: 10px;
      -webkit-appearance: none;
      color: #13bba4;
      margin-top: -1px;
    }
    
    input[type='range']::-webkit-slider-thumb {
      width: 10px;
      -webkit-appearance: none;
      height: 10px;
      cursor: ew-resize;
      background: #434343;
      box-shadow: -80px 0 0 80px #FE5250;
    height: 5px;
        border-radius: 3px;
    }

}
/** FF*/
input[type="range"]::-moz-range-progress {
  background-color: #FE5250; 
    height: 5px;
border-radius: 3px;
}
input[type="range"]::-moz-range-track {  
    background-color: #E9EAEB;
    height: 5px;
    border-radius: 3px;
}


/* thumb input range*/
/* Special styling for WebKit/Blink */
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
	border: 2px solid #FFFFFF;
    height: 17px;
    width: 17px;
    border-radius: 10px;
    background: #fe5250;
    cursor: pointer;
}

/* All the same stuff for Firefox */
input[type=range]::-moz-range-thumb {
    border: 2px solid #FFFFFF;
    height: 17px;
    width: 17px;
    border-radius: 10px;
    background: #fe5250;
    cursor: pointer;
}

/* All the same stuff for IE */
input[type=range]::-ms-thumb {
 border: 2px solid #FFFFFF;
    height: 17px;
    width: 17px;
    border-radius: 10px;
    background: #fe5250;
    cursor: pointer;
}

.content-thumb-text{
    align-self: flex-start;
    margin:0;
    color: #000000;	
    font-family: Lato-Bold;	
    font-size: 12px;	
    line-height: 17px;
}

.information-text{
    color: #797979;	
    font-family: Lato-Bold;	
    font-size: 10px;	
    line-height: 12px;
    margin : 0;
}

.filter-text{	
    margin: 0;
    white-space: nowrap;
    color: #828282;	
    font-family: Lato-Bold;	
    font-size: 11px;		
    line-height: 13px;
}

.filter-icone{
    width: 19px;
    height: 19px;
    border-radius: 3px;	
    background-color: #E9EAEB;
}

.submenu-creation-content{
    color: #000000;	
    font-family: Lato-Bold;	
    font-size: 16px;	
    line-height: 25px;
    margin: 0;
}
/* styles for '...' */ 
.block-with-text2 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */
  line-height: 17px;
  /* max-height = line-height (1.2) * lines max number (3) */
  max-height: 51px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: justify;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 1em;
}
/* create the ... */
.block-with-text2:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
}
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text2:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
  background: white;
}

/* styles for '...' */ 
.block-with-text4 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */
  line-height: 17px;
  /* max-height = line-height (1.2) * lines max number (3) */
  max-height: 40px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: justify;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 1em;
}
/* create the ... */
.block-with-text4:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
}
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text4:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
  background: white;
}

/* styles for text on 4 lines size 16px */ 
.block-with-text4-16 {
    /* hide text if it more than N lines  */
    overflow: hidden;
    /* for set '...' in absolute position */
    position: relative; 
    /* use this value to count block height */
    line-height: 20px;
    /* max-height = line-height (1.2) * lines max number (4) */
    max-height: 80px; 
    /* fix problem when last visible word doesn't adjoin right side  */
    text-align: start;  
    /* place for '...' */
    margin-right: -1em;
    padding-right: 1em;
  }
  /* create the ... */
  .block-with-text4-16:before {
    /* points in the end */
    content: '...';
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of block */
    right: 0;
    bottom: 0;
    padding-bottom:0.2em;
  }
  /* hide ... if we have text, which is less than or equal to max lines */
  .block-with-text4-16:after {
    /* points in the end */
    content: '';
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of text */
    right: 0;
    /* set width and height */
    width: 1em;
    height: 1em;
    margin-top: 0.8em;
    /* bg color = bg color under block */
  }

/* styles for '...' */ 
.block-with-text3-28 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */

  /* max-height = line-height (1.2) * lines max number (3) */
  max-height:100px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: justify;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 1em;
}
/* create the ... */
.block-with-text3-28:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
  padding-bottom:0.2em;
  }
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text3-28:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
}



/* styles for '...' */ 
.block-with-text2-28 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */

  /* max-height = line-height (1.2) * lines max number (3) */
  max-height:64px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: justify;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 1em;
}
/* create the ... */
.block-with-text2-28:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
  padding-bottom:0.2em;
  }
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text2-28:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
}


/* styles for '...' */ 
.block-with-text2-16 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */
  /* max-height = line-height (1.2) * lines max number (3) */
  max-height:40px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: justify;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 1em;
}
/* create the ... */
.block-with-text2-16:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
  padding-bottom:0.2em;
}
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text2-16:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
}


/* styles for '...' */ 
.block-with-text2-20 {
  /* hide text if it more than N lines  */
  overflow: hidden;
  /* for set '...' in absolute position */
  position: relative; 
  /* use this value to count block height */
  /* max-height = line-height (1.2) * lines max number (3) */
  max-height:45px; 
  /* fix problem when last visible word doesn't adjoin right side  */
  text-align: justify;  
  /* place for '...' */
  margin-right: -1em;
  padding-right: 1em;
}
/* create the ... */
.block-with-text2-20:before {
  /* points in the end */
  content: '...';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of block */
  right: 0;
  bottom: 0;
  padding-bottom:0.1em;
}
/* hide ... if we have text, which is less than or equal to max lines */
.block-with-text2-20:after {
  /* points in the end */
  content: '';
  /* absolute position */
  position: absolute;
  /* set position to right bottom corner of text */
  right: 0;
  /* set width and height */
  width: 1em;
  height: 1em;
  margin-top: 0.8em;
  /* bg color = bg color under block */
}


/* styles for text on 4 lines size 16px */ 
.block-with-text4-16 {
    /* hide text if it more than N lines  */
    overflow: hidden;
    /* for set '...' in absolute position */
    position: relative; 
    /* use this value to count block height */
    line-height: 20px;
    /* max-height = line-height (1.2) * lines max number (4) */
    max-height: 80px; 
    /* fix problem when last visible word doesn't adjoin right side  */
    text-align: start;  
    /* place for '...' */
    margin-right: -1em;
    padding-right: 1em;
  }
  /* create the ... */
  .block-with-text4-16:before {
    /* points in the end */
    content: '...';
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of block */
    right: 0;
    bottom: 0;
    padding-bottom:0.2em;
  }
  /* hide ... if we have text, which is less than or equal to max lines */
  .block-with-text4-16:after {
    /* points in the end */
    content: '';
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of text */
    right: 0;
    /* set width and height */
    width: 1em;
    height: 1em;
    margin-top: 0.8em;
    /* bg color = bg color under block */
  }
.header-result-session{
    display:flex;
    align-items:center;
    justify-content:center;
    background-color: #FFFFFF;
}

.header-result-text{
    font-family: Rubik-Medium;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #7F7F7F;
}

.result-done-question{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    text-transform: uppercase;
}

.result-question-title{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 20px;
}

.result-question-answer{
    font-family: Rubik;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 20px;
    color: #7F7F7F;
}

.multiple-line-without-spaces{
    white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
    white-space: -webkit-pre-wrap;          /* Chrome & Safari */ 
    white-space: -pre-wrap;                 /* Opera 4-6 */
    white-space: -o-pre-wrap;               /* Opera 7 */
    white-space: pre-wrap;                  /* CSS3 */
    word-wrap: break-word;                  /* Internet Explorer 5.5+ */
    word-break: break-all;
    white-space: normal;
}

.competence-separator {
    -webkit-box-shadow: inset -1px -1px 0px 0px rgb(244, 247, 249); 
    box-shadow: inset -1px -1px 0px 0px rgb(244, 247, 249);
}

.noselect{
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
    supported by Chrome, Edge, Opera and Firefox */
}

.header-separator {
    -webkit-box-shadow: inset -1px -1px 0px 0px rgb(244, 247, 249); 
    box-shadow: inset -1px -1px 0px 0px rgb(244, 247, 249);
}

/* APPRENANT ACCUEIL */

.accueil-contaienr {
    background-color: #F4F6F9;
}

.ellipsis-text {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    /* width: 100%; */
    font-family: Rubik;
    font-size: 14px;
    font-weight: 400;
    color: #FFFFFF;
    height: 40px;
}