/* author: ideenwerft GmbH */

@charset "UTF-8";

@import url("fonts.css"); 

/* .... VARIABLES .... */
:root {
	--primary-clr: #336A97;
	--secondary-clr: #C6A76B;
    --third-clr: #BF8350;
    --cta-clr: #336A97;
    --darker-cta-clr: #215580;
    --nav-clr: #BCA595;
    --font-headlines: 'Poppins', Helvetica, Arial, sans-serif;
    --font-body: 'Open Sans', Helvetica, Arial, sans-serif;
    --font-headline-clr: #336A97;
    --font-body-clr: #343B41;
}


/* .... BASICS .... */
body {
    overflow-x: hidden;
	font-family: var(--font-body);
  	font-size: 1rem;
  	color: var(--font-body-clr);
}
.container {
    max-width: 1400px;
}
main.container {
    padding-left: 30px;
    padding-right: 30px;
    max-width: 1130px;
}
main .container {
    max-width: 1100px;
}
main {
	padding: 5rem 0 7rem;
    font-size: 1.15rem;
}
.fullwidth,
.dce-teaser.fullwidth {
    margin: 7rem 0;
    padding: 5rem 0;
    background: var(--secondary-clr) !important;
    color: #fff;
}
main > div:last-child .fullwidth {
    background: var(--third-clr) !important;
    margin-bottom: -7rem;
}

@media (min-width: 768px) {
    main {
        padding: 5rem 0 7rem;
    }
}

.row {
    margin-right: -20px;
    margin-left: -20px;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    padding-right: 20px;
    padding-left: 20px;
}

@media (min-width: 992px) {
    .row {
        margin-right: -30px;
        margin-left: -30px;
    }
    .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
        padding-right: 30px;
        padding-left: 30px;
    }
}



/* .... TEXT .... */
h1, h2, h3, h4 {
	font-family: var(--font-headlines);
	font-weight: 400;
	color: var(--font-headline-clr);
}
.fullwidth h2,
.fullwidth h3,
.fullwidth h4 {
    color: #fff;
}
h1,
.dce-keyvisual .headline,
.pid4349 main > div:first-child header:first-child h2 {
    margin-bottom: 1.9rem;
	font-size: 2.4rem;
    /*text-transform: uppercase; */
}
h2 {
	font-size: 1.8rem;
    margin-top: 2.5rem;
    margin-bottom: 1.5rem;
    line-height: 1.4em;
}
header + h2 {
    margin-bottom: 5rem;
}
h3 {
	font-size: 1.6rem;
    margin-top: 2.5rem;
	margin-bottom: 1.25rem;
    line-height: 1.4em;
}
.fullwidth .frame > h3:first-child {
    margin-top: 0;
}
.dce-teaser h3 {
    margin-top: 0rem;
    font-size: 1.4rem;
}
h4 {
	font-size: 1.4rem;
    margin-top: 2rem;
	margin-bottom: 0.9rem;
    line-height: 1.4em;
}
.ce-textpic .ce-bodytext > h2:first-child,
.ce-textpic .ce-bodytext > h3:first-child,
.ce-textpic .ce-bodytext > h4:first-child {
    margin-top: 0;
}
p {
    margin-bottom: 1.4rem;
    line-height: 1.65rem;
}
ul li > p {
    margin-bottom: 0;
}
main ul {
    padding-left: 15px;
    margin-bottom: 1.6rem;
}
main ul li {
    margin-bottom: 1rem;
    padding-left: 10px;
}
main ul:not(.parsley-errors-list) li::marker {
    content: "\f45c";
    font-family: "Font Awesome 5 Pro";
    position: relative;
    display: inline-block;
    position: absolute;
    font-weight: bold;
    font-size: 0.6em;
    color: var(--cta-clr);
}

main h1,
main h2,
main h3,
main h4,
main p, 
main ul, 
main ol,
.dce-accordion,
.frame-type-text,
.frame-type-textpic {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}
main .fullwidth h2.text-center,
main .fullwidth h3.text-center,
main .fullwidth h4.text-center,
main .fullwidth h2.ce-headline-center,
main .fullwidth h3.ce-headline-center,
main .fullwidth h4.ce-headline-center,
main .fullwidth p.text-center {
    max-width: 900px;
}

