/***********************************/
.mioSwitch{
	position: relative;
	display: inline-block;
	width: 100px;
	height: 30px;
	overflow: hidden;
	border-radius: 20px !important;
	border: 0px solid #000000;
	cursor: pointer;
	zoom: 1;
}
.mioSwitch{
	height: 24px;
}
.mioSwitch.mioSwitch_allergeni{
	width: 55px;
}
.mioSwitch.mioSwitch_coloriAttivati{
	width: 240px;
}
.mioSwitch.mioSwitch_numeriFotoVisibili{
	width: 280px;
}



.mioSwitch .inside{
	position: absolute;
	width: 100%;
	height: calc(100% + 24px);
	margin-top: -11px;
	border: 0px dashed #000;
	oooopacity: 0.5;

}

.mioSwitch[stato="off"] .inside{
	margin-left: calc(-100% + 19px); 
}

.mioSwitch[stato="on"] .inside{
	margin-left: calc(0% - 9px); 
}

.mioSwitch.on{
	background: lightgreen;
	color: #000;
}
.mioSwitch.off{
	background: gray;
	color: #fff;
}

.mioSwitch.on.mioSwitch_allergeni{
	background: #3E9FDE;
	color: #fff;
}
.mioSwitch.off.mioSwitch_allergeni{
	background: gray;
	color: #fff;
}



.mioSwitch.on.mioSwitch_coloriAttivati{
	color: #000;
background: rgb(255,250,158);
background: -moz-linear-gradient(-45deg, rgba(255,250,158,1) 16%, rgba(107,166,214,1) 40%, rgba(242,130,255,1) 61%, rgba(182,255,165,1) 80%);
background: -webkit-linear-gradient(-45deg, rgba(255,250,158,1) 16%,rgba(107,166,214,1) 40%,rgba(242,130,255,1) 61%,rgba(182,255,165,1) 80%);
background: linear-gradient(135deg, rgba(255,250,158,1) 16%,rgba(107,166,214,1) 40%,rgba(242,130,255,1) 61%,rgba(182,255,165,1) 80%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffa9e', endColorstr='#b6ffa5',GradientType=1 );
}
.mioSwitch.off.mioSwitch_coloriAttivati{
	color: #fff;
}


.mioSwitch .inside .txt_on,
.mioSwitch .inside .txt_off{
	position: absolute;
	width: calc(100% + 2px);
	height: 100%;
	margin-left:0px;
	text-align: center;
	font-size: 16px;
	line-height: 49px;

}
.mioSwitch .inside .txt_on{
	left: 0px;
}
.mioSwitch .inside .txt_off{
	left: 100%;
	margin-left: -12px;
	
}

.mioSwitch .inside .cursore{
	position: absolute;
	top: 0px;
	left: 100%;
	margin-top: 13px;
	margin-left: -16px;
	background: white;
	border: 0px solid #333;
	border-radius: 100% !important;
	width: 24px;;
	height: 24px;
	z-index: 30;
}
.mioSwitch .inside .cursore{
	margin-left: -17px;
	width: 20px;
	height: 20px;
}

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