@charset "utf-8";

#navMobile { height:0; max-height:0; }

/* ------- Farbcodes -------- *//*
grau: #4f4f4f

/* --- Externe Schriften - Google Webfonts Helper --- */
/* noto-sans-100 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/noto-sans-v36-latin-100.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-100.ttf') format('truetype');
}

/* noto-sans-100italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 100;
  src: url('../fonts/noto-sans-v36-latin-100italic.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-100italic.ttf') format('truetype');
}

/* noto-sans-200 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/noto-sans-v36-latin-200.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-200.ttf') format('truetype');
}

/* noto-sans-200italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 200;
  src: url('../fonts/noto-sans-v36-latin-200italic.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-200italic.ttf') format('truetype');
}

/* noto-sans-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-v36-latin-regular.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-regular.ttf') format('truetype');
}

/* noto-sans-300 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/noto-sans-v36-latin-300.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-300.ttf') format('truetype');
}

/* noto-sans-300italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/noto-sans-v36-latin-300italic.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-300italic.ttf') format('truetype');
}

/* noto-sans-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-v36-latin-regular.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-regular.ttf') format('truetype');
}

/* noto-sans-italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/noto-sans-v36-latin-italic.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-italic.ttf') format('truetype');
}

/* noto-sans-500 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/noto-sans-v36-latin-500.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-500.ttf') format('truetype');
}

/* noto-sans-500italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/noto-sans-v36-latin-500italic.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-500italic.ttf') format('truetype');
}

/* noto-sans-600 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/noto-sans-v36-latin-600.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-600.ttf') format('truetype');
}

/* noto-sans-600italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 600;
  src: url('../fonts/noto-sans-v36-latin-600italic.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-600italic.ttf') format('truetype');
}

/* noto-sans-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/noto-sans-v36-latin-700.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-700.ttf') format('truetype');
}

/* noto-sans-700italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/noto-sans-v36-latin-700italic.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-700italic.ttf') format('truetype');
}

/* noto-sans-800 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/noto-sans-v36-latin-800.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-800.ttf') format('truetype');
}

/* noto-sans-800italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 800;
  src: url('../fonts/noto-sans-v36-latin-800italic.woff2') format('woff2'),
       url('../fonts/noto-sans-v36-latin-800italic.ttf') format('truetype');
}

/* open-sans-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v40-latin-regular.woff2') format('woff2'),
       url('../fonts/open-sans-v40-latin-regular.ttf') format('truetype');
}

/* open-sans-italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/open-sans-v40-latin-italic.woff2') format('woff2'),
       url('../fonts/open-sans-v40-latin-italic.ttf') format('truetype');
}

/* open-sans-500 - latin */
@font-face {
  font-display: swap;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/open-sans-v40-latin-500.woff2') format('woff2'),
       url('../fonts/open-sans-v40-latin-500.ttf') format('truetype');
}

/* open-sans-500italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/open-sans-v40-latin-500italic.woff2') format('woff2'),
       url('../fonts/open-sans-v40-latin-500italic.ttf') format('truetype');
}

/* open-sans-600 - latin */
@font-face {
  font-display: swap;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/open-sans-v40-latin-600.woff2') format('woff2'),
       url('../fonts/open-sans-v40-latin-600.ttf') format('truetype');
}

/* open-sans-600italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: url('../fonts/open-sans-v40-latin-600italic.woff2') format('woff2'),
       url('../fonts/open-sans-v40-latin-600italic.ttf') format('truetype');
}

/* open-sans-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/open-sans-v40-latin-700.woff2') format('woff2'),
       url('../fonts/open-sans-v40-latin-700.ttf') format('truetype');
}

/* open-sans-700italic - latin */
@font-face {
  font-display: swap;
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/open-sans-v40-latin-700italic.woff2') format('woff2'),
       url('../fonts/open-sans-v40-latin-700italic.ttf') format('truetype');
}


