/* body {
    background: #FAFAFA;
    font-family: 'Roboto', sans-serif;
    font-size: 17px;
    line-height: 24px;
    font-weight: 400;
    color: #424242;
} */
.light {
    font-weight: 300;
}
.regular {
    font-weight: 400;
}
.medium {
    font-weight: 500;
}
.condensed {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 500;
}
.logo {
    background: #5eab37;
    color: #FAFAFA;
    width: 375px;
    height: 54px;
    font-size: 19px;
    font-weight: 400;
    letter-spacing: 0.01em;
    display: block;
}
.daumen {
    height: 54px;
    display: block;
    float: left;
}
.karte {
    background-image: url(../profund_svg/karte.png);
    width: 375px;
    height: 120px;
    display: block;
}
.icon {
    width: 64px;
    height: 64px;
    -webkit-filter: drop-shadow(2px 2px 3px rgba(66,66,66,0.6) );
    filter: drop-shadow(2px 2px 3px rgba(66,66,66,0.6) );
}
.space {
    margin: 24px;
}
.button {
    width: 96px;
}
.zapfen {
    background-color: #CF232A;
    color: #fff;
    padding-top: 4px;
    position: absolute;
    width: 54px;
    height: 18px;
    text-align: center;
    border-radius: 22px;
    margin-left: -44px;
    margin-top: 28px;
    box-shadow: 4px 6px 6px -6px #888;
    font-size: 12px;
    font-weight: 500;
    line-height: 14px;
}
.bogen {
    background-image: url(../profund_svg/bogen.svg);
    background-size: cover;
    text-align: center;
}
@media (max-width: 768px) {
    .bogen {
        width:100%;
        position:fixed;
        height:100%;
    }
}
.smile {
    width: 70%;
}
.farben {
    width: 200px;
}
.rad {
    width: 260px;
    position: relative;
}
.fonticon {
    font-size: 48px;
}
.s {
    font-size: 30px;
}
.xs {
    font-size: 24px;
}
.white{
    color:#fafafa;
}
.backwhite{
    background-color: #fafafa;
}
.red {
    color: #cf232a;
}
.backred {
    background-color: #cf232a;
}
.backgrey{
    background-color: #b0bec5;
}
.grey {
    color: #b0bec5;
}
.backgreen{
    background-color:#5eab37;
}
.green {
    color: #5eab37;
}
.backlightgreen{
    background-color: rgb(187,218,171);
}
.lightgreen{
    color: rgb(187,218,171);
}
.middlegreen{
    color:#76c54d;
}
.backmiddlegreen{
    background-color:#76c54d;
}
.backorange{
    background-color: #f57f17;
}
.orange {
    color: #f57f17;
}
.fahrstreifen {
    text-align: center;
    /* width: 320px; */
    width: 100%;
    display: block;
}
.streifen {
    display: block;
    height: 40px;
    /* width: 50px; */
    width: 43.5px;
    border-left: 2px solid #b0bec5;
    text-align: center;
    padding-top: 5px;
    float: left;
}
.streifen[data-feedback=true]{
    cursor: pointer;
}
.streifen[data-feedback=true].active{
    border:1px solid blue;
    border-radius:50%;
}
.last {
    border-right: 2px solid #b0bec5;
}
.mid {
    /* border-left: 6px double #b0bec5; */
    border-left: 6px double #000000;
}
.rotate {
    transform: rotate(180deg);
    border-left: none;
    border-right: 2px solid #b0bec5;
}
.rotate.mid{
    border-right: 6px double #b0bec5;
    /* border-right:none; */
}
.thumb {
    position: relative;
    z-index: 100;
    top: -55px;
}
.clearfix {
    clear: both;
}
.slideline {
    width: 85%;
    margin: 0 0 40px 7.5%;
    display: block;
}

