﻿@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
body {
    color: #333;
    text-align: left;
    background: #fff;
    margin:0;
    padding:0;
}
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body,input {
    font-family: 'Roboto Slab', sans-serif;
}   .calculator-container {
        width: 100%;
    }

        .calculator-container .calculator-col-one {
            overflow: auto;          
            clear: none;
        }

        .calculator-container .calculator-col-two {
            /* background: #FFFFFF; */
            border-radius: 0px;
            border:1px solid #ddd;
            padding: 3%;
            /*width: 100%;*/
            overflow: auto;
            /*float: right;*/
            clear: none;
            margin: 0 0 2% 0;
        }

    .calculator-form {
        width: 100%;
    }

        .calculator-form form {
            padding: 0;
        }

        .calculator-form .slider-box {
            margin: 3% 0 0 0;
        }

        .calculator-form .field {
            margin: 0 0 4% 0;
            padding: 3%;
            padding-bottom: 6%;
            /* height: 106px; */
            /* background: #FFFFFF; */
            border-radius: 0px;
            border:1px solid #ddd;
        }

        .calculator-form label {
            vertical-align: top;
            zoom: 1;
        }

        .calculator-form .noUiSlider {
            width: 100%;
            margin: 0;
            display: inline-block;
        }

    .calculator-container .result-box {
        margin: 0 0 10px 0;
        overflow: hidden;
    }

    .calculator-container .results {
        border-radius: 5px;
    }

    .calculator-container .result {
        /* font-weight: bold; */
        font-size: 1.2em;
        color: #a33e2e;
    }

    .calculator-container .result-box .title {
        display: inline-block;
        width: 60%;
        margin-right: 0%;
    }

    .calculator-container .result-box .result {
        display: inline-block;
        vertical-align: top;
        float: right;
        text-align: right;
    }

    .calculator-form #cigs-per-pack.noUiSlider, .calculator-form #cigs-per-day.noUiSlider, .calculator-form #years-smoking.noUiSlider, .calculator-form #price-per-pack.noUiSlider {
        width: 75%;
        display: inline-block;
        margin: 6% 0 0 0%;
    }

    .calculator-form input.slider-field {
        width: 18%;
        text-align: center;
        vertical-align: center;
        /* font-weight: bold; */
        font-size: 2em;
        color: #2e284a;
        border: 1px solid #dddddd;
        margin: 0 0 0 2%;
        vertical-align: top;
        display: inline-block;
        position: relative;
        outline: none !important;
        z-index: 2;
        padding: 4px 0.5%;
    }

    .calculator-form .noUiSlider.horizontal div.scale {
        margin-left: 10px;
    }

    .lungs-box .lungs {
        position: relative;
        /*margin: 10% auto 5% auto;*/
        margin: 7% auto 5% auto;
        /*width: 155px;*/
        width: 250px;
        height: 144px;
        overflow: hidden;
        /*background: #FF6C6C;*/
    }

    .lungs-box .lungs-bg {
        position: absolute;
        width: 100%;
        height: 0%;
        left: 0;
        bottom: 0;
        z-index: 1;
        opacity: 1;
        background: url('images/lungs-tar.png?1426284721') no-repeat;
    }

    #container .lungs-box .lungs-bg > img {
        height: 100%;
    }

    .lungs-box .lungs-mask {
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 2;
        /*background: url('images/lungs-mask.png?1426284721') no-repeat;*/
         background: url('../../images/img/logo.jpg') no-repeat;
         background-size:100%;
    }

    .calculator-form input.slider-field::-webkit-outer-spin-button, .calculator-form input.slider-field::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }


    /*bhjmkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkjvghfcgdfgdsxfdszf*/


    .sb-expanders .sb-expander.main-area.closed {
        display: none;
    }

    .sb-expanders-categories li.sb-expanders-category.closed .category-body {
        display: none;
    }

    .sb-expanders-categories li.sb-expanders-category.closed .category-body {
        display: none;
    }

    .sb-expanders .video {
        position: relative;
        padding-bottom: 56.25%;
        padding-top: 30px;
        height: 0;
        overflow: hidden;
    }

        .sb-expanders .video iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

    .noUi-target, .noUi-target * {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -ms-touch-action: none;
        -ms-user-select: none;
        -moz-user-select: none;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .noUi-base {
        width: 100%;
        height: 100%;
        position: relative;
    }

    .noUi-origin {
        position: absolute;
        right: 0;
        top: 0;
        left: 0;
        bottom: 0;
    }

    .noUi-handle {
        position: relative;
        z-index: 1;
    }

    .noUi-stacking .noUi-handle {
        z-index: 10;
    }

    .noUi-state-tap .noUi-origin {
        -webkit-transition: left 0.3s, top 0.3s;
        transition: left 0.3s, top 0.3s;
    }

    .noUi-state-drag * {
        cursor: inherit !important;
    }

    .noUi-horizontal {
        height: 18px;
    }

        .noUi-horizontal .noUi-handle {
            width: 34px;
            height: 28px;
            left: -17px;
            top: -6px;
        }

        .noUi-horizontal.noUi-extended {
            padding: 0 15px;
        }

            .noUi-horizontal.noUi-extended .noUi-origin {
                right: -15px;
            }

    .noUi-vertical {
        width: 18px;
    }

        .noUi-vertical .noUi-handle {
            width: 28px;
            height: 34px;
            left: -6px;
            top: -17px;
        }

        .noUi-vertical.noUi-extended {
            padding: 15px 0;
        }

            .noUi-vertical.noUi-extended .noUi-origin {
                bottom: -15px;
            }

    .noUi-background {
        background: #FAFAFA;
        box-shadow: inset 0 1px 1px #f0f0f0;
    }

    .noUi-connect {
        background: #3FB8AF;
        box-shadow: inset 0 0 3px rgba(51,51,51,0.45);
        -webkit-transition: background 450ms;
        transition: background 450ms;
    }

    .noUi-origin {
        border-radius: 2px;
    }

    .noUi-target {
        border-radius: 4px;
        border: 1px solid #D3D3D3;
        box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB;
    }

        .noUi-target.noUi-connect {
            box-shadow: inset 0 0 3px rgba(51,51,51,0.45),0 3px 6px -5px #BBB;
        }

    .noUi-dragable {
        cursor: w-resize;
    }

    .noUi-vertical .noUi-dragable {
        cursor: n-resize;
    }

    .noUi-handle {
        border: 1px solid #D9D9D9;
        border-radius: 3px;
        background: #FFF;
        cursor: default;
        box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB;
    }

    .noUi-active {
        box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB;
    }

    .noUi-handle:before, .noUi-handle:after {
        content: "";
        display: block;
        position: absolute;
        height: 14px;
        width: 1px;
        background: #E8E7E6;
        left: 14px;
        top: 6px;
    }

    .noUi-handle:after {
        left: 17px;
    }

    .noUi-vertical .noUi-handle:before, .noUi-vertical .noUi-handle:after {
        width: 14px;
        height: 1px;
        left: 6px;
        top: 14px;
    }

    .noUi-vertical .noUi-handle:after {
        top: 17px;
    }

    [disabled].noUi-connect, [disabled] .noUi-connect {
        background: #B8B8B8;
    }

    [disabled] .noUi-handle {
        cursor: not-allowed;
    }

    .noUi-state-blocked.noUi-connect, .noUi-state-blocked .noUi-connect {
        background: #4FDACF;
    }

    .noUiSlider, .noUiSlider * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box; /* box-sizing:border-box; */ /* -webkit-user-select:none; */
        -moz-user-select: none;
        -ms-user-select: none;
        display: block;
        cursor: default;
    }

    .noUiSlider {
        position: relative;
    }

        .noUiSlider a {
            position: absolute;
            z-index: 1;
        }

            .noUiSlider a:nth-child(2) {
                background: inherit !important;
            }

        .noUiSlider.vertical a {
            width: 100%;
            bottom: 0;
        }

        .noUiSlider.noUi-horizontal a {
            height: 8px;
            right: 0;
        }

    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        .noUiSlider:before, body.TOUCH, .noUiSlider div {
            -ms-touch-action: none;
        }

        .noUiSlider:before {
            display: block;
            position: absolute;
            width: 150%;
            left: -25%;
            height: 400%;
            top: -150%;
            content: "";
            z-index: -1;
        }

        .noUiSlider.vertical:before {
            width: 400%;
            left: -150%;
            height: 150%;
            top: -25%;
        }
    }

    .noUiSlider {
        border: 1px solid #cccccc;
        border-radius: 2px;
    }

        .noUiSlider.connect a, .noUiSlider.connect.lower {
            background: #b2a98f;
        }

            .noUiSlider a, .noUi-origin, .noUiSlider.connect.lower a {
                background-color: rgba(255,255,255,0.6);
                filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#aaffffff', endColorstr='#aaffffff');
                z-index: 101;
            }

        .noUiSlider.disabled, .noUiSlider.disabled.connect.lower a {
            background: #ccc;
            box-shadow: none;
        }

        .noUiSlider div {
            /* border: 1px solid #a3a3a3; */
            border-radius: 2px;
        }

        .noUiSlider > a > div {
            background: #ffffff;
            opacity: 1;
        }

        .noUiSlider.disabled div {
            background: transparent;
        }

        .noUiSlider.noUi-horizontal {
            height: 10px;
        }

        .noUiSlider.vertical {
            width: 10px;
            height: 300px;
        }

            .noUiSlider.vertical div {
                margin: -9px 0 0 -5px;
            }

    .noUi-horizontal .noUi-handle {
        width: 20px;
        height: 18px;
        left: -10px;
        top: -7px;
    }

        .noUi-horizontal .noUi-handle:before {
            left: 6px;
            height: 6px;
            top: 5px;
        }

        .noUi-horizontal .noUi-handle:after {
            left: 11px;
            height: 6px;
            top: 5px;
        }

    .noUiSlider.noUi-horizontal div.scale, .noUiSlider.noUi-horizontal div.divisions {
        position: absolute;
        display: inline-block;
        height: 8px;
        margin: 0;
        padding: 0;
        border: 0;
        width: 100%;
        top: 0;
        left: 0;
    }

    .noUiSlider.noUi-horizontal div.scale-value, .noUiSlider.noUi-horizontal div.division {
        display: inline-block;
        /* border: 1px solid #FFFFFF; */
        width: 20%;
        float: left;
        clear: none;
        margin: 0;
        height: 8px;
        /* border-radius: 0; */
        z-index: 100;
    }

    .noUiSlider.noUi-horizontal div.divisions {
        background: #2e284a;
    }

    .noUiSlider.noUi-horizontal div.division {
        /* border: 1px solid #cccccc; */
    }

    .noUiSlider.noUi-horizontal div.scale, .noUiSlider.noUi-horizontal div.scale-value {
        top: 20px;
        height: 20px;
    }

    .noUiSlider.noUi-horizontal div.scale {
        font-size: 0.8em; /* background:#eeeeee; */
        width: 120%;
        left: -10%;
        clear: both; /* border:1px solid #eeeeee */
    }

    .noUiSlider.noUi-horizontal div.scale-value { /* background:#eeeeee; */
        text-align: center;
        width: 16.6%;
    }

@media (min-width: 767px) {    
       .calculator-container .calculator-col-two {
            /* background: #FFFFFF; */           
            float: right;
             width: 45%;
        }
        .calculator-container .calculator-col-one {
            float: left;
             width: 47%;
        }
}

@media (max-width: 767px) {
}