@charset "utf-8";

#calculator, #calculator * { margin: 0px; padding: 0px; box-sizing: border-box; font-family: inherit; }

#calculator { width: 100%; }

.sliderValues { display: flex; align-items: center; justify-content: space-between; }

#slider { position: relative; appearance: none; width: 100%; height: 20px; background: rgb(0, 51, 153); border-radius: 10px; outline: none; margin-top: 8px; z-index: 3; }

#slider::-webkit-slider-thumb { appearance: none; width: 25px; height: 25px; background: rgb(255, 255, 255); border-radius: 50%; cursor: pointer; border: 2px solid rgb(0, 51, 153); z-index: 4; }

.sliderValues span { position: relative; }

.sliderValues span::after { content: ""; display: block; position: relative; width: 1px; height: 6px; background: rgb(0, 0, 0); top: 10px; left: 50%; transform: translateX(-50%); z-index: 0; overflow: hidden; }

.currentValue__container { width: 100%; display: flex; align-items: center; justify-content: center; position: relative; top: -6px; margin-bottom: 14px !important; }

#currentValue { text-align: center; display: inline-block; border-right: 2px solid rgb(0, 51, 153); border-bottom: 2px solid rgb(0, 51, 153); border-left: 2px solid rgb(0, 51, 153); border-image: initial; width: 20%; padding: 6px 0px; margin: 0px auto; border-top: none; }

#calculator p { text-align: center; margin-bottom: 4px; }