@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);
body {
font-family: 'Open Sans', 'sans-serif';
background:#008C95;
background: url(https://www.synusie.de/images/codepen/bg_drk.jpg) center top no-repeat;
margin: 0;
padding: 0;
}
small{
font-size: 0.8rem;
}
a{
color: #B11F30;
}
a:hover{
color: #71141e;
text-decoration: none;
}
.readmore{
float: right;
}
h6.ctaspan{
font-size: 1.8rem;
margin: 0 0 2rem;
}
.cta_calc{
background: #eee;
width: 100%;
clear: both;
}
.col-sm-3 ul.calc_navul li a.cta_calc{
margin: 2px 0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
a.cta_calc img{
width: 10%;
color: #fff;
}
.ctainfo{
font-size: 1.25rem;
padding: 1.5rem 0 0 0;
}
img:hover {
filter: grayscale(90%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
}
.cta a.cta_btn:hover{
color: #fff;
}
.cta_btn:hover {
background: #9B1827;
}
div.card.mb img.card-img-top{
width: 100%;
}
h1{
text-align: center;
font-size: 8rem;
margin-top: 10rem;
color: rgba(0, 0, 0, 0.2);;
}
li.media div.media-body{
border-bottom: 0.0625rem solid #ddd;
}
.navbg{
background: #fff;
margin: 10rem 0;
border-bottom: 0.0625rem solid #ddd;
}
.navbar-default{
background:inherit;
}
.navbar {
position: relative;
min-height: 50px;
margin: 0;
border: none;
font-size: 1.6rem;
}
.navbar-nav>li>.dropdown-menu {
margin-top: 0px;
border-top: 1px solid #ddd;
box-shadow: 1px 6px 5px 0px rgba(0,0,0,0.3);
-webkit-box-shadow: 1px 6px 5px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 1px 6px 5px 0px rgba(0,0,0,0.3);
}
.navbar-default .navbar-nav>li>a {
/*width:200px;*/
color: #373c3f;
}
html body div.navbg div.container nav.navbar.navbar-default div.collapse.navbar-collapse.js-navbar-collapse ul.nav.navbar-nav li.dropdown.mega-dropdown.open ul.dropdown-menu.mega-dropdown-menu.row li.col-sm-4.logbox div.card article.card-body form div.form-group a.float-right{
clear: both;
float: left;
padding: 1rem 0 0 0;
}
html body div.navbg div.container nav.navbar.navbar-default div.collapse.navbar-collapse.js-navbar-collapse ul.nav.navbar-nav li.dropdown.mega-dropdown.open ul.dropdown-menu.mega-dropdown-menu.row li.col-sm-4 div.card article.card-body form div.form-group input.form-control{
width: 100%;
margin: 1.2rem 0;
}
ul.navul li a{
/*border-bottom: 0.0625rem solid #ddd;*/
}
.input-group {
padding: 0 0 0.5rem 0;
width: 100%;
}
section.newsletter h4 {
padding: 0 0 2rem;
}
.center{
text-align: center;
}
.col-sm-12 a.cta_btn{
color: #fff;
padding: 1rem;
}
.col-sm-12 a.cta_btn:hover{
color: #fff;
}
.col-sm-12 a.cta_btn:hover {
background: #9B1827;
}
div.card-body.mb h5.card-title,
.media-body h5.media-heading a{
font-weight: bolder;
text-decoration: none;
}
div.card-body.mb h5.card-title:hover{
color: #71141e;
}
.media-body p.by-author{
color: #999;
padding: 0 0 0 1rem;
font-style: italic;
font-size: 1.25rem;
}
.mega-dropdown {
position: static !important;
/*width:100%;*/
}
.mega-dropdown-menu {
padding: 20px 0px;
width: 100%;
box-shadow: none;
-webkit-box-shadow: none;
}
/*
.mega-dropdown-menu:before {
content: "";
border-bottom: 15px solid #fff;
border-right: 17px solid transparent;
border-left: 17px solid transparent;
position: absolute;
top: -15px;
left: 285px;
z-index: 10;
}
.mega-dropdown-menu:after {
content: "";
border-bottom: 17px solid #ccc;
border-right: 19px solid transparent;
border-left: 19px solid transparent;
position: absolute;
top: -17px;
left: 283px;
z-index: 8;
}
*/
.mega-dropdown-menu > li > ul {
padding: 0;
margin: 0;
}
.mega-dropdown-menu > li > ul > li {
list-style: none;
}
.mega-dropdown-menu > li > ul > li > a {
display: block;
padding: 5px 20px;
clear: both;
font-weight: normal;
line-height: 2.9rem;
color: #373c3f;
white-space: normal;
}
.mega-dropdown-menu > li ul > li > a:hover,
.mega-dropdown-menu > li ul > li > a:focus {
text-decoration: none;
color: #444;
background-color: #f5f5f5;
}
.mega-dropdown-menu .dropdown-header {
color: #428bca;
font-size: 18px;
}
.mega-dropdown-menu form {
margin:3px 20px;
}
.mega-dropdown-menu .form-group {
margin-bottom: 3px;
}
.glyphicon-chevron-down:before {
content: "\e114";
color: #ddd;
}
.pull-right {
padding: 0 0 0 1rem;}
body > div > div > nav > div.collapse.navbar-collapse.js-navbar-collapse > ul > li:nth-child(6){
padding-left: 19rem;
}
body > div > div > nav > div.collapse.navbar-collapse.js-navbar-collapse > ul > li.kdnPort{
float: right;
}
.glyphli{
float: left;
margin: -2.7rem 0 0 0.2rem;
padding: -1rem 0 0 0;
color: #ddd;
}
.blue{
background: #f1f9ff;
overflow: hidden;
min-height: 330px;
padding: 2rem 2rem 8rem 3rem;
margin: -20px 0;
-webkit-border-top-right-radius: 4px;
-webkit-border-bottom-right-radius: 4px;
-moz-border-radius-topright: 4px;
-moz-border-radius-bottomright: 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
li.dropdown:nth-child(6) > ul:nth-child(2){
width: 50%;
float: right;
}
li.dropdown:nth-child(6) > ul:nth-child(2){
background: inherit;
box-shadow: inherit;
width: 100%;
border: inherit;
margin: -20px 0 0 0;
}
.checkbox > label:nth-child(1) > input:nth-child(1){
clear: both;
}
.logbox{
background: #f2f2f2;
overflow: hidden;
min-height: 330px;
padding: 2rem 2rem 8rem 3rem;
margin: -2rem 0 0 74rem;
-webkit-border-bottom-right-radius: 4px;
-webkit-border-bottom-left-radius: 4px;
-moz-border-radius-bottomright: 4px;
-moz-border-radius-bottomleft: 4px;
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
margin-top: 0px;
border-top: 1px solid #ddd;
box-shadow: 1px 6px 5px 0px rgba(0,0,0,0.3);
-webkit-box-shadow: 1px 6px 5px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 1px 6px 5px 0px rgba(0,0,0,0.3);
}
.cta_btn{
background: #B11F30;
text-align: center;
padding: 1rem 5rem;
margin: 3rem 0 2rem 0;
width: 100%;
color: #fff;
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 6px;
}
.media-heading {
margin: 0 5px 5px;
}
li.dropdown.mega-dropdown.open ul.dropdown-menu.mega-dropdown-menu.row li.col-sm-4.center a.cta_btn{
color: #fff;
}
li.dropdown.mega-dropdown.open ul.dropdown-menu.mega-dropdown-menu.row li.col-sm-4.center a.cta_btn:hover{
background: #981e2c;
}
/* Dropdown Area*/
.flex-container {
padding: 0;
margin: 0;
list-style: none;
-ms-box-orient: horizontal;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -moz-flex;
display: -webkit-flex;
display: flex;
}
.wrap {
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.wrap li {
background: gold;
}
.wrap li:hover {
background: #eee;
}
.flex-item {
background: tomato;
padding: 5px;
width: 160px;
height: 100px;
margin: 10px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
line-height: 100px;
color: white;
font-weight: bold;
font-size: 2em;
text-align: center;
}
ul.navul{
padding-left: 0.8rem !important;
}
.grid {
margin-left: auto;
margin-right: auto;
margin-top: 1.5rem;
width: 50%;
}
.phoneNumberRow,
.phoneNumberRow_column{
padding: 1rem 0;
}
.sockel_contactFootnote {
font-size: 1.25rem;
padding: 0 2rem;
}
/* layout/base.css */
.phoneNumberLabeled_label {
margin-left: 2.25rem;
line-height: 1rem;
font-size: 1rem;
}
.cta{
border: 1px solid #ddd;
padding: 2rem;
text-align: center;
}
.contact_field{
margin: 10rem 0 0 0;
}
/* modules/image.css */
svg {
height: auto;
max-width: 100%;
vertical-align: middle;
}
/* modules/map.css */
.map__state path {
fill: #ddd;
stroke: #fff;
}
.map__state:hover path {
fill: #d5d4d4;
}
.phoneNumber{
font-size: 2rem;
}
.sockel .phoneNumberLabeled_phoneNumber {
font-size: 2.25rem;
}
.phoneNumberLabeled_phoneNumber {
font-size: 1.25rem;
font-weight: 600;
padding-left: 2.25rem;
position: relative;
}
.phoneNumberLabeled_phoneNumber .phoneNumber {
color: #B11F30;
}
.sockel .phoneNumberLabeled_label {
font-size: .75rem;
}
.media-body {
overflow: hidden;
zoom: 1;
padding: 1rem 0 0 0;
}
.media:hover{
background: #f8f8f8;
}
.media>.pull-left {
margin-right: 0;
}
.col-md-4 {
width: 50%;
}
.socialMediaIcons {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.socialShare .socialMediaIcons_icon {
color: #777;
background-color: #fff;
border-color: #777;
margin-bottom: 0.5rem;
width: 2.25rem;
height: 2.25rem;
font-size: 1.125rem;
line-height: 2em;
}
.socialMediaIcons_icon {
margin-right: 0.5rem;
display: inline-block;
width: 2.5rem;
height: 2.5rem;
text-align: center;
color: #fff;
background-color: #777;
font-size: 1.25rem;
line-height: 1.9em;
border: 1px solid #777;
border-top-color: rgb(119, 119, 119);
border-right-color: rgb(119, 119, 119);
border-bottom-color: rgb(119, 119, 119);
border-left-color: rgb(119, 119, 119);
border-radius: 50%;
transition: all 150ms ease-in;
}
li.dropdown.mega-dropdown.open ul.dropdown-menu.mega-dropdown-menu.row li.col-sm-4 input.form-control{
width: 50%;
float: left;
-webkit-border-top-right-radius: 3px !important;
-webkit-border-bottom-right-radius: 3px !important;
-moz-border-radius-topright: 3px !important;
-moz-border-radius-bottomright: 3px !important;
border-top-right-radius: 3px !important;
border-bottom-right-radius: 3px !important;
}
button.btn.btn-primary.btn-block{
border-color: #373C3F;
background-color: #373C3F;
width: 50%;
float: left;
}
button.btn.btn-primary.btn-block:hover{
border-color: #131516;
background-color: #131516;
width: 50%;
float: left;
}
.formElement_input {
position: relative;
float: left;
width: 100%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem;
}
label {
display: inline-block;
margin-bottom: 5px;
font-weight: 700;
}
input[type="range"] {
display: block;
width: 100%;
}
.bauzinsenKurzrechner .formElement_field.formElement_field-slider {
padding: 0 2rem;
}
.slider {
position: relative;
}
.slider_current {
position: relative;
display: inline-block;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
border-radius: .125rem;
padding: 0.25rem;
color: #fff;
background: #008C95;
text-align: center;
width: 6rem;
cursor: pointer;
margin-bottom: 0.75rem;
}
.slider_emptyRange {
position: relative;
width: 100%;
height: 4px;
top: 21px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
background: #ddd;
}
.slider {
position: relative
}
.slider_current {
position: relative;
display: inline-block;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
border-radius: .125rem;
padding: 0.25rem;
color: #fff;
background: #008C95;
text-align: center;
width: 6rem;
cursor: pointer;
margin-bottom: 0.75rem
}
.slider_current::after {
content: "";
position: absolute;
bottom: -5px;
left: calc(50% - 5px);
width: 0;
height: 0;
border-top: 5px solid #008C95;
border-left: 5px solid transparent;
border-right: 5px solid transparent
}
.slider_minimum {
font-size: .875rem;
font-weight: 600;
color: #999;
float: left
}
.slider_maximum {
font-size: .875rem;
font-weight: 600;
color: #999;
float: right
}
.slider_inputRange {
-webkit-appearance: none;
overflow: visible;
padding: 0;
width: 100%;
border-color: transparent;
background: transparent;
height: 2.375rem;
box-shadow: none;
}
.slider_inputRange:focus {
outline: none;
border-color: transparent;
background: transparent
}
.slider_inputRange:hover {
border-color: transparent;
background: transparent
}
.slider_inputRange::-ms-track {
width: 100%;
cursor: pointer;
background: transparent;
border-color: transparent;
color: transparent;
height: 4px
}
.slider_inputRange::-webkit-slider-thumb {
-webkit-appearance: none;
box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.4);
height: 40px;
width: 40px;
border-radius: 50%;
border: .625rem solid #fff;
background-color: #008C95;
cursor: pointer;
margin-top: -18px;
position: relative
}
.slider_inputRange::-webkit-slider-runnable-track {
background: #ddd;
height: 4px
}
.slider_inputRange::-moz-range-thumb {
box-sizing: border-box;
box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.4);
height: 40px;
width: 40px;
border-radius: 50%;
border: .625rem solid #fff;
background-color: #008C95;
cursor: pointer
}
.slider_inputRange::-ms-thumb {
box-sizing: border-box;
box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.4);
height: 32px;
margin-top: 1px;
width: 32px;
border-radius: 50%;
border: .625rem solid #fff;
background-color: #008C95;
cursor: pointer
}
.slider_inputRange::-moz-range-progress {
background: #008C95;
height: 4px
}
.slider_inputRange::-moz-range-track {
background: #ddd;
height: 4px
}
.slider_inputRange::-ms-fill-lower {
background: #008C95;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px
}
.slider_inputRange::-ms-fill-upper {
background: #ddd;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px
}
.slider_emptyRange {
position: relative;
width: 100%;
height: 4px;
top: 14px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
background: #ddd
}
.slider_fillRange {
background-color: #008C95;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
height: 4px;
position: relative
}
.ui-datepicker .ui-widget-header {
background-color: #008C95;
color: #fff;
white-space: nowrap;
min-height: calc(38px + .4rem)
}
.ui-datepicker .ui-widget-header a {
color: inherit
}
.ui-datepicker .ui-widget-header a:hover {
text-decoration: none;
color: #555
}
.ui-datepicker .ui-widget-header .ui-icon {
background: none
}
.ui-datepicker .ui-datepicker-prev {
left: .2rem
}
.ui-datepicker .ui-datepicker-prev::before {
font-family: FontAwesome;
content: "\f053"
}
.ui-datepicker .ui-datepicker-next {
right: .2rem
}
.ui-datepicker .ui-datepicker-next::before {
font-family: FontAwesome;
content: "\f054"
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
top: .2rem;
width: 38px;
height: 38px;
line-height: 38px;
text-align: center
}
.ui-datepicker .ui-datepicker-title {
line-height: 38px
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
width: auto;
padding-left: 0;
padding-right: 28.5px;
border: none;
box-shadow: unset;
background-color: transparent;
background-image: url("/vendor/@drklein/form-element/dist/form-element/drk-datepicker-select.svg")
}
.ui-datepicker .ui-datepicker-month option,
.ui-datepicker .ui-datepicker-year option {
background-color: #fff;
color: #373C3F
}
.ui-datepicker .ui-state-default {
border-color: #ddd;
background-color: #fff;
color: #373C3F;
border-radius: .125rem;
border-width: 1px;
border-style: solid;
display: inline-block;
cursor: pointer;
transition: all 120ms ease-in;
font-size: 1rem;
padding: 0.4rem 0.75rem;
display: block;
padding: 0;
text-align: center
}
.ui-datepicker .ui-state-default:hover {
background-color: #dfdfdf;
border-color: #c4c4c4;
color: #373C3F
}
.ui-datepicker .ui-state-default:focus {
background-color: #e6e6e6;
border-color: #aaa;
color: #373C3F
}
.ui-datepicker .ui-state-default:active {
background-color: #e6e6e6;
border-color: #c4c4c4;
color: #373C3F
}
.ui-datepicker .ui-state-default:active:hover,
.ui-datepicker .ui-state-default:active.focus {
background-color: #d4d4d4;
border-color: #aaa;
color: #373C3F
}
.ui-datepicker .ui-state-default:hover,
.ui-datepicker .ui-state-default:focus {
text-decoration: none
}
.ui-datepicker .ui-state-highlight {
background-color: #ddd
}
.ui-datepicker .ui-state-active {
background-color: #61BAE4;
border-color: #61BAE4
}
.formElement,
.formElement-labelLeftOfInput {
margin-left: -1rem;
margin-right: -1rem;
display: flex;
flex-direction: column;
margin-top: 1.25rem;
margin-bottom: 1.25rem
}
.formElement:before,
.formElement-labelLeftOfInput:before,
.formElement:after,
.formElement-labelLeftOfInput:after {
content: " ";
display: table
}
.formElement:after,
.formElement-labelLeftOfInput:after {
clear: both
}
.formElement_label {
position: relative;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem;
padding-right: 0.25rem;
margin-bottom: 0.5rem
}
@media (min-width: 992px) {
.formElement_label {
float: left;
width: 100%
}
}
.formElement_label .labelAndTooltip_label {
color: #555;
font-weight: 400;
font-size: .875rem
}
@media all and (min-width: 768px) {
.formElement_label .labelAndTooltip_label {
font-size: 1rem
}
}
.formElement_labelHeading {
position: relative;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem;
padding-right: 0.25rem;
margin-bottom: 0.5rem
}
@media (min-width: 992px) {
.formElement_labelHeading {
float: left;
width: 100%
}
}
.formElement_labelHeading .labelAndTooltip_label {
color: #555;
font-weight: 600
}
.formElement_field {
position: relative
}
.formElement_field:after {
position: absolute;
right: .5rem;
top: 0;
font-size: 1.25rem;
line-height: 38px
}
.formElement_field input[type=checkbox] {
display: none
}
.formElement_field input[type=checkbox]+label {
padding-left: 2rem;
display: block;
margin: 0
}
.formElement_field input[type=checkbox]+label::before {
border-radius: .125rem;
border: 1px solid #ddd;
box-shadow: inset 0 0 .0625rem 0 #ddd;
content: '.';
background-color: #fff;
display: block;
position: absolute;
width: 1.5rem;
height: 1.5rem;
margin-right: .5rem;
margin-left: -2rem;
text-align: center;
font-weight: 400;
font-size: 0.75rem;
color: #fff;
cursor: pointer
}
.formElement_field input[type=checkbox]+label:hover::before,
.formElement_field input[type=checkbox]+label:focus::before {
background-color: #FAFAFA
}
.formElement_field input[type=checkbox]:checked+label::before {
font-family: FontAwesome;
content: "\f00c";
background-color: #008C95;
border-color: #008C95;
box-shadow: none
}
.formElement_field--is-invalid::after {
font-family: FontAwesome;
content: "\f00d";
color: #B11F30
}
.formElement_field--is-invalid input,
.formElement_field--is-invalid select,
.formElement_field--is-invalid textarea {
border-color: #B11F30
}
.formElement_field--is-invalid input[type="radio"]+label {
border-color: #B11F30
}
.formElement_field--is-invalid input[type="checkbox"]+label::before {
border-color: #B11F30
}
.formElement_field--is-valid::after {
font-family: FontAwesome;
content: "\f00c";
color: #008C95
}
.formElement_field.formElement_field-checkbox .formElement_errorMessage {
padding-left: 2rem;
white-space: inherit
}
.formElement_field.formElement_field-checkbox::after {
display: none
}
.formElement_field.formElement_field-radio::after {
display: none
}
.formElement_field.formElement_field-slider::after {
display: none
}
.formElement_field.formElement_field-date::after {
right: calc(.5rem + 38px)
}
.formElement_field.formElement_field-select::after {
right: calc(.5rem + 38px)
}
.formElement_fieldpair-vornameNachname .formElement_fieldpair {
margin-left: -1rem;
margin-right: -1rem
}
.formElement_fieldpair-vornameNachname .formElement_fieldpair:before,
.formElement_fieldpair-vornameNachname .formElement_fieldpair:after {
content: " ";
display: table
}
.formElement_fieldpair-vornameNachname .formElement_fieldpair:after {
clear: both
}
.formElement_fieldpair-vornameNachname .formElement_fieldpair .formElement_field::after {
right: 1.5rem
}
.formElement_fieldpair-vornameNachname .formElement_fieldpair .formElement_field:first-child {
position: relative;
float: left;
width: 50%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_fieldpair-vornameNachname .formElement_fieldpair .formElement_field:last-child {
position: relative;
float: left;
width: 50%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
@media all and (max-width: 767px) {
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair {
margin-left: -1rem;
margin-right: -1rem
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair:before,
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair:after {
content: " ";
display: table
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair:after {
clear: both
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair .formElement_field::after {
right: 1.5rem
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair .formElement_field:first-child {
position: relative;
float: left;
width: 58.33333%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair .formElement_field:last-child {
position: relative;
float: left;
width: 41.66667%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
}
@media all and (min-width: 768px) {
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair {
margin-left: -1rem;
margin-right: -1rem
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair:before,
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair:after {
content: " ";
display: table
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair:after {
clear: both
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair .formElement_field::after {
right: 1.5rem
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair .formElement_field:first-child {
position: relative;
float: left;
width: 66.66667%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_fieldpair-strasseHausnummer .formElement_fieldpair .formElement_field:last-child {
position: relative;
float: left;
width: 33.33333%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
}
@media all and (max-width: 767px) {
.formElement_fieldpair-plzOrt .formElement_fieldpair {
margin-left: -1rem;
margin-right: -1rem
}
.formElement_fieldpair-plzOrt .formElement_fieldpair:before,
.formElement_fieldpair-plzOrt .formElement_fieldpair:after {
content: " ";
display: table
}
.formElement_fieldpair-plzOrt .formElement_fieldpair:after {
clear: both
}
.formElement_fieldpair-plzOrt .formElement_fieldpair .formElement_field::after {
right: 1.5rem
}
.formElement_fieldpair-plzOrt .formElement_fieldpair .formElement_field:first-child {
position: relative;
float: left;
width: 41.66667%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_fieldpair-plzOrt .formElement_fieldpair .formElement_field:last-child {
position: relative;
float: left;
width: 58.33333%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
}
@media all and (min-width: 768px) {
.formElement_fieldpair-plzOrt .formElement_fieldpair {
margin-left: -1rem;
margin-right: -1rem
}
.formElement_fieldpair-plzOrt .formElement_fieldpair:before,
.formElement_fieldpair-plzOrt .formElement_fieldpair:after {
content: " ";
display: table
}
.formElement_fieldpair-plzOrt .formElement_fieldpair:after {
clear: both
}
.formElement_fieldpair-plzOrt .formElement_fieldpair .formElement_field::after {
right: 1.5rem
}
.formElement_fieldpair-plzOrt .formElement_fieldpair .formElement_field:first-child {
position: relative;
float: left;
width: 33.33333%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_fieldpair-plzOrt .formElement_fieldpair .formElement_field:last-child {
position: relative;
float: left;
width: 66.66667%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
}
.formElement_fieldpair-telefonvorwahlTelefonnummer .formElement_fieldpair {
margin-left: -1rem;
margin-right: -1rem
}
.formElement_fieldpair-telefonvorwahlTelefonnummer .formElement_fieldpair:before,
.formElement_fieldpair-telefonvorwahlTelefonnummer .formElement_fieldpair:after {
content: " ";
display: table
}
.formElement_fieldpair-telefonvorwahlTelefonnummer .formElement_fieldpair:after {
clear: both
}
.formElement_fieldpair-telefonvorwahlTelefonnummer .formElement_fieldpair .formElement_field::after {
right: 1.5rem
}
.formElement_fieldpair-telefonvorwahlTelefonnummer .formElement_fieldpair .formElement_field:first-child {
position: relative;
float: left;
width: 41.66667%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_fieldpair-telefonvorwahlTelefonnummer .formElement_fieldpair .formElement_field:last-child {
position: relative;
float: left;
width: 58.33333%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_input {
position: relative;
float: left;
width: 100%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_input .ui-datepicker-trigger {
position: absolute;
height: 36px;
width: 42.30667px;
margin-left: -43.30667px;
margin-top: 1px;
background-image: url("/vendor/@drklein/form-element/dist/form-element/drk-input-calendar.svg");
border: none
}
.formElement_radiogroup {
display: flex;
flex-wrap: wrap;
border-radius: 2px;
overflow: hidden;
border-top: 1px solid #ddd;
border-left: 1px solid #ddd;
margin-top: 1px
}
.formElement_radiogroup input {
display: none
}
.formElement_radiogroup input:checked+label {
background-color: #008C95;
border-color: #008C95;
color: #fff
}
.formElement_radiogroup label {
flex-grow: 1;
display: flex;
border-radius: 0;
border-color: #ddd;
border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd;
outline: none;
padding: 0 1rem;
height: 38px;
align-items: center;
justify-content: center;
background-color: #fff;
white-space: nowrap;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
transition-property: background-color;
transition: all 120ms ease-in
}
.formElement_radiogroup label:hover {
background-color: #E5E5E5
}
.formElement_checkboxgroup input[type=checkbox]+label {
display: inline-block;
margin-right: 1.25rem
}
.formElement_errorMessage {
font-size: .875rem;
color: #B11F30;
line-height: 1rem
}
.formElement_unit {
display: none
}
.teaserPanel_link a#c247028.button{
}
.formElement_submitStyle,
.formElement_submit {
position: relative;
float: left;
width: 100%;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
.formElement_submitStyle button,
.formElement_submit button {
border-color: #008C95;
background-color: #008C95;
color: #fff;
border-radius: .125rem;
/* border-width: 1px; */
border-style: solid;
display: inline-block;
cursor: pointer;
transition: all 120ms ease-in;
font-size: -3.35rem;
padding: 0.9rem 0.75rem;
width: 385px;
}
.formElement_submitStyle button:hover,
.formElement_submit button:hover {
background-color: #005156;
border-color: #005c62;
color: #fff
}
.formElement_submitStyle button:focus,
.formElement_submit button:focus {
background-color: #005c62;
border-color: #002c2f;
color: #fff
}
.formElement_submitStyle button:active,
.formElement_submit button:active {
background-color: #005c62;
border-color: #005c62;
color: #fff
}
.formElement_submitStyle button:active:hover,
.formElement_submit button:active:hover,
.formElement_submitStyle button:active.focus,
.formElement_submit button:active.focus {
background-color: #003b3e;
border-color: #002c2f;
color: #fff
}
.formElement_submitStyle button:hover,
.formElement_submit button:hover,
.formElement_submitStyle button:focus,
.formElement_submit button:focus {
text-decoration: none
}
.formElement_submit {
text-align: right
}
.formElement-labelLeftOfInput {
align-items: flex-start
}
.formElement-labelLeftOfInput .formElement_label,
.formElement-labelLeftOfInput .formElement_labelHeading {
position: relative;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
@media (min-width: 992px) {
.formElement-labelLeftOfInput .formElement_label,
.formElement-labelLeftOfInput .formElement_labelHeading {
float: left;
width: 25%
}
}
.formElement-labelLeftOfInput .formElement_input {
position: relative;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
@media (min-width: 992px) {
.formElement-labelLeftOfInput .formElement_input {
float: left;
width: 75%
}
}
@media (min-width: 992px) {
.formElement-labelLeftOfInput .formElement_input:first-child {
margin-left: 25%
}
}
.formElement-labelLeftOfInput .formElement_submit {
position: relative;
min-height: 1px;
padding-left: 1rem;
padding-right: 1rem
}
@media (min-width: 992px) {
.formElement-labelLeftOfInput .formElement_submit {
float: left;
width: 75%
}
}
@media (min-width: 992px) {
.formElement-labelLeftOfInput .formElement_submit {
margin-left: 25%
}
}
@media all and (min-width: 992px) {
.formElement-labelLeftOfInput {
flex-direction: row
}
}
.formElement--is-required .formElement_label .labelAndTooltip_label::after {
color: #B11F30;
content: "*";
margin-left: .25rem
}
.formElement--is-required input[type=checkbox]+label::after {
color: #B11F30;
content: "*";
margin-left: .25rem
}
.labelAndTooltip {
display: flex;
flex-direction: row-reverse;
justify-content: flex-end
}
.labelAndTooltip_tooltipIcon {
width: 1.5rem;
height: 1.5rem;
margin-right: 0.5rem;
flex-shrink: 0;
background-image: url("/vendor/@drklein/form-element/dist/label-and-tooltip/drk-info.svg");
background-repeat: no-repeat;
cursor: pointer
}
.labelAndTooltip_tooltipIcon:hover {
background-image: url("/vendor/@drklein/form-element/dist/label-and-tooltip/drk-info_active.svg")
}
.labelAndTooltip_tooltipIcon:hover .labelAndTooltip_tooltipContainer {
display: block;
z-index: 12
}
.labelAndTooltip_tooltipIcon:hover .labelAndTooltip_tooltipText {
display: block
}
.labelAndTooltip_tooltipContainer {
display: none;
cursor: default;
width: 18rem;
padding-top: .5rem;
padding-bottom: .5rem
}
.labelAndTooltip_tooltipText {
display: none
}
.labelAndTooltip_tooltipArrow {
z-index: 10;
position: absolute;
margin-left: -.5rem;
margin-top: -.5rem;
display: block;
width: 1rem;
height: 1rem;
background-color: #fff;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc
}
.labelAndTooltip_tooltipArrow--is-bottom {
transform: rotate(45deg)
}
.labelAndTooltip_tooltipArrow--is-top {
transform: rotate(225deg)
}
.labelAndTooltip--is-hover .labelAndTooltip_tooltipText {
box-shadow: 0 0 5px 0 #ddd;
border-radius: .125rem;
border: 1px solid #ddd;
padding: 0.75rem;
transition: opacity 0.3s;
background-color: #fff;
color: #373C3F;
font-weight: 400;
line-height: 1.25rem
}
.labelAndTooltip--is-hover .labelAndTooltip_tooltipText:active {
opacity: 0;
display: none
}
.labelAndTooltip--is-slideDown+.labelAndTooltip_tooltipText {
margin-bottom: 0.5rem;
font-size: .875rem;
line-height: 1.5em
}
.button,
.button-slim {
font-weight: 600
}
.button-slim {
font-weight: 400
}
.callToAction {
display: inline-block;
text-align: center;
max-width: 100%
}
.callToAction_button {
border-color: #B11F30;
background-color: #B11F30;
color: #fff;
border-radius: .125rem;
border-width: 1px;
border-style: solid;
display: inline-block;
cursor: pointer;
transition: all 120ms ease-in;
border-radius: 2rem;
padding: 0.5em 1.5em;
margin: 0.25em 0 0.25em;
font-size: 1.25rem;
font-weight: 400;
line-height: 1.125em;
display: inline-block;
max-width: 100%
}
.callToAction_button:hover {
background-color: #7b1621;
border-color: #861724;
color: #fff
}
.callToAction_button:focus {
background-color: #861724;
border-color: #5a1018;
color: #fff
}
.callToAction_button:active {
background-color: #861724;
border-color: #861724;
color: #fff
}
.callToAction_button:active:hover,
.callToAction_button:active.focus {
background-color: #67121c;
border-color: #5a1018;
color: #fff
}
.callToAction_button:hover,
.callToAction_button:focus {
text-decoration: none
}
.callToAction_button::after {
font-family: FontAwesome;
content: "\f101";
display: inline;
font-weight: 400;
margin-left: .25rem;
color: #fff
}
@media screen and (max-width: 767px) {
.callToAction_button {
border-radius: .125rem
}
}
.callToAction_textBelow {
display: block;
color: #777;
font-size: .875rem;
font-weight: 400;
margin-top: -0.25em
}
.callToAction+.callToAction {
margin-left: 2rem
}
.googleMapsIframe {
margin-top: 0;
margin-bottom: 1rem
}
.googleMapsIframe_externalContent {
width: 100%;
height: 32.5rem;
border: none
}
.googleMapsIframe .cookieConsentPlaceholder {
display: flex;
padding: 1rem;
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
background-color: #FAFAFA;
background-repeat: no-repeat;
height: 32.5rem;
background-image: url("/fileadmin/_drk-content-admin/placeholder/maps-placeholder.png")
}
.googleMapsIframe .cookieConsentPlaceholder_icon {
margin-bottom: 2.5rem
}
.googleMapsIframe .cookieConsentPlaceholder_icon::before {
font-family: FontAwesome;
content: "\f023";
display: block;
font-size: 5rem;
color: #61BAE4
}
.googleMapsIframe .cookieConsentPlaceholder_description {
padding: 1rem;
background-color: #EEF7FD;
border-radius: .125rem
}
.googleMapsIframe .cookieConsentPlaceholder_description a {
color: #373C3F;
text-decoration: underline
}
.googleMapsIframe .cookieConsentPlaceholder_description a:hover,
.googleMapsIframe .cookieConsentPlaceholder_description a:focus {
color: #B11F30
}
.googleMapsIframe .cookieConsentPlaceholder_submit {
border-color: #008C95;
background-color: #008C95;
color: #fff;
border-radius: .125rem;
border-width: 1px;
border-style: solid;
display: inline-block;
cursor: pointer;
transition: all 120ms ease-in;
font-size: 1rem;
padding: 0.4rem 0.75rem
}
.googleMapsIframe .cookieConsentPlaceholder_submit:hover {
background-color: #005156;
border-color: #005c62;
color: #fff
}
.googleMapsIframe .cookieConsentPlaceholder_submit:focus {
background-color: #005c62;
border-color: #002c2f;
color: #fff
}
.googleMapsIframe .cookieConsentPlaceholder_submit:active {
background-color: #005c62;
border-color: #005c62;
color: #fff
}
.googleMapsIframe .cookieConsentPlaceholder_submit:active:hover,
.googleMapsIframe .cookieConsentPlaceholder_submit:active.focus {
background-color: #003b3e;
border-color: #002c2f;
color: #fff
}
.googleMapsIframe .cookieConsentPlaceholder_submit:hover,
.googleMapsIframe .cookieConsentPlaceholder_submit:focus {
text-decoration: none
}
.newsletter {
padding: 80px 0;
background: #f2f2f2;
}
.newsletter .content {
max-width: 650px;
margin: 0 auto;
text-align: center;
position: relative;
z-index: 2; }
.newsletter .content h2 {
color: #243c4f;
margin-bottom: 40px; }
.newsletter .content .form-control {
height: 50px;
border-color: #ffffff;
border-radius:0;
}
.newsletter .content.form-control:focus {
box-shadow: none;
border: 2px solid #243c4f;
}
.dropdown-menu.mega-dropdown-menu.row li.col-sm-4 section.newsletter div.content form div.input-group input.form-control{
width: 100%;
}
.newsletter .content .btn {
min-height: 50px;
border-radius: 0;
background: #243c4f;
color: #fff;
width: 100%;
}
!
