﻿.toggle-container
{
    position: relative;
}

.range-field
{
 	display: inline-block;
  	width:100px;
  	margin: 0px;
  	border-radius: 2px;
}

.toggle-true-msg
{
    display: none;
    opacity: .2;
    transition: .5s opacity;
    display: inline-block;
    position: relative;
    top: -8px;
}

.toggle-false-msg
{
    display: none;
    opacity: .2;
    transition: .5s opacity;
    display: inline-block;
    position: relative;
    top: -8px;
}

.toggle-neutral-msg
{
    display: none;
    opacity: .2;
    transition: .5s opacity;
    display: none;
    position: relative;
    top: -8px;
}

#textActive
{
    opacity: 1;
    color:black;
}

input[type=range]
{
    -webkit-appearance: none;
    margin: 0;
    width: 100%;
    padding: 6px 0 0 0;
    outline: none;
    border: none;
}

input[type=range]:focus
{
    outline: none;
}

input[type=range]::-webkit-slider-runnable-track
{
    width: 100%;
    height: 30px;
    cursor: pointer;
    animate: 0.2s;
    box-shadow: 0px 0px 0px #000000;
    background: #FED71A;
    border-radius: 7.5px;
    border: 1px solid #000000;
}

input[type=range]::-webkit-slider-thumb
{
    -webkit-appearance: none;
    border: 1px solid #000000;
    height: 30px;
    width: 19px;
    border-radius: 10px;
    background: #C4C4C4;
    cursor: pointer;
    margin-top: -2px;
	box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}

input[type=range]:focus::-webkit-slider-runnable-track
{
  background: #FED71A;
}

input[type=range]::-moz-range-track
{
  width: 100%;
  height: 30px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background: #FED71A;
  border-radius: 7.5px;
  border: 1px solid #000000;
}

input[type=range]::-moz-range-thumb
{
    border: 1px solid #000000;
    height: 30px;
    width: 19px;
    border-radius: 10px;
    background: #C4C4C4;
    cursor: pointer;
	box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}

input[type=range]::-ms-track
{
    width: 100%;
    height: 30px;
    cursor: pointer;
    animate: 0.2s;
    background: transparent;
    border-color: transparent;
    color: transparent;
}

input[type=range]::-ms-fill-lower
{
    background: #FED71A;
    border: 1px solid #000000;
    border-radius: 7.5px;
    box-shadow: 0px 0px 0px #000000;
}

input[type=range]::-ms-fill-upper
{
    background: #FED71A;
    border: 1px solid #000000;
    border-radius: 7.5px;
    box-shadow: 0px 0px 0px #000000;
}

input[type=range]::-ms-thumb
{
    border: 1px solid #000000;
    height: 30px;
    width: 19px;
    border-radius: 10px;
    background: #C4C4C4;
    cursor: pointer;
	box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}

input[type=range]:focus::-ms-fill-lower
{
    background: #FED71A;
}

input[type=range]:focus::-ms-fill-upper
{
    background: #FED71A;
}

input[type=range]::-ms-tooltip
{
    display: none;
}

.rangeTrue::-ms-fill-lower, .rangeTrue::-ms-fill-upper
{
    background: #6AEB75 !important;
    border: 1px solid #6AEB75 !important;
}

.rangeTrue::-ms-thumb
{
    background: white !important;
}

.rangeNeutral::-ms-fill-lower, .rangeNeutral::-ms-fill-upper
{
    background: #FED71A !important;
    border: 1px solid #FED71A !important;
}

.rangeNeutral::-ms-thumb
{
    background: white !important;
}

.rangeFalse::-ms-fill-lower, .rangeFalse::-ms-fill-upper
{
    background: #FE3324 !important;
    border: 1px solid #FE3324 !important;
}

.rangeFalse::-ms-thumb
{
    background: white !important;
}

.rangeTrue::-webkit-slider-runnable-track
{
    background: #6AEB75 !important;
    border: 1px solid #6AEB75 !important;
}

.rangeTrue::-webkit-slider-thumb
{
    background: white !important;
}

.rangeNeutral::-webkit-slider-runnable-track
{
    background: #FED71A !important;
    border: 1px solid #FED71A !important;
}

.rangeNeutral::-webkit-slider-thumb
{
    background: white !important;
}

.rangeFalse::-webkit-slider-runnable-track
{
    background: #FE3324 !important;
    border: 1px solid #FE3324 !important;
}

.rangeFalse::-webkit-slider-thumb
{
    background: white !important;
}
