/*FONCTONNEMENT - STYLE*/

/*RECAP*/
/* -- Entete = newFondIconeEntete et newicon 
   -- Radius =  newiconelarge sur a + newiconeradius (div)
   -- Transparant = newFondIconTransp et newicontransp
   -- Bouton partout (en bas, fermer, fp, ...) = fondNewIcon et newicon

ICONE SIMPE
$vtTexte:=$vtTexte+"<div class=\"fondNewIcon\"><div class=\"newicon fermer\"></div></div>"

ICONE BLEU (BAS, HAUT, Info)
$vtTexte:=$vtTexte+"<div class=\"fondNewIconUtils\"><div class=\"newiconutils bas\"><div class=\"infobulle\">"+Traduction (16433)+"</div></div></div>"
<div class="newicon fermer"></div>

ICONE dans SFL (Avec un fond gris)
<div class="element" onclick=""><div class="fondNewIcon gris"><div class="newicon ajouter2"></div></div><div class="libelle">Ajouter</div></div>

ICONE DIALOGUE EN TETE
<div class="fondNewIconGrand"><div class="newicongrand question"></div></div>
*/

/* ENTETE */
.newFondIconeEntete{
   /* background-color: var(--color-fondbtnentete);*/
	width: 28px;
	min-width: 28px;
	height: 30px;
	border-radius: 13px;
	display: flex;
	align-items: center;
	transition: 0.3s;
}

.newFondIconeEntete .newicon {
	background-color: var(--color-btnentete);
	width: 20px;
	height: 30px;
	margin: auto;
	transition: 0.3s;
}

/* RADIUS */
.radius.actif .loupe, .radius .loupe, .radius.actif .liste, .radius .liste, .radius .newiconelarge, .enteteform .boutons .liste, .enteteform .boutons .oeil, .enteteform .boutons .crayon,.entete .cloche, .blocconnexion .logUser, .blocconnexion .logPassword {
	background-image: none !important;
}
.radius.actif a {
	background-color: var(--color-boutonradius) !important;
}
.radius.actif .newiconeradius {
	width: 20px;
	height: 30px;
	margin: auto;
	transition: 0.3s;
	background-color: var(--color-boutoniconradius);
}
.radius .newiconeradius {
	width: 20px;
	height: 30px;
	margin: auto;
	transition: 0.3s;
	/*background-color: var(--color-boutonradius);*/
	background-color: var(--color-boutonbas); /*BV : c'est + logique*/
}
.radius .large .newiconeradius, .radius.actif .large .newiconeradius {
	width: 26px;
	height: 30px;
}
.entete .newFondIconeRadius .boutonrond {
	background-color: var(--color-boutonradius);
}
.entete .newFondIconeRadius .newicone {
	background-color: var(--color-boutoniconradius);
	width: 20px;
	height: 30px;
	margin: auto;
	transition: 0.3s;
}

/* SIMPLE */
.fondNewIconGrand { /* FOND ICON pour les dialogues */
	background-color: #f7f7f7;
	width: 58px;
	min-width: 58px;
	height: 63px;
	border-radius: 27px;
	display: flex;
	align-items: center;
	transition: 0.3s;
	margin-left: -79px;
	position: absolute;
}
.element .fondNewIcon { /* FOND ICON */
	background-color: var(--color-boutonbasfond);
	width: 26px;
	min-width: 26px;
	height: 28px;
	border-radius: 13px;
	display: flex;
	align-items: center;
	transition: 0.3s;
}
.element .fondNewIcon.petit { /* FOND ICON */
	background-color: var(--color-boutonbasfond);
	width: 22px;
	min-width: 22px;
	height: 24px;
	border-radius: 13px;
	display: flex;
	align-items: center;
	transition: 0.3s;
}
.element:not(.disabled):hover .fondNewIcon { /* Hover sur fond icone que si non disabled*/
	background-color: var(--color-boutonbasfondhover);
}

.newicon { /* ICONE Simple (Utilisé partout) */
	background-color: var(--color-boutonbas);
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	margin: auto;
	transition: 0.3s;
}
.newicongrand {
	background-color: var(--color-boutonbas);
	width: calc(100% - 20px);
	height: calc(100% - 20px);
	margin: auto;
	transition: 0.3s;
	opacity: 0.8;
}
.element:not(.disabled):hover .newicon { /* Hover sur icone que si non disabled */
	background-color: var(--color-boutonbashover);
}
.newicon.iconproc {
	width: 100%;
	height: 100%;
}
/* SIMPLE */
.element .fondNewIcon.gris { /* FOND ICON */
	background-color: #f4f4f4;
}
.element:not(.disabled):hover .fondNewIcon.gris { /* Hover sur fond icone que si non disabled*/
	background-color: var(--color-boutonbasfondhover);
}

