.boutonrond70
{
	width: 70px;
    height: 70px;
    border-radius: 35px;
    box-shadow: rgba(0,0,0,0.5) 0px -0.5px 0px inset, rgba(255,255,255,0.5) 0px 0.5px 0px inset;
    display: inline-block;
	background-position:center center;
	background-repeat:no-repeat;
}



.bleu	{	color: #3583d5;	}
.btn_bleu	{	background-color: #3583d5;	}
.btn_jaune	{	background-color: #e6c81f;	}
.btn_blanc	{	background-color: #fff;		}
.btn_bleu:hover	{	background-color: #3892f1;	}
.btn_jaune:hover	{	background-color: #fddc23;	}

#btn_plateforme
{
	background-image:url(img/btn_plateforme.png);
}
#btn_calendrier
{
	background-image:url(img/btn_calendrier.png);
}
#btn_inscription
{
	background-image:url(img/btn_inscription.png);
}
#btn_plus
{
	background-image:url(img/btn_plus.png);
}
#btn_mail
{
	background-image:url(img/btn_mail.png);
}

.bouton
{
	background: #fff;
	color: #fff;
	padding-left: 8px;
	padding-right: 8px;
	box-shadow: inset rgba(255, 255, 255, 0.1) 1px 1px 0px, 
	inset rgba(0, 0, 0, 0.1) 1px -1px 0px;
	border-radius: 16px;
	text-decoration: none;
	display: inline-flex;
	text-align: center;
	justify-content: center;
	border: none;
}
.boutonrouge
{
	background: linear-gradient(#ffbaba, #ff0012);
    color: #fff;
    border: 2px solid #f00;
}
.fondbleu
{
	background: #66a3da;
}
.fondjaune
{
	background: #f7c509;
}

#tooltip
{
	position: absolute;
    background-color: #666;
    color: #fff;
    border-radius: 5px;
    padding-left: 5px;
    padding-right: 5px;
}

.titreserre
{
	text-align: center;
    margin: auto;
    margin-bottom: 10px;
    margin-top: 20px;
    font-size: 20px;
	}

.redborder {
    border: 2px solid #f00 !important;
}
.elementliste
{
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	position:relative;
	width: 80%;
	/* height: 100px; */
	border-radius: 20px;
	border:#fff 1px solid;
	margin: auto;
	box-shadow: rgba(0,0,0,0.1) 1px 5px 5px, rgba(0,0,0,0.02) 0px -1px 0 inset,
				rgba(255,255,255,0.5) 0px 1px 0 inset;
	margin-bottom: 15px;
	overflow:hidden;
	background: linear-gradient(to bottom right, #efefef, #f7f7f7);
	padding: 5px;
	padding-left: 8px;
}
.elementliste:hover
{
	background: linear-gradient(to bottom right, rgb(247, 245, 228), #f7f7eb);
}
.elementliste > div
{
	position: relative;
	width: 100%;
}
.elementlistec0
{
	flex-grow:2;
}
.elementlistec1
{
	flex-grow:1;
}
.elementlistedetails
{
	display: flex;
	align-items: flex-end;
	height: 100%;
	width: 100%;
	position: relative;
}
.elementlistedetails .detailscalendrier
{
	height: 100%;
	flex-basis: 400px;
}
.elementlistedetails .editionliens
{
	padding-left: 10px;
	position: relative;
	/* flex-basis: 140px; */
}
.elementlistedetails>div:first-child {
    flex-basis: 50%;
}
.elementlistedetails table td:first-child {
    white-space: nowrap;
    padding-right: 5px;
}


.gestionutilisateur .elementlistedetails {
    display: block;
}

.gestionutilisateur .elementlistedetails .editionliens {
    display: flex;
    width: 100%;
    justify-content: space-evenly;
    margin-top: 10px;
}

.gestionutilisateur .editionliens a {
    color: #3277c5;
}
.editionutilisateur .editionliens {
    flex-grow:1;
    text-align: center;
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 100%;
	flex-grow:1;
}

.neverused {
    background: #95defc;
}
.unused {
    opacity: 0.5;
}
.unused:hover {
    opacity: 0.7;
}
.redbackground {
    background:#ec8484;
}
.redbackground:hover {
    background:#f19898;
}
.unused:after {
    content: "Non synchronise depuis plus de 48h";
    position: absolute;
    right: 6px;
    border: 1px solid #a5a5a5;
    padding: 0px 5px 0px 5px;
}
.redbackground:after {
    content: "Non synchronise";
    position: absolute;
    right: 6px;
    border: 1px solid #fff;
    padding: 0px 5px 0px 5px;
    color:#fff;
    font-weight:bold;
}

.elementid
{
	display:none;
}
.elementintitule,.elementnom
{
	font-size: 22px;
	top:-4px;
}
.elementtype
{
    color: #3583d5;
}
.elementcalendrier
{
    color: #762696;
	max-width: 42vw;
    overflow: hidden;
}
.elementlogin
{
    color: #e21212;
}
.elementpasse
{
    color: #e21212;
}
.elementidu
{
	display: none;
}
.elementutilisateur
{
    color: #e6c81f;
    font-weight: bold;
}
div[class^="element"]
{
    word-break: break-word;
}
.editionelement
{

}
.suppressionelement
{

}

#batchpasswordchange {
    width: 220px;
    max-width: 80%;
    display: flex;
    margin: auto;
    flex-flow: column;
}

#batchpasswordchange>* {
    margin-bottom: 16px;
}


#spaceedition
{
	display:none;
	text-align: center;
    line-height: 130px;
	background: #fff;
}
.editioncalendrier
{
	border: 3px dashed #e6c81f;
}
.editioncalendrier .elementintitule, .editioncalendrier .elementnom
{font-size:20px;top:0;width: 100%;max-width: 314px;}

.editioncalendrier .elementtype
{	top:60px;}
.editioncalendrier .elementcalendrier
{	top:80px;}
.editioncalendrier .editionelement
{	top:123px;	left:38%;}
.editioncalendrier .suppressionelement
{z-index:1;}
.editioncalendrier #login
{	color:#e21212;}
.editioncalendrier #passe
{	color:#e21212;}
.editioncalendrier #annuler
{	margin: 5px;	}


@media only screen and (max-width: 600px)
{
	.elementliste
	{
		width:95%;
	}
	.elementintitule,.elementnom
	{
		font-size: 3vw;
	}
	.elementcalendrier
	{
		max-width: 42vw;
	}
	.editionliens > div .moretext
	{
		display:none;
	}
	
	#userinfos > span.moretext
	{
		display:none;
	}
}
/*page rapports*/

.boutonsrapports {
    display: flex;
    max-width: 420px;
    flex-wrap: wrap;
    justify-content: center;
    margin: 20px auto;
}

.boutonsrapports > a {
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px;
    margin: 5px;
    width: 182px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #3a9ef9;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
}

.boutonsrapports > a:hover {
    background: #73bcff;
}


/*------------------------------------------------------------------------*/

.elementlisteliaison
{
	display: flex;
    justify-content: space-around;
	align-items:center;
	margin-left: 10%;
    margin-right: 10%;
    margin-top: 15px;
    margin-bottom: 15px;
	border: #e0e0e0 dashed 2px;
    border-radius: 100px;
}
.elementlisteliaison > div 
{
	display: flex;
    justify-content: space-between;
	align-items:center;
	flex-direction: column;
    margin-left: 2%;
    margin-right: 2%;
	width:100%
}
.elementlisteliaison .destination
{
    width: 70%;
    padding: 5px;
    font-size: 14px;
    position: relative;
    padding-bottom: 14px;
}
.elementlisteliaison .destination a
{
    color:#fff;
}
.elementlisteliaison .destination > div
{
    float:right;
}
.elementlisteliaison .ajout
{
    width: 70%;
    padding: 10px;
    font-size: 14px;
	border:none;
	background:none;
	color:#666;
}
.elementlisteliaison .ajout select
{
	width:50%;
	min-width: 50px;
}
.elementlisteliaison > div > div
{
    padding: 15px;
	margin-top: 5px;
    margin-bottom: 5px;
    width: 100%;
	
    text-align: center;
    font-size: 19px;
    background: #5c8dcc;
	border: #fff 1px solid;
	border-radius: 26px;
    color: #fff;
    box-shadow: rgba(0,0,0,0.2) 1px 3px 6px;
}
.elementlisteliaison > div.sync, #filter > div.sync
{
	width:auto;
	display: inline-block;
}
.elementlisteliaison > div.sync a, #filter > div.sync a
{
	width:23px;
	height:23px;
	background-image:url(img/sync.png);
	opacity:0.3;
	display: inline-block;
	vertical-align: middle;
}
.elementlisteliaison > div.sync a:hover, #filter > div.sync a:hover
{
	opacity:1;
}
.destination span[data-type] {
    position: absolute;
    left: 0;
    top: 50%;
    margin: 0;
    transform: translate(-100%, -50%);
}
.destination span[data-type="SAV"]
{
	left:-20px;
}
.destination span[data-type]:before
{
	content:attr(data-type);
	position:absolute;
	top:-10px;
	color:#58f;
	font-size:8px;
	word-break:keep-all;
	left: 4px;
}

#lastsynchro {
    position: absolute;
    font-size: 10px;
    width: 100%;
    left: 0;
    color: rgba(255,255,255,0.6);
}
#syncfilter
{
	margin-left:10px;
}

.level
{
	display:none;
}

@media only screen and (max-width: 800px)
{
	.elementlisteliaison > div > div
	{	font-size: 2.2vw;}
	.elementlisteliaison .destination
	{	font-size: 1.9vw;}
}
@media only screen and (max-width: 600px)
{
	.elementlisteliaison
	{	margin-left: 3%;	margin-right: 3%;	}
	.elementlisteliaison > div > div
	{	font-size: 2.5vw;}
	.elementlisteliaison .destination
	{	font-size: 2.0vw;}
}
@media only screen and (max-width: 600px)
{
	.elementlisteliaison > div > div
	{	font-size: 12px;}
	.elementlisteliaison .destination
	{	font-size: 10px;}
	.elementlisteliaison .ajout input[type=submit]
	{	max-width: 16vw;	padding: 0;	}
}





/*------------------------------------------------------------------------*/

#infoedition
{
	position: absolute;
	top: 0px;
	left: 0;
	background: #fff;
	border-radius: 10px;
	padding: 10px;
	padding-right: 5px;
	text-align: justify;
	font-size: 13px;
	box-shadow: rgba(0,0,0,0.1) 1px 2px 5px;
	width: 100%;
	height: 100%;
}
#infoedition > div
{
	overflow-y:auto;
	width:100%;
	height:100%;
    padding-right: 5px;
}
#infoedition > div > img
{
	float:left;
	margin:-5px;
	margin-right:0;
	max-width: 5vw;
}
.infoliaison 
{
	border-radius: 30px;
    padding: 10px;
    padding-right: 30px;
    text-align: justify;

	display: flex;
    justify-content: space-around;
	align-items:center;
	margin-left: 10%;
    margin-right: 10%;
    margin-top: 15px;
    margin-bottom: 15px;
	border: #e0e0e0 dashed 2px;
    border-radius: 100px;
}

#edition #cp{			width:254px;	}
#edition #type{			width:254px;	}
#edition #login{		width:254px;	}
#edition #passe{		width:130px;	}
#edition #calendrier{	width:254px;	}

@media only screen and (max-width: 900px)
{
	#infoedition{	font-size: 12px;	}
	.elementnom{	width: 36vw;	}
}

@media only screen and (max-width: 750px)
{
	#infoedition{	font-size: 1.5vw;	}
	#edition #type{			width:35vw;	}
	#edition #login{		width:35vw;	}
	#edition #passe{		width:21vw;	}
	#edition #calendrier{	width:35vw;	}
}


@media only screen and (max-width: 580px)
{
	#infoedition{	font-size: 10px;    bottom: 29px;	}
	.elementnom{width: 35vw;font-size: 4vw;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
}

@media only screen and (max-width: 450px)
{
	.elementlistec1{	display:none; }
	.elementnom{	width: 42vw;    font-size: 6vw;	}
	#edition #type{			width:40vw;	}
	#edition #login{		width:40vw;	}
	#edition #passe{		width:40vw;	}
	#edition #calendrier{	width:40vw;	}
}

@media only screen and (max-width: 320px)
{
	.elementnom{	width: 130px;	font-size: 16px;	}
}



/*------------------------------------------------------------------------*/




#filter
{
	text-align: center;
    width: 700px;
    margin: auto;
    padding: 10px;
    border: 1px #eee solid;
	line-height: 1.5;
	max-width: 80%;
}
#filter .ligne0
{
	font-size:16px;
}
#filter .ligne1
{
	font-size:13px;
}
#filter .ligne2
{
	font-size:10px;
}
#filter a
{
	text-decoration:none;
}

#exportlist
{
	display: flex;
    flex-flow: row;
    justify-content: space-around;
    align-items: baseline;
    flex-wrap: wrap;
}

#genererrapport,#suppressionparlot
{
	display: flex;
    align-items: center;
    justify-content: center;
}
#genererrapport>input,,#suppressionparlot>input
{
	margin:10px;
}
/*rapport dispatch*/

#tablerapportdispatch
{
    border-collapse:collapse;
    margin:auto;
    margin-bottom:50px;
}
#tablerapportdispatch td
{
    border:1px solid #aaa;
    padding:3px
}
#tablerapportdispatch tr.green {
    background: #ddf1dd;
}

#tablerapportdispatch tr.red {
    background: #ffd7d7;
}

#tablerapportdispatch tr.orange {
    background: #fee59c;
}

#tablerapportdispatch tr.purple {
    background: #f5cfe7;
}


/**/

#connectagenda
{
	margin:auto;
	text-align:center;
}


#rapportdebutfin,
#rapportintitule
{
	text-align:center;
	font-size: 16px;
    color: #4d96e2;
	padding-left:10%;
	padding-right:10%;
}

#rapportdebutfin > input[type=text]
{
	width:55px;
}

#dernierrapport
{
	text-align:center;
	padding-left:10%;
	padding-right:10%;
}



/*------------------------------------------------------------------------*/





#titrepage
{
    text-align: center;
    line-height: 33px;
    margin: 24px;
    font-size: 33px;
    font-family: "Raleway", Helvetica, Arial, sans-serif;
	font-weight:lighter;
	display: block;
}

#listecarre
{
    position: relative;
	z-index: 10;
	display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    max-width: 1000px;
    margin: auto;
	margin-bottom: -57px;
}
.carre
{
    width: 265px;
    height: 408px;
    margin: 25px;
    background-position: center;
	
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-flow: column;
    font-size: 15px;
    color: #fff;
    font-family: Helvetica, Arial, sans-serif;
	box-shadow: rgba(0,0,0,0.1) 5px -20px 20px;
}
.carre > div
{
	padding-left:31px;
	padding-right:31px;
	padding-bottom:3px;
	padding-top:2px;
}
.carre .centerimage
{
	text-align:center;
}
.carre .centerimage img
{
	border:1px #fff solid;
	max-width: 97%;
}

.titrecarre
{
	background-color: rgba(255,255,255,0.1);
    width: 100%;
    text-align: center;
}
.cbleu{ background: #2a619c; }
.corange{ background: #e0b40d; }
.cviolet{ background: #a23ea2; }
.cgris{ background: #bfbeb9; }
.crouge{ background: #9c3636; }
.carre .carretexte
{
	text-align:justify;
	padding-top:10px;
	padding-bottom:10px;
}
.carrefooter
{
	text-align:center;
	background: rgba(0,0,0,0.2);
	font-size: 12px;
    width: 100%;
}
.carrefooter a
{
	color:#fff;
}
.carreimage
{
	background-position:center center;
	background-size:cover;
	height:130px;
}
.img_statistiques{	background-image:url("img/statistiques.jpg");}
.img_developpement{	background-image:url("img/developpement.jpg");}

.img_api{	background-image:url("img/api.png"); background-color: #3a2e2e;}



@media only screen and (max-width: 650px)
{
	.carre{	width: 80%; }
}





/**----------------------------------------------------------------------------**/

#listeagendas
{
	margin: auto;
	text-align: center;
	max-width: 641px;
	width: 80%;
	border-radius: 5px;
    background: url(img/droitetabcalcrev.jpg);
    background-position: right center;
    background-size: cover;
	box-shadow: rgba(0,0,0,0.1) 0px 7px 11px 0px;
	border: 1px #eee solid;
}
#listeagendas > div
{
	padding-top: 20px;
	padding-bottom: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	width:100%;
	height:100%;
    background: linear-gradient(to right,#fff,rgba(255, 255, 255, 0.6));
	border-radius: 5px;
 }
#listeagendas > div > div
{
	border: 1px solid #eee;
	width: 80%;
	margin: 23px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	background: rgba(255,255,255,0.7);
}
#listeagendas > div > div > div
{
	display:inline-block;
	width:200px;
}
.logoagenda > a > img
{
	max-width: 115px;
}
.logoagenda
{
	margin:20px;
}
.titrelogoagenda
{
	margin:20px;
	text-align:justify;
}


/**---------------------------------------------------------------------------**/

.cadreimagegradient
{
	border: 1px #eee solid;
    border-radius: 5px;
    margin: auto;
    background-image: url(img/droitetabcalcrev.jpg);
    background-position: right center;
    background-size: cover;
	box-shadow: rgba(0,0,0,0.1) 0px 7px 11px 0px;
    border: 1px #eee solid;
	
}
.cadreimagegradient > div
{
    background: linear-gradient(to right,#fff,rgba(255, 255, 255, 0.0));
	border-radius: 4px;
    width: 100%;
    height: 100%;
}


/**---------------------------------------------------------------------------**/



#contactctn
{
	width: 75vw;
	margin: auto;
	max-width: 829px;
}

.inscription, #contactctn
{
    width: 80%;
    max-width: 950px;
    background: url(img/inscription.jpg);
}
.inscription > div, #contactctn > div
{
	position: relative;
	display: flex;
	align-items: stretch;
	justify-content: center;
	background: linear-gradient(to right,#fff,rgba(255, 255, 255, 0.6));

}

.inscription > div > div
{
	background:rgba(255,255,255,0.7);
	margin: 10px;
}

#contact
{
	margin: 10px;
	padding: 14px;
	flex-basis: 35%;
	background:rgba(255,255,255,0.7);
}

#contact textarea, #contact input[type=text]
{
	width:100%;
}
#contact input[name="email"]
{
	display:none;
}
#contact input[type=submit]
{
	width:100%;
	margin:auto;
}
#contact textarea
{
	height:150px;
}
#faq
{
	margin: 10px;
	flex-basis: 65%;
	background:rgba(255,255,255,0.7);
	padding:14px;
}
#faq
{
	margin-left:0;
}

.question
{
	font-weight:bold;
	color:#378de2;
}

@media only screen and (max-width: 950px)
{
	.inscription > div
	{
		flex-wrap: wrap;
	}
	.inscription > div > div
	{
		width:100%;
	}
	#contactctn > div
	{
		flex-wrap: wrap;	
	}
	#faq
	{
		margin-left: 10px;
		width:100%;
	}
	#contact,#faq
	{
		flex-basis: auto;
		width: 100%;
		text-align: center;
	}
	#contact textarea, #contact input[type=text], #contact input[type=submit]
	{
		max-width: 50%;
	}
}
@media only screen and (max-width: 750px)
{
	#contact textarea, #contact input[type=text], #contact input[type=submit]
	{
		max-width: 75%;
	}
}
@media only screen and (max-width: 600px)
{
	#contact textarea, #contact input[type=text], #contact input[type=submit]
	{
		max-width: 100%;
	}
}




/**------------------------------------------------------------------------**/

.inscriptiontable
{
	display:table;
	border: 1px #e6e6e6 solid;
	border-radius: 5px;
    padding: 5px;
    margin: 10px;
}
.inscriptiondiv2
{
	border: 1px #e6e6e6 solid;
	border-radius: 5px;
	padding: 5px;
	margin: 10px;
	text-align:center;
	width: 33vw;
}
.inscriptiontable > div
{
	display:table-row;
}
.inscriptiontable > div > div
{
	display:table-cell;
	padding:5px;
}
.inscriptiontable input,  .inscriptiondiv2 input
{
	width:22vw;
	max-width: 374px;
}
.inscriptiontable .right
{
	text-align:right;
}
.infoinscription
{
	font-size:10px;
}
.textcenter
{
	text-align:center;
}

@media only screen and (max-width: 950px)
{
	.inscriptiontable
	{
		display: block;
		text-align: center;
	}
	.inscriptiontable > div
	{
		display: block;
		text-align: center;
		margin: auto;
	}
	.inscriptiontable > div > div
	{
		display: block;
	}

	.inscriptiontable input,  .inscriptiondiv2 input
	{
		width:30vw;
	}	
	.inscriptiontable, .inscriptiondiv2
	{
		width:80%;
	}	
}
@media only screen and (max-width: 450px)
{
	.inscriptiontable > div > div
	{
		width:100%;
		display:block;
		text-align:center;
	}	
	.inscriptiontable .right
	{
		text-align:center;
	}	
	.inscriptiontable input, .inscriptiondiv2 input
	{
		width:100%;
	}	
}


#cgv
{
    text-align: justify;
    width: 80%;
    border-radius: 5px;
    border: #eeeeee 1px solid;
    margin: auto;
    padding:5vw;
    font-size:10px;
    max-width: 950px;
}


/**----------------------------------------------------------------------------**/

#infoagendasprisencharge
{
	width: 80%;
	max-width: 641px;
	margin: auto;
	text-align: justify;
	border: 1px #eee solid;
	border-radius: 5px;
	padding: 15px;
}

@media only screen and (max-width: 630px)
{
	.logoagenda
	{
		margin: 20px;
		margin-bottom:10px;
	}
	.titrelogoagenda
	{
		margin: 20px;
		margin-top:10px;
	}
}

/**----------------------------------------------------------------------------**/


#notreplateforme
{
    max-width: 836px;
    width: 80%;
}
#notreplateforme > div
{
	padding:4vw;
}

#textenotreplateforme
{
    text-align: justify;
    font-size: 14px;
    line-height: 1.5;
    padding-right: 123px;
}





@media only screen and (max-width: 930px)
{
	#textenotreplateforme
	{
		font-size: 12px;
	}
}
@media only screen and (max-width: 650px)
{
	#textenotreplateforme
	{
		line-height: 1.2;
	}
}
@media only screen and (max-width: 510px)
{
	#textenotreplateforme
	{
		padding-right: 0;
	}
	#notreplateforme > div
	{
		background: linear-gradient(to right,#fff,rgba(255, 255, 255, 0.7));
	}
}

/**----------------------------------------------------------------------------**/


#lespluslinkall
{
	background-image: url(img/cadretopdev.jpg);
    background-position: center top;
    max-width: 836px;
    width: 80%;
    background-size: contain;
}
#lespluslinkall > div
{
	background: linear-gradient(207deg,rgba(255, 255, 255, 0.0),#fff 48%);
	padding: 4vw;
}
#blanctoplesplus
{
	width:100%;
	height:21vw;
	max-height:137px;
}
#textelespluslinkall
{
    text-align: justify;
    font-size: 14px;
    line-height: 1.5;
}

/**----------------------------------------------------------------------------**/

#liensprincipaux
{
	margin: auto;
    width: 80%;
    border: hsl(0, 0%, 94%) 1px solid;
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
    max-width: 700px;
    padding: 6px;
    line-height: 20px;
}

/**----------------------------------------------------------------------------**/

.mapresult
{
	margin:auto;
	margin-top:10px;
	margin-bottom:10px;
	text-align: right;
	border:1px solid #eee;
	table-layout: fixed;
	width:90%;
	max-width:500px;
	font-size: 10px;
}
.mapresult td
{
	padding:5px;
	border-left:1px solid #eee;
	overflow: hidden;
    text-overflow: ellipsis;
	cursor:pointer;
}
.mapresult td:first-child
{
	border-left:none;
}

.mapresult td:nth-of-type(1),.mapresult td:nth-of-type(3)
{
	width:50px;
}

.btnoptimiser
{
	padding: 2px;
	padding-left: 10px;
	padding-right: 10px;
	border: 1px solid #aaa;
	margin: auto;
	border-radius: 26px;
	cursor:pointer;
	display: inline-block;
}

/**----------------------------------------------------------------------------**/
.jauneclignotant {
  animation: jauneblinker 0.5s linear infinite;
  color:#ffbe00;
}

@keyframes jauneblinker {
  50% {
    opacity: 0.3;
  }
}

#listerdv
{
	margin: auto;
	border-collapse: separate;
	border-spacing: 0px 6px;
	word-wrap: break-word;
	width: 100%;
	max-width: calc(510px + 10vw);
	text-align:unset;
	/* table-layout:fixed; */
}
#listerdv>tbody>tr
{
	background: #fbfbfb;
	box-shadow: rgba(0,0,0,0.2) 1px 3px 4px;
	position: relative;
	z-index: 1;
	border-radius: 5px;
	max-width: 100px;
}
#listerdv>tbody>tr:not(.indispo):not(.jour_sep)[class]
{
	background: #cdebff;
}
#listerdv>tbody>tr.supprimee
{
    color: #ccc;
    box-shadow: none;
}
#listerdv>tbody>tr.supprimee .croix_supp
{
    display:none;
}
#listerdv>tbody>.PROPOSE {
	display:none;
    background-color: #ff3e3e;
    color: #fff;
}
#listerdv>tbody>.PROPOSE.OWNER {
	display:table-row;
    background-color: #ffc53e;
}
#listerdv>tbody>tr.exp
{
	background: #f6f3bd;
}
#listerdv>tbody>tr.locked
{
	background: #a2a2a2;
}
#listerdv>tbody>tr.clientresilie
{
	background: #b50020;
	color: #9d9d9d;
}
#listerdv>tbody>tr.planifiee
{
	background: #e7c800;
}
#listerdv>tbody>tr.cloturee
{
	background: #00e725;
}
#listerdv>tbody>tr.locked td,
#listerdv>tbody>tr.cloturee td,
#listerdv>tbody>tr.planifiee td,
#listerdv>tbody>tr.cloturee td
{
	cursor: not-allowed !important;
}


#listerdv input {
    max-width: 100px;
}
#listerdv textarea {
    width:100%;
}
#listerdv span {
    white-space: nowrap;
}
#listerdv>tbody>tr:first-child
{
	background: #3998f1;
    color: #fff;
}
#listerdv td
{
	padding:5px;
	max-width: 16%;
	word-wrap: break-word;
	position:relative;
	word-break: break-word;
}
#listerdv>tbody>tr>td:first-child
{ 
	border-top-left-radius: 5px; 
	border-bottom-left-radius: 5px; 
}
#listerdv>tbody>tr>td:last-child
{ 
	border-top-right-radius: 5px; 
	border-bottom-right-radius: 5px; 
}
#listerdv table {
    border-top: solid 1px #eee;
}

/*cloture ecotel*/
#listerdv form[name="formcloture"] input[type="text"]
{
	max-width: 200px;
}
img[id^="photo_"]
{
	height:25px;
	width:25px;
	vertical-align:bottom;
}
.tab_script i {
    font-size: 24px;
    cursor: pointer;
}
.titreaction {
    background-color: #574d4d;
    color: #fff;
    display: block;
	cursor:pointer;
}
.croix_supp
{
    background-color: #574d4d;
    color: #bab3b3;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid #aaa;
	font-weight: bold;
	cursor:pointer;
	background-image: url(img/actions.png);
    background-size: 90%;
    background-position-x: center;
    background-position-y: center;
    background-repeat: no-repeat;
}
.cadenas
{
    background-color: unset;
    background-image: url(img/cadenas.png);
    background-size: 63%;
}
#liste_nonplanif #listerdv td
{
	cursor: pointer;
}
#liste_nonplanif #listerdv tr:hover
{
	background: #efd42c;
    color: #ffffff;
}
#liste_nonplanif #listerdv tr:hover .tip_planif
{
    color: #000000;
}

#liste_nonplanif #listerdv tr:first-child>td
{
	text-align:center;
}


@media only screen and (max-width: 560px)
{
	#liste_nonplanif #listerdv td.col_ipca,
	#liste_nonplanif #listerdv td.col_exp
	{
		display:none;
	}
}

@media only screen and (max-width: 533px)
{
	#liste_nonplanif #listerdv td.col_username
	{
		display:none;
	}
}
@media only screen and (max-width: 533px)
{
	#liste_nonplanif #listerdv td.col_username
	{
		display:none;
	}
}
@media only screen and (max-width: 456px)
{
	#liste_nonplanif #listerdv td.col_titre,
	#liste_nonplanif #listerdv td.col_ville
	{
		max-width: 25vw;
	}
}
.tip_planif {
    background: #fff;
    margin-top: 6px;
    border-radius: 5px;
    border: 1px solid #0062e4;
}
div[onclick].tip_planif {
    cursor: alias;
}
div[onclick].tip_planif:hover {
    background:#f00;
}


#plannification-cp {
   margin-top:10px;
}
#plannification-cp>a {
    text-decoration: none;
    padding: 1px 3px;
    margin: 3px;
    display: inline-block;
    border-radius: 5px;
    background: #3998f1;
    color: #fff;
}
#plannification-cp>a>span {
    /* font-size:10px; */
    position:relative;
    /* top:-2px; */
    color: #000000;
    font-weight: bold;
}

#liste_planif #listerdv td
{
	text-align:center;
}

#liste_planif #listerdv td.debut{width: 50px;max-width: 10%;}
#liste_planif #listerdv td.duree{width: 50px;max-width: 10%;}
#liste_planif #listerdv td.titre{ max-width: 100%;}
#liste_planif #listerdv td.type{width: 81px;max-width: 10%;}
#liste_planif #listerdv td.reference{width: 80px;max-width: 10%;}
#liste_planif #listerdv td.suppr{width: 31px;max-width: 10%;}


#listerdv tr.ERT-1 {    background-color: #ebe4ff;}
#listerdv tr.ERT-1FIAB {    background-color: #ebe4ef;}
#listerdv tr.ERT-1EXP {    background-color: #ebd4ff;}
#listerdv tr.ERT-1NRA {    background-color: #dbe4ff;}

#listerdv tr.CIRCET-1 {    background-color: #d0e7fb;}
#listerdv tr.CIRCET-1FIAB {    background-color: #d0e7eb;}
#listerdv tr.CIRCET-1EXP {    background-color: #d0d7fb;}
#listerdv tr.CIRCET-1NRA {    background-color: #c0e7fb;}

#listerdv tr.CONNECT-1 {    background-color: #e2e2e2;}
#listerdv tr.CONNECT-1FIAB {    background-color: #e2e2d2;}
#listerdv tr.CONNECT-1EXP {    background-color: #e2d2e2;}
#listerdv tr.CONNECT-1NRA {    background-color: #e2e2e2;}

#listerdv tr.CONNECT {    background-color: #e2e2e2;}
#listerdv tr.CONNECTFIAB {    background-color: #e2e2d2;}
#listerdv tr.CONNECTEXP {    background-color: #e2d2e2;}
#listerdv tr.CONNECTNRA {    background-color: #e2e2e2;}
#listerdv tr.SFR {    background-color: #e2e2e2;}
#listerdv tr.SFRFIAB {    background-color: #e2e2d2;}
#listerdv tr.SFREXP {    background-color: #e2d2e2;}
#listerdv tr.SFRNRA {    background-color: #e2e2e2;}

#listerdv tr.GA {
	transform: translateX(-5px);
    box-shadow: none;    
	background-color: #ffe990;
}

#listerdv tr.jour_sep
{
    background:none;
    box-shadow: none;
    height: 50px;
}
#commentaire123 {
    width: 270px;
    height: 67px;
	vertical-align: middle;
	margin-top:5px;
	margin-bottom:5px;
}
#motif123 {
    width: 270px;
}

#action_selection {
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
	display:none;
}
#action_selection>#motif, #action_selection>#commentaire {
    margin: 10px;
}

#action_selection>#commentaire {
    width: 320px;
    vertical-align: middle;
}


div#filtre_cp {
    margin-top: 30px;
}