main .ce-textpic.ce-right .ce-gallery + .ce-bodytext p {
    max-width: inherit;
}
main a {
	color: var(--cta-clr);
    font-weight: 600;
}
a:hover {
	text-decoration: none;
	color: var(--darker-cta-clr);
}
main a.phone::before,
main a.mail::before {
    font-family: "Font Awesome 5 Pro";
    position: relative;
    display: inline-block;
    color: var(--primary-clr);
    font-weight: 600;
    font-size: 0.9em;
    margin-right: 10px;
}
main a.phone::before {
    content: "\f8d3";
}
main a.mail::before {
    content: "\f1d8";
}
b, strong {
    font-weight: 600;
}

blockquote {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
}
blockquote p:first-child::before,
blockquote p:nth-last-child(2)::after {
    content: "\f10d";
    top: -9px;
    font-family: "Font Awesome 5 Pro";
    position: relative;
    display: inline-block;
    color: var(--third-clr);
    font-weight: 600;
    font-size: 0.6em;
    margin-right: 10px;
    opacity: 0.9;
}
blockquote p:nth-last-child(2)::after {
    content: "\f10d";
    margin-right: 0;
    margin-left: 10px;
}
blockquote p:not(:last-child) {
    font-style: italic;
    font-size: 1.7rem;
    line-height: 1.5em;
    color: var(--third-clr);
}
blockquote p:last-child {
    font-style: normal;
    margin-bottom: 0;
    font-size: 0.9rem;
    opacity: 0.7;
}

@media (max-width:900px) {
    h1 br, 
    h2 br, 
    h3 br, 
    h4 br {
        display: none;
    }
}


@media (min-width: 768px) {
    h1,
    .dce-keyvisual .headline,
    .pid4349 main > div:first-child header:first-child h2  {
        font-size: 2.6rem;
        margin-top: 0;
        margin-bottom: 2rem;
        hyphens: none;
        -webkit-hyphens: none;
    }
    .pid4349 main > div:first-child header:first-child h2  {
        margin-top: -10px;
    }
}

/* .... BUTTONS .... */
.button,
.btn,
input[type=submit]{
    position: relative;
	padding: 7px 20px;
    margin-top: 10px;
	background: var(--cta-clr);
	display: inline-block;
	color: #fff;
    font-weight: 400;
    border: none;
}
.button::after,
.btn::after,
input[type=submit]::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 5px;
    left: 5px;
    border: 1px solid #88a9c3;
}
.fullwidth .button,
.fullwidth .btn,
.fullwidth input[type=submit]{
	background: #fff;
    color: var(--cta-clr);
}
.fullwidth .button::after,
.fullwidth .btn::after,
.fullwidth input[type=submit]::after {
    border-color: #cee2f1;
}
.button:hover,
.btn:hover,
.button:focus,
.btn:focus {
	background: var(--darker-cta-clr);
    color: #fff;
}

/* .... OTHER .... */
img {
  	max-width: 100%;
  	height: auto; 
}
.ce-border img {
    border: none;
    border-radius:50%;
}
hr.ce-div {
    border: none;
    height: 1px;
}
@media (max-width: 767px) {
    .ce-right.ce-intext .ce-gallery {
        max-width: 40%;
    }
    .row > div:nth-child(1) .frame:last-child {
        margin-bottom: 3rem;
    }
}

@media (max-width: 500px) {
    .ce-right.ce-intext {
        display: flex;
        flex-direction: column-reverse;
    }
    .ce-right.ce-intext .ce-gallery,
    .ce-right.ce-intext .ce-gallery .ce-column {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
    }
    .ce-right.ce-intext .ce-gallery figure {
        display: block;
    }
    .ce-right.ce-intext .ce-gallery img {
        width: 100%;
    }
}


/* .... HEADER .... */

.dce-keyvisual .textbox,
.dce-keyvisual > div:not(.box-below) .textbox {
    display: block;
    width: auto;
    max-width: 90%;
}
.dce-keyvisual .text {
    padding: 1.5rem 20px 20px;
    font-size: 1rem;
    background: rgba(97,111,123,0.5);
    color: #fff;
    text-align: center;
}
.dce-keyvisual .text p:first-child {
    margin-bottom: 0.4rem;
    text-transform: uppercase;
    font-family: var(--font-headlines);
    font-weight: 400;
    font-size: 1.3rem;
    letter-spacing: 4px;
}
.dce-keyvisual .text p:last-child {
    margin-bottom: 0;
    line-height: 1.5em;
}
.dce-keyvisual .text h1,
.dce-keyvisual .headline {
    position: relative;
    display: inline-block;
    width: auto;
    margin: 0 auto 1.2rem;
    font-weight: 300;
    font-size: 1.2rem;
    color: #fff;
    letter-spacing: 3px;
}
.dce-keyvisual .text h1::after,
.dce-keyvisual .headline::after {
    width: 80%;
    content: '';
    background: #fff;
    height: 1px;
    display: block;
    margin: 1.3rem auto 0;
}