.element .fondNewIcon.gris .newicon { /* */
	background-color: var(--color-boutonbas);
}
.element:not(.disabled):hover .fondNewIcon.gris .newicon { /* Hover sur icone que si non disabled */
	background-color: #f4f4f4;
}
/* ICONE Accueil*/
.newFondIconConnexion {
	background-color: transparent;
	width: 28px;
	min-width: 28px;
	height: 30px;
	border-radius: 13px;
	display: flex;
	align-items: center;
	transition: 0.3s;
	position: absolute;
}
.newiconconnexion {
	background-color: var(--color-iconconnexion);
	width: 95%;
	height: 95%;
	margin: auto;
	transition: 0.3s;
}

/* ICONE avec transparence*/
.newFondIconTranspNotHov {
	background-color: transparent;
	width: 28px;
	min-width: 28px;
	height: 30px;
	border-radius: 13px;
	display: flex;
	align-items: center;
	transition: 0.3s;
	cursor: pointer;
}
.newFondIconTransp {
	background-color: transparent;
	width: 28px;
	min-width: 28px;
	height: 30px;
	border-radius: 13px;
	display: flex;
	align-items: center;
	transition: 0.3s;
	cursor: pointer;
}

.newFondIconTransp:not(.active):hover {
	background-color: var(--color-boutonbasfondhover);
}
.newFondIconTransp.active {
	background-color: white;
}

.newicontransp { /* Changement sur l'icone */
	background-color: white;
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	margin: auto;
	transition: 0.3s;
}
.newicontransp.actif {
	background-color: var(--color-icontransparant);
}
/* ICONES Menu de droite*/
.fondNewIconDroite {
	display: flex;
	background-color: var(--color-boutondroitefond);
	width: 32px;
	min-width: 32px;
	height: 35px;
	border-radius: 15px / 17px;
	/* cursor: pointer; */
	background-position: center center;
	background-repeat: no-repeat;
	/* background-size: 50% auto; */
	-moz-transition: background-color 0.2s ease;
	-webkit-transition: background-color 0.2s ease;
	-o-transition: background-color 0.2s ease;
	transition: background-color 0.2s ease;
}
.fondNewIconDroite.transparant {
	background-color: transparent;
}

.element:hover .fondNewIconDroite {
	background-color: var(--color-boutondroitefondhover);
}

.element .newicondroite { /* */
	background-color: var(--color-boutondroite);
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	margin: auto;
	transition: 0.3s;
}
.element .newicondroite.transparant {
	background-color: var(--color-boutondroitetransparant);
}
.element:not(.disabled):hover .fondNewIconDroite .newicondroite { /* Hover sur icone que si non disabled */
	background-color: var(--color-boutondroitehover);
}
.element:not(.disabled):hover .fondNewIconDroite .newicondroite.transparant { /* Hover sur icone que si non disabled */
	background-color: var(--color-boutondroitetransparanthover);
}

.newFondIconTrCol {
	background-color: transparent;
	width: 20px;
	min-width: 20px;
	height: 20px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	transition: 0.3s;
	cursor: pointer;
	border: 1px solid transparent;
}
.newFondIconTrCol.actif {
	border: 1px solid var(--color-icontransparant);
	/*background-color: #ababab0f;*/
	-webkit-box-shadow: 0px 0px 3px 1px #0000003b; 
	box-shadow: 0px 0px 3px 1px #0000003b;
}
.newicontrcol {
	background-color: #7d7d7d;
	height: 18px;
	width: 18px;
	margin: auto;
	transition: 0.3s;
}

/* ICONS UTILS */
.fondNewIconUtils {
	background-color: var(--color-fondbtnutils);
	width: 24px;
	min-width: 24px;
	height: 26px;
	border-radius: 13px;
	display: flex;
	align-items: center;
	transition: 0.3s;
	cursor: pointer;
	margin-right: 4px;
}

.element:hover .fondNewIconUtils {
	background-color: var(--color-fondbtnutilshover);
}
html.rechercheouvert .affichagecolonnes .boutonrond.colrecherche,html.flouvert .affichagecolonnes .boutonrond.colfl,html.fpouvert .affichagecolonnes .boutonrond.colfp {
	background-color:var(--color-boutonbasfondhover);
}
html.rechercheouvert .newFondIconeEntete .newicon.loupe,html.flouvert .newFondIconeEntete .newicon.menu,html.fpouvert .newFondIconeEntete .newicon.document {
	background-color:white;
}																																										

.element .newiconutils { /*  */
	background-color: var(--color-fondbtnutilsicon);
	width: calc(100%);
	height: calc(100%);
	margin: auto;
	transition: 0.3s;
}
.element:hover .newiconutils {
	background-color: var(--color-fondbtnutilshovericon);
}