#filtre_cp input[type=text] {
    width: 70px;
}
#filtre_cp a[class^="show"]
{
    padding: 2px 4px;
    border-radius: 5px;
    color: #fff;
}
a.showplanifie {
    background: #e7c800;
}
a.showcloture {
    background: #00e826;
}
a.showresilie {
    background: #b50220;
}


#liste_nonplanif {
    text-align: center;
	margin-top: 20px;
}
#divplanification {
	position:relative;
    margin: auto;
	margin-top: 110px;
    width: 330px;
    min-height: 500px;
	max-height: 87%;
    background: #e2ebf1;
    border-radius: 5px;
    padding: 10px;
    overflow: auto;
}
#divplanification>#loading, #popupmsg>#loading {
    background: rgba(0,0,0,0.5);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
	display:none;
	align-items: center;
    justify-content: center;
    perspective: 100px;
}
#popupmsg>#loading {
    position: relative;
    width: 100%;
    height: unset;
	display:block;
	align-items: center;
    justify-content: center;
    perspective: 100px;
	background: none;
	margin-bottom: -18px;
}

#loading>#loadinglogo
{
    background: url(img/logo95x86.png) no-repeat center center;
    background-size: contain;
    width: 50px;
    height: 50px;
    transform: rotateY(0deg);
	transition:all 1s linear;
	animation-name: rotate; 
    animation-duration: 1s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	margin:auto;
}
@keyframes rotate 
{
    from {transform: rotateY(0deg);}
    to {transform: rotateY(360deg);}
}