@media (min-width: 400px) {
    .dce-keyvisual .text {
        padding: 3rem 20px 25px;
        font-size: 1.1rem;
    }
    .dce-keyvisual .text p:first-child {
        font-size: 1.6rem;
    }
}
@media (min-width: 500px) {
    .dce-keyvisual .text {
        padding: 4rem 30px 30px;
        font-size: 1.2rem;
    }
    .dce-keyvisual .text p:first-child {
        margin-bottom: 0.6rem;
        font-size: 2rem;
        letter-spacing: 4px;
    }
    .dce-keyvisual .text h1,
    .dce-keyvisual .headline {
        margin: 0 auto 1.8rem;
        font-size: 1.4rem;
    }
    .dce-keyvisual .text h1::after {
        margin: 1.5rem auto 0;
    }
}

@media (min-width: 768px) {
    .dce-keyvisual .text {
        padding: 3rem 3rem 2.6rem;
        font-size: 1.35rem;
    }
    .dce-keyvisual .text p:first-child {
        font-size: 2.5rem;
    }
    .dce-keyvisual .text h1,
    .dce-keyvisual .headline {
        margin: 0 auto 1.8rem;
        font-size: 1.3rem;
    }
    .dce-keyvisual .text p:last-child {
        line-height: 1.5em;
    }

}
@media (min-width: 1000px) {
    .dce-keyvisual .text {
        padding: 3rem 3rem 2.6rem;
        font-size: 1.4rem;
    }
    .dce-keyvisual .text p:first-child {
        font-size: 3rem;
    }
    .dce-keyvisual .text h1,
    .dce-keyvisual .headline {
        margin: 0 auto 1.8rem;
        font-size: 1.4rem;
    }
    .dce-keyvisual .text p:last-child {
        line-height: 1.5em;
    }

}