.form .blocchamp .boutons, .errormessage .champ .boutons,.boutonstoutseul { /* Bouton champ lié*/
	width: 21px !important;
	height: 22px !important;
	background-color: #f4f4f4 !important;
	margin-right: 5px !important;
	border-radius: 10px !important;
	top: 5px !important;
	display: flex !important;
}
.form .blocchamp .boutons div.points,.errormessage div.points,.boutonstoutseul .points { /* Bouton champ lie*/
	-webkit-mask: url(petitspoints.svg) no-repeat center center /100% 100% !important;
	mask: url(petitspoints.svg) no-repeat center center /100% 100% !important;
	background-color: var(--color-boutonbas) !important;
	width: calc(100% - 8px) !important;
	height: calc(100% - 8px) !important;
	margin: auto !important;
	transition: 0.3s !important;
	position: relative;
}

.form .blocchamp .champ input[type=text]:disabled + .boutons, .form .blocchamp .champ input[type=password]:disabled + .boutons, .form .blocchamp .champ textarea:disabled + .boutons{
	display: none !important;
}
.form .blocchamp .champ input[type=text]:disabled.voirboutonquandmeme + .boutons, .form .blocchamp .champ input[type=password]:disabled.voirboutonquandmeme + .boutons, .form .blocchamp .champ textarea:disabled.voirboutonquandmeme + .boutons{
	display: flex !important;
}
.fondNewIconAffichage { /*Icone flèche dans Accordéon*/
	width: 26px;
	height: 26px;
	min-width: 26px;
	right: 25px;
	margin-top: -25px;
	position: absolute;
}
.newfpglobal .fondNewIconAffichage {
	right: calc(15px + 26px + 5px);
}	
.newiconaffichage { /*Icone flèche dans Accordéon*/
	width: calc(100% - 0px);
	height: calc(100% - 0px);
	position: relative;
	background-color: var(--color-fleche);
}
.accordeon.vuehorizontal .newiconaffichage{ /*Icone flèche dans Accordéons*/
	-webkit-mask: url(vuevert2.svg) no-repeat center /100% 100%;
	mask: url(vuevert2.svg) no-repeat center /100% 100%;
}
.accordeon .newiconaffichage{ /*Icone flèche dans Accordéons*/
	-webkit-mask: url(vuehor2.svg) no-repeat center /100% 100%;
	mask: url(vuehor2.svg) no-repeat center /100% 100%;
}
.accordeon .newiconaffichage:hover{
	cursor: pointer;
	opacity: 0.8;
	transition: all 0.3s;
}

.fondFlecheIntoMenu {
	width: 18px;
	height: 18px;
	min-width: 18px;
	margin-top: -3px;
}
.fondFlecheIntoMenu .newiconflechemenu{
	width: calc(100% - 0px);
	height: calc(100% - 0px);
	position: relative;
	background-color: #6a6a6a;
	margin-top: 4px;
}
.fondFlecheIntoMenu .newiconflechemenu.newiconflechehaut {
	margin-top: 4px;
}

.fondNewIconFleche { /*Icone flèche dans Accordéon*/
	width: 26px;
	height: 26px;
	min-width: 26px;
	right: 25px;
	margin-top: -25px;
	position: absolute;
}


.InfoUtil .fondNewIconFleche {right: 280px;}			   

.newfpglobal .fondNewIconFleche {
	right: 15px;
}			   
.newiconfleche,.iconsuivirel,.icondansaccordeon { /*Icone flèche dans Accordéon*/
	width: calc(100% - 0px);
	height: calc(100% - 0px);
	position: relative;
	background-color: var(--color-fleche);
}
.accordeon .newiconfleche, .ssaccordeon .newiconfleche{ /*Icone flèche dans Accordéons*/
	-webkit-mask: url(flechehaut.svg) no-repeat center /100% 100%;
	mask: url(flechehaut.svg) no-repeat center /100% 100%;
}
.accordeon.ferme .newiconfleche, .ssaccordeon.ferme .newiconfleche{ /*Icone flèche dans Accordéons*/
	-webkit-mask: url(flechebas.svg) no-repeat center /100% 100%;
	mask: url(flechebas.svg) no-repeat center /100% 100%;
}
.fondFlecheIntoMenu .newiconflechebas {
	-webkit-mask: url(flechehautbas.svg) no-repeat center /100% 100%;
	mask: url(flechehautbas.svg) no-repeat center /100% 100%;
}
.fondFlecheIntoMenu .newiconflechehaut {
	-webkit-mask: url(flechebashaut.svg) no-repeat center /100% 100%;
	mask: url(flechebashaut.svg) no-repeat center /100% 100%;
}

.accordeon .iconsuivirel, .ssaccordeon .iconsuivirel{ /*Icone flèche dans Accordéons*/
	-webkit-mask: url(suivi-relations.svg) no-repeat center /100% 100%;
	mask: url(suivi-relations.svg) no-repeat center /100% 100%;
	margin-top: 0.5px;
}
.icondansaccordeon.chart {
	-webkit-mask: url(Chart.svg) no-repeat center /22px 22px;
	mask: url(Chart.svg) no-repeat center /22px 22px;
	margin-top: 0.5px;
}
.ssaccordeon .newiconfleche{ /*Icone flèche dans Accordéons*/
	opacity: 0.7;
	margin-top: 1px;
}
.fondIconExplo {
	right: 60px;
} 