.close
{
	display: flex;
    position: absolute;
    right: 5px;
    top: 5px;
    width: 30px;
    height: 30px;
    justify-content: center;
    align-items: center;
    background: #aaa;
    border-radius: 50%;
    text-decoration: none;
    color: #fff;
    box-shadow: rgba(0, 0, 0, 0.2) 1px 2px 4px, inset rgba(0, 0, 0, 0.2) 0 -1px 0px;
	cursor: pointer;
}

#divplanification #heure, #divplanification #minute {
    margin-right: 5px;
    margin-top: 5px;
    height: 30px;
    border-radius: 5px;
    border-width: 1px;
    border-color: #09b0db;
    border-style: dotted;
}
#divplanification input[type="text"] {
    width: 125px;
    text-align: center;
    height: 30px;
    border-radius: 5px;
    border-width: 1px;
    border-color: #09b0db;
    border-style: dotted;
}
#divplanification input[name="comm_libre"]
{
	width:100%;
}
#divplanification input[type="checkbox"] {
    width: 23px;
    height: 23px;
    min-width: 23px;
    display: block;
}
#divplanification div#clientresilie {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;
    top: -39px;
    margin-bottom: -29px;
}

input[name="clientresilie"]~span {
    background-color: #3082cc;
    color: #fff;
    border-radius: 6px;
    display: block;
    padding: 0px 4px;
    position:relative;
    top:-2px;
    width: 70px;
    text-align: center;
}
input[name="clientresilie"]:checked~span {
    background-color: #f00;
    top:0px;
}
input[name="clientresilie"]~span:after {
    content: "Client actif";
    position: relative;
}
input[name="clientresilie"]:checked~span:after {
    content:"Client resilie";
}
input[name="clientresilie"]~span:before {
    content: "cocher si resilie";
    position: absolute;
    color: #666;
    font-size: 10px;
    top: 15px;
    left: 0;
    width: 100%;
}
input[name="clientresilie"]:checked~span:before
{
    display:none;
}

