.rangebox {
            position: relative;
            width: 100%;
            height: 15px;
             
            border-radius: 10px;
            margin-top: 30px;
        }
            .rangebox:before {
                position: absolute;
                content: ' ';
                left: 0;
                top: 25%;
                height: 50%;
                right: 0;
                background: white;
                border: 1px solid #dddddd;
                border-top-left-radius: 5px;
                border-bottom-left-radius: 5px;
                border-bottom-right-radius: 5px;
                border-top-right-radius: 5px;
            }

        .rangevalue {
            height: 100%;
            position: absolute;
            top: 0px;
            left: 10%;
            width: 30%;
        }
        .bgrangevalue:before {
            position: absolute;
            content: ' ';
            left: 0;
            top: 15%;
            height: 70%;
            right: 0;
            background: #eee;
            border: 1px solid #dddddd;
        }
        .bgrangevalue {
            width: 100%;
            height: 100%;
            position: relative;
            margin-left: 10px;
        }

        .rangebutton1 {
            position: absolute;
            left: 10px;
            height: 100%;
            padding: 0;
            margin: 0;
            font-size: 1px;
            border: none;
            background: red;
            border-radius: 50%;
            cursor: pointer;
            top: 0px;
            overflow: hidden;
            box-shadow: 0px 0px 0px 2px #616161;
            background: #505050;
        }

            .rangebutton1 img {
                height: 100%;
            }

        .rangebutton2 img {
            height: 100%;
        }

        .rangebutton2 {
            position: absolute;
            left: 40px;
            height: 100%;
            padding: 0;
            margin: 0;
            font-size: 1px;
            border: none;
            border-radius: 50%;
            cursor: pointer;
            top: 0px;
            overflow: hidden;
            box-shadow: 0px 0px 0px 2px #616161;
            background: #505050;
        }

        .rangemin, .rangemax, .rangedata {
            position: absolute;
            bottom: 110%;
            color: red;
            font-weight: bold;
            font-size: 12px;
        }

        .rangemin {
            left: 2%;
        }

        .rangemax {
            right: 2%;
        }

        .rangedata {
            width: 100%;
            text-align: center;
            color: #463434;
            font-size: 15px;
        }