/* ICONES */
/* -- Entete -- */
.newicon.dashboard {
	-webkit-mask: url(vue-grille.svg) no-repeat center;
	mask: url(vue-grille.svg) no-repeat center;
}
.newicon.parametres {
	-webkit-mask: url(parametre.svg) no-repeat center;
	mask: url(parametre.svg) no-repeat center;
}
.newicon.logout {
	-webkit-mask: url(logout.svg) no-repeat center /82%;
	mask: url(logout.svg) no-repeat center /82%;
}
.newicon.palette {
	-webkit-mask: url(palette.svg) no-repeat center /20px;
	mask: url(palette.svg) no-repeat center /20px;
}
.newicon.folder {
	-webkit-mask: url(folder.svg) no-repeat center center;
	mask: url(folder.svg) no-repeat center center;
}
.newicon.cloche {
	-webkit-mask: url(cloche.svg) no-repeat center;
	mask: url(cloche.svg) no-repeat center;
}
.newicon.mesDoc {
	-webkit-mask: url(file.svg) no-repeat center;
	mask: url(file.svg) no-repeat center;
}
.newicon.word {
	-webkit-mask: url(word.svg) no-repeat center;
	mask: url(word.svg) no-repeat center;
}
.newicon.loupe {
	-webkit-mask: url(dialogsearch.svg) no-repeat center;
	mask: url(dialogsearch.svg) no-repeat center;
}

/* -- Entete form*/
.newicon.fermer, .newicontransp.fermer, .newicon.stopexport {
	-webkit-mask: url(close2.svg) no-repeat center /100% 100%;
	mask: url(close2.svg) no-repeat center /100% 100%;
}

/* Radius */
.radius .newiconeradius.modifier2 {
	-webkit-mask: url(modifier2.svg) no-repeat center /20px;
	mask: url(modifier2.svg) no-repeat center /20px;
}
.radius .newiconeradius.rech {
	-webkit-mask: url(dialogsearch.svg) no-repeat center /20px;
	mask: url(dialogsearch.svg) no-repeat center /20px;
}
.radius .newiconeradius.menu {
	-webkit-mask: url(menu.svg) no-repeat center;
	mask: url(menu.svg) no-repeat center;
}
.newicondroite.menu {
	-webkit-mask: url(menu.svg) no-repeat center;
	mask: url(menu.svg) no-repeat center;
}
.radius .newiconeradius.fullscreen, .newicon.fullscreen, .newicontransp.fullscreen {
	-webkit-mask: url(fullscreen.svg) no-repeat center;
	mask: url(fullscreen.svg) no-repeat center;
}
.newicon.fullwidth,.newicon.afficherMasquerCriteresBPM {
	-webkit-mask: url(arrow-expand-horizontal2.svg) no-repeat center /24px;
	mask: url(arrow-expand-horizontal2.svg) no-repeat center /24px;
}

html.recherchelarge .bloccorpsrecherche .newicon.fullwidth,
html.fpouvert.rechercheferme.flferme .bloccorpsfp .newicon.fullwidth,
html.flouvert.rechercheferme.fpferme .bloccorpsfl .newicon.fullwidth,
body.BPMCriteresVisibles .newicon.afficherMasquerCriteresBPM {
	-webkit-mask: url(arrow-collapse-horizontal2.svg) no-repeat center /24px;
	mask: url(arrow-collapse-horizontal2.svg) no-repeat center /24px;
}

/* Tourne uniquement l'icône afficherMasquerCriteresBPM */
.newicon.afficherMasquerCriteresBPM {
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg); /* si besoin pour IE */
}