#divplanification[data-resilie] input:not([name~='clientresilie']),
#divplanification[data-resilie] select
{
	opacity:0.2 !important;
	pointer-events:none;
}
#prevcomm {
    color: #d37914;
    font-style: italic;
}
.tooltip_comm {
    position: absolute;
    right: 0;
    top: 0;
    font-size: 10px;
    background-color: #3998f1;
    color: #fff;
    border-radius: 10px;
    width: 12px;
    height: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.listing
{
    width: 100%;
    max-width: 600px;
	margin:auto;
	margin-bottom:30px;
}
.listing tr:first-of-type
{
	background:#999;
	color:#fff;
}
.listing tr>td
{
	text-align:
	right;
	border-bottom: 1px solid #f4f2f2;
	padding-left: 1vw;
	padding-right: 1vw;
}
.listing tr>td:first-of-type
{
	text-align:left;
}
.listing tr:first-of-type>td
{
	text-align:center;
}
.listing.gauche tr>td
{
	text-align:left;
}
.listing.ligne tr>td
{
	white-space:nowrap;
}

#listinguserstat > table
{
	width:90%;
}
.planiftech.listing tr>td
{
	text-align:center;
	vertical-align: baseline;
}
@media only screen and (max-width: 450px)
{
	.planiftech.listing tr>td:nth-of-type(1)
	{
		display:none;
	}
}

#legendeclassement 
{
    width: 100%;
    max-width: 600px;
    margin: auto;
    font-size: 10px;
    margin-bottom: 50px;
}
.medaille
{
    position: relative;
    display: inline-block;
    top: 4px;
    margin-left: 2px;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    margin-top: -5px;
}
.medaille.or
{
    background-image: url(img/medaille_or.svg);
}
.medaille.argent
{
    background-image: url(img/medaille_argent.svg);
}
.medaille.bronze
{
    background-image: url(img/medaille_bronze.svg);
}

#formcomment div {
    display: flex;
    margin-top: 10px;
    align-items: center;
}
#commentaire {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding: 5px;
}
#commentaire>div
{
	flex-basis:25%;
	white-space: nowrap;
}
#interstitial {
    position: fixed;
    width: 100%;
    height: 100%;
    display: none;
    top: 0;
    left: 0;
    z-index: 50;
    background-color: rgba(0,0,0,0.2);
    align-items: center;
    justify-content: center;
}