/* --- alle Abstaende und Raender auschalten --- */
* { margin:0px; padding:0px; border:0px none; }

/* --- bei Links die Hervorhebung durch den Browser auschalten --- *//*
a:active, a:focus { outline-width:0; outline-style:none; outline-color:currentcolor; }

/* --- Die oft verwendeten Styles position:relative, position:absolute und overflow:hidden in Klasse packen --- */
.rehi { position:relative; overflow:hidden; }
.abhi { position:absolute; overflow:hidden; }
.fihi { position:fixed;    overflow:hidden; }
.revi { position:relative; overflow:visible; }
.abvi { position:absolute; overflow:visible; }
.fivi { position:fixed;    overflow:visible; }

/* --- Die oft verwendeten Styles für background-colour, display:none und clear:both in Klasse packen --- */
.hide  { display:none; }
.clear { clear:both; }

/* ======================================================================================================================================= */
/* ===========================================       Gemeinsame Styles für alle Viewports      =========================================== */
/* ======================================================================================================================================= */

/* ------------------------------------------------- Schalter für Elemente, die ohne JavScript verborgen werden ---------- */
body.fb .hideJSfalse { display:none; }

/* ------------------------------------------------- Hintergrundfarbe für gesamte Seite ---------------------------------- */
html { background-color:#fcfbfa; }

/* ------------------------------------------------- Grundschriftformatierung -------------------------------------------- */
html { font-family:'Noto Sans', Tahoma, Geneva, sans-serif; font-size:16px; font-weight:400; font-style:normal; line-height:24px; color:#202020; -webkit-text-size-adjust:100%; }

/* ------------------------------------------------- Styles fuer Positionierung der Grundbloecke ------------------------- */
#site { position:relative; width:100%; height:100%; overflow:auto; z-index:1; }
 
#frameContent { width:100%; height:auto; }
#clear        { width:100%; height:120px; }
#framePage    { width:100%; height:auto; }
.page         { width:100%; height:auto; }
.window       { width:100%; height:600px; background-color:transparent; }
.slider       { left:0; top:50%; width:100%; height:auto; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index:0; }
.title        { left:0; bottom:20%; width:100%; height:auto; z-index:1; }
.line         { width:100%; height:30px; background-image:url(../icons/line.png); }
.content      { width:100%; height:auto; background-color:#d2cac2; }
.contentInner { width:100%; height:auto; margin:0 auto 0; padding:48px 30px 36px; box-sizing:border-box; max-width:1400px; }
#bottom       { width:100%; height:auto; min-height:100px; background-color:#d2cac2; }
#bottomInner  { width:100%; height:auto; margin:0 auto 0; padding:48px 0 36px; box-sizing:border-box; max-width:1400px; text-align:center; }
 
#framePage.pa #pageA { display:block; }
#framePage.pa #pageB { display:none; }
#framePage.pb #pageA { display:none; }
#framePage.pb #pageB { display:block; }
 
.slider img     { width:100%; height:auto; margin:0; padding:0; }
.slider picture { width:100%; height:auto; margin:0; padding:0; }
 
#frameFooter { width:100%; height:0; left:0; bottom:0; position:fixed; z-index:2; }
#footer      { width:100%; height:0; margin:0 auto 0; padding:0 30px 0; box-sizing:border-box; max-width:1400px; }
.upButton    { right:10px; bottom:20px; width:50px; height:50px; float:none; background:url(../icons/pageup-black.png) 0 0 no-repeat; cursor:pointer; }
 
#frameHeader       { left:0; top:0; width:100%; height:120px; padding:0; overflow:visible; background-color:#fcfbfa; z-index:3; }
#header            { width:100%; max-width:1400px; height:120px; margin:0 auto 0; padding:0; }
 
#frameNavTop       { left:0; top:47px; width:100%; box-sizing:border-box; margin:0; padding:0 110px 0 40.00%; height:26px; z-index:4; }
#navTop            { height:26px; margin:0; padding:0; }
#navSocial         { right:30px; top:41px; width:136px; height:38px; z-index:6; }
#navIcon           { right:22px; top:25px; width:60px; height:38px; cursor:pointer; cursor:pointer; z-index:7; }
#navIcon .lineUp   { left:0; top:4px; width:60px; height:7px; border-bottom:6px solid #4b565b; border-top:6px solid #4b565b; -webkit-transition: all 0.2s ease-out;
                     -moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }
#navIcon .lineDown { left:0; top:30px; width:60px; height:0px; border-top:6px solid #4b565b; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; 
                     -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }
#logo              { left:25px; top:16px; width:100%; max-width:408px; height:auto; z-index:5; }
#logo a            { display:block; position:relative; width:100%; height:100%; margin:0; padding:0; overflow:hidden; }
#logo a img        { width:100%; height:auto; }
 
#navIcon.active           { right:27px; top:26px; }
#navIcon.active .lineUp   { left:0px; top:18px; width:40px; height:0px; border-top:3px solid #4b565b; border-bottom:0 none; transform:rotate(-45deg); }
#navIcon.active .lineDown { left:0px; top:18px; width:40px; height:0px; border-top:3px solid #4b565b; transform:rotate(45deg); }
 
 
/* ------------------------------------------------- Styles fuer Menus --------------------------------------------------- */
#navTop ul.firstul                  { position:relative; width:100%; list-style:none; overflow:visible; text-align:center; }
#navTop li.firstli                  { display:inline-block; position:relative; padding:0; margin:0 15px 0; height:25px; text-align:center; vertical-align:top; overflow:visible; }
#navTop li.firstli span.f,
#navTop li.firstli a.f              { display:inline-block;  text-decoration:none; cursor:pointer; }
#navTop li.firstli span.f .underlf,
#navTop li.firstli a.f .underlf     { display:block; position:relative; padding:0; margin:0; border-bottom:1px solid transparent; overflow:hidden;
                                      font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:18px; font-weight:400; line-height:25px; text-decoration:none;
                                      letter-spacing:1px; white-space:nowrap; color:#4b565b; }
									  
#navTop li.firstli span.f.sub .underlf            { padding:0 21px 0 0; background:url(../icons/icon-nav-down.png) no-repeat right 11px; background-size:18px 8px; } 
#navTop li.firstli.activehold span.f.sub .underlf { background:url(../icons/icon-nav-up.png) no-repeat right 11px; }

#navTop ul.secondul               { display:block; position:absolute; top:24px; padding-top:1px; left:-20px; list-style:none; overflow:hidden; z-index:4; }
#navTop li.secondli               { margin:0; text-align:left; background-color:rgba(252,251,250,0.90); overflow:hidden; }
#navTop li.secondli a.s           { display:block; text-decoration:none; position:relative; margin:0; padding:0 66px 0 20px; overflow:hidden; }
#navTop li.secondli a.s .underls  { display:inline-block; position:relative; margin:5px 0 5px; border-bottom:1px solid transparent; padding:0; overflow:hidden;
                                    font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:17px; font-weight:300; line-height:26px; text-decoration:none;
                                    letter-spacing:1px; white-space:nowrap; color:#4b565b; }
 
#navTop li.firstli a.active .underlf    { border-bottom:1px solid #4b565b; }
#navTop li.firstli span.active .underlf { border-bottom:1px solid #4b565b; }
#navTop li.secondli a.active .underls   { border-bottom:1px solid #4b565b; }
 
#navTop li.firstli.activehold span.active .underlf { border-bottom:1px solid transparent; }
 
#navTop li.secondli:first-child { padding-top:15px; }
#navTop li.secondli:last-child  { padding-bottom:15px; }
						  
#navTop li.firstli ul.secondul            { max-height:0px;  -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out;
                                                             -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
#navTop li.firstli.active ul.secondul     { max-height:400px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;
                                                              -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }
#navTop li.firstli.activehold ul.secondul { max-height:400px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;
                                                              -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }
 
#navBottom ul        { display:block; position:relative; width:auto; overflow:hidden; text-align:center; vertical-align:text-top; }
#navBottom ul li     { display:inline-block; list-style:none;
                       font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:18px; font-weight:400; font-style:normal; line-height:24px; color:#202020; }
#navBottom ul li a   { color:#202020; }
#navBottom ul li.cev { padding:0 15px 0; }

#navBottom ul li a,
#navBottom ul li.cev span { display:block; padding:5px 0 0; text-decoration:none; overflow:hidden; }
 
#navSocial ul.socialul                { float:right; width:auto; }
#navSocial ul.socialul li             { list-style:none; float:left; width:38px; height:38px; margin:0 0 0 4px; }
#navSocial ul.socialul li:first-child { margin:0; }

#navSocial .socialul span.i { display:block; position:relative; width:38px; height:38px; background-repeat:no-repeat; background-position:0 0; background-size:38px 38px; overflow:hidden; }
#navSocial .socialul span.t { display:none; }

#navSocial .socialul .ico-facebook span.i { background-image:url(../icons/icons_facebook.png); }
#navSocial .socialul .ico-whatsapp span.i  { background-image:url(../icons/icons_whatsapp.png); }
#navSocial .socialul .ico-instagram span.i  { background-image:url(../icons/icons_instagram.png); }
#navSocial .socialul .ico-pinterest span.i { background-image:url(../icons/icons_pinterest.png); }