/* .slider{
    -webkit-appearance: none;
    appearance: none;
    height: 10px;
    border-radius: 5px;
    background: #B0bec5;
    outline: none;
    opacity: 0.7; 
    -webkit-transition: .2s; 
    transition: opacity .2s;
}

.slider::-webkit-slider-thumb{
    -webkit-appearance: none; 
    appearance: none;
    width: 18px; 
    height: 18px; 
    border-radius: 50%; 
    background-color: #f57f17; 
    cursor: pointer;
}

.slider::-ms-thumb {
    -webkit-appearance: none; 
    appearance: none;
    width: 10px; 
    height: 10px; 
    border-radius: 50%; 
    background-color: #f57f17; 
    cursor: pointer;
}
 
.slider::-ms-track {
    width: 100%;
    height:10px;
    border-width: 10px 0;
    background: transparent;
    cursor:pointer;
    border-color: transparent;
    color: transparent;
}
.slider.green::-webkit-slider-thumb{
    background-color:#5EAB37;
}
.slider.green::-ms-thumb {
    background-color:#5EAB37;
}

.slider::-moz-range-thumb {
    width: 18px;
    height: 18px; 
    border-radius: 50%; 
    background: #f57f17; 
    cursor: pointer; 
}

.slider::-moz-focus-outer {
    border:0;
} */

.slider {
    -webkit-appearance: none;
    width: 100%;
}
.slider:focus {
    outline: none;
}
.slider::-webkit-slider-runnable-track {
    width: 100%;
    height: 10px;
    cursor: pointer;
    animate: 0.2s;
    background: #B0bec5;
    border-radius: 5px;
}

.slider::-webkit-slider-thumb {
    height: 18px;
    width: 18px;
    border-radius: 50%;
    background: #f57f17; 
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -5px;
}
.slider:focus::-webkit-slider-runnable-track {
    background: #B0bec5;
}
.slider::-moz-range-track {
    width: 100%;
    height: 10px;
    cursor: pointer;
    animate: 0.2s;
    background: #B0bec5;
    border-radius: 5px;
  }
  .slider::-moz-range-thumb {
    height: 18px;
    width: 18px;
    border-radius: 50%;
    background: #f57f17; 
    cursor: pointer;
  }
  .slider::-ms-track {
    width: 100%;
    height: 10px;
    cursor: pointer;
    animate: 0.2s;
    background: transparent;
    border-color: transparent;
    border-width: 20px 0;
    color: transparent;
  }
  .slider::-ms-fill-lower {
    background: #B0bec5;
    border-radius: 5px;
  }
  .slider::-ms-fill-upper {
    background: #B0bec5;
    border-radius: 5px;
  }
  .slider::-ms-thumb {
    height: 18px;
    width: 18px;
    border-radius: 50%;
    background: #f57f17; 
    cursor: pointer;
  }
  .slider:focus::-ms-fill-lower {
    background: #B0bec5;
  }
  .slider:focus::-ms-fill-upper {
    background: #B0bec5;
  }


/*Roud Slider styles*/
	
.roundslider {
    width:100% !important;
}

.roundslider .rs-handle:before {
    font-family: "profund-iconfont" !important;
    content: "\65" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;

    position: relative;
    z-index: 100;
    top: -30px;
    color: #f57f17;
    font-size: 48px; 
    transform: rotate(-90deg);
    display: block;
    position: absolute;
    right: 0;    
}
.roundslider .rs-handle.first:before{
    color: #5EAB37;
}
.roundslider .rs-handle.second:before{
    color: #F57F17;
}
.roundslider .rs-handle.third:before{
    color: #CF232A;
}

.roundslider .rs-path-color {
    /* background-color: #f57f17; */
    background: transparent;
}
.roundslider .rs-range-color {
    background: transparent;
}
.roundslider .rs-bg-color {
    background: #FAFAFA;
}
.roundslider .rs-border {
    border:0;
}
.roundslider.rs-animation .rs-transition{
    -webkit-transition: all 0.25s linear 0s;
    -moz-transition: all 0.25s linear 0s;
    -o-transition: all 0.25s linear 0s;
    transition: all 0.25s linear 0s;
}

.autobahn {
    background-image: url(../profund_svg/autobahn_negativ.svg);
    background-repeat: no-repeat;
    background-position: 0px -11px;
    overflow: visible;
    height: 50px;
    text-align: center;
    vertical-align: middle;

    position:absolute;
    
}
.autobahn_positive {
    background-image: url(../profund_svg/autobahn_positiv.svg);
    background-repeat: no-repeat;
    background-position: center;
    text-align: center;
    color:#fafafa;
}

@supports (-ms-ime-align:auto) {
    #movefingerpagetwo {
        margin-top:0 !important;
    }
}