#googlemap {
    width: 100%;
    height: 600px;
}
#googlemap.mapfixed
{
	position: fixed;
    top: 100%;
    left: 0;
	width:100%;
	height: 100%;
	transition:all 1s;
}
#map
{
	width: 100%;
	height: 100%;
}
#btn_showmap
{
	cursor:pointer;
    background-image: url(img/rollup.svg);
    height: 36px;
    width: 80px;
    background-repeat: no-repeat;
    background-position: center;
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}
#flexuserlist {
    width: 90%;
    max-width: 500px;
    margin: auto;
	margin-bottom:20px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    align-items: start;
}
#flexuserlist>div {
    width: 100px;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 5px;
}



.options {
    display: flex;
    width: 100%;
    flex-flow: row;
    align-items: center;
}

.options>div:first-of-type {
    flex-grow: 1;
    /* max-width: 50%; */
    text-overflow: ellipsis;
    overflow: hidden;
}

.options input[type=text] {
    width: 100%;
    height: 18px;
    min-width: unset;
}

.ctnoptions {
    border: 1px solid #ddd;
    padding: 5px;
    position: relative;
    margin-bottom: 5px;
    border-radius: 5px;
    /* width: 97%; */
    overflow: hidden;
    text-overflow: ellipsis;
}

.options>div:nth-of-type(2) {
    /* max-width: 50%; */
}

