@charset "utf-8";

    .no-selection {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    .sprt {
        background-repeat: no-repeat;
        display: block;
    }
    .slider {
        width: 90%;
        position: relative;
        margin: 75px auto 20px;
    }
    .slider-line {
        width: 100%;
        height: 13px;
        border: solid 1px #b7b7b7;
        background-color: #f0eded;
        border-radius: 7px;
        position: relative;
        overflow: hidden;
    }
    .slider-line-color {
        width: 0;
        background-color: #df3344;
        height: 15px;
        position: absolute;
        top: -1px;
        left: -1px;
    }
    .slider-bullet {
        position: absolute;
        top: -10px;
    }
    .slider-handle {
        width: 26px;
        height: 36px;
		background-image: url(../images/sprite/slider-handle.png);
        position: absolute;
        left: -13px;
    }
    .slider-tooltip {
        width: 72px;
        height: 50px;
        position: absolute;
		background-image: url(../images/sprite/slider-tooltip.png);
        top: -55px;
        left: -36px;
        text-align: center;
        line-height: 40px;
    }
    .slider-sqr-meter .unit:after {
        content: 'm²';
    }
    .slider-meter .unit:after {
        content: 'm';
    }
    .slider-min-text {
        position: absolute;
        width: 0;
        left: 0;
        white-space: nowrap;
        text-align: center;
    }
    .slider-max-text {
        position: absolute;
        width: 100px;
        right: 0;
        white-space: nowrap;
        text-align: right;
    }
    hr {
        border: none;
        margin: 10px auto;
		margin-bottom: 20px;
        width: 149px;
        height: 10px;
		background-image: url(../images/sprite/hr.png);

    }
    .energy-class {
        text-align: left;
        display: block;
        width: 400px;
        margin: 3px auto;
        padding-left: 30px;
        position: relative;
    }
    .energy-class input {
        display: none;
    }
    .energy-class:before {
        content: '';
        display: block;
        position: absolute;
        top: 2px;
        left: 0;
        width: 20px;
        height: 20px;
        background-image: url('../images/sprite/energy-class.png');
        background-repeat: no-repeat;
    }
    .energy-class.active:before {
		background-image: url(../images/sprite/energy-class-active.png);
	}
    .final-value {
        font-size: 42px;
        font-weight: bold;
        text-align: center;
        margin: 25px 0 30px;
    }
    .product-line-buttons {
        display: table;
        width: 760px;
        table-layout: fixed;
        border: solid 1px #df3344;
        border-radius: 3px;
        margin: 0 auto;
    }
    .product-line-button {
        display: table-cell;
        width: 20%;
        border-left: solid 1px #df3344;
        padding: 4px 0;
        text-align: center;
        cursor: pointer;
    }
    .product-line-button.active {
        background-color: #df3344;
        color: #fff;
        font-weight: bold;
    }
    .product-line-button:first-child {
        border-left: none;
    }

    .product-line {
        padding-top: 30px;
    }
    .product-line .image {
        width: 665px;
        height: 255px;
        float: left;
        background-repeat: no-repeat;
        background-position: center;
    }
    .product-line[data-product="2"] .image {
        margin-right: 20px;
    }
    .product-line .text {
        text-align: left;
    }
    .product-line .price-range {
        padding: 15px 0;
        clear: both;
        width: 665px;
    }
    .price-range {
        font-weight: bold;
    }
    .price-range-images {
        background-color: #df3344;
        padding: 5px;
        border-radius: 12px;
        height: 22px;
        display: inline-block;
        margin-bottom: -5px;
        margin-right: 5px;
    }
    .price-range-images:after {
        content: '';
        display: block;
        clear: both;
    }
    .price-range-images span {
        display: block;
        float: left;
        background-image: url('/images/sprite.png');
        background-position: -150px 0;
        width: 13px;
        height: 12px;
        margin-right: 2px;
    }
    .price-range-images span:last-child {
        margin-right: 0;
    }

    .product-line, .thermostate {
        display: none;
    }

    .product-line.active {
        display: block;
    }
    .thermostate.active {
        display: inline-block;
        vertical-align: top;
    }

    .product-line .specs {
        text-align: left;
        color: #b7b7b7;
        font-size: 13px;
        padding: 50px 65px;
    }
    .product-line .specs div {
        display: inline-block;
        width: 285px;
        margin-left: 110px;
        border-bottom: solid 1px #b7b7b7;
        padding-left: 17px;
        position: relative;
        color: #645858;
        font-weight: bold;
    }
    .product-line .specs div:before {
        content: '';
        width: 6px;
        height: 6px;
        border-radius: 3px;
        background-color: #df3344;
        position: absolute;
        left: 5px;
        top: 8px;
    }

    .thermostates {
        max-width: 900px;
        margin: 0 auto;
        text-align: center;
    }
    .thermostates:after {
        content: '';
        display: block;
        clear: both;
    }
    .thermostate {
        width: 295px;
    }
    .thermostate .image {
        width: 280px;
        height: 155px;
        margin: 10px auto;
    }
    .thermostate .text h3 {
        color: #df3344;
    }
    .thermostate .text {
        width: 240px;
        margin: 0 auto;
    }
    a.up-to-design {
        display: none;
    }
    .calculator-button {
        padding: 10px 35px;
        color: #fff;
        background-color: #df3344;
        border: solid 2px #df3344;
        border-radius: 4px;
        font-weight: bold;
        font-size: 18px;
        margin: 30px auto 40px;
        cursor: pointer;
    }
    .calculator-button:hover {
        color: #645858;
        background-color: #fff;
    }
    .static-page-wrapper {
        text-align: center;
    }