/* Fonctions Bas*/
.newicon.arrow_back {
	-webkit-mask: url(arrow_back.svg) no-repeat center / 100% 100%;
	mask: url(arrow_back.svg) no-repeat center / 100% 100%;
}
.newicon.retourgauche {
	-webkit-mask: url(gauche.svg) no-repeat center / 100% 100%;
	mask: url(gauche.svg) no-repeat center / 100% 100%;
}
.newicon.ajouter {
	-webkit-mask: url(ajouter.svg) no-repeat center center;
	mask: url(ajouter.svg) no-repeat center center;
}
.newicon.modifier {
	-webkit-mask: url(modifier.svg) no-repeat center center;
	mask: url(modifier.svg) no-repeat center center;
}
.newicon.menu,.newicontransp.menu {
	-webkit-mask: url(menu.svg) no-repeat center /20px;
	mask: url(menu.svg) no-repeat center /20px;
}
.newicon.chercher {
	-webkit-mask: url(dialogsearch.svg) no-repeat center /20px;
	mask: url(dialogsearch.svg) no-repeat center /20px;
}
.newicon.chercher2, .newicon.search {
	-webkit-mask: url(dialogsearch.svg) no-repeat center /100% 100%;
	mask: url(dialogsearch.svg) no-repeat center /100% 100%;
}
.newicon.chercheBtn {
	-webkit-mask: url(dialogsearch.svg) no-repeat center;
	mask: url(dialogsearch.svg) no-repeat center;
}
.newicon.reload {
	-webkit-mask: url(reload.svg) no-repeat center /100% 100%;
	mask: url(reload.svg) no-repeat center /100% 100%;
}
.newicon.dernieres {
	-webkit-mask: url(dernieres.svg) no-repeat center /90% 90%;
	mask: url(dernieres.svg) no-repeat center /90% 90%;
}
.newicon.toutes {
	-webkit-mask: url(toutes.svg) no-repeat center /90% 90%;
	mask: url(toutes.svg) no-repeat center /90% 90%;
}
.newicon.dossiershier {
	-webkit-mask: url(dossiershier.svg) no-repeat center /96% 96%;
	mask: url(dossiershier.svg) no-repeat center /96% 96%;
}
.newicon.toutes2 {
	-webkit-mask: url(toutes.svg) no-repeat center /100% 100%;
	mask: url(toutes.svg) no-repeat center /100% 100%;
}
.newicon.reduire {
	-webkit-mask: url(reduire.svg) no-repeat center /90% 90%;
	mask: url(reduire.svg) no-repeat center /90% 90%;
}
.newicon.reduire2 {
	-webkit-mask: url(reduire.svg) no-repeat center /100% 100%;
	mask: url(reduire.svg) no-repeat center /100% 100%;
}
.newicon.enlever {
	-webkit-mask: url(enlever.svg) no-repeat center /70% 70%;
	mask: url(enlever.svg) no-repeat center /70% 70%;
}
.newicon.enlever2 {
	-webkit-mask: url(enlever.svg) no-repeat center /100% 100%;
	mask: url(enlever.svg) no-repeat center /100% 100%;
}
.newicon.document {
	-webkit-mask: url(document.svg) no-repeat center /100% 100%;
	mask: url(document.svg) no-repeat center /100% 100%;
}
.newicon.revenir {
	-webkit-mask: url(retour.svg) no-repeat center /90% 90%;
	mask: url(retour.svg) no-repeat center /90% 90%;
}
.newicon.hierarchie {
	-webkit-mask: url(hierarchy.svg) no-repeat center /100% 100%;
	mask: url(hierarchy.svg) no-repeat center /100% 100%;
}
.newicon.inverser {
	-webkit-mask: url(inverser.svg) no-repeat center /90% 90%;
	mask: url(inverser.svg) no-repeat center /90% 90%;
}
.newicon.classer {
	-webkit-mask: url(menu.svg) no-repeat center /90% 90%;
	mask: url(menu.svg) no-repeat center /90% 90%;
}
.newicon.deployer {
	-webkit-mask: url(deployer.svg) no-repeat center /90% 90%;
	mask: url(deployer.svg) no-repeat center /90% 90%;
}
.newicon.deployer2 {
	-webkit-mask: url(deployer.svg) no-repeat center /100% 100%;
	mask: url(deployer.svg) no-repeat center /100% 100%;
}
.newicon.ajouter {
	-webkit-mask: url(ajouter.svg) no-repeat center /90% 90%;
	mask: url(ajouter.svg) no-repeat center /90% 90%;
}
.newicon.effacer {
	-webkit-mask: url(eraser.svg) no-repeat center /90% 90%;
	mask: url(eraser.svg) no-repeat center /90% 90%;
}
.newicon.effacer2 {
	-webkit-mask: url(erase2.svg) no-repeat center /90% 90%;
	mask: url(erase2.svg) no-repeat center /90% 90%;
}
.newicon.ajouter2 {
	-webkit-mask: url(ajouter.svg) no-repeat center /100% 100%;
	mask: url(ajouter.svg) no-repeat center /100% 100%;
}
.newicon.imprimer2 {
	-webkit-mask: url(imprimer.svg) no-repeat center /104% 104%;
	mask: url(imprimer.svg) no-repeat center /104% 104%;
}
.newicondroite.ajouter {
	-webkit-mask: url(ajouter.svg) no-repeat center center;
	mask: url(ajouter.svg) no-repeat center center;
}
.newicon.check {
	-webkit-mask: url(dialogcheck.svg) no-repeat center /90% 90%;
	mask: url(dialogcheck.svg) no-repeat center /90% 90%;
}
.newicon.check2 {
	-webkit-mask: url(dialogcheck.svg) no-repeat center /100% 100%;
	mask: url(dialogcheck.svg) no-repeat center /100% 100%;
}
.newicon.facturer {
	-webkit-mask: url(facturer.svg) no-repeat center /100% 100%;
	mask: url(facturer.svg) no-repeat center /100% 100%;
}
.newicon.liste {
	-webkit-mask: url(lister.svg) no-repeat center /90% 90%;
	mask: url(lister.svg) no-repeat center /90% 90%;
}
.newicondroite.explorer {
	-webkit-mask: url(lister.svg) no-repeat center center;
	mask: url(lister.svg) no-repeat center center;
}
.newicontransp.liste {
	-webkit-mask: url(lister.svg) no-repeat center /100% 100%;
	mask: url(lister.svg) no-repeat center /100% 100%;
}
.newicondroite.consulter {
	-webkit-mask: url(consulter.svg) no-repeat center center;
	mask: url(consulter.svg) no-repeat center center;
}
.newicon.oeil, .newicontransp.oeil {
	-webkit-mask: url(consulter.svg) no-repeat center /90% 90%;
	mask: url(consulter.svg) no-repeat center /90% 90%;
}
.newicon.crayon, .newicontransp.crayon {
	-webkit-mask: url(modifier.svg) no-repeat center /90% 90%;
	mask: url(modifier.svg) no-repeat center /90% 90%;
}
.newicongrand.question {
	-webkit-mask: url(question.svg) no-repeat center /100% 100%;
	mask: url(question.svg) no-repeat center /100% 100%;
}
.newicongrand.alert {
	-webkit-mask: url(alert.svg) no-repeat center /100% 100%;
	mask: url(alert.svg) no-repeat center /100% 100%;
	margin-top: 7px;
}
.newicon.modifier2 {
	-webkit-mask: url(modifier.svg) no-repeat center /100% 100%;
	mask: url(modifier.svg) no-repeat center /100% 100%;
}
.newicon.valider2 {
	-webkit-mask: url(dialogcheck.svg) no-repeat center /100% 100%;
	mask: url(dialogcheck.svg) no-repeat center /100% 100%;
}
.newicon.modifier3 {
	-webkit-mask: url(modifier2.svg) no-repeat center /100% 100%;
	mask: url(modifier2.svg) no-repeat center /100% 100%;
}
.newicondroite.modifier {
	-webkit-mask: url(modifier.svg) no-repeat center center;
	mask: url(modifier.svg) no-repeat center center;
}
.newicon.gauche {
	-webkit-mask: url(gauche.svg) no-repeat center /100% 100%;
	mask: url(gauche.svg) no-repeat center /100% 100%;
	width: calc(100% - 0px);
	height: calc(100% - 0px);
}
.newicon.droite {
	-webkit-mask: url(droite.svg) no-repeat center /100% 100%;
	mask: url(droite.svg) no-repeat center /100% 100%;
	width: calc(100% - 0px);
	height: calc(100% - 0px);
}
.newicon.flechebas {
	-webkit-mask: url(flechebas.svg) no-repeat center center /100% 100%;
	mask: url(flechebas.svg) no-repeat center center /100% 100%;
	width: calc(100% - 0px);
	height: calc(100% - 0px);
}
.newicon.flechehaut {
	-webkit-mask: url(flechehaut.svg) no-repeat center center /100% 100%;
	mask: url(flechehaut.svg) no-repeat center center /100% 100%;
	width: calc(100% - 0px);
	height: calc(100% - 0px);
}
.newicon.choisir {
	-webkit-mask: url(choisir.svg) no-repeat center /90% 90%;
	mask: url(choisir.svg) no-repeat center /90% 90%;
}
.newicon.choisir2 {
	-webkit-mask: url(choisir.svg) no-repeat center /100% 100%;
	mask: url(choisir.svg) no-repeat center /100% 100%;
}
.newicon.supprimer, .newicontransp.supprimer {
	-webkit-mask: url(poubelle.svg) no-repeat center /90% 90%;
	mask: url(poubelle.svg) no-repeat center /90% 90%;
}
.newicon.supprimer2 {
	-webkit-mask: url(poubelle.svg) no-repeat center /100% 100%;
	mask: url(poubelle.svg) no-repeat center /100% 100%;
}
.newicondroite.supprimer {
	-webkit-mask: url(poubelle.svg) no-repeat center center;
	mask: url(poubelle.svg) no-repeat center center;
}
.newicon.enregistrer {
	-webkit-mask: url(enregistrer.svg) no-repeat center /100% 100%;
	mask: url(enregistrer.svg) no-repeat center /100% 100%;
}
.newicon.exclure {
	-webkit-mask: url(exporter.svg) no-repeat center /100% 100%;
	mask: url(exporter.svg) no-repeat center /100% 100%;
	transform: rotate(90deg);
}
.newicon.fusion {
	-webkit-mask: url(merge.svg) no-repeat center /100% 100%;
	mask: url(merge.svg) no-repeat center /100% 100%;
}
.newicon.etiqueter {
	-webkit-mask: url(etiqueter.svg) no-repeat center /100% 100%;
	mask: url(etiqueter.svg) no-repeat center /100% 100%;
}
.newicon.close2 {
	-webkit-mask: url(close2.svg) no-repeat center /100% 100%;
	mask: url(close2.svg) no-repeat center /100% 100%;
}
.newicon.close {
	-webkit-mask: url(close2.svg) no-repeat center /100% 100%;
	mask: url(close2.svg) no-repeat center /100% 100%;
}
.newicon.imprimer {
   -webkit-mask: url(imprimer.svg) no-repeat center /100% 100%;
	mask: url(imprimer.svg) no-repeat center /100% 100%;
}
.newicondroite.valider {
	-webkit-mask: url(dialogcheck.svg) no-repeat center center;
	mask: url(dialogcheck.svg) no-repeat center center;
}
.newicondroite.cloturer {
	-webkit-mask: url(cloturer.svg) no-repeat center center;
	mask: url(cloturer.svg) no-repeat center center;
}
.newicondroite.masquer {
	-webkit-mask: url(masquer.svg) no-repeat center center;
	mask: url(masquer.svg) no-repeat center center;
}
.newicondroite.imprimer {
	-webkit-mask: url(imprimer.svg) no-repeat center center;
	mask: url(imprimer.svg) no-repeat center center;
}
.newicondroite.exporter {
	-webkit-mask: url(exporter.svg) no-repeat center center;
	mask: url(exporter.svg) no-repeat center center;
}
.newicondroite.parametres {
	-webkit-mask: url(parametre.svg) no-repeat center;
	mask: url(parametre.svg) no-repeat center center;
}
.newicondroite.points {
	-webkit-mask: url(petitspoints.svg) no-repeat center center;
	mask: url(petitspoints.svg) no-repeat center center;
}
.newicon.points2 {
	-webkit-mask: url(petitspoints.svg) no-repeat center center /100% 100%;;
	mask: url(petitspoints.svg) no-repeat center center /100% 100%;;
}
.newiconutils.info {
	-webkit-mask: url(about.svg) no-repeat center center /100% 100%;
	mask: url(about.svg) no-repeat center center /100% 100%;
}
.newiconutils.haut {
	-webkit-mask: url(haut.svg) no-repeat center center /80% 62%;
	mask: url(haut.svg) no-repeat center center /80% 62%;
}
.newiconutils.bas {
	-webkit-mask: url(bas.svg) no-repeat center center /80% 62%;
	mask: url(bas.svg) no-repeat center center /80% 62%;
}
.newicon.exporter2 {
	-webkit-mask: url(exporter.svg) no-repeat center center /100% 100%;
	mask: url(exporter.svg) no-repeat center center /100% 100%;
}
.newicon.expexcel {
	-webkit-mask: url(excel.svg) no-repeat center center /100% 100%;
	mask: url(excel.svg) no-repeat center center /100% 100%;
}
.newiconconnexion.login {
	-webkit-mask: url(login.svg) no-repeat 3px center /90% 70%;
	mask: url(login.svg) no-repeat 3px center /90% 70%;
}
.newiconconnexion.password {
	-webkit-mask: url(cloturer.svg) no-repeat center center /90% 64%;
	mask: url(cloturer.svg) no-repeat center center /90% 64%;
}
.newicon.projets{
	-webkit-mask: url(projets.svg) no-repeat center /100% 100%;
	mask: url(projets.svg) no-repeat center /100% 100%;
	z-index: 3;
}
.newicon.updates{
	-webkit-mask: url(updates.svg) no-repeat center /100% 100%;
	mask: url(updates.svg) no-repeat center /100% 100%;
	z-index: 3;
}
.newicon.taches{
	-webkit-mask: url(taches.svg) no-repeat center /100% 100%;
	mask: url(taches.svg) no-repeat center /100% 100%;
	z-index: 3;
}
.newicon.envoyer{
	-webkit-mask: url(envoyer.svg) no-repeat 2px center /90% 90%;
	mask: url(envoyer.svg) no-repeat center center /90% 90%;
}
.newicontrcol.formatgauche {
	-webkit-mask: url(formatgauche.svg) no-repeat center center /100% 100%;
	mask: url(formatgauche.svg) no-repeat center center /100% 100%;
}
.newicontrcol.formatcentrer {
	-webkit-mask: url(formatcentrer.svg) no-repeat center center /100% 100%;
	mask: url(formatcentrer.svg) no-repeat center center /100% 100%;
}
.newicontrcol.formatdroite {
	-webkit-mask: url(formatdroite.svg) no-repeat center center /100% 100%;
	mask: url(formatdroite.svg) no-repeat center center /100% 100%;
}
.newicon.dialogna {
	-webkit-mask: url(dialogna.svg) no-repeat center center /100% 100%;
	mask: url(dialogna.svg) no-repeat center center /100% 100%;
}
.newicon.fullscreen {
	-webkit-mask: url(fullscreen.svg) no-repeat center;
	mask: url(fullscreen.svg) no-repeat center center /100% 100%;
}
.newicon.toutSelectionner {
	-webkit-mask: url(selectionner-tout.svg) no-repeat center;
	mask: url(selectionner-tout.svg) no-repeat center center /100% 100%;
}
.newicon.toutDeselectionner {
	-webkit-mask: url(deselectionner-tout.svg) no-repeat center;
	mask: url(deselectionner-tout.svg) no-repeat center center /100% 100%;
}
.newicon.vuehierarchie {
	-webkit-mask: url(menu2.svg) no-repeat center /100% 100%;
	mask: url(menu2.svg) no-repeat center center /100% 100%;
}