/*gestion acces*/
.gestionacces {
    display: flex;
    justify-content: space-between;
    margin: auto;
    width: 440px;
    flex-wrap: wrap;
    max-width: 90%;
    background: hsla(0, 0%, 98%, 1);
    padding:5px;
}

.gestionacces>div {
    width: 210px;
}

#detailsgestionnaire {
    display: flex;
    justify-content: center;
    margin: 10px auto;
    width: 440px;
    flex-wrap: wrap;
    max-width: 90%;
    background: hsla(0, 0%, 98%, 1);
    padding:20px;
}
.gestionnaire {
    margin: auto;
    max-width: 200px;
    cursor: pointer;
}
button#btngenererpasseassocie {
    display: block;
    margin: auto;
    margin-top: 20px;
}

div#passeassocie {
    text-align: center;
    margin: 20px;
    color: #3893ea;
}

div#passeassocie>span:nth-of-type(2) {
    font-weight: 600;
}

/*page suppression par lot*/

div#spllist>div {
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
}
div#spllist>div>div {
    margin:20px
}
#spllist>div>div>div
{
	display: flex;
	align-items: flex-end;
}
#spllist input
{
	margin:0;
}

/*gestion plannigs*/

div#plannings 
{
	padding: 10px;
	height: 95vh;
	position: relative;
}
#plannings .theaderV, #plannings .theaderH
{
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
	background: #fff;
}

