/*
The MIT License (MIT)

Copyright (c) Mon May 15 2017 Christian Waske

Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software, and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORTOR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/

html,
body {
    overflow-x: hidden;
}
body p {
    line-height: 1.6em !important;
}

#waterfunnel,
input,
select,
textarea {
    color: #41505a;
    font-family: Marselis, Arial, 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 400;
}

#waterfunnel .textjustify {
    text-align: justify;
}

#waterfunnel img {
    height: auto;
    max-width: 100%;
}

#waterfunnel #step-goto {
    position: absolute;
    top: 50%;
    text-align: center;
    width: 100%;
}


/* Buttons */

#waterfunnel .btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}

#waterfunnel .btn.btn-primary {
	background-color: #5aaf2d;
	border-color: white;
    text-align: center;
}

#waterfunnel .btn[data-active="true"],
#waterfunnel .btn:not( [data-active="true"] ):hover {
    color: #fff;
    background-color: #5aaf2d;
    border-color: white;
}
#waterfunnel .btn.prevBtn:hover {
	color: #333;
	background-color: #e6e6e6;
	border-color: #adadad;
}

#waterfunnel .btn-lg {
    border-radius: 23px;
    padding: 10px 30px;
}

#waterfunnel #produktkonfigurator .btn-lg {
    font-size: 14px;
}

.contactLink {
	position: fixed;
	right: 0;
	top: 21%;
	z-index: 9999;
}

/* Steps */

#waterfunnel .stepwizard-row {
    margin-bottom: 2px;
    position: relative;
}

#waterfunnel .stepwizard-row .line {
    position: absolute;
    top: 15px;
    left: 0;
    width: 100%;
    height: 1px;
    border-bottom: #ddd solid 1px;
    z-index: -1;
}

#waterfunnel .stepwizard-step {
    width: calc(100% / 5.1);
    font-size: 8px;
    text-align: center;
    float: left;
}

#waterfunnel .stepwizard-step a {
    background: #fff;
}

#waterfunnel .stepwizard-step p {
    margin-top: 10px;
    margin-bottom: 15px;
}

#waterfunnel .setup-content {
    margin: 35px 0 55px 0;
    padding: 0 13px 28px 13px;
}

#waterfunnel .setup-content h3 {
    margin-bottom: 25px!important;
    text-align: center;
}

#waterfunnel .h3left {
    text-align: left !important;
}

#waterfunnel img.gruenbeck-funnel-icon {
    height: 80px !important;
}


/* Form */

#waterfunnel input,
#waterfunnel select,
#waterfunnel textarea {
    color: #000 !important;
    background: #eee !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

#waterfunnel form {
    margin-bottom: 50px;
}

#waterfunnel .form-container {
    max-width: 1100px;
    margin: 0 auto;
    margin-top: 50px;
    margin-top: 50px;
}

#waterfunnel .form-group img {
    height: 50px;
}

#waterfunnel .form-group.radio {
    text-align: center;
}

#waterfunnel label.radio {
    margin: 0 0 15px 0!important;
    padding: 50px 20px;
	text-align: center;
	vertical-align: top;
    width: 100%;
    background: #C6C5C6;
    color: white;
    border: #eee solid 1px;
    border-radius: 0px;
    display: block;
}

#waterfunnel label.radio:active,
#waterfunnel label.radio:focus {
    /*background: #62BB46;*/
    /*color: white;*/
}

#waterfunnel .label-text {
    padding: 5px 0;

}
#waterfunnel .label-text > span {
	height: 40px;
	display: block;
}

#waterfunnel label.form-control {
    padding: 30px;
    box-shadow: 0 4px 3px -2px #ccc;
    border-radius: 0px;
    border: 2px solid #d9d8d3;
    background-color: #eee;
    cursor: pointer;
    margin: 0 1px;
    -webkit-transition: border-color .15s 0s linear;
    transition: border-color .15s 0s linear;
    margin-bottom: 20px;
    position: relative;
    text-align: center;
}

#waterfunnel .checkbox input[type=checkbox],
#waterfunnel .checkbox-inline input[type=checkbox],
#waterfunnel .radio input[type=radio],
#waterfunnel .radio-inline input[type=radio] {
    visibility: hidden;
}