.newicon.publipost {
	-webkit-mask: url(publipost.svg) no-repeat center /100% 100%;
	mask: url(publipost.svg) no-repeat center center /100% 100%;
}

.formEnvoyerEmail .ssaccordeon .fondNewIconFleche{ 
	width: 26px !important;
	height: 26px !important;
	min-width: 26px !important;
	right: 0px !important;
	margin-top: -3px !important;
	margin-right: 8px !important;
	left: 20px !important;
	float: right !important;
	position: relative !important;
	display: block;
}
.custom-layer .boutons.fr-command {
	top: 26px !important;
}
.newicon.file-folder {
	-webkit-mask: url(file-folder.svg) no-repeat center center /20px 20px;
	mask: url(file-folder.svg) no-repeat center center /20px 20px;
}
.newicon.file-file {
	-webkit-mask: url(file-file.svg) no-repeat center center /20px 20px;
	mask: url(file-file.svg) no-repeat center center /20px 20px;
}
.newicon.file-image {
	-webkit-mask: url(file-image.svg) no-repeat center center /20px 20px;
	mask: url(file-image.svg) no-repeat center center /20px 20px;
}
.newicon.file-music {
	-webkit-mask: url(file-music.svg) no-repeat center center /20px 20px;
	mask: url(file-music.svg) no-repeat center center /20px 20px;
}
.newicon.file-pdf {
	-webkit-mask: url(file-pdf.svg) no-repeat center center /20px 20px;
	mask: url(file-pdf.svg) no-repeat center center /20px 20px;
}
.newicon.file-ppt {
	-webkit-mask: url(file-ppt.svg) no-repeat center center /20px 20px;
	mask: url(file-ppt.svg) no-repeat center center /20px 20px;
}
.newicon.file-text {
	-webkit-mask: url(file-text.svg) no-repeat center center /20px 20px;
	mask: url(file-text.svg) no-repeat center center /20px 20px;
}
.newicon.file-video {
	-webkit-mask: url(file-video.svg) no-repeat center center /20px 20px;
	mask: url(file-video.svg) no-repeat center center /20px 20px;
}
.newicon.file-word {
	-webkit-mask: url(file-word.svg) no-repeat center center /20px 20px;
	mask: url(file-word.svg) no-repeat center center /20px 20px;
}
.newicon.file-xls {
	-webkit-mask: url(file-xls.svg) no-repeat center center /20px 20px;
	mask: url(file-xls.svg) no-repeat center center /20px 20px;
}
.newicon.file-zip {
	-webkit-mask: url(file-zip.svg) no-repeat center center /20px 20px;
	mask: url(file-zip.svg) no-repeat center center /20px 20px;
}
.newicon.Chart {
	-webkit-mask: url(Chart.svg) no-repeat center center/100% 100%;
	mask: url(Chart.svg) no-repeat center center/100% 100%;
}.newicon.Table {
	-webkit-mask: url(Table.svg) no-repeat center center/100% 100%;
	mask: url(Table.svg) no-repeat center center/100% 100%;
}.newicon.Copy {
	-webkit-mask: url(copy.svg) no-repeat center center/100% 100%;
	mask: url(copy.svg) no-repeat center center/80% 80%;
}

.boutoninvisible {
	width: 40px;
	min-width: 40px;
	height: 34px;
	display: flex;
	align-items: center;   
}

.newicon.user-check{
	-webkit-mask: url(user-check.svg) no-repeat center / 100% 100%;
	mask: url(user-check.svg) no-repeat center / 100% 100%;
}

.newicon.user-down{
	-webkit-mask: url(user-down.svg) no-repeat center / 100% 100%;
	mask: url(user-down.svg) no-repeat center / 100% 100%;
}
.newicon.columns-order {
	-webkit-mask: url(columnorder.svg) no-repeat center / 100% 100%;
	mask: url(columnorder.svg) no-repeat center / 100% 100%;
}