/* ------------------------------------------------- Styles fuer Inhalte ------------------------------------------------ */
/* 100% Bilder im Text */
.text .frame-default,
.text .frame-portrait,
.text .ce-textpic,
.text .ce-image,
.text .ce-outer,
.text .ce-inner,
.text .ce-row,
.text .ce-column,
.text .ce-media,
.text figure,
.text .ce-media img,
.text figure img  { position:relative; overflow:hidden; margin:0; padding:0; border:0px none; border-image-width:0; width:100%; height:auto; }

.text .ce-textpic .ce-gallery,
.text .ce-image .ce-gallery    { box-sizing:border-box; padding: 6px 20px 6px; }

/*frame-full*/
.text .frame-full                          { width:100%; }
.text .frame-full .ce-textpic .ce-gallery  { display:none; }
.text .frame-full .ce-textpic .ce-bodytext { width:100%; }

/*frame-half*/
.text .frame-half                          { float:left; width:48%; margin:0 2% 0 0; }
.text .frame-half+.frame-half              { float:left; width:48%; margin:0 0 0 2%; }
.text .frame-extra+.frame-half             { float:left; width:48%; margin:0 0 0 2%; }
.text .frame-half .ce-textpic .ce-gallery  { display:none; }
.text .frame-half .ce-textpic .ce-bodytext { width:100%; }

/*frame-extra*/
.text .frame-extra                          { float:left; width:48%; margin:0 2% 0 0; }
.text .frame-extra .ce-textpic .ce-gallery  { display:none; }
.text .frame-extra .ce-textpic .ce-bodytext { width:100%; }

/* --- Abstände --- */
.frame.frame-space-before-nospace     { padding-top:0; }
.frame.frame-space-before-extra-small { padding-top:12px; }
.frame.frame-space-before-small       { padding-top:24px; }
.frame.frame-space-before-medium      { padding-top:36px; }
.frame.frame-space-before-large       { padding-top:48px; }
.frame.frame-space-before-extra-large { padding-top:60px; }

