
.calc-3d-8b-container
{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	max-width: 2100px;
	margin: auto;
	background: #8bbe2a;
	padding: 0 20px;
}

.calc-3d-8b-container .up-container
{
	max-width: 2100px;
}

.section-3d-8b h3
{
	font-family: Anton;
	font-weight: 400;
	font-size: 23px;
	color: #484848;
}

.calc-3d-8b-canvas-block
{
	line-height: 0;
	background: #8bbe2a;
	position: relative;
	width: 65%;
}

.calc-3d-8b-data-block
{
	display: flex;
	flex-direction: column;
	/* align-items: center; */
	justify-content: flex-start;
	padding: 15px 20px 50px;
	width: 35%;
}

/* --- */
.calc-3d-8b-location,
.calc-3d-8b-type
{
	display: flex;
	justify-content: flex-start;
	gap: 10px;
	margin-top: 5px;
	margin-bottom: 15px;
}

.calc-3d-8b-location-biberist input[type="radio"],
.calc-3d-8b-location-lotzwil input[type="radio"]
{
	opacity: 0.01;
	z-index: 100;
	width: 0;
	display: none;
}

.calc-3d-8b-location-biberist label,
.calc-3d-8b-location-lotzwil label,
.calc-3d-8b-type-comm label,
.calc-3d-8b-type-priv label
{
	position: relative;
	display: flex;
	align-items: center;
	border: 2px solid #484848;
	padding: 5px;
	font-family: Anton;
	font-weight: 400;
	font-size: 18px;
	line-height: 1.2;
	text-transform: uppercase;
	color: #484848;
	cursor: pointer;
}

.calc-3d-8b-location-biberist input[type="radio"]:checked + label,
.calc-3d-8b-location-lotzwil input[type="radio"]:checked + label,
.calc-3d-8b-type-comm input[type="radio"]:checked + label,
.calc-3d-8b-type-priv input[type="radio"]:checked + label
{
	background-color: #484848;
	color: #fff;
}

.calc-3d-8b-location-biberist input[type="radio"]:checked + label::before,
.calc-3d-8b-location-lotzwil input[type="radio"]:checked + label::before,
.calc-3d-8b-type-comm input[type="radio"]:checked + label::before,
.calc-3d-8b-type-priv input[type="radio"]:checked + label::before
{
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color: #8BBE2A;
	margin-right: 5px;
}


.calc-3d-8b-location-biberist input[type="radio"],
.calc-3d-8b-location-lotzwil input[type="radio"],
.calc-3d-8b-type-comm input[type="radio"],
.calc-3d-8b-type-priv input[type="radio"]
{
	opacity: 0.01;
	z-index: 100;
	width: 0;
	display: none;
}

.calc-3d-8b-location-biberist input[type="radio"]:checked + label,
.calc-3d-8b-location-lotzwil input[type="radio"]:checked + label,
.calc-3d-8b-type-comm input[type="radio"]:checked + label,
.calc-3d-8b-type-priv input[type="radio"]:checked + label
{
	background-color: #484848;
	color: #fff;
}

/* --- */

.calc-3d-8b-type-location
{
	display: flex;
	justify-content: flex-start;
	gap: 10px;
	margin-top: 5px;
	margin-bottom: 15px;
}

.calc-3d-8b-tl-biberist-comm input[type="radio"],
.calc-3d-8b-tl-lotzwil-sel-comm input[type="radio"],
.calc-3d-8b-tl-lotzwil-sel-priv input[type="radio"]
{
	opacity: 0.01;
	z-index: 100;
	width: 0;
	display: none;
}

.calc-3d-8b-tl-biberist-comm label,
.calc-3d-8b-tl-lotzwil-sel-comm label,
.calc-3d-8b-tl-lotzwil-sel-priv label
{
	position: relative;
	display: flex;
	align-items: center;
	border: 2px solid #484848;
	padding: 5px;
	font-family: Anton;
	font-weight: 400;
	font-size: 21px;
	line-height: 1.2;
	text-transform: uppercase;
	color: #484848;
	cursor: pointer;
}

.calc-3d-8b-tl-lotzwil-sel-comm label,
.calc-3d-8b-tl-lotzwil-sel-priv label
{
	background-color: #484848;
	color: #fff;
}

.calc-3d-8b-tl-biberist-comm input[type="radio"]:checked + label,
.calc-3d-8b-tl-lotzwil-sel-comm input[type="radio"]:checked + label,
.calc-3d-8b-tl-lotzwil-sel-priv input[type="radio"]:checked + label
{
	background-color: #484848;
	color: #fff;
}

.calc-3d-8b-tl-biberist-comm input[type="radio"]:checked + label::before,
.calc-3d-8b-tl-lotzwil-sel-comm input[type="radio"]:checked + label::before,
.calc-3d-8b-tl-lotzwil-sel-priv input[type="radio"]:checked + label::before
{
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color: #8BBE2A;
	margin-right: 5px;
}

.calc-3d-8b-tl-lotzwil-sel-comm input[type="radio"]:not(:checked) + label::before,
.calc-3d-8b-tl-lotzwil-sel-priv input[type="radio"]:not(:checked) + label::before
{
	content: '';
	display: inline-block;
	width: 12px;
	height: 8px;
}

.calc-3d-8b-tl-lotzwil-sel
{
	position: relative;
	margin-left: 1px;
}