/* keyvisual hero */
@media (min-width: 768px) {
    .dce-keyvisual {
        position: relative;
        height: calc(100vh - 260px);
        overflow: hidden;
    }
    .pid4349 .dce-keyvisual {
        height: calc(100vh - 56px);
    } 
    .dce-keyvisual img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

/* .... NAVIGATION .... */
.sticky {
	position: fixed !important;
	z-index: 100;
	top: 0;
	left: 0;
	right: 0;
	opacity: 1;
}
.nav-wrap {
    background: var(--nav-clr);
}
ul.dropdown-menu {
    background: #a28b7a;
    margin-top: 0;
    border-radius: 0;
}
.nav-wrap .navbar {
    padding-top: 0;
    padding-bottom: 0;
}
.nav > li > a:link, 
.nav > li > a:visited {
    color: #fff;
    text-transform: uppercase;
    font-size: 1.15rem;
}
.nav > li > a {
    position: relative;
}
.nav > li > a:hover::after,
.nav > li.active > a::after {
    content: '';
    position: absolute;
    bottom: 8px;
    left: 0;
    right: 0;
    height: 2px;
    background: #fff;
}
button.navbar-toggler {
    margin-left: -7px;
    font-size: 1.7rem;
    color: #fff;
}
button.navbar-toggler:focus {
    outline: none;
}
button.navbar-toggler:not(.collapsed) {
    /*background: rgba(0,0,0,0.2);*/
    background: transparent;
}

/* 2. Ebene */
.nav > li > ul a:link, 
.nav > li > ul a:visited,
.nav > li > ul li.spacer {
    display: block;
    padding: 3px 20px;
    color: #fff;
    font-size: 1rem;
    white-space: nowrap;
}
.nav > li > ul a:hover, 
.nav > li > ul a:focus, 
.nav > li > ul li.active a {
    color: var(--primary-clr);
}
.nav > li > ul li.spacer {
    font-size: 1.1em;
    text-transform: uppercase;
    font-weight: 600;
}
.nav > li > ul li + li.spacer{
    margin-top: 12px;
}

@media (max-width:991px) {
    nav.navbar {
        padding-left: 5px;
        padding-right: 0;
    }
    header ul.navbar-nav {
        margin: 1rem 5px;
    }
    .nav > li > a {
        display: inline-block;
    }
    .dropdown-toggle::after {
        margin-left: 5px !important;
        vertical-align: 0.1em;
        color: #fff;
        font-size: 1.2em;
    }
    .navbar-nav .dropdown-menu {
        border: none;
        padding-top: 0;
    }
    .nav > li > ul a:link, .nav > li > ul a:visited, .nav > li > ul li.spacer {
        padding: 3px 0px;
    }
}

@media (min-width:992px) {
    #mainnavi {
        display: block !important;
    }
    header ul.navbar-nav {
        width: 100%;
        justify-content: space-around;
    }
    .nav a:link, 
    .nav a:visited {
        font-size: 1.15rem;
    }
    .nav .dropdown-toggle {
        display: none;
    }
    .nav > li > a:link, 
    .nav > li > a:visited {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .nav > li:hover ul.dropdown-menu {
        display: block;
        border: none;
        left: -12px;
        padding-bottom: 15px
    }
}

/* .... STARTSEITE .... */
.pid4349 h2 {
    font-size: 2.2rem;
}
.pid4349 .dce-image-tiles .row > div {
    max-width: 100%;
    flex: inherit;
}
.pid4349 .dce-image-tiles h3 {
    text-transform: none;
    font-weight: 300;
    font-size: 1.3rem;
    color: #fff;
}
.pid4349 .dce-image-tiles .tile .hover-content p {
    margin-bottom: 0;
    padding-top: 10px;
    color: #fff;
    font-size: 0.9rem;
    font-style: italic;
}
.pid4349 .dce-image-tiles .tile .hover-content {
    max-height: inherit;
    opacity: 1;
    overflow: visible;
}
.pid4349 .dce-image-tiles .tile .text-wrap {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-pack: center;
    align-items: center;
    text-align: center;
    background: rgba(0,0,0,.1);
    z-index: 10;
}
.pid4349 .frame-type-header + .content-frame {
    margin-top: 3rem;
}
@media (max-width:767px) {
    #c18722 .row > div:last-child {
        order: -1;
        margin-bottom: 2rem;
    }
}
@media (min-width:768px) {
    #c18722 .row > div:nth-child(2) .frame-type-text {
        padding-left: 3rem;
    }
    .pid4349 .dce-image-tiles h3 {
        font-size: 1.4rem;
    }
    .pid4349 .dce-image-tiles .tile .hover-content p {
        padding-top: 20px;
        font-size: 1rem;
    }
}
@media (min-width:950px) {
    .pid4349 .dce-image-tiles h3 {
        font-size: 1.8rem;
    }
    .pid4349 .dce-image-tiles .tile .hover-content p {
        font-size: 1.1rem;
    }
}

/* .... FÜR PRIVATPERSONEN .... */
.pid4366 #c18996 .fullwidth {
    margin-bottom: -7rem;
}


/* .... STOERER FULLWIDTH .... */
.fullwidth .ce-textpic.ce-left {
    display: flex;
    align-items: center;
}
.fullwidth .ce-textpic.ce-left .ce-gallery {
    margin-bottom: 0;
}
@media (max-width:799px) {
    .fullwidth .ce-textpic.ce-left {
        flex-direction: column;
        justify-content: center;
    }
    .fullwidth .ce-textpic.ce-left .ce-bodytext {
        text-align: center;
        margin-top: 40px;
        padding: 0 30px;
    }
}

/* .... ACCORDIONS .... */
.dce-accordion .card-header h5 button {
    color: #fff;
    background-color: var(--third-clr);
    box-shadow: none !important;
}
.dce-accordion .btn::after {
    border: 1px solid #e7c1a2;
}
.dce-accordion .card-header h5 button:hover, 
.dce-accordion .card-header h5 button:focus, 
.dce-accordion .card-header h5 button[aria-expanded="true"] {
    background-color: #a96a34;
    outline: none;
}
.dce-accordion .card-header h5 button[aria-expanded="true"]::after {
    border-bottom: none
}
.dce-accordion .card-body {
    background: #fff7f0;
    border: 1px solid #e7c1a2;
    border-top: none;
    padding: 30px 25px;
    margin-left: 5px;
    margin-right: -5px;
}


