/* Custom icons */

#INDmenu-btn{
	--indscale-contra: calc(1 - var(--indscale));
	--indscale-margin: calc( var(--indscale-contra) * 10 * -4px );
}

.INDpositionRight #INDmenu-btn{
	right: 5px !important;
	margin-right: var(--indscale-margin) !important;
}

.INDpositionLeft #INDmenu-btn{
	left: 5px !important;
	margin-left: var(--indscale-margin) !important;
}

#INDmenu-btn{
	padding: 15px;
	background: var( --indmaincolor ) !important;
}

#INDmenu-btn > svg{
	transform: none !important;
	width: 50px !important;
	height: 50px  !important;
	display:block !important;
}
#INDmenu-btn svg * {
	stroke: none !important;
	fill: var( --indsecondcolor ) !important;
}

#INDmenu-btn > span{
	text-align: center;
	font-size: 1.7rem;
	color: var( --indsecondcolor ) !important;
}
/* Arrows */
#INDmenu-btn.INDarrow-btn.INDarrow-before-btn > span{
	padding-right: 0px;
	padding-left: 20px;
}

#INDmenu-btn.INDarrow-btn.INDarrow-after-btn > span{
	padding-right: 20px;
	padding-left: 0px;
}

#INDmenu-btn.INDarrow-btn.INDarrow-before-btn > span:before,
#INDmenu-btn.INDarrow-btn.INDarrow-after-btn > span:after{
	content: '';
}

#INDmenu-btn.INDarrow-btn > span:before,
#INDmenu-btn.INDarrow-btn > span:after{
	background: transparent !important;
	position: absolute;
	top: 26px;
	height: 11px;
	width: 11px;
	border: 2px solid var(--indsecondcolor) !important;
	border-bottom-left-radius: 2px;
	border-top: none !important;
	border-right: none !important;
}

#INDmenu-btn.INDarrow-btn > span:before{
	left: 15px !important;;
}

#INDmenu-btn.INDarrow-btn> span:after{
	right: 15px !important;;
}

#INDmenu-btn.INDarrow-right-btn > span:before,
#INDmenu-btn.INDarrow-right-btn > span:after{
    transform: rotate(225deg);
}

#INDmenu-btn.INDarrow-left-btn > span:before,
#INDmenu-btn.INDarrow-left-btn > span:after{
    transform: rotate(45deg);
}

#INDmenu-btn.INDarrow-up-btn > span:before,
#INDmenu-btn.INDarrow-up-btn > span:after{
    transform: rotate(135deg);
}
#INDmenu-btn.INDarrow-down-btn > span:before,
#INDmenu-btn.INDarrow-down-btn > span:after{
    transform: rotate(-45deg);
}

/*Outlined btn*/
#INDmenu-btn.INDoutline-btn{
	color: var( --indmaincolor ) !important;
	border: 5px solid var( --indsecondcolor ) !important;
}

/*Rounded btn*/
#INDmenu-btn.INDrounded-btn{
	border-radius: 15px !important;
}

/*Circle btn*/
#INDmenu-btn.INDcircle-btn {
	border-radius: 100px !important;
}

/*Semi-Circle btn
#INDmenu-btn.INDsemicircle-btn{
	margin: 0 !important;
}
*/

.INDpositionLeft #INDmenu-btn.INDsemicircle-btn{
	left: 0 !important;
	border-radius: 0 100px 100px 0 !important;
	padding-left: 12px !important;
}
.INDpositionRight #INDmenu-btn.INDsemicircle-btn{ 
	right: 0 !important;
	border-radius: 100px 0 0 100px !important;
	padding-right: 12px !important;
}
/*Kano btn :)*/
.INDpositionLeft #INDmenu-btn.INDkano-btn{
	border-radius: 0 100px !important;
}

.INDpositionLeft #INDmenu-btn.INDkano-btn > svg{
	transform: rotate(-45deg) !important;
}

.INDpositionRight #INDmenu-btn.INDkano-btn{
	border-radius: 100px 0 !important;
}

.INDpositionRight #INDmenu-btn.INDkano-btn > svg{
	transform: rotate(45deg) !important;
}

/*Drag tooltip*/
.INDhasDragTooltip #INDWrap #INDmenu-btn-moveArrow{
	display: block			!important;
}

.INDhasDragTooltip.INDpositionRight #INDmenu-btn:before{
	right: 0!important;;
}

.INDhasDragTooltip.INDpositionRight #INDmenu-btn:after{
	right: 100% !important;
}

.INDhasDragTooltip.INDpositionLeft #INDmenu-btn:before{
	left: 0 !important;
}

.INDhasDragTooltip.INDpositionLeft #INDmenu-btn:after{
	left: 100% !important;
}

.INDhasDragTooltip #INDmenu-btn.INDoutline-btn:hover,
.INDhasDragTooltip #INDmenu-btn.INDoutline-btn:focus{
	border: none !important;
}