/* Edit Info Modal */

.modal-content {
    border-radius: 0px;
}

.modal-content .btn-primary,
.modal-content .btn-primary:hover {
    color: #fff;
    background-color: #62BB46 !important;
    border-color: white;
}

.modal-footer .btn-primary {
    width: 100%;
}

#household5 br {
    display: none;
}


/* Media Queries */

@media only screen and (min-width: 769px) {
    #waterfunnel .setup-content {
        margin: 35px auto 55px auto;
    }
    #waterfunnel label.radio {
        margin: 0!important;
        width: calc(100% / 5);
		height: 220px;
        display: inline-block;
    }
    #waterfunnel .stepwizard-step {
        font-size: 16px;
    }
}

@media only screen and (max-width: 768px) {
    #waterfunnel .stepwizard-step p {
        display: none;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
    #waterfunnel label.radio {
        padding: 40px 20px;
    }
}

@media only screen and (min-width: 995px) and (max-width: 1024px) {
    #household5 br {
        display: block;
    }
}

/* 2017-09-28 R. El Kudr */

#waterfunnel .checkbox input[type=checkbox], #waterfunnel .checkbox-inline input[type=checkbox], #waterfunnel .radio input[type=radio], #waterfunnel .radio-inline input[type=radio] {
	visibility: visible;
	width: 150px;
	height: 150px;
	opacity: 0;
	margin-top: -100px;
	cursor: pointer;
}



/*  */
.icon {
	width: 80px;
	height: 80px;
	margin: auto;
	background-position: center;
	background-size: 80px 80px;
	background-repeat: no-repeat;
}
.icon.icon_people {
	background-image: url( '../img/Icon_6.png' );
}
.icon.icon_people[data-active="true"] {
	background-image: url( '../img/Icon_6_h.png' );
}
.icon.icon_water {
	background-image: url( '../img/Icon_5.png' );
}
.icon.icon_water[data-active="true"] {
	background-image: url( '../img/Icon_5_h.png' );
}
.icon.icon_hardness {
	background-image: url( '../img/Icon_9.png' );
}
.icon.icon_hardness[data-active="true"] {
	background-image: url( '../img/Icon_9_h.png' );
}
.icon.icon_check {
	background-image: url( '../img/Icon_8.png' );
}
.icon.icon_check[data-active="true"] {
	background-image: url( '../img/Icon_8_h.png' );
}
.icon.icon_times {
	background-image: url( '../img/Icon_7.png' );
}
.icon.icon_times[data-active="true"] {
	background-image: url( '../img/Icon_7_h.png' );
}


/* Special Product Table */
#product_form .setup-content .special_product_wrapper table.product_table {
    width: 100%;
}
#product_form .setup-content .special_product_wrapper table.product_table th {
    background-color: #cdd5db;
}

#product_form .setup-content .special_product_wrapper table.product_table th,
#product_form .setup-content .special_product_wrapper table.product_table td {
    border: 1px solid #cdd5db;
    padding: 10px 20px;
}
#product_form .setup-content .special_product_wrapper table.product_table th:nth-child(2),
#product_form .setup-content .special_product_wrapper table.product_table td:nth-child(3) {
    text-align: center;
}

/* Special Product Styles */
#product_form .setup-content .special_product_wrapper h3 {
    text-align: left;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2em;
    margin-top: 0;
    margin-bottom: 4px !important;
}
#product_form .setup-content .special_product_wrapper h4 {
    text-align: left;
    font-size: 24px;
    line-height: 1.2em;
    font-weight: 400;
    margin: 0;
    margin-bottom: 32px;
}

#product_form .setup-content .special_product_wrapper p,
#product_form .setup-content .special_product_wrapper img,
#product_form .setup-content .special_product_wrapper table {
    margin-bottom: 30px;
}
#product_form .setup-content .special_product_wrapper .product_table img {
    margin-bottom: 0;
}

#product_form .product_table  tr td:last-child {
    text-align: center;
}

#product_form .setup-content .check {
    position: relative;
    padding: 12px 18px;
    padding-left: 46px;
    margin-bottom: 10px;
    font-weight: 600;
}
#product_form .setup-content .check:after {
    content: " ";
    background-image: url( '../img/icon-check.png' );
    position: absolute;
    left: 3px;
    top: 7px;
    width: 30px;
    height: 30px;
}