.frame.frame-space-after-nospace     { padding-bottom:0; }
.frame.frame-space-after-extra-small { padding-bottom:12px; }
.frame.frame-space-after-small       { padding-bottom:24px; }
.frame.frame-space-after-medium      { padding-bottom:36px; }
.frame.frame-space-after-large       { padding-bottom:48px; }
.frame.frame-space-after-extra-large { padding-bottom:60px; }

  
/* ---------------------------------------------------------- Styles fuer die Schriften -------------------------------------------------------------- */
.text p  { margin:0; padding:0 0 12px; }
.text h1 { font-family:Georgia, "Times New Roman", Times, serif; padding:0 0 24px; font-size:40px; line-height:48px; font-weight:300; text-align:center; color:#202020; }
.text h2 { font-family:Georgia, "Times New Roman", Times, serif; padding:0 0 24px; font-size:40px; line-height:48px; font-weight:300; text-align:center; color:#202020; }
.text h3 { font-family:Georgia, "Times New Roman", Times, serif; padding:0 0 12px; font-size:30px; line-height:36px; font-weight:300; text-align:center; color:#202020; }
.text h4 { font-family:Georgia, "Times New Roman", Times, serif; padding:6px 0 6px; font-size:24px; line-height:32px; font-weight:300; text-align:left; color:#202020; }

.text p b,
.text p strong { font-weight:700; }

.text a,
.text p a  { text-decoration:underline; color:#202020; }
.text h1 a { text-decoration:none;      color:#202020; }
.text h2 a { text-decoration:none;      color:#202020; }
.text h3 a { text-decoration:none;      color:#202020; }

.text a:hover,
.text p a:hover  { text-decoration:none; }

.text ul    { margin:0; padding:6px 0 0 50px; color:#ffffff; }
.text ul li { list-style:none; margin:0 0 6px; color:#202020; }

.text ul li::before { content:"\2022"; color:#202020; font-weight:bold; display:inline-block; width:1em; margin-left:-1em; }

.text-left   { text-align:left; } 
.text-center { text-align:center; } 
.text-right  { text-align:right; }

.text .important      {  }
.text .quote          { font-family:'Noto Sans', Tahoma, Geneva, sans-serif; padding:0 0 4px; margin:0; font-size:30px; line-height:38px; font-weight:300; font-style:italic; color:#202020; }
.text .name-of-person { font-family:'Noto Sans', Tahoma, Geneva, sans-serif; padding:0 0 4px; margin:0; font-size:22px; line-height:28px; font-weight:300; font-style:italic; color:#202020; }


/* ---------------------------------------------------------- Styles fuer Kontaktformular ---------------------------------------------- */
.contact-form-wrap          { position:relative; display:block; width:100%; margin:auto; overflow:hidden; }
.contact-form-wrap fieldset { border:0 none; }

.contact-form-wrap legend,
.contact-form-wrap .contact-form>h3 { display:none; }

.contact-form-wrap { position:relative; overflow:hidden; }

.contact-fieldwrap { position:relative; width:80%; padding:0 0 16px; overflow:hidden; }
.contact-field     { position:relative; width:99%; padding:0;        overflow:hidden; } 
.mandatory           { display:none; }

.contact-fieldwrap-input                  { position:relative; width:100%; overflow:hidden; margin-bottom:4px; }
.contact-fieldwrap-input .contact-label { position:relative; display:block; max-width:100%; padding:0 0 6px; overflow:hidden;
                                                   font-family:'Noto Sans', Tahoma, Geneva, sans-serif; font-size:16px; line-height:22px; font-weight:normal; color:#202020; }
.contact-fieldwrap-input .contact-field { position:relative; width:100%; outline:none; }
.contact-fieldwrap-input .contact-input { position:relative; width:100%; background-color:#fff; padding:8px 8px 8px; outline:none; overflow:hidden;
                                                   font-family:'Noto Sans', Tahoma, Geneva, sans-serif; font-size:16px; line-height:22px; font-weight:normal; color:#202020; }

.contact-fieldwrap-textarea                     { position:relative; width:100%; overflow:hidden; margin-bottom:4px; }
.contact-fieldwrap-textarea .contact-label    { position:relative; display:block; max-width:100%; padding:0 0 6px;
                                                         font-family:'Noto Sans', Tahoma, Geneva, sans-serif; font-size:16px; line-height:22px; font-weight:normal; color:#202020; } 
.contact-fieldwrap-textarea .contact-field    { position:relative; width:100%; outline:none; }
.contact-fieldwrap-textarea .contact-textarea { position:relative; width:100%; height:132px; background-color:#fff; padding:8px 8px 8px; outline:none; overflow:hidden;
                                                         font-family:'Noto Sans', Tahoma, Geneva, sans-serif; font-size:16px; line-height:22px; font-weight:normal; color:#202020; }
														 
.contact-fieldwrap-submit                  { position:relative; width:100%; overflow:hidden; padding-top:10px; }
.contact-fieldwrap-submit .contact-field { position:relative; display:block; max-width:100%; padding:0 0 6px; }
.contact-fieldwrap-submit input            { display:block; position:relative; width:auto; padding:6px 18px 6px; background-color:#fff; overflow:hidden; cursor:pointer;
													font-family:'Noto Sans', Tahoma, Geneva, sans-serif; font-size:17px; line-height:22px; text-decoration:none; color:#202020; }			
.contact-fieldwrap-submit input:active    { background-color:#555; color:#fff; }			

/* Fehler */
ul.contact-errors-list,
ul.contact-errors-list li { color:#ff0000; list-style-position: outside; margin:0; padding:0; list-style:none !important; }
.mandatory                  { display:none;  }

/* Honeypot-Feld (Spamschutz Kontaktformular) */
.contact-honeypot { position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }



/* ======================================================================================================================================= */
/* ========================================     Viewport kleiner 1000 Pixel - Navigation mobile    ======================================= */
/* ======================================================================================================================================= */
@media screen and (max-width:1000px) {
	
#navTop { float:right; margin-right:4px; width:auto; height:auto; overflow:hidden; }

#navTop ul.firstul                  { overflow:hidden; background-color:rgba(252,251,250,0.90); min-width:180px; }
#navTop li.firstli                  { display:block; position:relative; padding:0 10px 0; margin:0 auto 0; height:auto; overflow:hidden; }
#navTop li.firstli span.f,
#navTop li.firstli a.f              { padding:0; width:auto; }
#navTop li.firstli span.f .underlf,
#navTop li.firstli a.f .underlf     { display:inline-block; width:auto; margin:7px 0 7px; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:19px; font-weight:400;
                                      line-height:25px; text-decoration:none; letter-spacing:1px; white-space:nowrap; color:#4b565b; }

#navTop li.firstli span.f.sub .underlf            { padding:0 21px 0 0; background:url(../icons/icon-nav-down.png) no-repeat right 11px; } 
#navTop li.firstli.activehold span.f.sub .underlf { background:url(../icons/icon-nav-up.png) no-repeat right 11px; }
/* #navTop li.firstli.activehold span.active .underlf { border-bottom:1px solid #4b565b; } */
								  
#navTop li.firstli:first-child { padding-top:10px; }
#navTop li.firstli:last-child  { padding-bottom:10px; }

#navTop ul.secondul               { position:relative; top:auto; left:auto; width:auto; height:auto; padding-top:0; overflow:hidden; }
#navTop li.secondli               { display:block; margin:0; text-align:center; background-color:transparent; }
#navTop li.secondli a.s           { margin:0; padding:0; width:auto; }
#navTop li.secondli a.s .underls  { display:inline-block; width:auto; margin:3px 0 3px; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:16px; font-weight:300;
                                    line-height:26px; text-decoration:none; letter-spacing:1px; white-space:nowrap; color:#4b565b; }

#navTop li.secondli:first-child { padding-top:0; }
#navTop li.secondli:last-child  { padding-bottom:8px; }

#navTop                                   { max-height:0px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;
                                                            -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }
#navTop.active                            { max-height:900px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;
                                                              -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }
#navTop li.firstli ul.secondul            { max-height:0px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;
                                                            -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }
#navTop li.firstli.active ul.secondul     { max-height:400px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;
                                                              -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }
#navTop li.firstli.activehold ul.secondul { max-height:400px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;
                                                              -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }

}


/* ======================================================================================================================================= */
/* ========================================      Viewport kleiner 580 Pixel - Smartphone klein     ======================================= */
/* ======================================================================================================================================= */

@media screen and (max-width:580px) {
.smarhide { display:none;  }
.porthide {  }
.landhide {  }
.deskhide {  }

.window { height:420px; }

#frameHeader,
#clear,
#header            { height:90px; }
#navSocial         { right:8px; top:6px; }
#navIcon           { right:11px; top:47px; width:42px; height:38px; cursor:pointer; z-index:6; cursor:pointer; }
#navIcon .lineUp   { left:0; top:6px; width:42px; height:7px; border-bottom:4px solid #4b565b; border-top:4px solid #4b565b; }
#navIcon .lineDown { left:0; top:28px; width:42px; height:0px; border-top:4px solid #4b565b; }
#logo              { left:0; top:49px; width:100%; max-width:434px; box-sizing:border-box; padding:0 110px 0 18px;
                     -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); }
#frameNavTop       { top:94px; margin:0; padding:0; height:0; }
 
#navIcon.active           { right:11px; top:45px; width:38px; }
#navIcon.active .lineUp   { left:0px; top:18px; width:38px; height:0px; }
#navIcon.active .lineDown { left:0px; top:18px; width:38px; height:0px; }

.text .frame-half              { float:none; width:100%; margin:0; }
.text .frame-half+.frame-half  { float:none; width:100%; margin:0; }
.text .frame-extra             { float:none; width:100%; margin:0; }
.text .frame-extra+.frame-half { float:none; width:100%; margin:0; }

.text h1 { padding:0 0 24px; font-size:28px; line-height:36px; font-weight:300; }
.text h2 { padding:0 0 24px; font-size:28px; line-height:36px; font-weight:300; }
.text h3 { padding:0 0 12px; font-size:22px; line-height:28px; font-weight:300; }

.text .quote          { padding:0 0 4px; margin:0; font-size:22px; line-height:28px; font-weight:300; }
.text .name-of-person { padding:0 0 4px; margin:0; font-size:18px; line-height:24px; font-weight:300; }
 
}


/* ======================================================================================================================================= */
/* ========================================       Viewport größer 580 Pixel - Tablet Portrait    ======================================= */
/* ======================================================================================================================================= */

@media screen and (min-width:581px) and (max-width:758px) {
.smarhide {  }
.porthide { display:none; }
.landhide {  }
.deskhide {  }

.window { height:420px; }

#frameHeader,
#clear,
#header            { height:90px; }
#navSocial         { right:22px; top:6px; }
#navIcon           { right:25px; top:47px; width:42px; height:38px; cursor:pointer; z-index:6; cursor:pointer; }
#navIcon .lineUp   { left:0; top:6px; width:42px; height:7px; border-bottom:4px solid #4b565b; border-top:4px solid #4b565b; -webkit-transition: all 0.2s ease-out;
                     -moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }
#navIcon .lineDown { left:0; top:28px; width:42px; height:0px; border-top:4px solid #4b565b; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; 
                     -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }

#logo              { left:50%; top:13px; max-width:306px; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transform:translateX(-50%); }
#frameNavTop       { top:94px; margin:0; padding:0; height:0; }
 
#navIcon.active           { right:25px; top:45px; width:38px; }
#navIcon.active .lineUp   { left:0px; top:18px; width:38px; height:0px; }
#navIcon.active .lineDown { left:0px; top:18px; width:38px; height:0px; }

.text .frame-half              { float:none; width:100%; margin:0; }
.text .frame-half+.frame-half  { float:none; width:100%; margin:0; }
.text .frame-extra             { float:none; width:100%; margin:0; }
.text .frame-extra+.frame-half { float:none; width:100%; margin:0; }

.text h1 { padding:0 0 24px; font-size:32px; line-height:40px; font-weight:300; }
.text h2 { padding:0 0 24px; font-size:32px; line-height:40px; font-weight:300; }
.text h3 { padding:0 0 12px; font-size:22px; line-height:28px; font-weight:300; }

.text .quote          { padding:0 0 4px; margin:0; font-size:24px; line-height:30px; font-weight:300; }
.text .name-of-person { padding:0 0 4px; margin:0; font-size:18px; line-height:24px; font-weight:300; }
 
}


/* ======================================================================================================================================= */
/* ========================================       Viewport größer 758 Pixel - Tablet Portrait      ======================================= */
/* ======================================================================================================================================= */

@media screen and (min-width:759px) and (max-width:1000px) {
.smarhide {  }
.porthide { display:none; }
.landhide {  }
.deskhide {  }

.window { height:510px; }

#frameHeader,
#clear,
#header      { height:90px; }
#navSocial   { right:90px; top:26px; }
#logo        { left:50%; top:13px; max-width:306px; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transform:translateX(-50%); }
#frameNavTop { top:94px; margin:0; padding:0; height:0; }

.text .frame-half              { float:none; width:100%; margin:0; }
.text .frame-half+.frame-half  { float:none; width:100%; margin:0; }
.text .frame-extra             { float:none; width:100%; margin:0; }
.text .frame-extra+.frame-half { float:none; width:100%; margin:0; }

.text h1 { padding:0 0 24px; font-size:36px; line-height:44px; font-weight:300; }
.text h2 { padding:0 0 24px; font-size:36px; line-height:44px; font-weight:300; }
.text h3 { padding:0 0 12px; font-size:26px; line-height:32px; font-weight:300; }

}


/* ======================================================================================================================================= */
/* =======================================       Viewport größer 1000 Pixel - Tablet Landscape       ===================================== */
/* ======================================================================================================================================= */

@media screen and (min-width:1001px) and (max-width:1260px) {
.smarhide {  }
.porthide {  }
.landhide { display:none; }
.deskhide {  }

.window { height:360px; }

#frameHeader,
#clear,
#header      { height:90px; }
#frameNavTop { top:32px; padding:0 110px 0 40.00%; }
#navSocial   { right:30px; top:26px; }
#logo        { left:25px; top:16px; max-width:306px; }

#navTop li.firstli                  { padding:0; margin:0 10px 0; height:25px; }
#navTop li.firstli span.f .underlf,
#navTop li.firstli a.f .underlf     { font-size:16px; font-weight:400; line-height:25px; letter-spacing:1px; }
#navTop li.secondli a.s .underls    { font-size:15px; font-weight:300; line-height:26px; letter-spacing:1px; }

}

/* ======================================================================================================================================= */
/* ==========================================       Viewport größer 1260 Pixel - Desktop       =========================================== */
/* ======================================================================================================================================= */

@media screen and (min-width:1261px) and (max-width:1420px) {
.smarhide {  }
.porthide {  }
.landhide {  }
.deskhide { display:none; }

.window { height:360px; }
 
}

/* ======================================================================================================================================= */
/* ==========================================       Viewport größer 1420 Pixel - Desktop       =========================================== */
/* ======================================================================================================================================= */

@media screen and (min-width:1421px) and (max-width:1640px) {
.smarhide {  }
.porthide {  }
.landhide {  }
.deskhide { display:none; }

.window { height:420px; }
 
}

/* ======================================================================================================================================= */
/* ==========================================       Viewport größer 1640 Pixel - Desktop       =========================================== */
/* ======================================================================================================================================= */

@media screen and (min-width:1641px) and (max-width:1900px) {
.smarhide {  }
.porthide {  }
.landhide {  }
.deskhide { display:none; }

.window { height:500px; }
 
.upButton { right:-20px; }
 
}

/* ======================================================================================================================================= */
/* ==========================================       Viewport größer 1900 Pixel - Desktop       =========================================== */
/* ======================================================================================================================================= */

@media screen and (min-width:1901px) {
.smarhide {  }
.porthide {  }
.landhide {  }
.deskhide { display:none; }
 
.upButton { right:-20px; }
 
}