@import url(./range.css);
*{box-sizing: border-box;}
.debugmode{opacity:.3;display:none!important;clear: left;}
.korrektur{padding-right: 20px;}
.maincolor {color:#0554A2}
.nodisplay2{display:none}
.nosee{display:none!important}
.noseeintro{display:none!important}
.mouseover{transition:all .4s}
.mouseover:hover{cursor:pointer;}
@media screen and (min-width: 800px){.mouseover:hover{opacity:.8}}
.bgimage{background-repeat:no-repeat; background-size:cover;background-position:center center;}
.bgimage2{background-repeat:no-repeat; background-size:contain;background-position:center center;}
.errormessage{color:red;margin: 0;}
.logbuchlogo img{max-height:60px;width:auto;}

/*
.titlebox{margin-bottom:30px;min-height: 60px;}
.titlebox div{float:left}
.titlebox h1{margin:0}
.titlebox .viertel{width:25%;font-family: "Courgette"!important;font-size: 25px;line-height: 1.4em;}
.titlebox .halb{width:50%;text-align:center;}
*/

#nojava {width:100%;padding:5px 0;background:#ff0000;color:#333;font-weight:bold;position:absolute;top:0;text-align:center;}






.subtitle { bottom: 0;
    color: #0554a2 !important;
    display: inline-table;
    left: 0;
    position: relative;
    text-align: center;
    width: 100%;
	top: 5px;}

#row_A {margin-top: 25px !important;}

#wpcf7-f2616-p2619-o1 {margin: 0 auto !important;max-width: 1000px;width: 100%;}



.headline {
	color: black;
	margin: 20px 0 10px;
	font-weight: normal;
	font-size: 40px;
	text-align: center;
}


h3.sub_headline {
    color: black;
    font-size: 34px;
    font-weight: normal;
    margin: 0px auto;
    padding: 0;
    text-align: left;
    width: 100%;
}

h4 {
	color: black !important;
	font-weight: normal !important;
	font-size: 18px !important;
}

.intro {
	padding: 10px;
	background-color: #eee;
	box-shadow: 1px 1px 2px #333;
	margin: 0 auto 15px;
    max-width: 90%;
}


/* Tooltip container */
.tooltip {
	margin-left: 10px;
	color: white;
    position: relative;
    display: inline-block;
	background-color: #404040;
	font-size: 16px;
	font-family: serif;
	font-weight: bold;
	font-style: italic;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 20px;
	cursor: default;
	top:0px
}

/* Tooltip text */
.tooltiptext {	
	box-shadow: 1px 1px 1px 1px #000;
	pointer-events: none;
	font-family: 'Open Sans', Arial, sans-serif;
	font-weight: normal;
	font-style: normal;
    width: 300px;
    background-color: #feffa2;
    color: black;
    padding: 5px 10px;
    border-radius: 3px;
	font-size: 14px;
	line-height: normal;
	padding: 5px 10px;
    opacity: 0;
	visibility: hidden;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	transition:all 0.3s ease-in-out;
	text-align: left;
    position: absolute;
    z-index: 9;
	bottom: 130% !important;
    left: 0%;
	margin-left: -40px;
}

/* Tooltip arrow */
.tooltip .tooltiptext:before {
    content: " ";
	visibility: hidden;
    position: absolute;
    top: 100%; /* At the bottom of the tooltip */
    left: 12%;
	opacity: 0;
	transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease; 
	-moz-transition : all 0.4s ease; 
	transition : all 0.4s ease; 
    border-width: 10px;
    border-style: solid;
    border-color: #feffa2 transparent transparent transparent;
} 

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext, .tooltip:hover .tooltiptext:before {
    opacity: 1;
    visibility: visible;
	bottom: 115% !important;
}




/* Tooltip small container */
.tooltip_small {
	margin-left: 8px;
	color: white;
    position: relative;
    display: inline-block;
	background-color: #404040;
	font-size: 14px;
	font-family: serif;
	font-weight: bold;
	font-style: italic;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 20px;
	cursor: default;
}

/* Tooltip text small*/
.tooltiptext_small {	
	box-shadow: 1px 1px 1px 1px #000;
	pointer-events: none;
	font-family: 'Open Sans', Arial, sans-serif;
	font-weight: normal;
	font-style: normal;
    width: 100%;
	display: inline-table;
    background-color: #feffa2;
    color: black;
    padding: 5px 10px;
    border-radius: 3px;
	font-size: 14px;
	line-height: normal;
	padding: 5px 10px;
    opacity: 0;
	visibility: hidden;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	transition:all 0.3s ease-in-out;
	text-align: left;
    position: absolute;
    z-index: 1;
	bottom: 140% !important;
    left: 0%;
	margin-left: -40px;
}

/* Tooltip small arrow */
.tooltip_small .tooltiptext_small:before {
    content: " ";
	visibility: hidden;
    position: absolute;
    top: 100%; /* At the bottom of the tooltip */
    left: 40%;
	opacity: 0;
	transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease; 
	-moz-transition : all 0.4s ease; 
	transition : all 0.4s ease; 
    border-width: 10px;
    border-style: solid;
    border-color: #feffa2 transparent transparent transparent;
}

/* Show the tooltip small text when you mouse over the tooltip small container */
.tooltip_small:hover .tooltiptext_small, .tooltip_small:hover .tooltiptext_small:before {
    opacity: 1;
    visibility: visible;
	bottom: 125% !important;
}


.fkwhateverwidth .tooltip_small {margin-left: 3px !important;}
.fktenthwidth .tooltip_small {margin-left: -2px !important;}

.content {
    box-sizing: border-box;
    padding: 0px;
    position: relative;
    width: 100%;
}

.buttons {margin-top: 40px;}

/* ------------------------------------------------------ */

/* ----------------------HEADER-MENU----------------------------- */
.breadcrumb {display: flex;overflow: hidden;width: 100%;}

.breadcrumb a {	text-decoration: none;outline: none;
	display: inline-block;float: left;font-size: 18px;line-height: 70px;
	color: white;text-align: center;position: relative;width: 33.33%;padding-left: 10px;
}
/*adding the arrows for the breadcrumbs using rotated pseudo elements*/
.breadcrumb a:after {
	content: '';
	position: absolute;
	right: -1.25em;
	width: 68px;
	height: 65px;
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	border-color: #aaa #aaa transparent transparent;
	border-width: 0.125em;
	border-style: solid;
	z-index: 10;
}

/* no arrow after the last link */
.breadcrumb a:last-child:after {
	content: none;
}

/* first link bold */

.flat a, .flat a:after {
	background: #eee;
	color: black;
}

.flat a:hover, .flat a.active, .flat a:hover:after, .flat a.active:after {
	background: #0554A2 !important;
	font-weight: bold !important;
	color: white;
	cursor: pointer;
}

.active {
	background: #0554A2;
	color: #fff;
	font-weight: bold;
	pointer-events: none;
    cursor: default;
}

.disabled {
	pointer-events: none;
    cursor: default;
}

.done {
	background: #0554A2 !important;
	color: #fff !important;
	font-weight: normal !important;
	pointer-events: none;
    cursor: default;
}

.done:after {
	background: #0554A2 !important;
	color: white !important;
	cursor: pointer !important;
	pointer-events: none;
    cursor: default;
}

/* ------------------------------------------------------ */




/* ----------------------PAGES-&-BUTTONS------------------------ */
.fkpage {
	width:100%;
	float:left;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	-ms-transition: all 1s;
	transition: all 1s;
	display:none;
	background: white;
	color: #000;
	box-sizing: border-box;
	position:relative;
}

#fkpage1 { display:block; }

.fkmenue{width:25%;background:#0554a2;text-align:center;float:left;color:#fff;}
.fkmenue:hover{opacity:0.8; cursor:pointer;}

.fkbuttonright {
	margin: 0px 0px 20px 0px;
	float:right;
}

.fkbuttonright:after {
	display: inline-block;
	font-family: 'FontAwesome';
	content: "\f105";
	font-size: 25px;
	position: absolute;
	z-index: 1;
	margin-left: -.8em;
	margin-top:-5px;
	visibility: hidden;
	opacity: 0;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	transition:all 0.3s ease;
}

.fkbuttonright:hover:after {
    opacity: 1;
    visibility: visible;
	margin-left: .6em;
}

.fkbuttonleft {
	margin: 0px 0px 20px 0px;
	float:left; 
}

.fkbuttonleft:before {
	display: inline-block;
	font-family: 'FontAwesome';
	content: "\f104";
	font-size: 25px;
	position: absolute;
	margin-top:-5px;
	z-index: 1;
	margin-left: 0;
	visibility: hidden;
	opacity: 0;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	transition:all 0.3s ease;
}

.fkbuttonleft:hover:before {
    opacity: 1;
    visibility: visible;
	margin-left: -1em;
}

.fkbutton {
	padding:10px 40px;
	background:#8294a6;
	color:#fff;
	border-radius: 3px;
}

.fkbutton:hover {
	cursor:pointer; 
	background:#0554a2;
}

.back {
	color: #0554a2;
	cursor: pointer;
}

.pdf {
	text-align: center !important;
}

.gr {
	position:relative;
}

.fkdivider{clear:both;padding-top:10px;}
.fkdivider2{clear:both;}
.fkdivider3{clear:both;padding-top: 20px; /*border-bottom: 1px solid lightgrey;*/ margin-bottom: 20px;}

#kniestockA .wpcf7-text, #kniestockB .wpcf7-text, #kniestockC .wpcf7-text, #kniestockD .wpcf7-text, #kniestockE .wpcf7-text, #kniestockF .wpcf7-text {
	width: 80% !important;
	margin-left: 10px;
}
.fkwhateverwidth{width:37%; float:left;margin:0;padding: 8px 0;}
.fktenthwidth{width:10%; float: left; margin:0;padding: 15px 0;}
.fksixthwidth{width:14%; float: left; margin:0;}
.fktwothirdhwidth{width:66.66%; float:left;margin:0;}

.fkonefifthwidth{width:20%; float:left;margin:0;}
.fkquartwidth, .fkquartwidth2{width:25%; float:left;margin:0;}
.fkthirdwidth{width:33.33%; float:left;margin:0;}

.fkhalfwidth{width:50%; float:left;margin:0;}
.fkhalfwidth2{width:50%; float:left;margin:0;}
.fkthreequarterwidth{width:75%; float:left;margin:0;}
.fkfullwidth{width:100%; float:left;margin:0;}

.widthwrapper{display: inline-block;margin:5px 0;padding:5px 5px 25px 5px;/*border-bottom: 1px solid #ddd;*/position: relative;transition: all .4s;width:100%}
/*.widthwrapper{display: block;margin: 5px;padding:5px;border: 1px solid #ddd;position: relative;transition: all .4s}*/
.widthwrapper3{display: block;margin: 5px;padding:5px;position: relative;transition: all .4s}
.widthwrapper4{display: block;margin: 0 5px;padding:0 5px;position: relative;transition: all .4s}
.widthwrapper2{display: inline-block;margin: 0 5px;padding:5px;border: 1px solid #ddd;position: relative;transition: all .4s;width:100%}
/*.widthwrapper:hover, .widthwrapper2:hover{border: 1px solid #0554a2}*/
.zweispaltbox{display: inline-block;margin-top: -10px; width: 100%;}

#dsA, #dsB, #dsC, #dsD, #dsE, #dsF {
	margin-right: 0px;
}

.btn {
	border-radius: 3px;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
	-ms-transition: all 0.2s;
	transition: all 0.2s;
	background-color: #8294a6;
	color: white;
	padding: 15px;
	text-align: center;
	margin: 10px;
	font-size: 17px;
}

.hiddeninput input{ margin: 0 10px;width: 90%;opacity: .3}
@media screen and (min-width: 1000px){
.btn:hover{background-color: #0554A2;cursor: pointer;opacity:.8}
}
.btnactive, .komfortactive, .bwbtn, .dwbtn, .wcbtn, .bidetbtn, .wtbtn, .spbtn, .sbtn {
	background-color: #0554A2;
	cursor: pointer;
}
	


/* CONTACTFORM */
input, textarea {border-radius: 3px !important;}
.wpcf7-select {color:#000 !important;}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="select"],
input[type="date"],
select,
textarea {
	box-sizing: border-box;
	border-radius: 3px !important;
	background-color: white !important;
	color: #000 !important;
	border: 1px solid #999 !important;
	width:100% !important; 
	padding: 10px 15px !important;
	margin: 5px 0 0 0 !important;
	max-width: -moz-available;
	max-width: -webkit-available;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus {
    border: 1px solid #0554a2!important;
	-moz-box-shadow: 0 0 3px rgba(5,84,162,0.5),0 2px 0 rgba(0,0,0,0.07) inset !important;
	box-shadow: 0 0 3px rgba(5,84,162,0.5),0 2px 0 rgba(0,0,0,0.07) inset !important;
}


::-webkit-input-placeholder {opacity: 1; color: #999 !important;}
:-moz-placeholder {opacity: 1; color: #999 !important;}
::-moz-placeholder {opacity: 1; color: #999 !important;}
:-ms-input-placeholder {opacity: 1; color: #999 !important;}
input:-ms-input-placeholder {opacity: .5; color: #999 !important;}
textarea:-ms-input-placeholder {opacity: .5; color: #999 !important;}

.wpcf7 textarea {height:90px !important;color: #000 !important;}

.wpcf7-submit {
	font-family: 'Open Sans', Arial, sans-serif !important;
	font-size: 18px !important;
	float:right!important; 
	margin: 0px 0px 20px 0px!important; 
	padding:14px 40px!important; 
	background: #8294a6!important; 
	color: #fff!important;
	border-radius: 0px !important;
	box-shadow: none!important;
	border: 0!important;
	line-height: 1.65em!important;
	border-radius: 3px!important;
}

.wpcf7-select {
	height: 41px !important;
}

.wpcf7-submit:hover {
	cursor:pointer!important; 
	background:#0554a2!important;
}

.wpcf7 p {margin-bottom: 10px !important;}
.wpcf7-not-valid-tip {font-size:14px !important;}

.wpcf7-number {
	color: #000 !important;
	border: 1px solid #999 !important;
	width:50% !important; 
	padding: 10px 15px !important;
}
/* ------------------------------------------------------ */
/* ------------------------------------------------------ */



/* --------------------PAGE-2---------------------------- */
.stockwahl {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	transition: all 0.3s;
	height: 190px;
	background-size: contain;
	background-repeat: no-repeat; 
	cursor: pointer;
	background-position: center; 
	border-radius: 3px !important;
	position:relative;
	background-position: center 80%;
    background-size: 90% auto;
}

.stockwahl2{
	position:absolute;
	width:100%;
	height:100%;
	background-image:url('../img/stockwerk.png');
    background-position: center 80%;
    background-repeat: no-repeat;
    background-size: 90% auto;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	transition: all 0.3s;
	border-radius: 3px !important;
}

.stockwahl2:hover, .dachwahl2:hover{opacity:0 !important;}

#Keller {background-image:url('../img/keller2.png');}
#Erdgeschoss {background-image:url('../img/erdgeschoss2.png');}
#Obergeschoss {	background-image:url('../img/obergeschoss2.png');}
#Dachgeschoss {	background-image:url('../img/dachgeschoss2.png');}

#Keller2 {background-image:url('../img/keller.png');}
#Erdgeschoss2 {background-image:url('../img/erdgeschoss.png');}
#Obergeschoss2 {	background-image:url('../img/obergeschoss.png');}
#Dachgeschoss2 {	background-image:url('../img/dachgeschoss.png');}

.dachwahlcontent, .stockwahlcontent {text-align: center;padding-top: 4px;color: #333;position:relative;}

.dachwahl{
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	transition: all 0.3s;
	height: 190px;
	background-size: 90% auto;
	background-repeat: no-repeat; 
	cursor: pointer;
	background-position: center 73%;
	border-radius: 3px !important;
	position:relative;
}
.dachwahl2 {
	position:absolute;
	width:100%;
	height:100%;
    background-position: center 73%;
    background-repeat: no-repeat;
    background-size: 90% auto;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	transition: all 0.3s;
	border-radius: 3px !important;
}

#Satteldach {background-image:url('../img/sattel.png');}
#Walmdach {background-image:url('../img/walm.png');}
#Pultdach {background-image:url('../img/pult.png');}
#Flachdach {background-image:url('../img/flach.png');}

#Satteldach2 {background-image:url('../img/sattel_hover.png');}
#Walmdach2 {	background-image:url('../img/walm_hover.png');}
#Pultdach2 {	background-image:url('../img/pult_hover.png');}
#Flachdach2 {background-image:url('../img/flach_hover.png');}

/* ------------------------------------------------------- */



/* --------------------PAGE3---------------------------- */
.bildwahl {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	transition: all 0.3s;
	height:190px;
	background-size:contain;
	background-repeat:no-repeat;
	cursor:pointer;
	background-position: center;
	display: inline-block;
	border-radius: 3px;
	position:relative;
}

.grundrisstext {
	font-weight: bold;
	margin-left: -8px;
}

#grundrisscontent {
	display: inline-block;
	width: 650px;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	-ms-transition: all 0.5s;
	transition: all 0.5s;
}

.row {
	padding: 0px!important;
	margin: 0px 0px 5px 0px!important;
}

.row .fkquartwidth{ 
	padding: 0px!important;
	margin: 0px!important;
}

.hidden {display: none;}

.bildwahl2 {
	position:absolute;
	width:100%;
	height:100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
	-ms-transition: all 0.2s;
	transition: all 0.2s;
	border-radius: 3px !important;
}

.bildwahl {
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
	-ms-transition: all 0.2s;
	transition: all 0.2s;
}

#bildwahl1 {background-image:url('../img/grundriss_1.png');}
#bildwahl2 {background-image:url('../img/grundriss_2.png');}
#bildwahl3 {background-image:url('../img/grundriss_3.png');}
#bildwahl4 {background-image:url('../img/grundriss_4.png');}

#bildwahl1_active {background-image:url('../img/grundriss_1_active.png');}
#bildwahl2_active {background-image:url('../img/grundriss_2_active.png');}
#bildwahl3_active {background-image:url('../img/grundriss_3_active.png');}
#bildwahl4_active {background-image:url('../img/grundriss_4_active.png');}

.bildwahl2:hover{opacity:0 !important;}

.grundriss1_A {background-image:url('../img/grundriss_1_A.png')!important;}
.grundriss1_B {background-image:url('../img/grundriss_1_B.png')!important;}
.grundriss1_C {background-image:url('../img/grundriss_1_C.png')!important;}
.grundriss1_D {background-image:url('../img/grundriss_1_D.png')!important;}

.grundriss2_A {background-image:url('../img/grundriss_2_A.png')!important;}
.grundriss2_B {background-image:url('../img/grundriss_2_B.png')!important;}
.grundriss2_C {background-image:url('../img/grundriss_2_C.png')!important;}
.grundriss2_D {background-image:url('../img/grundriss_2_D.png')!important;}
.grundriss2_E {background-image:url('../img/grundriss_2_E.png')!important;}

.grundriss3_A {background-image:url('../img/grundriss_3_A.png')!important;}
.grundriss3_B {background-image:url('../img/grundriss_3_B.png')!important;}
.grundriss3_C {background-image:url('../img/grundriss_3_C.png')!important;}
.grundriss3_D {background-image:url('../img/grundriss_3_D.png')!important;}
.grundriss3_E {background-image:url('../img/grundriss_3_E.png')!important;}
.grundriss3_F {background-image:url('../img/grundriss_3_F.png')!important;}

.grundriss4_A {background-image:url('../img/grundriss_4_A.png')!important;}
.grundriss4_B {background-image:url('../img/grundriss_4_B.png')!important;}
.grundriss4_C {background-image:url('../img/grundriss_4_C.png')!important;}
.grundriss4_D {background-image:url('../img/grundriss_4_D.png')!important;}
.grundriss4_E {background-image:url('../img/grundriss_4_E.png')!important;}
.grundriss4_F {background-image:url('../img/grundriss_4_F.png')!important;}


/* -------------------------------------------------------- */


.check {color: white;text-align: center;display: inline-block;background-color: #8294a6;padding: 7px 20px;margin:0 2% 0 0;border-radius: 3px;-webkit-transition: all 0.2s;-moz-transition: all 0.2s;-o-transition: all 0.2s;-ms-transition: all 0.2s;transition: all 0.2s;}
.check_50 {width:48%;}
.check_33 {width:31.33%;}
.check:hover, .checked, .winchecked, .doorchecked {cursor: pointer;background-color: #0554A2;}
.checkboxes {margin-top: 5px;}
.slider {padding: 10px 0;}
.budgetbr{display:none}

@media screen and (max-width: 1050px){.rs-hidden {display: none;}}

@media screen and (max-width: 800px){
	.content {padding: 0px;}
	.tooltiptext{width:100%;max-width:300px;display:inline-table}
	.fksixthwidth {min-width:200px;}
	.titlebox .halb, .titlebox .viertel{width:100%;margin:10px 0;}
	.titlebox .viertel{text-align:center;margin-top:0 !important;}
	.maintitlebox{padding:300px 10px 10px 10px!important;height:auto!important;position:relative}
	.fkhalfwidth2 div{height: 150px!important;}
	.budgetwahl {font-size: 16px!important;}
	.budgetbr{display:block}
}

@media screen and (max-width: 900px){
	.fktenthwidth{width:23%;}
	.fksixthwidth{width:30%;}
	.grundrisscontent .fkquartwidth{width:77%!important}
	.fkwhateverwidth{clear:both;width:100%;margin:0 auto;float:none !important;text-align: center;}
	#kniestockA , #kniestockB, #kniestockC, #kniestockD, #kniestockE, #kniestockF{float: none!important; margin:0 auto!important;text-align: center;}
}

@media screen and (max-width: 700px){
	.fkquartwidth{width: 50%}	
	.fkquartwidth2, .fkhalfwidth, .fkthirdwidth ,.fktwothirdhwidth{width:100%}
	.fkdivider3 {display:none}
	.stockwahl2, .stockwahl {background-size: 80% auto;}
	.dachwahl2, .dachwahl {background-size: 80% auto;}
}	

@media screen and (min-width: 471px) and (max-width: 800px){
	
	.stockwahl, .dachwahl{height: 100%;height: 200px;}
}

@media screen and (max-width: 470px){
	.stockwahl, .dachwahl{height: 100%;height: 120px;}
	.check{padding: 7px 10px!important;}
	.fktenthwidth{width:30%!important;}
	.grundrisscontent .fkquartwidth{width:70%!important}
	.grundrisscontent input{padding:10px 5px !important}
	.fkhalfwidth2{width:100%}
}


/* --------------------------------------------------- */
/* ARROW Sprechblasen */
.wc-gratis{position: absolute;right: -43px;top: -33px;width: 99px;}
.arrow_box {position: relative;background: #eee;color:#000;padding:30px 30px 30px 40px;border-radius: 10px;font-size:18px;line-height: 25px;}
.intro_container{position:relative;max-width:850px;margin:20px auto 10px;display: flex;min-height: 150px;}
.intro_bild{flex: 1;text-align:center;position:relative;width:150px; margin: 0 auto;background-repeat:no-repeat;background-size:150px auto;background-image:url('../personal/Profilfoto.png');background-position:center center;}
.intro_text{float:left;flex: 2;}
@media screen and (min-width: 651px){.arrow_box:after {right: 100%;top: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(238, 238, 238, 0);border-right-color: #eee;border-width: 30px;margin-top: -30px;}}
@media screen and (max-width: 650px){.wc-gratis{float: right;margin-top: -20px;right: 10%;position:relative;top: 0;}.arrow_box:after {bottom: 100%;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(238, 238, 238, 0);border-bottom-color: #eee;border-width: 30px;margin-left: -30px;}.intro_container{display: block;margin:0px auto;}.intro_bild{height: 170px;margin: 0 auto 40px;background-position: center top;width:100%;}}
/* --------------------------------------------------- */

.maintitlebox{background-repeat: no-repeat;width:100%;padding:40px 20px 0 40%;color:#000;text-align:center;height:300px;}

/* TAB Boxen Seite 1 */
.tab_container{margin:45px 0 0; width:90%;position:relative;border-top-right-radius:70px;border-top-left-radius:20px;}
.tab{position:relative}
.tab_inner{padding:30px 20px 0; border: 2px solid;border-color: #aaa #aaa #aaa #aaa;background-image:url('../img/muster.png');}
.tabbox div {display: inline-block;height: 100%;text-align: center;vertical-align: bottom;}
.tabbox{overflow: hidden;box-shadow: inset 0 -7px 9px -7px rgba(0,0,0,0.3);background-size: cover;border-top-left-radius:20px;text-align:center; border:2px solid #aaa;height:auto;padding:15px 5px;display: inline-table;border-bottom:none!important;
  
}

.roundtab{
  -webkit-border-top-right-radius: 50px;
    -moz-border-top-right-radius: 50px;
    border-top-right-radius: 50px;
    -khtml-border-top-right-radius: 50px;
	}

.tabbox:hover {cursor:pointer;background:#3776b5!important;color:#fff}
.tabbox1{z-index:5;width:20%;position:absolute;background-color:#A997E7}
.tabbox2{z-index:4;padding-left:20%;width:40%;position:absolute;background:#5FD4A8}
.tabbox3{z-index:3;padding-left:40%;width:60%;position:absolute;background:#FCC472;}
.tabbox4{z-index:2;padding-left:60%;width:80%;position:absolute;background:#FCDC72;}
.tabbox5{z-index:1;padding-left:80%;width:100%;position:relative;background:#FC9F72;}
.tabboxtitle{font-size:17px; }
.activetab{box-shadow: none !important;color:#fff;background-size:contain;border-color: #aaa #aaa transparent #aaa !important;background:#0554A2}
@media screen and (max-width: 700px){.hidemobile{display:none;}.tabboxtitle{font-size:15px; }.tab_container{width:100%;}}
@media screen and (min-width: 701px){.showmobile_E{display:none}}
/* --------------------------------------------------- */

/* TAB Boxen Seite 1 */
.tabtitle{margin:0px 0 40px;padding-right:260px}
.post_it { z-index: 2;background-image: url("../img/post-it.png");display: inline-table;font-size: 1.1em;height: 170px;padding: 15px;position: absolute;right: 48px;text-align: center;top: 30px;width: 230px;}
.post_it div {vertical-align: middle;display:table-cell;}
@media screen and (max-width: 700px){.post_it { position: relative;right: inherit;top:inherit;}.tabtitle{margin:0px 0 40px;padding-right:0}}
@media screen and (max-width: 1000px){.fkquartwidth2 .post_it{position: relative;right: inherit;top:inherit;}.fkquartwidth2{width:100%!important}}


.post_it2 {background-image: url("../img/post-it.png");display: inline-table;font-size: 1.1em;height: 250px;padding: 15px;position: absolute;right: 204px;text-align: center;top: 84px;width: 300px;z-index: 1;
}.post_it2 div {vertical-align: middle;width:100%;height:100%;display:table-cell;}


/* --------------------------------------------------- */



.continuebutton {font-size:20px;}

@media screen and (max-width: 700px){
.mobilebutton{display: inline-block;margin: 10px 10% 0;width: 80%;}
}

.h2subtext{font-size:1.6em;padding-bottom:30px;}
/* ------------------------------------------------------ */

.activeimage{border: 10px solid #0554A2;}
.notactiveimage{opacity:.4;}
.headericon {background-position: left center;background-repeat: no-repeat;background-size: contain; padding-left: 30px;}

.mehrinfobox {background-color: #eee;border-radius: 6px;color: #999;font-family: serif;font-size: 15px;font-style: italic;height: 24px;line-height: 24px;margin-left: 10px;margin-top: 4px;opacity: 0.8;position: absolute;text-align: center;transition: all 0.4s ease 0s;vertical-align: middle;width: 96px;}
.mehrinfobox:hover {cursor:pointer; opacity:1;}
.infobox{ position: relative;padding:20px;background-color:#feffa2 ;font-size:17px;border-radius:20px;margin-bottom:40px;}
.infobox:after {top: 100%;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(254, 255, 162, 0);border-top-color: #feffa2;border-width: 30px;margin-left: -30px;}


.komfortbox{font-size:34px;padding:5px 0 5px 40px;line-height:40px;margin: 10px; background-image:url('../img/check2.png');background-repeat:no-repeat;background-size:40px;background-position:center left;}
.komfortboxtab1{margin:0 0 0 43px;font-weight: normal;font-size: 34px;padding:5px 0 5px 40px;line-height:40px; background-image:url('../img/check2.png');background-repeat:no-repeat;background-size:40px;background-position:center left;}
.komfortbox2{border-bottom: 2px solid #0554A2;height: 60px;margin: 0; background-image:url('../img/check2.png');background-repeat:no-repeat;background-size:40px;background-position:top center;}
.komfortbox3 {background-image: url("../img/check2.png");background-position:left top;background-repeat: no-repeat;background-size: 25px auto;line-height: 30px;margin: 0 auto;padding-left: 25px;}
.komfortbox4 {font-size:26px;background-image: url("../img/check2.png");background-position:left top;background-repeat: no-repeat;background-size: 25px auto;line-height: 30px;margin: 5px 10%;padding-left: 25px;}



.komfortbox:hover, .komfortboxtab1:hover, .komfortbox3:hover, .komfortbox4:hover{cursor:pointer;color:#0554A2!important}
.komfortbox_active, .komfortboxtab1_active, .komfortbox4_active {background-image:url('../img/check.png') !important;}

.budgetwahl{text-align:center;font-size:20px;}
.budgetwahlstriche{margin-top: -11px;width:100%;height:20px;border:2px solid;border-color: transparent #0554A2 transparent transparent;}
.buget_active{background-image:url('../img/check.png') !important;border-width:3px!important}
.budgetwahl:hover{cursor:pointer}


.step4_page{width:100%;height:auto;position:relative;padding:0px;}