.calc-3d-8b-tl-lotzwil-sel.calc-3d-8b-sel-selected
{
	margin-left: 14px;
}

.calc-3d-8b-tl-lotzwil-sel-btn
{
	position: relative;
	display: flex;
	align-items: center;
	border: 2px solid #484848;
	padding: 5px;
	font-family: Anton;
	font-weight: 400;
	font-size: 21px;
	line-height: 1.2;
	text-transform: uppercase;
	color: #484848;
	cursor: pointer;
}

.calc-3d-8b-tl-lotzwil-sel-btn::before
{
	content: '';
	display: inline-block;
	width: 12px;
	height: 8px;
}

.calc-3d-8b-sel-selected .calc-3d-8b-tl-lotzwil-sel-btn::before
{
	width: 8px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color: #8BBE2A;
	margin-right: 5px;
}

.calc-3d-8b-tl-lotzwil-sel-btn::after
{
	content: '';
	background-image: url("data:image/svg+xml,%3Csvg width='18' height='10' viewBox='0 0 18 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.78018 9.17172C9.34929 9.60943 8.65069 9.60943 8.21981 9.17172L1.19816 2.03843C0.767279 1.60072 0.767279 0.891095 1.19816 0.453278C1.62905 0.0155739 2.32764 0.0155739 2.75853 0.453278L8.99999 6.794L15.2415 0.453278C15.6724 0.0155739 16.3709 0.0155739 16.8019 0.453278C17.2327 0.891095 17.2327 1.60072 16.8019 2.03843L9.78018 9.17172Z' fill='%23484848'/%3E%3C/svg%3E%0A");
	width: 18px;
	height: 10px;
	margin-left: 10px;
	background-repeat: no-repeat;
}

.calc-3d-8b-sel-active .calc-3d-8b-tl-lotzwil-sel-btn,
.calc-3d-8b-sel-selected .calc-3d-8b-tl-lotzwil-sel-btn
{
	background-color: #484848;
	color: #fff;
}

.calc-3d-8b-sel-active .calc-3d-8b-tl-lotzwil-sel-btn::after
{
	background-image: url("data:image/svg+xml,%3Csvg width='18' height='10' viewBox='0 0 18 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.78018 0.828278C9.34929 0.390574 8.65069 0.390574 8.21981 0.828278L1.19816 7.96157C0.767279 8.39928 0.767279 9.10891 1.19816 9.54672C1.62905 9.98443 2.32764 9.98443 2.75853 9.54672L8.99999 3.206L15.2415 9.54672C15.6724 9.98443 16.3709 9.98443 16.8019 9.54672C17.2327 9.10891 17.2327 8.39928 16.8019 7.96157L9.78018 0.828278Z' fill='white'/%3E%3C/svg%3E%0A");
}

.calc-3d-8b-sel-selected:not(.calc-3d-8b-sel-active) .calc-3d-8b-tl-lotzwil-sel-btn::after
{
	background-image: url("data:image/svg+xml,%3Csvg width='18' height='10' viewBox='0 0 18 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.78018 9.17172C9.34929 9.60943 8.65069 9.60943 8.21981 9.17172L1.19816 2.03843C0.767279 1.60072 0.767279 0.891095 1.19816 0.453278C1.62905 0.0155739 2.32764 0.0155739 2.75853 0.453278L8.99999 6.794L15.2415 0.453278C15.6724 0.0155739 16.3709 0.0155739 16.8019 0.453278C17.2327 0.891095 17.2327 1.60072 16.8019 2.03843L9.78018 9.17172Z' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.calc-3d-8b-tl-lotzwil-sel-dropdown
{
	position: absolute;
	width: 100%;
	margin-top: 3px;
	z-index: 100;
	box-shadow: 0 0 3px -1px #8bbe2a;
}

/* --- */

.calc-3d-8b-calc-action-request .title-font span
{
	font-size: 21px;
}

.calc-3d-8b-data-title-row,
.calc-3d-8b-data-calc-row,
.calc-3d-8b-data-total-row
{
	display: flex;
	justify-content: space-between;
	color: #484848;
	margin-bottom: 15px;
}

.calc-3d-8b-data-title-row
{
	font-size: 23px;
	font-weight: bold;
}

.calc-3d-8b-data-calc-row span
{
	font-size: 23px;
	line-height: 2;
	font-weight: normal;
}

.calc-3d-8b-data-total-row span
{
	font-size: 23px;
	line-height: 2;
	font-weight: bold;
}

.calc-3d-8b-calc-result
{
	background-color: #FFFFFF1F;
	margin-top: 45px;
	padding: 23px;
	display: none;
}

.contact-3d-8b-container
{
	display: none;
}

.calc-3d-container-hidden 
{
	display: none;
}

.contact-3d-container-shown
{
	display: flex;
}

.contact-3d-8b-container .wpcf7
{
	width: 100%;
}

.contact-3d-8b-container .np-3d-cf-datepicker
{
	font-size: 16px !important;
	width: 130px !important;
	border: 2px solid #484848 !important;
	text-align: center;
}


@media all and (max-width: 991px)
{
	.calc-3d-8b-data-block
	{
		width: 100%;
		order: 2;
	}
	
	.calc-3d-8b-canvas-block
	{
		width: 100%;
		order: 1;
	}
}