#plannings table {
    border: 1px solid #eee;
    border-top: none;
    border-left: none;
    box-sizing: border-box;
    margin-bottom: 10px;
    table-layout: fixed;
}
#plannings table {
    /*width: 100%;*/
}
#plannings .theaderV {
	width:18px;
}

#plannings table:not(.theaderV) {
    margin-left: 0;
}

div#plannings>div {
    height: 50%;
    overflow: auto;
    position: relative;
    border: 2px solid #aaa;
    margin-bottom:1px;
}
#plannings tr:first-of-type
{
	height:25px;
}
#plannings td {
    border: 1px solid #fafafa;
    border-bottom: none;
    border-right: none;
    height: 15px;
    white-space: nowrap;
    position: relative;
    width: 84px;
    min-width: 84px;
}
#plannings td.leftsep {
    border-left: 2px solid #fad8d8;
}
#plannings td.hiddencol, #plannings td.filteredcol {
    width: 0 !important;
    min-width: 0 !important;
}
#plannings td.hiddencol:not(.leftsep), #plannings td.filteredcol:not(.leftsep) {
    border: none; 
}

#plannings td.hiddencol div ,#plannings td.filteredcol div {
    display: none;
}

#plannings td div.pdate {
    display: block;
    position:absolute;
    z-index:99;
    left: 0px;
    top: -2px;
    background: #fff;
    padding-left: 1px;
    font-weight: bold;
    color: #3f3f3f;
}

#plannings tr:nth-of-type(even)>td {
    border-top: 1px solid #fff0f0;
}
#plannings #planningB td:not(:first-of-type), #plannings #headerH2 td:not(:first-of-type)
{
	width: 30px;
	min-width: 30px;
}
#plannings td:first-of-type {
	width: 18px;
	min-width: 18px;
}



