.toggleSettingContainer
{
    position: relative;
    border-spacing: 0 5px;
    display: table;
}

.toggleSettingContainerInner
{
    display: table-row;
}

.toggleSettingContainer .desc,
.toggleSettingContainer .toggle
{
    display: table-cell;
    vertical-align: middle;
}

.toggleSettingContainer .desc
{
    width: 100%;
    padding-right: 10px;
}

.toggleSettingContainer .desc label
{
    font-size: 1.15em; /* 16px */
}

.toggleSettingContainer .desc p
{
    margin-top: 8px;
}

.scrimp .slidebutton-container {
    margin-left: 30px;
}

.slidebutton-container
{
        position: relative;
        cursor: pointer;
        overflow: hidden;
        /* prevent text selection */
        -khtml-user-select: none;
        -o-user-select: none;
        -moz-user-select: none;
        -moz-user-focus: ignore;
        -moz-user-input: disabled;
        height: 18px;
        /* set default width based on ON/OFF labels */
        width: 45px;
        margin-left: 20px;
        padding: 2px;
        border-radius: 50px;
        background-color: #ccc;
}

.slidebutton-container input
{
        position: absolute;
        top: 9px;
        left: 34px;
        -moz-opacity: 0.0;
        opacity: 0.0;
        /* allow checking of input if visible */
        -moz-user-input: enabled !important;
}

.ie8 .slidebutton-container input                                                               
{                                                                                               
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);                             
}                                                                                               
                                                                                                
.slidebutton-disabled                                                                           
{                                                                                               
        opacity: 0.5;        
	cursor: not-allowed;                                                                   
}                                                                                               
                                                                                                
/* MS alpha filter opacity effect doesn't seem to apply to the div and its child divs as a unit.
   So we have to dim back disabled sliders like this.*/                   
.ie8 .slidebutton-disabled div                                            
{                                                                         
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
        filter: alpha(opacity=50);           
}

.slidebutton-label-on, .slidebutton-label-off                                                   
{                                                                                               
        position: absolute;                                                                     
        display: block;                                                                         
        white-space: nowrap;                                                                    
        font-size: 17px;                                                                        
        text-transform: uppercase;                                                              
        cursor: inherit;                                                                        
        width: auto;                                                                            
        overflow: hidden;                                                                       
        z-index: 1;         
        border-radius:50px;                                                                  
}                                                                         
                                                                          
.slidebutton-label-on                                                     
{                                                                         
        left: 0px;                                                                            
}                                
                     
                                                                   
.slidebutton-label-off                                             
{                                                                         
        right: 0px;                                                
}                                                                  
                                                                   
.slidebutton-label-on div, .slidebutton-label-off div
{                                                    
        color: #fff;                                                                            
        line-height: 16px;                                                                      
        text-align: center;                                                                     
        width: 40px;                                                                            
}

.slidebutton-label-off div                                                                      
{
        width: 40px;
}                                                                                               
                                                                                                
.slidebutton-handle                                                                             
{
        display: block;
        position: absolute;
        /* cursor: pointer; */
        z-index: 3;
        padding-left: 3px;
        margin-left: 0px;
        height: 18px;                                                                           
        /* set default width based on ON/OFF labels */
        width: 18px;
}                                                                                               
                                                                                                
.slidebutton-handle-right                                                                       
{                                                                                               
        height: 100%;                                                                           
        width: 100%;                                                      
        padding-right: 3px;                                               
        z-index: 3;                                                       
}                                                                         
                                                                                                
.slidebutton-handle-middle                             
{                                                                  
        height: 100%;                                              
        width: 100%;                                                      
        z-index: 3;                                                
}                                                                  
                                                                   
.slidebutton-loader                                   
{                                                     
        position: absolute;                                                                     
        height: 100%;                                                                           
        width: 100%;                                                                            
        margin: -2px;                                                                           
        z-index: 999;                                                                           
        opacity: 0.6;                                                                           
}                                                                         
                                                                          
.ie8 .slidebutton-loader                                                  
{                                                                         
        background-color: transparent;                
        filter:                                       
                progid:DXImageTransform.Microsoft.Alpha(Opacity=60)
                progid:DXImageTransform.Microsoft.Gradient(startColorstr=#3cFFFFFF, endColorstr=#3cFFFFFF);
}
/*

.slidebutton-focus
{
    background: url("images/toggle_switch/bg-toggle-focus.png") no-repeat center;
}

.slidebutton-label-on, .slidebutton-label-off
{
    font-weight: bold;
    font-family: NHaasGroteskTXPro-55Rg, Helvetica, sans-serif;
}

.slidebutton-label-on
{
    background: url("images/toggle_switch/on.png") no-repeat;
    text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
}

.slidebutton-label-off
{
    background: url("images/toggle_switch/off.png") no-repeat right 0;
    text-shadow: 0px 0px 2px #353535;
}

.slidebutton-handle
{
  background: url("images/toggle_switch/slider_left.png") no-repeat 0 0; 
}

html.rtl .slidebutton-handle
{
    background: url("images/toggle_switch/slider_right.png") no-repeat right 0;
}

.slidebutton-handle-right
{
    background: url("images/toggle_switch/slider_right.png") no-repeat right 0;
}

html.rtl .slidebutton-handle-right
{
    background: url("images/toggle_switch/slider_left.png") no-repeat 0 0;
}
*/

.slidebutton-handle-middle
{
    background: url("images/toggle_switch/slider_center.png") center;
}

.slidebutton-loader
{
    background: #fff url("images/toggle_switch/toggle-loader.gif") no-repeat center;
}

.slidebutton-container.isOff {
			background-color: #D8DADA;
}
.slidebutton-container.isOn {
			background-color: var(--primaryColor)  
			
}