/* .... POWERMAIL .... */
.tx-powermail {
    max-width: 800px;
    margin: 4rem auto 0;
}
main .tx-powermail .powermail_fieldset {
    background: #fff7f0;
}
.tx-powermail h3,
.tx-powermail legend {
    display: none;
}
main .tx-powermail div.powermail_fieldwrap {
    padding-left: 0;
    padding-right: 0;
}
.tx-powermail .powermail_fieldset .parsley-errors-list,
.tx-powermail .powermail_fieldset div.parsley-error,
.tx-powermail .powermail_fieldset .powermail_field_error_container .parsley-errors-list{
    background: transparent;
    border: none;
}
.tx-powermail .powermail_fieldset .parsley-errors-list>li {
    padding: 0;
    font-size: 0.85em;
}
@media (max-width:991px) {
    .tx-powermail .container-fluid {
        padding: 0;
    }
    main .tx-powermail div.powermail_fieldwrap {
        display: block;
    }
    main .powermail_fieldwrap > label.col-sm-2 {
        width: 100%;
        max-width: inherit;
    }
    main .powermail_fieldwrap > .col-sm-10 {
        max-width: inherit;
    }
    .powermail_fieldwrap_datenschutz label.control-label {
        display: none;
    }
}


/* .... FOOTER .... */
body > footer {
    padding: 3rem 0 2rem;
    background: var(--primary-clr);
    color: #fff;
}
body > footer .container {
    padding-left: 20px;
    padding-right: 20px;
}
body > footer .grid {
    display: grid;
    grid-template-columns: 1fr;
    margin-bottom: 1.5rem;
}
footer .social {
    display: flex;
    gap: 0.7rem;
}

@media (max-width:767px) {
    body > footer .grid {
        gap: 1.5rem;
        margin-bottom: 3rem;
    }
}
@media (min-width:768px) {
    body > footer .grid {
        grid-template-columns: 1fr 1fr;
        gap: 2rem 0;
    }
}

@media (min-width:1100px) {
    body > footer .grid {
        grid-template-columns: 35% 30% 30% 5%;
    }
    footer .social {
        flex-direction: column;
        align-items: center;
    }
}

@media (min-width:1300px) {
    body > footer .grid {
        grid-template-columns: 30% 30% 30% 10%;
    }
}



body > footer a:link,
body > footer a:visited {
    color: #fff;
}

body > footer a:hover,
body > footer a:focus {
    opacity: 0.7;
}

/* brand */
footer .brand .title {
    font-size: 1.8rem;
    font-family: var(--font-headlines);
    text-transform: uppercase;
    letter-spacing: 3px;
}
footer .brand .title + p {
    font-weight: 500;
    font-size: 1.1em;
    letter-spacing: 1px;
}

/* themen  */
footer .topics p {
    line-height: 1.9em;
}

/* kontakt */
footer .contact .headline {
    font-size: 1.2rem;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
    letter-spacing: 2px;
}
footer .contact p {
    margin-bottom: 0.3rem;
}
footer .contact p i {
    margin-right: 9px;
    font-size: 1.2rem;
}
footer .contact p i.fa-phone-volume {
    margin-left: 3px;
    margin-right: 11px;
}
footer .contact p i.fa-phone-rotary {
    font-weight: 400;
}

/* social */

footer .social a {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    border-radius: 100%;
    color: var(--primary-clr) !important;
    width: 45px;
    height: 45px;
    font-size: 1.5rem;
}


/* copy und musthaves */
.musthavecopy {
    padding: 15px 0;
    background: var(--primary-clr);
    color: #fff;
}
.musthavecopy .container {
    display: flex;
    flex-direction: column-reverse;
    border-top: 1px solid rgba(255,255,255,0.7);
    padding-top: 1rem;
}
ul.musthave {
    display: flex;
    padding-left: 0;
    list-style: none;
    margin-bottom: 0;
}
ul.musthave li {
    margin-right: 15px;
}
ul.musthave li:last-child {
    margin-right: 0;
}
.musthavecopy a:link, 
.musthavecopy a:visited {
    color: #fff;
}
.musthavecopy a:hover, 
.musthavecopy a:focus {
    color: #fff;
    opacity: 0.7;
}

@media (min-width: 768px) {
    .musthavecopy .container {
        flex-direction: row;
        justify-content: space-between;
    }
    ul.musthave {
        margin-right: 0;
        margin-left: 15px;
    }
}


/* .... PRINT STYLES .... */
@media print {
    .header-top,
    .footnavi,
    .musthave {
        display: none;
    }
}