#product_form .setup-content .special_product_sidebar img {
    margin-bottom: 0;
}

/* Special Product Sidebar */
#product_form .setup-content .green_sidebar {
    background-color: #69bd4a;
    color: #fff;
    margin-bottom: 30px;
}
#product_form .setup-content .gray_sidebar {
    background-color: #cdd5db;
    color: #3d4f59;
    margin-bottom: 30px;
}
.red_sidebar.arrow_button {
    background-color: #e50027;
    color: #fff;
    margin-bottom: 30px;
	transition: background-color .5s;
}

#product_form .setup-content .sidebar_inner {
    padding: 30px;
}
#product_form .setup-content .sidebar_inner p {
    margin-bottom: 10px;
}

/* Special Product Buttons */
#product_form .setup-content .grey_button {
    background-color: #9fa7ac;
    color: #fff;
    width: 100%;
    display: inline-block;
    padding: 12px 18px;
    transition: background-color .5s;
    border-radius: 23px;
}
#product_form .setup-content .grey_button:hover {
    background-color: #a4aaaf;
}
#product_form .setup-content .green_button {
    background-color: #5aaf2d ;
    color: #fff;
    display: inline-block;
    padding: 12px 38px;
    transition: background-color .5s;
    border-radius: 23px;
}
#product_form .setup-content .green_button:hover {
    background-color: #449d44;
}

.red_button{
	padding: 12px 20px;
}

#product_form .setup-content .transparent_button {
    background-color: rgba( 0, 0, 0, 0 );
    color: #fff;
    width: 100%;
    display: inline-block;
    padding: 12px 18px;
    transition: background-color .5s;
}
#product_form .setup-content .transparent_button:hover {
    background-color: rgba( 0, 0, 0, .2 );
}

#product_form .setup-content .white_border_button {
    border: 2px solid #fff;
}
#product_form .setup-content .white_button {
    background-color: #ffffff;
    color: #3d4f59;
    width: 100%;
    display: inline-block;
    padding: 12px 18px;
    transition: background-color .5s;
}
#product_form .setup-content .white_button:hover {
    background-color: #e6e6e6;
}

#product_form .setup-content .phone_button {
    text-align: center;
    font-weight: 600;
    position: relative;
    border-radius: 23px;
}

#product_form .setup-content .dowload_button {
    position: relative;
    text-align: center;
}

#product_form .setup-content .arrow_button {
    position: relative;
    text-align: center;
}

#product_form .setup-content .special_product_sidebar .gray_sidebar {
    background-color: #7b868c;
    color: #fff;
    margin-bottom: 30px;
}
#product_form .red_sidebar.arrow_button {
    background-color: #c84650;
    margin-bottom: 30px;
    border-radius: 23px;
}
#product_form .red_sidebar.arrow_button:hover {
	background-color: #c71212;
}
#product_form .red_sidebar.arrow_button a{
    color: #fff;
}
#product_form .setup-content .special_product_sidebar .green_sidebar {
    background-color: #5aaf2d;
    color: #fff;
    margin-bottom: 30px;
}

.green_container {
    padding: 10px 20px;
    background-color: #5aaf2d;
    color: #ffffff;
    margin: 10px 0 20px 0;
}
.green_container h4 {
    font-weight: 600;
}

.gray_container {
    padding: 10px 20px;
    background-color: #7b868c;
    color: #ffffff;
    margin: 10px 0;
}
.gray_container h3 {
    text-align: left;
    font-weight: 600;
}

#waterfunnel label.radio.radio_extended .label-text {
    position: relative;
}
#waterfunnel label.radio.radio_extended .additional_info {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    text-align: center;
}

@media(min-width: 768px) {
    #waterfunnel label.radio.radio_extended {
        height: 260px;
        padding-top: 40px;
    }

    .start_container {
        width: calc( 100% / 5 * 2 );
        display: inline-block;
        height: 50px;
        vertical-align: middle;
        padding: 0;
    }
    .start_container_inner {
        border: 1px solid #fff;
        padding: 10px 20px;
        height: 100%;
    }
}

.row.setup-content .centerlist{
    width: 75%;
    margin: auto;
}