*{-webkit-box-sizing:border-box;box-sizing:border-box}.scontainer{width:72px;border:1px solid #444;border-radius:6px;display:inline-block;margin:1rem 2.5rem 0 2.25rem}.sliderarea{width:12px;height:400px;border:1px solid #444;border-radius:6px;background-color:transparent;position:relative;margin:1rem auto 1.5rem auto;padding:0}.sliderarea:hover{cursor:pointer;background-color:#444}.sliderbutton{height:24px;width:24px;position:absolute;background-color:#2981c4;border:1px solid #444;border-radius:50%;outline:none;cursor:pointer}.sliderbutton:hover{background-color:#fd8f00}.output{width:100%;margin:1rem 0 0.5rem 0}.outputfield{width:100%;background-color:transparent;font-size:2rem;color:#ddd;text-align:center;border:none}.butsettings{width:4rem;height:4rem;margin:0;padding:0;cursor:pointer;display:block;position:relative;border:1px solid #444;border-radius:10px;background-image:-webkit-gradient(linear, left top, left bottom, from(#39393d), to(#23232a));background-image:linear-gradient(to bottom, #39393d, #23232a);background-repeat:repeat-x}.butsettings:after{width:4rem;height:4rem;position:absolute;top:0;left:0;content:'';background:transparent;background-image:url("../svg/settings-b.svg");background-size:2.6rem;background-position:center center;background-repeat:no-repeat;display:inline-block;-webkit-transition:all .5s ease;transition:all .5s ease}.butsettings:hover:after{background-image:url("../svg/settings-o.svg");background-size:2.6rem;background-position:center center;background-repeat:no-repeat}.settings{width:480px;height:auto;position:absolute;top:-7px;right:-9px;padding:0px 0px 24px 0px;background:#000;border:1px solid #444;border-radius:10px;z-index:+1;cursor:default;display:block;opacity:0}.settings h1{font-family:"RotisSemiSans","Verdana",sans-serif;font-size:2.4rem;font-weight:bold;text-align:left;color:#2981c4;margin:0rem 2rem 0rem 2rem;border:none;letter-spacing:0.05rem}.settings h5{font-family:"RotisSemiSans","Verdana",sans-serif;font-size:2.2rem;font-weight:bold;text-align:left;color:#2981c4;margin:1.6rem 2rem 0rem 2rem;border:none;letter-spacing:0.05rem}.settings p{font-family:"RotisSemiSans","Verdana",sans-serif;font-size:2rem;line-height:2.4rem;text-align:left;margin:0.4rem 2rem 0rem 2rem;width:80%;color:#ddd;letter-spacing:0.05rem}@media (max-width: 1920px){.scontainer{width:36px;border-radius:3px;margin:0.25rem 1.25rem 0 1.1rem}.sliderarea{width:6px;height:250px;border-radius:3px;margin:0.5rem auto 0.75rem auto}.sliderbutton{height:12px;width:12px}.output{margin:0.5rem 0 0.25rem 0}.outputfield{font-size:1rem}.butsettings{width:2rem;height:2rem;border-radius:5px}.butsettings:after{width:2rem;height:2rem;top:0;left:0;background-size:1.3rem}.butsettings:hover:after{background-size:1.3rem}.settings{width:240px;padding:0px 0px 12px 0px;border-radius:5px}.settings h1{font-size:1.2rem;margin:0rem 1rem 0rem 1rem}.settings h5{font-size:1.1rem;margin:0.8rem 1rem 0rem 1rem}.settings p{font-size:1rem;line-height:1.2rem;margin:0.2rem 1rem 0rem 1rem}}@media (max-width: 414px){.sliderarea{height:100px}.settings h1{font-size:1rem;margin:0.2rem 0.5rem 0rem 1rem}.settings h5{font-size:0.9rem;margin:0.4rem 0.5rem 0rem 1rem}.settings p{font-size:0.8rem;line-height:1rem;margin:0rem 1rem 0rem 1rem}}