#plannings .rdv {
    position: absolute;
    border-radius: 5px;
    background: #0873a0;
    color: #fff;
    padding-left: 2px;
    padding-right: 2px;
    display: inline-block;
    opacity: 0.8;
    border: 1px solid #fff;
    width: 82px;
    z-index: 2;
    cursor: pointer;
    top: 0;
	touch-action:none;
}
#plannings .creneau>.rdv:nth-child(2) {
 
    transform:translate(10px,12px);
}
#plannings .creneau>.rdv:nth-child(3) {
 
    transform:translate(20px,24px);
}
#plannings .creneau>.rdv:nth-child(4) {
    transform:translate(30px,36px);
}
#plannings .creneau>.rdv:nth-child(5) {
    transform:translate(40px,48px);
}
#plannings .creneau>.rdv:nth-child(6) {
    transform:translate(50px,60px);
}

#plannings .rdv.indispo,
#plannings .rdv[titre^="indispo"]
{
    opacity: 0.1;
    z-index: 1;
    pointer-events:none;
}
#plannings .rdv.indispo>div,
#plannings .rdv[titre^="indispo"]>div
{
    display:none;
}
#plannings .rdv.inqueue,
#plannings .rdv.queuedinsert
{
    opacity: 0.6;
    border: #f00 1px dotted;
}
#plannings #planningB .rdv {
    width: 30px;
}
#plannings .nopevent .rdv {
    pointer-events:none;
}
#plannings #planningB .rdv>div {
    direction: rtl;
    font-size: 10px;
}
#plannings #headerH2 .headertech {
    width: 30px;
}

#plannings .headertech {
    position: absolute;
    padding-left: 2px;
    padding-right: 2px;
    display: inline-block;
    width: 82px;
    z-index: 1;
    top: 14px;
    font-size: 10px;
    left: 0;
    overflow: hidden;
}
#headerH2 .headertech
{
    overflow: visible;
}
.headertech>div {
    width: 100%;
}
#headerH2 .headertech>div {
    transform: rotate(-23deg) translateX(7px);
}
#plannings .rdv:active {
    cursor: grabbing;
}
#plannings .rdv>div {
    overflow: hidden;
    text-overflow: ellipsis;
}
.rdv .deplanif {
    position: absolute;
    top: 1px;
    right: 2px;
    font-size: 9px;
	cursor:pointer;
}
#plannings .hiderdv {
    display: none;
}
#planningB .rdv .deplanif,
.rdv.queudedinsert .deplanif
{
    display:none;
}

@keyframes twinkling {
  0% {background-color:#a1fbec}
  50% {background-color:#f00}
  100% {background-color:#a1fbec}
}
#refreshbtn {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-color: #9e9d9d;
    background-size: contain;
    position: relative;
    top: 3px;
    -webkit-mask-image: url(img/refresh.svg);
    mask-image: url(img/refresh.svg);
	cursor:pointer;
}
#refreshbtn.twinkling {
  animation-name: twinkling;
  animation-duration:1s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
#ptooltip {
    position: absolute;
    top: -5px;
    right: 0;
    transform: translateX(100%);
    color: #f00;
    font-size: 10px;
    font-weight: 700;
    z-index: 10;
    background: rgba(255,255,255,0.75);
    border-radius: 5px;
    padding-left: 1px;
	pointer-events: none;
}
#movingelement.detailsrdv {
    background: #666;
    position: absolute;
    z-index: 100;
    color: #fff;
    padding: 5px;
    border-radius: 5px;
    border: #fff solid 1px;
    opacity: 0.95;
    width: 430px;
    max-width: 50%;
    height: 500px;
    overflow: auto;
}
#movingelement a[href*="tel:"]
{
    color: #fff;
    margin-bottom: 2px;
    margin-top: 2px;
    padding: 3px;
    display: inline-block;
    border: 1px solid #ffffff;
    border-radius: 20px;
    background-color: #7db5e9;
    text-decoration: none;
}

#movingelement
{
	position:absolute;
	display:none;
}
#topinfo,#infoappversion {
    width: 100%;
    background: #0091db;
    position: fixed;
    bottom: 0;
    left: 0;
    color: #fff;
    opacity:0.9;
    text-align:center;
    display:none;
    z-index:100;
    padding: 5px;
    font-weight: bold;
    font-size: 15px;
}
#infoappversion {
    display:block;
    background: #ff0000;
}
#actionqueue {
    pointer-events:none;
	display:none;
    position: fixed;
    top: 41px;
    right: 5px;
    background: #eca90a;
    z-index: 1000;
    padding: 5px;
    color: #fff;
    border: #fff 1px solid;
    box-shadow: rgba(4, 4, 4, 0.52) 1px 2px 13px;
    opacity: 0.9;
}
span.filtre {
    color: #fff;
    display: inline-block;
    padding-left: 1px;
    padding-right: 1px;
    border-radius: 5px;
    margin-right: 5px;
    margin-bottom: 1px;
    margin:2px;
	cursor:pointer;
}


/*rapport pieces*/

.piece {
    display: flex;
    margin: 20px;
    justify-content: center;
	position:relative;
}

.piece>div:first-of-type {
    width: 480px;
}

.piece>div {
    border: 1px solid #eee;
    text-align: left;
	padding: 5px;
	position:relative;
}

.piece>div>div:nth-of-type(1) {
    color: #0091ff;
}
.piece>div>div:nth-of-type(2) {
    color: #ff9100;
}
.piece .titre {
    font-weight: bold;
    color: #cc9494;
    text-decoration: underline;
}
.piece .date
{
	position: absolute;
    right: 3px;
    bottom: 0;
    font-size: 10px;
}


/*attribution materiel*/
div#materieltech .materiel {
    background: #fafafa;
    padding: 7px;
    display: flex;
    flex-flow: column;
    margin: 5px auto;
    width: 910px;
    max-width: 80%;
    word-break: inherit;
					
					 
					  
    border-radius: 5px;
    box-shadow: rgb(0 0 0 / 16%) 0px 1px 4px;
    cursor: pointer;
}
div#materieltech .materiel:hover:after
{
    content:"Cliquer pour ajouter a  la liste des materiels a attribuer";   
    font-size:12px;
    color:#3998f1;
}
div#materieltech .blocmat {
    height: 23px;
    overflow: hidden;
    display: none;
}
div#materieltech .blocmat.visible {
    height: unset;
}

div#materieltech .stockmat
{
    cursor:pointer;
}

/*rapport motifs clotures*/
div#checkboxfilter {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

div#checkboxfilter>div {
    width: 150px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: left;
}