/* Generic context menu styles */
.contextMenu,.contextMenu ul:not(.contextMenu .sub ul){
	position: fixed;
	min-width: 150px;
	z-index: 99999;
	/*border: solid 1px #CCC;*/
	background: #FFFFFF;
	padding: 20px !important;
	margin: 0px !important;
	display: none;
	border-radius:10px;
	box-shadow: 0px 0px 10px 2px lightgray;

}

.contextMenu .sub ul{
	display:none;
	font-size:14px;
	padding-inline-start: 15px;
	margin-top:5px;
}

.explorateur .contextMenu {
	padding: 10px !important;
}
.contextMenu ul:not(.contextMenu .sub ul){ /*sousmenu*/
	margin:-28px 0px 0px 149px;
}
.contextMenu LI {
	list-style: none;
	padding: 0px;
	margin: 0px;
	position:relative;
}


.contextMenu .sub ul a{
	padding:3px;
}

.contextMenu LI.sub > A {
    padding-right: 25px;
	/* background-image:url(../Images/flechedroitegris.png); */
	position:relative;
	background-position:right 7px center; /*background-position:right 7px center;*/
}

.contextMenu LI.sub > a::after {
	pointer-events:none;
	
	/*Triangle vers le bas*/
	content: "";
	border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #666;	
    position: absolute;
    right: 5px;
    top: 50%;
	transform: translateY(-50%);
	/*--------------------*/
}

.contextMenu LI.sub:not(::before):hover > a::after{border-top: 6px solid #fff;}

.triangeflechehaut::after {
	/* background-image:url(../Images/flechedroite2.png); */
	/* Triangle vers le haut */
	border-top: none!important;
    border-bottom: 6px solid #666;
	/* -------------------- */
}

.hover .triangeflechehaut::after{border-bottom: 6px solid #fff;}

.displaysub{display:block!important;}

.contextMenu A {
	color: #6a6a6a;
	text-decoration: none;
	display: block;
	line-height: 16px;
	background-position: 6px center;
	background-repeat: no-repeat;
	outline: none;
	padding:5px 8px;
}

.contextMenu LI.hover > A {
	color:#FFF;
	background-color: #3399FF;
}

.contextMenu LI.disabled A,.contextMenu LI.grisclair A {
	color:#ddd;
	cursor:default;
}
.contextMenu LI.grisclair A::after { /*la classe grisclair indique que c'est temporairement inactif, mais que ça va le devenir*/
	content:'';
	position:absolute;
	background-image:url('../images/loading.gif');
	background-repeat:no-repeat;
	background-position:center;
	background-size:17px;
	width:17px;
	height:17px;
	left:-12px;
}
.contextMenu LI.hover.disabled A,.contextMenu LI.hover.grisclair A {
	background-color: transparent!important;
	color: #ddd!important;
}

.contextMenu LI.separator {
	position: relative;
	margin-top: 15px !important;
}

.contextMenu LI.separator::before {
	content: "";
	position: absolute;
	top: -8px;
	left: 0;
	right: 0;
	height: 1px;
	background-color: #ECECEC;
}
@media screen and (max-height: 800px), screen and (max-device-height: 800px) {
	.contextMenu.hautmenu {
		padding:10px !important;
	}
	.contextMenu.hautmenu LI.grisclair A::after {
		left:-10px;
	}
}
@media screen and (max-height: 750px), screen and (max-device-height: 750px) {
	.contextMenu.hautmenu LI.separator {
		margin-top: 11px !important;
	}
	.contextMenu.hautmenu LI.separator::before {
		top:-6px;
	}
	.contextMenu.hautmenu A {
		line-height: 15px;
		font-size: 15px;
		padding:3px 8px;
	}
}