

/* Overide noUiSlider */
.interaction_slider {
    display: block;
    padding: 0px !important;
}

/* Height */
.interaction_slider .noUi-horizontal {
    height: 10px !important;
}

/* Handle */
.interaction_slider .noUi-handle {
    display: inline-block;
    margin-top: -5px;
    width: 32px;
    height: 32px;
    padding: 1px;
    background-image: none !important;
    border: 1px solid #ccc;
    border-radius: 20px;
    background-color: #fff; /* For Safari 5.1 to 6.0 */
    background-image: url(images/handle.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    cursor: col-resize; 
    /*
    box-shadow: inset 0 0 1px #FFF,
                inset 0 1px 7px #EBEBEB,
                0 3px 6px -3px #BBB;
    */
}
/* Remove default ui slider handle lines */ 
.interaction_slider .noUi-handle:before, .noUi-handle:after {
    width: 0px;
}


.interaction_slider .noUi-handle:hover {
    border: 1px solid #aaa;

    /*
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.46) !important;
    -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.46) !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.46) !important;
    */
}
.interaction_slider .noUi-handle:before {
    
}
.interaction_slider .noUi-handle:after {
    background: #ccc;
}
.interaction_slider .noUi-origin {
    border-radius: 0px 10px 10px 0px;
}

/* Background */
.interaction_slider .noUi-background {
    background: #bfbfbf;
    border: 0px solid #ccc;
    height: 8px;
}

.interaction_slider .noUi-target {
    background: #ebe7e2;
}


/* Connect */
.interaction_slider .noUi-connect {
    border: 0px solid #bfbfbf;
    height: 8px;

    background: #ee7023; /* For browsers that do not support gradients */
    /*
    background: -webkit-linear-gradient(left, #ef712f, #f5c01b); 
    background: -o-linear-gradient(right, #ef712f, #f5c01b); 
    background: -moz-linear-gradient(right, #ef712f, #f5c01b); 
    background: linear-gradient(right, #ef712f, #f5c01b); 
    */
}

.interaction_bottom_margin {
    margin-bottom: 5px;
}


/* Input radio buttons */ 
input[type="radio"] {
    display: none;
}
input[type="radio"] + label span {
    display: inline-block;
    width: 19px;
    height: 19px;
    margin: -1px 4px 0 0;
    vertical-align: middle;
    background: url("../img/check_radio_sheet.png") -37px top no-repeat;
    cursor: pointer;
}
input[type="radio"]:checked + label span {
    background: url("../img/check_radio_sheet.png") -56px top no-repeat;
}

/*  Calculation sizes */
.calcSize_small {
    font-size: 20px;
}
.calcSize_medium {
    font-size: 26px;
}
.calcSize_large {
    font-size: 32px;
}

