﻿/*Theme: Arkeo Theme ver. 5.0
Description: Stylesheet for Wohnmobil Platzer Website.
Author: Dipl.-Ing. Dimitri Papadopoulos
Author URI: http://www.die-digitalexperten.de/  
*/
/*html * {
    background: rgba(255, 0, 0, .1);
    box-shadow: 0 0 0 1px red;
}
body, form, .aspNetHidden {
    background: transparent;
    box-shadow: none;
}*/
@font-face {
    font-family: 'robotobold';
    src: url('fonts/Roboto-Bold-webfont.eot');
    src: url('fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Bold-webfont.woff') format('woff'),
         url('fonts/Roboto-Bold-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Bold-webfont.svg#robotobold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotocondbold';
    src: url('fonts/RobotoCondensed-Bold-webfont.eot');
    src: url('fonts/RobotoCondensed-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/RobotoCondensed-Bold-webfont.woff') format('woff'),
         url('fonts/RobotoCondensed-Bold-webfont.ttf') format('truetype'),
         url('fonts/RobotoCondensed-Bold-webfont.svg#robotocondbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotomedium';
    src: url('fonts/Roboto-Medium-webfont.eot');
    src: url('fonts/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Medium-webfont.woff') format('woff'),
         url('fonts/Roboto-Medium-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Medium-webfont.svg#robotomedium') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotoregular';
    src: url('fonts/Roboto-Regular-webfont.eot');
    src: url('fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'opensansregular';
    src: url('fonts/OpenSans-Regular-webfont.eot');
    src: url('fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Regular-webfont.svg#opensansregular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'opensanssemibold';
    src: url('fonts/OpenSans-Semibold-webfont.eot');
    src: url('fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Semibold-webfont.woff') format('woff'),
         url('fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Semibold-webfont.svg#opensanssemibold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'opensanscondbold';
    src: url('fonts/OpenSans-CondBold-webfont.eot');
    src: url('fonts/OpenSans-CondBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-CondBold-webfont.woff') format('woff'),
         url('fonts/OpenSans-CondBold-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-CondBold-webfont.svg#opensanscondbold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'opensanscondlightitalic';
    src: url('fonts/OpenSans-CondLightItalic-webfont.eot');
    src: url('fonts/OpenSans-CondLightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-CondLightItalic-webfont.woff') format('woff'),
         url('fonts/OpenSans-CondLightItalic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-CondLightItalic-webfont.svg#opensanscondlightitalic') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'opensanscondlight';
    src: url('fonts/OpenSans-CondLight-webfont.eot');
    src: url('fonts/OpenSans-CondLight-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-CondLight-webfont.woff') format('woff'),
         url('fonts/OpenSans-CondLight-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-CondLight-webfont.svg#opensanscondlight') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'raleway-extralight';
    src: url('fonts/raleway-extralight-webfont.eot');
    src: url('fonts/raleway-extralight-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/raleway-extralight-webfont.woff') format('woff'),
         url('fonts/raleway-extralight-webfont.ttf') format('truetype'),
         url('fonts/raleway-extralight-webfont.svg#raleway-extralight') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'montserrat';
    src: url('fonts/mont/montserrat-v23-latin-regular.eot');
    src: url('fonts/mont/montserrat-v23-latin-regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/mont/montserrat-v23-latin-regular.woff') format('woff'),
         url('fonts/mont/montserrat-v23-latin-regular.ttf') format('truetype'),
         url('fonts/mont/montserrat-v23-latin-regular.svg#opensansregular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'fira_sans_condensedlight';
    src: url('fonts/fira/FiraSansCondensed-Light-webfontt.eot');
    src: url('fonts/fira/FiraSansCondensed-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/fira/FiraSansCondensed-Light-webfont.woff2') format('woff2'),
         url('fonts/fira/FiraSansCondensed-Light-webfont.woff') format('woff'),
         url('fonts/fira/FiraSansCondensed-Light-webfont.ttf') format('truetype'),
         url('fonts/fira/FiraSansCondensed-Light-webfont.svg#fira_sans_condensedlight') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'fira_sans_condensedregular';
    src: url('fonts/fira/FiraSansCondensed-Regular-webfont.eot');
    src: url('fonts/fira/FiraSansCondensed-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/fira/FiraSansCondensed-Regular-webfont.woff2') format('woff2'),
         url('fonts/fira/FiraSansCondensed-Regular-webfont.woff') format('woff'),
         url('fonts/fira/FiraSansCondensed-Regular-webfont.ttf') format('truetype'),
         url('fonts/fira/FiraSansCondensed-Regular-webfont.svg#fira_sans_condensedregular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'fira_sans_condensedsemibold';
    src: url('fonts/fira/FiraSansCondensed-SemiBold-webfont.eot');
    src: url('fonts/fira/FiraSansCondensed-SemiBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/fira/FiraSansCondensed-SemiBold-webfont.woff2') format('woff2'),
         url('fonts/fira/FiraSansCondensed-SemiBold-webfont.woff') format('woff'),
         url('fonts/fira/FiraSansCondensed-SemiBold-webfont.ttf') format('truetype'),
         url('fonts/fira/FiraSansCondensed-SemiBold-webfont.svg#fira_sans_condensedsemibold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'fira_sans_condensedbold';
    src: url('fonts/fira/FiraSansCondensed-Bold-webfont.eot');
    src: url('fonts/fira/FiraSansCondensed-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/fira/FiraSansCondensed-Bold-webfont.woff2') format('woff2'),
         url('fonts/fira/FiraSansCondensed-Bold-webfont.woff') format('woff'),
         url('fonts/fira/FiraSansCondensed-Bold-webfont.ttf') format('truetype'),
         url('fonts/fira/FiraSansCondensed-Bold-webfont.svg#fira_sans_condensedbold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}




/* Variable fonts usage:
:root { font-family: "Inter", sans-serif; }
@supports (font-variation-settings: normal) {
  :root { font-family: "InterVariable", sans-serif; font-optical-sizing: auto; }
} */
@font-face {
  font-family: InterVariable;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("fonts/Inter/web/InterVariable.woff2") format("woff2");
}
@font-face {
  font-family: InterVariable;
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("fonts/Inter/web/InterVariable-Italic.woff2") format("woff2");
}

/* static fonts */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100; font-display: swap; src: url("fonts/Inter/web/Inter-Thin.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 100; font-display: swap; src: url("fonts/Inter/web/Inter-ThinItalic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 200; font-display: swap; src: url("fonts/Inter/web/Inter-ExtraLight.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 200; font-display: swap; src: url("fonts/Inter/web/Inter-ExtraLightItalic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 300; font-display: swap; src: url("fonts/Inter/web/Inter-Light.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 300; font-display: swap; src: url("fonts/Inter/web/Inter-LightItalic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/Inter/web/Inter-Regular.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 400; font-display: swap; src: url("fonts/Inter/web/Inter-Italic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/Inter/web/Inter-Medium.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 500; font-display: swap; src: url("fonts/Inter/web/Inter-MediumItalic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/Inter/web/Inter-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 600; font-display: swap; src: url("fonts/Inter/web/Inter-SemiBoldItalic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/Inter/web/Inter-Bold.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 700; font-display: swap; src: url("fonts/Inter/web/Inter-BoldItalic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 800; font-display: swap; src: url("fonts/Inter/web/Inter-ExtraBold.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 800; font-display: swap; src: url("fonts/Inter/web/Inter-ExtraBoldItalic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 900; font-display: swap; src: url("fonts/Inter/web/Inter-Black.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 900; font-display: swap; src: url("fonts/Inter/web/Inter-BlackItalic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 100; font-display: swap; src: url("fonts/Inter/web/InterDisplay-Thin.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 100; font-display: swap; src: url("fonts/Inter/web/InterDisplay-ThinItalic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 200; font-display: swap; src: url("fonts/Inter/web/InterDisplay-ExtraLight.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 200; font-display: swap; src: url("fonts/Inter/web/InterDisplay-ExtraLightItalic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 300; font-display: swap; src: url("fonts/Inter/web/InterDisplay-Light.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 300; font-display: swap; src: url("fonts/Inter/web/InterDisplay-LightItalic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/Inter/web/InterDisplay-Regular.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 400; font-display: swap; src: url("fonts/Inter/web/InterDisplay-Italic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/Inter/web/InterDisplay-Medium.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 500; font-display: swap; src: url("fonts/Inter/web/InterDisplay-MediumItalic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/Inter/web/InterDisplay-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 600; font-display: swap; src: url("fonts/Inter/web/InterDisplay-SemiBoldItalic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/Inter/web/InterDisplay-Bold.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 700; font-display: swap; src: url("fonts/Inter/web/InterDisplay-BoldItalic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 800; font-display: swap; src: url("fonts/Inter/web/InterDisplay-ExtraBold.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 800; font-display: swap; src: url("fonts/Inter/web/InterDisplay-ExtraBoldItalic.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: normal; font-weight: 900; font-display: swap; src: url("fonts/Inter/web/InterDisplay-Black.woff2") format("woff2"); }
@font-face { font-family: "InterDisplay"; font-style: italic; font-weight: 900; font-display: swap; src: url("fonts/Inter/web/InterDisplay-BlackItalic.woff2") format("woff2"); }

@font-feature-values InterVariable {
    @character-variant {
        cv01: 1; cv02: 2; cv03: 3; cv04: 4; cv05: 5; cv06: 6; cv07: 7; cv08: 8;
        cv09: 9; cv10: 10; cv11: 11; cv12: 12; cv13: 13;
        alt-1:            1; /* Alternate one */
        alt-3:            9; /* Flat-top three */
        open-4:           2; /* Open four */
        open-6:           3; /* Open six */
        open-9:           4; /* Open nine */
        lc-l-with-tail:   5; /* Lower-case L with tail */
        simplified-u:     6; /* Simplified u */
        alt-double-s:     7; /* Alternate German double s */
        uc-i-with-serif:  8; /* Upper-case i with serif */
        uc-g-with-spur:  10; /* Capital G with spur */
        single-story-a:  11; /* Single-story a */
        compact-lc-f:    12; /* Compact f */
        compact-lc-t:    13; /* Compact t */
    }
    @styleset {
        ss01: 1; ss02: 2; ss03: 3; ss04: 4; ss05: 5; ss06: 6; ss07: 7; ss08: 8;
        open-digits: 1;                /* Open digits */
        disambiguation: 2;             /* Disambiguation (with zero) */
        disambiguation-except-zero: 4; /* Disambiguation (no zero) */
        round-quotes-and-commas: 3;    /* Round quotes &amp; commas */
        square-punctuation: 7;         /* Square punctuation */
        square-quotes: 8;              /* Square quotes */
        circled-characters: 5;         /* Circled characters */
        squared-characters: 6;         /* Squared characters */
    }
}
@font-feature-values Inter {
    @character-variant {
        cv01: 1; cv02: 2; cv03: 3; cv04: 4; cv05: 5; cv06: 6; cv07: 7; cv08: 8;
        cv09: 9; cv10: 10; cv11: 11; cv12: 12; cv13: 13;
        alt-1:            1; /* Alternate one */
        alt-3:            9; /* Flat-top three */
        open-4:           2; /* Open four */
        open-6:           3; /* Open six */
        open-9:           4; /* Open nine */
        lc-l-with-tail:   5; /* Lower-case L with tail */
        simplified-u:     6; /* Simplified u */
        alt-double-s:     7; /* Alternate German double s */
        uc-i-with-serif:  8; /* Upper-case i with serif */
        uc-g-with-spur:  10; /* Capital G with spur */
        single-story-a:  11; /* Single-story a */
        compact-lc-f:    12; /* Compact f */
        compact-lc-t:    13; /* Compact t */
    }
    @styleset {
        ss01: 1; ss02: 2; ss03: 3; ss04: 4; ss05: 5; ss06: 6; ss07: 7; ss08: 8;
        open-digits: 1;                /* Open digits */
        disambiguation: 2;             /* Disambiguation (with zero) */
        disambiguation-except-zero: 4; /* Disambiguation (no zero) */
        round-quotes-and-commas: 3;    /* Round quotes &amp; commas */
        square-punctuation: 7;         /* Square punctuation */
        square-quotes: 8;              /* Square quotes */
        circled-characters: 5;         /* Circled characters */
        squared-characters: 6;         /* Squared characters */
    }
}
@font-feature-values InterDisplay {
    @character-variant {
        cv01: 1; cv02: 2; cv03: 3; cv04: 4; cv05: 5; cv06: 6; cv07: 7; cv08: 8;
        cv09: 9; cv10: 10; cv11: 11; cv12: 12; cv13: 13;
        alt-1:            1; /* Alternate one */
        alt-3:            9; /* Flat-top three */
        open-4:           2; /* Open four */
        open-6:           3; /* Open six */
        open-9:           4; /* Open nine */
        lc-l-with-tail:   5; /* Lower-case L with tail */
        simplified-u:     6; /* Simplified u */
        alt-double-s:     7; /* Alternate German double s */
        uc-i-with-serif:  8; /* Upper-case i with serif */
        uc-g-with-spur:  10; /* Capital G with spur */
        single-story-a:  11; /* Single-story a */
        compact-lc-f:    12; /* Compact f */
        compact-lc-t:    13; /* Compact t */
    }
    @styleset {
        ss01: 1; ss02: 2; ss03: 3; ss04: 4; ss05: 5; ss06: 6; ss07: 7; ss08: 8;
        open-digits: 1;                /* Open digits */
        disambiguation: 2;             /* Disambiguation (with zero) */
        disambiguation-except-zero: 4; /* Disambiguation (no zero) */
        round-quotes-and-commas: 3;    /* Round quotes &amp; commas */
        square-punctuation: 7;         /* Square punctuation */
        square-quotes: 8;              /* Square quotes */
        circled-characters: 5;         /* Circled characters */
        squared-characters: 6;         /* Squared characters */
    }
}

:root {
    --color-white: #fff;
    --color-grey-100: #fafafa;
    --color-grey-150: #fdfdfd;
    --color-grey-200: #f4f4f4;
    --color-grey-250: #efeff4;
    --color-grey-300: #dcdcdc;
    --color-grey-400: #949494;
    --color-grey-500: #666;
    --color-grey-550: #333;
    --color-grey-600: #181818;
    --color-black: #000;
    --main-text-color: hsl(0, 0%, 21%);

    --color-white: #fff;
    --color-grey-100: #fafafa;
    --color-grey-150: #fdfdfd;
    --color-grey-200: #f4f4f4;
    --color-grey-250: #efeff4;
    --color-grey-300: #dcdcdc;
    --color-grey-400: #949494;
    --color-grey-500: #666;
    --color-grey-550: #333;
    --color-grey-600: #181818;
    --color-black: #000;
    --main-text-color: hsl(0, 0%, 15%);
    --main-blue: hsl(202, 90%, 46%);
    --form-grey-txt: hsla(216, 33%, 50%, 20%);
    --form-grey-txt-d: hsl(224, 11%, 53%);
    --form-grey-bg: hsl(216, 33%, 97%);
    --form-grey-border-20: hsla(222, 21%, 10%, 20%);
    --form-grey-border: hsla(222, 100%, 10%, 10%);
    --form-blue-link: hsl(233, 100%, 9%);
    --footer-link: hsla(0, 0%, 7%, 60%);
    --banderole-bg-grey: hsl(0, 0%, 97%);

    --overlap: 180px;
}
html {
    -webkit-font-smoothing: antialiased;
    overflow-y: scroll;
}
*, :after, :before {
    box-sizing: border-box;
}
body {
    padding: 0; /*remove padding */
    margin: 0; /* remove margins */
    border: 0; /* remove borders */
    color: var(--main-text-color);
    font: 125%/1.5 "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
@media only screen and (max-width: 759px) {
    body {
        font: 93%/1.5 "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    }
}
#header {
    min-height: 200px;
    padding-top: 0.1em;
    margin: 0 auto;
    background-color: hsl(202, 95%, 96%);
}
#header:after, #header:before {
        content: " ";
        display: table;
}
.headerimg {
    max-width: 100%; 
    height: auto;
}
#pagecontent, #frontcontent {
    margin: 0 auto; 
    padding: 0; 
    /*max-width: 1600px;*/ 
    text-align: left;
    clear: both;
    /*font-size: 1.05rem;*/
}
.clear {
    clear: both;
}
.slidermsg-container {
    position: relative;
    min-height: 450px;
    display: block;
    border-radius: 3px;
    background-image: 
                linear-gradient(
                    205deg, 
                    hsla(202, 90%, 92%, 0.9),
                    hsla(202, 90%, 92%, 0.1) 60%
                ), url('images/fotos/IMG-20251225-WA0003_s.webp');
    background-size: cover;
    background-repeat: no-repeat;
}
.slidermsg2-container {
    position: relative;
    min-height: 450px;
    display: block;
    border-radius: 3px;
    background-image: 
                linear-gradient(
                    205deg, 
                    hsla(202, 90%, 92%, 0.9),
                    hsla(202, 90%, 92%, 0.1) 60%
                ), url('images/fotos/t338_ansicht.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position-y: center;
}
#footerbanner-container {
    clear: both;
    margin: 0em;
    padding: 20px 20px 40px 20px;
    width: 100%;
    color: var(--color-white);
    text-align: left;
    min-height: 230px;
    background: var(--vib-red) url('images/emblem_vib.svg') no-repeat center right;
    background-size: 350px 314px;
}
#footerbanner-container h3 { color: var(--color-white); }
.footerbanner {
    margin: 0 auto;
    width: 80%;
    min-height: 340px;
    align-content: center;
}
.icongrid-30a, .icongrid-30 {
    margin: 0.6em 0em;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    justify-items: start;
    gap: 1rem;
}
.icongrid-30 {
    color: var(--main-text-color);
}
.icongrid-30a {
    color: var(--color-white);
}
.pgrid-container {
    margin: 0px auto;
    padding: 0.3em 0em 0.3em 0em;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    justify-items: start;
    gap: 1rem;
    max-width: 780px;
}
.pgrid-header {
  background-color: #04AA6D;
  color: white;
  padding: 20px;
  text-align: center;
  background-color: var(--main-blue);
}
.pgrid-container > div {
  padding: 8px;
  text-align: center;
}
.pgrid-container + .pgrid-container { border-top: 1px solid #ccc; }
footer, #footer-container {
    clear: both;
    margin: 0em;
    padding: 40px 20px 40px 20px;
    width: 100%;
    color: #212121;
    text-align: left;
    font-size: 0.9rem;
    border-top: 1px solid #DEDEDE;
}
.footerhl {
     font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
     font-weight: 700;
     font-size: 1.5em; margin: 0.6em 0em 0.3em 0em; 
     text-align: left;
     color: #212121;
 }
 #footer-container a, #footer a:link, #footer a:link, #footer a:active {
    text-decoration: none;
    color: var(--footer-link);
}
#footer-container a:hover, #footerfront a:hover {
    text-decoration: none;
    color: var(--footer-link);
}
#footer-container ul {margin:0; padding:0; list-style:none; white-space:nowrap; text-align:left;}
#footer-container ul {*display:inline;}
#footer-container li {
    margin: 12px 0px;
    list-style: none;
    padding: 0px;
    background: none;
}
.dlogo { display:block; }
.mlogo { display: none; }
.cline {position: absolute; bottom: 4.5rem; left: 8rem; color: var(--color-white);
        display: grid;
        grid-template-rows: 32px auto 30px;
        gap: 1.2rem;
}
.clinetxt {
    font-size: 3rem;
    font-family: 'opensanssemibold';
    font-weight: 500;
    line-height: 1.35;
    padding: 0;
    text-shadow: 2px 2px hsl(209, 100%, 24%);
}
.cline540 { max-width: 540px; }
table {
    border-collapse: collapse;
    border-spacing: 0;
}
.responsive {
    height: auto;
    width: 100%;
}
.responsive-video {
    max-width: 100%; 
    height: auto;
    position: relative;
}
.responsive-video video {
    width: 100%;
	height: 100%;
}
/** Arkeo Content Start **/
h1, h2, h3, h4, h5, h6 {font-family: "fira_sans_condensedlight", system-ui, -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 500; color: var(--main-text-color); }
h1 { font-size: 2.3em; margin: 0.6em 0 0.3em; }
h2 { font-size: 2em; margin: 0.6em 0 0.1em; }
h3 { font-size: 1.5em; margin: 0.6em 0 0.1em; }
h4 { font-size: 1.17em; margin: 0.6em 0 0.1em; }
h5 { font-size: 1.12em; margin: 0.6em 0 0.1em; }
h6 { font-size: .83em; margin: 0.6em 0 0.1em; }
a:link, a:visited {
    color: hsl(209, 100%, 54%);
    text-decoration: none;
}
a:hover,a {
    color:hsl(209, 100%, 64%);
    text-decoration: underline;
}
strong, b {
    font-weight: 700;
}
.hint {
    font-size: 0.8em;
}
.ql-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    /*overflow-x: auto;*/
    margin: 2em 0em;
    padding: 20px 20px 20px 20px;
    width: 100%;
    color: #212121;
    text-align: left;
    font-size: 1.2rem;
    border-radius: 35px 35px 35px 35px;
    background-color: var(--form-grey-bg);
    justify-content: space-between;
}
.ql-container a { color: var(--main-text-color); }
.qltm {
    margin: 12px 0px 6px 0px;
}

.ql-item {
    /*width: 320px;
    height: 236px;*/
    flex-shrink: 0;
    width: 19%;
    aspect-ratio: 1/1;
    /*margin: 0em 1.6em 1.6em 0em;*/
    margin: 0 auto;
    padding: 0.2em;
    /*display: flex;*/
    align-items: center;
    justify-content: center;
    flex-direction: column;
    align-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    text-align: center;
}
.ql:hover {
    background-color: hsl(358, 79%, 97%);
    cursor: pointer;
}
.ql-item + .ql-item {
    border-left: solid 1px var(--form-grey-border-20);
}
@media only screen and (max-width: 599px) {
    #header {
        min-height: 152px;
    }
    .cn-content { padding: 0px 20px 0px 20px; }
    .dlogo {
        display: none;
    }
    .mlogo {
        display: block;
        position: absolute;
        top: 10px;
        left: 20px;
    }
    .slidermsg-container {
        position: relative;
        min-height: 450px;
        display: block;
        border-radius: 3px;
        background-image: 
                    linear-gradient(
                        205deg, 
                        hsla(202, 90%, 92%, 0.9),
                        hsla(202, 90%, 92%, 0.1) 60%
                    ), url('images/fotos/slider_front.jpg');
        background-size: cover;
        background-repeat: no-repeat;
    }
    .slidermsg2-container {
        position: relative;
        min-height: 450px;
        display: block;
        border-radius: 3px;
        background-image: linear-gradient( 205deg, hsla(202, 90%, 92%, 0.9), hsla(202, 90%, 92%, 0.1) 60% ), url('images/fotos/slider_fahrzeug.jpg');
        background-size: cover;
        background-repeat: no-repeat;
        background-position-y: center;
    }
    .cline {position: absolute; top: 3.5rem; left: 0.5rem; color: var(--color-white);
            display: grid;
            grid-template-rows: 32px auto 30px;
            gap: 1.2rem;
    }
    .clinetxt {
        font-size: 2rem;
        font-family: 'opensanssemibold';
        font-weight: 500;
        line-height: 1.35;
        padding: 0;
        text-shadow: 2px 2px hsl(209, 100%, 24%);
    }
    .cline540 { max-width: 100%; }

    .ql-container {
        flex-direction: column;
        align-items: center;
    }

    .ql-item {
        width: 80%;
        aspect-ratio: auto;
        margin: .6em;
    }
    .ql-item + .ql-item {
        border-left: none;
        border-top: solid 1px var(--form-grey-border-20);
    }
}
@media only screen and (min-width:1401px) and (max-width: 759px) {
    #header {
        min-height: 152px;
    }
    .cn-content { padding: 0px 20px 0px 20px; }
    .dlogo {
        display: none;
    }
    .mlogo {
        display: block;
        position: absolute;
        top: 10px;
        left: 20px;
    }
    .slidermsg-container {
        position: relative;
        min-height: 450px;
        display: block;
        border-radius: 3px;
        background-image: 
                    linear-gradient(
                        205deg, 
                        hsla(202, 90%, 92%, 0.9),
                        hsla(202, 90%, 92%, 0.1) 60%
                    ), url('images/fotos/IMG-20251225-WA0003_s.webp');
        background-size: cover;
        background-repeat: no-repeat;
    }

    .cline {position: absolute; bottom: 3.5rem; left: 0.5rem; color: var(--color-white);
            display: grid;
            grid-template-rows: 32px auto 30px;
            gap: 1.2rem;
    }
    .clinetxt {
        font-size: 2rem;
        font-family: 'opensanssemibold';
        font-weight: 500;
        line-height: 1.35;
        padding: 0;
        text-shadow: 2px 2px hsl(209, 100%, 24%);
    }
    .cline540 { max-width: 100%; }

    .ql-container {
        flex-direction: column;
        align-items: center;
    }

    .ql-item {
        width: 80%;
        aspect-ratio: auto;
        margin: .6em;
    }
    .ql-item + .ql-item {
        border-left: none;
        border-top: solid 1px var(--form-grey-border-20);
    }
}
@media screen and (min-width: 801px) {
    #pagecontent {
        min-height: 450px;
    }
    /* Grid Start */
    .row, .rowlv, .rowtariff {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
    }
    .column, .columnlv, .columntarifh, .columntarifhc, .columntarifhb, .columntarifb {
        flex: 1;
        -ms-flex: 1;
        -webkit-flex: 1;
    }
    .columntarifh, .columntarifhc, .columnavailh, .columnavailhc {
        margin: 2px;
        padding: 12px;
        font-size: 1.4em;
        color: var(--color-white);
        background-color: #3a4660;
    }
    .columntarifhc {
        max-width: 315px;
    }
    .columntarifhb {
        margin: 2px;
        padding: 12px;
        font-size: 1.2em;
        font-weight: 700;
        color: var(--color-white);
        background-color: #7F98D2;
        max-width: 315px;
    }
    .columntarifb {
        margin: 2px;
        padding: 12px;
        color: #009ADF;
        background-color: #7F98D2;
    }
    .dblue {
        font-size: 1em;
        color: var(--color-white);
        background-color: #3a4660;
        padding: 8px;
    }
    ._15 {
        flex: 1.5;
        -ms-flex: 1.5;
        -webkit-flex: 1.5;
    }
    ._2 {
        flex: 2;
        -ms-flex: 2;
        -webkit-flex: 2;
    }
    ._25 {
        flex: 2.5;
        -ms-flex: 2.5;
        -webkit-flex: 2.5;
    }
    ._3 {
        flex: 3.0;
        -ms-flex: 3.0;
        -webkit-flex: 3.0;
    }
    ._33 {
        flex: 3.33;
        -ms-flex: 3.33;
        -webkit-flex: 3.33;
    }
    ._4 {
        flex: 4.0;
        -ms-flex: 4.0;
        -webkit-flex: 4.0;
    }
    ._5 {
        flex: 5;
        -ms-flex: 5;
        -webkit-flex: 5;
    }
    ._6 {
        flex: 6;
        -ms-flex: 6;
        -webkit-flex: 6;
    }
    ._66 {
        flex: 6.6;
        -ms-flex: 6.6;
        -webkit-flex: 6.6;
    }
    ._7 {
        flex: 7;
        -ms-flex: 7;
        -webkit-flex: 7;
    }
    ._75 {
        flex: 7.5;
        -ms-flex: 7.5;
        -webkit-flex: 7.5;
    }
    ._8 {
        flex: 8;
        -ms-flex: 8;
        -webkit-flex: 8;
    }

    .borderbottom {
        border-bottom: 1px solid #7f98d2;
    }
    .borderbottom2 {
        border-bottom: 2px solid #f6f6f6;
    }
    .brdrbottom2p {
        border-bottom: 2px solid #f6f6f6;
        margin-bottom: 12px;
    }
    .borderbottomg {
        border-bottom: 1px solid #ccc;
    }
    .borderbottomb {
        border-bottom: 2px solid #2299D1
    }
    .bordertop {
        border-top: 1px solid #f6f6f6;
    }
    .borderright {
        border-right: 1px solid #808080;
    }
    .borderleft {
        border-left: 1px solid #808080;
    }
    .border {
        border: 1px solid #808080;
    }
    .tbvcenter {
        align-content: center;
    }
    .tbcenter, .tbcenter h1, .tbcenter h2, .tbcenter h3, .tbcenter h4, .tbcenter h5 .tbcenter h6, .tbcenter p {
        text-align: center;
    }
    .tbleft {
        text-align: left;
    }
    .tbright {
        text-align: right;
    }
    .center {
        text-align: center;
    }
    .right {
        text-align: right;
    }
    .resright {
        text-align: right;
    }
    .resleft {
        text-align: left;
    }
    .spacer2 .column, .spacer2 .columnlv {
        padding: 2px;
    }
    .spacer5 .column, .spacer5 .columnlv {
        padding: 5px;
    }
    .spacer50 .column, .spacer50 .columnlv {
        padding: 10px 5px 10px 5px;
    }
    .spacer012 .column {
        padding:  0px 12px 0px 12px;
    }
    .mspacer12 {
        margin: 5px 12px;
    }
    .mspacer120 {
        margin: 12px 0px 12px 0px;
    }
    .mspacer240 {
        margin: 24px 0px 24px 0px;
    }
    .spacer20 .column, .spacer20 .columnlv {
        padding: 20px;
    }
    .lblbrdrl {
        border-left: solid 1px var(--form-grey-border-20);
    }
    .ellipsis {
        display: inline-block;
        max-width: 100%;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .banderole-bg-grey {
        background-color: var(--banderole-bg-grey);
    }
}
@media screen and (min-width: 962px) {
    .arkeo-content-block[class*=cb-][class*="-left"] .cb-content {
        float: left;
    }

    .cn-content, .cs-content {
        margin: 0 auto;
        width: 90%;
    }

    .cn-contentall {
        margin: 0 auto;
        width: 80%;
    }
    .arkeo-content-block[class*=cb-50-50] .cb-content, .arkeo-content-block[class*=cb-50-50] .cb-media {
        float: left;
        width: 50%;
    }

    .arkeo-content-block[class*=cb-80-20] .cb-content {
        float: left;
        width: 80%;
    }

    .arkeo-content-block[class*=cb-80-20] .cb-media {
        float: left;
        width: 20%;
    }

    .arkeo-content-block[class*=cb-70-30] .cb-content {
        float: left;
        width: 70%;
    }

    .arkeo-content-block[class*=cb-70-30] .cb-media {
        float: left;
        width: 30%;
    }

    .arkeo-content-block[class*=cb-66-33] .cb-content {
        float: left;
        width: 70%;
    }

    .arkeo-content-block[class*=cb-66-33] .cb-media {
        float: left;
        width: 30%;
    }

        .arkeo-content-block[class*=cb-60-40] .cb-content {
        float: left;
        width: 60%;
    }

    .arkeo-content-block[class*=cb-60-40] .cb-media {
        float: left;
        width: 40%;
    }

    .arkeo-content-block[class*=cb-50-50] .cb-content, .arkeo-content-block[class*=cb-50-50] .cb-media, .arkeo-content-block[class*=cb-33-66-left] .cb-content,
    .arkeo-content-block[class*=cb-33-66-left] .cb-media, .arkeo-content-block[class*=cb-66-33-right] .cb-content, .arkeo-content-block[class*=cb-66-33-right] .cb-media,
    .arkeo-content-block[class*=cb-66-33-left] .cb-content, .arkeo-content-block[class*=cb-66-33-left] .cb-media, .arkeo-content-block[class*=cb-60-40-left] .cb-content, 
    .arkeo-content-block[class*=cb-60-40-left] .cb-media, .arkeo-content-block[class*=cb-33-66-right] .cb-content, .arkeo-content-block[class*=cb-33-66-right] .cb-media, 
    .arkeo-content-block[class*=cb-70-30-left] .cb-content, .arkeo-content-block[class*=cb-70-30-left] .cb-media {
        min-height: 1px;
        padding-left: 15px;
        padding-right: 15px;
        position: relative;
    }

    .clearfix:after, .clearfix:before, .container-fluid:after, .container-fluid:before, .container:after, .container:before, .dl-horizontal dd:after,
    .dl-horizontal dd:before, .modal-footer:after, .modal-footer:before, .nav:after, .nav:before, .navbar-collapse:after, .navbar-collapse:before,
    .navbar-header:after, .navbar-header:before, .navbar:after, .navbar:before, .pager:after, .pager:before, .panel-body:after, .panel-body:before, 
    .row:after, .row:before, .rowlv:after, .rowlv:before {
        content: " ";
        display: table;
    }
}
@media only screen and (min-width:1152px) and (max-width:1290px) {
    .stoererimg img {
      width: clamp(120px, 25vw, 360px);
    }
}

@media screen and (min-width: 1279px) and (max-width:1438px) {
    .cn-content, .cs-content {
        margin: 0 auto;
        width: 90%;
    }
}

@media screen and (min-width: 1439px) and (max-width:1540px)  {
    .cn-content, .cs-content {
        margin: 0 auto;
        width: 90%;
    }
}

@media screen and (min-width: 1540px) {
    .cn-content, .cs-content {
        margin: 0 auto;
        width: 80%;
    }
}



