@import "fonts.css";


/* ············································································· */


/* #76c9d6; /* türkis */ /*118,201,214*/
/* #69b1bd; /* dunkeltürkis */ /* Für Schrift */
/* #5c5261; /* lila */
/* #4e4852; /* dunkellila-1 */
/* #342f37; /* dunkellila-2 */
/* #b39e97; /* hellbraun */
/* #dd3030; /* Sale-Rot */


/* ············································································· */


/*
* {
    border: 1px solid blue;
}
*/

/* Screenshots */
/*::-webkit-scrollbar {
    display: none;
}*/

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
}

body {
    font: 300 1em/1.5 'Roboto Condensed', 'Roboto', Tahoma, Verdana, Arial, Helvetica, sans-serif;
    color: #444;
    background-color: white;

    /* Sticky Footer */
    /*display: flex;
    flex-direction: column;
    min-height: 100%;*/
}

*,
*:after,
*:before {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.clearfix:before,
.clearfix:after {
    content: '';
    display: table;
}

.clearfix:after {
    clear: both;
}

a,
a:visited {
    outline: none; /* Sorry */
    /* wrap long urls */
    white-space: pre;           /* CSS 2.0 */
    white-space: pre-wrap;      /* CSS 2.1 */
    white-space: pre-line;      /* CSS 3.0 */
    white-space: -pre-wrap;     /* Opera 4-6 */
    white-space: -o-pre-wrap;   /* Opera 7 */
    white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -hp-pre-wrap;  /* HP Printers */
    word-wrap: break-word;      /* IE 5+ */
}

/*a[href^="http://"]/*:not([href*="example.com"])*//*:before,
a[href^="https://"]/*:not([href*="example.com"])*//*:before*/
a[rel~="external"]:before {
    font-family: 'FontAwesome';
    font-weight: 900;
    font-size: 0.8em;
    /*font-weight: 400;*/
    content: '\f08e'; /* fa-external-link */
    margin: 0 .3em 0 0;
}

/*
a:hover,
a:active {}
*/
a,
a:hover,
a:active,
a:visited,
header > section,
header > section > a > img,
#showhide > div,
.visual,
section.grid a img {
   -webkit-transition: all 250ms;
   -moz-transition:    all 250ms;
   -o-transition:      all 250ms;
   -ms-transition:     all 250ms;
    transition:        all 250ms;
    text-decoration: none;
}

strong {
    font-weight: 500;
}

ul, ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

h1, h2, h3, h4, h5, h6, p, ul, ol {
    margin: 0 0 1.3em 0;
    font-weight: 300;
    line-height: 1.5;
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
    hyphens: auto;
}

h1 {
    font: 400 1.5em/1 'Allerta Stencil', sans-serif;
    text-transform: uppercase;
    /*letter-spacing: 0.05em;*/
    /*color: rgba(0,0,0,0.6);*/
    /*color: black;*/
    color: #2c4144; /* 70% Schwarz auf Türkis */
    text-align: center;
    margin-bottom: 50px;
}

.hidden {
    display: none;
}

/* Spaltensatz */
.columns {
    /*column-width: 5em;
    column-gap: 1em;
    column-rule: thin solid silver;*/
   /*-moz-column-gap: 50px;
   -webkit-column-gap: 50px;
    column-gap: 50px;*/
   /*-webkit-column-count: 2; /* Chrome, Safari, Opera */
   /*-moz-column-count: 2; /* Firefox */
    /*column-count: 2;*/
   -webkit-columns: 2;
      -moz-columns: 2;
           columns: 2;
   -webkit-column-gap: 50px;
      -moz-column-gap: 50px;
           column-gap: 50px;

    /*text-align: justify;*/
}

/* ············································································· */

@media all and (max-width: 600px) {

    /* Spaltensatz */
    .columns {
       -webkit-columns: 1;
          -moz-columns: 1;
               columns: 1;
       -webkit-column-gap: 0;
          -moz-column-gap: 0;
               column-gap: 0;
    }
}

/* ============================================================================= */

header {
    width: 100%;
    display: flex;
    flex-direction: column;
    /*flex-flow: column;*/
    justify-content: center; /* space-between für gesamte Breite */

    background-color: rgba(44, 56, 67, 0.9);
}

header > section {
    margin: 50px auto 24px auto;
    padding: 0 calc(5% - 6px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* header > section > a {
    display: block;
} */

header > section > a > img {
    width: 100%;
    max-width: 319px;
    display: block;

    /* background-color: white; */
    /* border: 3px solid white; */
}

header > section > .language {
    display: flex;
    flex-direction: row-reverse; /* 'DE' zuerst */
    text-transform: uppercase;
}

header > section .language > li:not(:last-child) {
    margin-left: 10px;
}

header > section .language > li {
    /* border: 1px solid rgba(0,0,0,.2); */
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
}

header > section .language > li > a {
    color: #444444;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-size: 90%;
    text-align: center;
    /* background-color: rgba(44, 56, 67, 0.08); */
}

header > section .language > li.current-lang > a {
    font-weight: 400;
    color: white;
    /* background-color: #a79773; */
    background-color: #2c3843;
}

/* ············································································· */

@media all and (max-width: 600px) {

    header > section {
        display: none;
    }
}

/* ============================================================================= */

nav {
    /*position: relative;*/
    width: 100%;
    /*padding: 80px 10% 25px 10%;*/
    /*background: #99cfd8;*/
    /*box-shadow: 0 0 4px rgba(0,0,0,0.3);*/
    background-color: #2c3843;
}

.nav-flex {
    /* width: 100%; */
    display: flex;
    justify-content: center; /* space-between für gesamte Breite */
    /* max-width: 620px; */
    /* margin: 0 auto; */
}

nav ul {
    /*width: 100%;
    max-width: 720px;*/
    width: auto;
    /* margin: 0 auto; */
    margin-bottom: 0;
    padding: 0;
    display: flex;
    flex-flow: row wrap;
    justify-content: center; /* space-between für gesamte Breite */
    /*background: #99cfd8; /* Macht hier mehr Sinn: so bekommen alle ULs die gleiche Backgroundfarbe */
    background-color: #2c3843;
    /* border: 1px solid red; */
}

nav ul:last-child {
    justify-content: flex-end;
    /* margin-left: auto; */
}

nav li {
    position: relative;
}

nav ul:first-child a {
    display: block;
    height: 100%;
    margin: 0;
    padding: 1.2em 2em;
    /*font: normal 1em/1 'Allerta Stencil', serif;*/
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    /*color: black; /* Für türkisen BG */
    color: white;
}

nav ul a:hover {
    /*color: white;*/
    background: #86b6be;
}

nav li.current a {
    font-weight: 400;
    color: white;
    background: #86b6be;
}

/* Parent vom angewählten Submenü-Punkt */
nav li.parent {
    background-color: #86b6be;
}

/* Submenü */
nav ul li ul {
    /*min-width: 100%; /* <- 100% Breite des Parents */
    min-width: 15em;
    position: absolute;
    z-index: 1;
    /*background-color: #5c5261; /* lila */
    white-space: nowrap;
    display: none;
}

nav ul li:hover > ul {
    display: block;
}






nav .language {
    position: relative;
    top: -22px;
    background-color: transparent;
    display: flex;
    flex-direction: row-reverse; /* 'DE' zuerst */
    text-transform: uppercase;
}

nav .language > li:not(:last-child) {
    margin-left: 12px;
}

nav .language > li {
    margin: 0;
    padding: 0;
    border: 1.5px solid rgba(255,255,255,0.4);
    /* display: block; */
    width: 32px;
    height: 32px;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: white;
    background-color: #2c3843;
}

nav .language > li.current-lang {
    /* background-color: #2c3843; */
    background-color: #86b6be;
    border-color: white;
}

nav .language > li > a {
    color: #444;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
    /* width: 30px;
    height: 30px; */
    aspect-ratio: 1;
    border-radius: 50%;
    font-size: 90%;
    text-align: center;
    line-height: 1;
    letter-spacing: normal;
    font-weight: 300;
    /* background-color: #2c3843; */
}

nav .language > li > a:hover {
    color: white;
}

nav .language > li.current-lang > a {
    font-weight: 400;
    color: white;
    /* background-color: #a79773; */
}

/* ············································································· */

@media all and (max-width: 600px) {



}

/* ============================================================================= */

/*  Show/Hide Navigation */
#showhide {
    position: relative;
    z-index: 100;
    width: 100%;
    height: 4.5em;
    padding: 0;
    display: none;

    /* Für Text im Balken */
    /*height: 4.5em;
    font-size: 1.5em;
    line-height: 0;
    color: whitesmoke;
    text-align: center;
    padding: 2.5em 0 0 0;*/
}

#showhide > section {
    display: flex;
    /*flex-direction: row;
    justify-content: flex-end;*/
    align-items: stretch;
}

#showhide > section > a {
    flex: 1;
}

/* v2: 'Hamburger' farblich hinterlegt */
#showhide > section > div {
    cursor: pointer;
    /*position: absolute;
    top: 0;
    right: 0;*/
    width: 4.5em;
    height: 4.5em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: rgba(255,255,255,0.15);
}

#showhide span {
    display: block;
    width: 2em;
    height: 4px;
    background: rgba(255,255,255,0.5);
    margin-bottom: 7px;
}

#showhide span:last-of-type {
    margin-bottom: 0;
}

/* ············································································· */

@media all and (max-width: 600px) {

    nav {
        padding-top: 0;
        padding-bottom: 0;
    }

    nav > .nav-flex ul:first-child {
       -webkit-flex-flow: column;
        flex-flow: column;
        align-items: stretch;
        display: none;
    }



    nav .nav-flex {
        position: relative;
        /* width: auto; */
        /* display: flex; */
        flex-direction: column-reverse !important; /* 'DE' zuerst */
    }

    nav .language {
        position: absolute;
        z-index: 100;
        top: -52px;
        left: 6px;

    }
    nav .language > li:not(:last-child) {
        margin-left: 0; /* 6px */
    }

    nav .language > li,
    nav .language > li > a {
        /* background-color: #2c3843; */
        /* background-color: #86b6be; */
        background-color: transparent;
        /* border: 2px solid rgba(255,255,255,1); */
        /* border-width: 1px; */
        border: none;
    }

    nav .language > li > a {
        color: white;
    }

    nav .language > li.current-lang {
        /* background-color: #2c3843; */
        background-color: #86b6be;
    }


    nav ul a {
        padding: 1.5em 5%;
        border-top: 1px solid rgba(255,255,255,0.2);
    }

    /* Submenü */
    nav ul li ul {
        position: relative;
        display: block;
        min-width: 0; /* https://twitter.com/rogerjohansson/status/324947861148164096?lang=de */
    }

    /* Childs vom Parent einrücken */
      nav li.sub li a {
        padding-left: 4em;
    }

    #showhide {
        display: block;
        /*background: #6d6471; /* 10% Weiß auf Nav-BG-Farbe */
    }

}

/* ············································································· */

@media all and (max-width: 600px) {

    #showhide > section > a {
        margin-left: 4.5em; /* Logo zu zentrieren abzüglich des Hamburgers */
        background: url('../images/pa-pier.png') no-repeat center center / 60px; /* contain */
    }
}

/* ============================================================================= */

main {
    width: 100%;
    /*margin: 0 auto;*/
    /*flex: 1; /* Sticky Footer */
}

main a {
    font-weight: 400;
    color: #444;
    border-bottom: 2px dotted #51aca5;
}

main a:hover {
    color: #51aca5;
    border-bottom: 2px dotted #777;
}

body.home main a {
    color: white;
    padding: 0 0 0.1em 0;
    border-bottom: 2px dotted rgba(0,0,0,0.5);
}

body.home main a:hover {
    color: black;
    border-bottom: 2px solid whitesmoke;
}

main ul li {
    margin: 0 0 0.7em 0.6em;
}

main ul li:before {
    font-family: 'FontAwesome';
    font-weight: 900;
    content: '\f0da\00a0'; /* fa-caret-right + Leerzeichen */
    color: #69b1bd; /* dunkeltürkis */
    margin: 0 0 0.5em -0.6em;
}

main h2 {
    margin: 2em 0 1em 0;
    font-size: 1.3em;
    font-weight: 400;
    color: #51aca5;
}

main h3, main h4, main h5, main h6 {
    margin: 1em 0 0.5em 0;
    font-size: 1em;
    font-weight: 400;
}

/* ============================================================================= */

.visual {
    width: 100%;
    height: 350px;
    background: black url('../images/hamburg-66684.jpg') no-repeat center center / cover;
    /*background-color: black;*/
}

/* ············································································· */

@media all and (max-width: 800px) {

    .visual {
        height: 240px;
    }
}

/* ············································································· */

@media all and (max-width: 600px) {

    .visual {
        height: 180px;
    }
}

/* ············································································· */

@media all and (max-width: 480px) {

    .visual {
        height: 120px;
    }
}

/* ============================================================================= */

/* Struktur, um Inhalte zu zentrieren */
article > section {
    width: 100%;
    max-width: 1280px; /* 960px */
    margin: 0 auto;
    padding: 60px 5% 40px 5%;
    /*border: 1px solid red;*/
}

.cols-2 > section > section {
    display: flex;
    justify-content: flex-start; /* flex-start | space-between | space-around | space-evenly */
}
    .cols-2 > section > section > div {
        flex: 1;
    }

    .cols-2 > section > section > div:first-child {
        padding-right: 2.5%;
    }

    /* Bild links */
    article > section > section div:first-child img {
        width: 100%;
    }

    .cols-2 > section > section > div:last-child {
        padding-left: 2.5%;
    }

/* ----------------------------------------------- */

@media screen and (max-width: 480px) {

    .cols-2 > section > section {
        flex-flow: column;
        display: block; /* IE */
    }

    .cols-2 > section > section > div:first-child {
        padding-right: 0;
        margin-bottom: 3em;
    }

    .cols-2 > section > section > div:last-child {
        padding-left: 0;
        align-self: top;
    }

}

/* ············································································· */

/* Artikel-Darstellung */


.white {
    width: 100%;
    padding-bottom: 30px;
    background-color: #a79773; /* Farbe vom P-Logo */
}

.white > section > section {
    color: white;
}

h1.ornament:before {
    display: block;
    margin: 0 auto 40px auto;
    font-family: 'FontAwesome';
    font-weight: 900;
    font-size: 1em;
    content: '\f13d'; /* fa-external-link */
    color: #eee;
}

/* Darstellung Grafiken -> Startseite */
section.grid {
    width: 100%;
    margin: 0;
    /*display: flex;
    justify-content: space-between; /* flex-start | space-between | space-around | space-evenly */
    /*flex-flow: row wrap;
    align-items: stretch; /* center */

   -webkit-columns: 4;
      -moz-columns: 4;
           columns: 4;
   -webkit-column-gap: 10px;
      -moz-column-gap: 10px;
           column-gap: 10px;
}

/* ············································································· */

@media all and (max-width: 1024px) {

    /* Spaltensatz */
    section.grid {
       -webkit-columns: 3;
          -moz-columns: 3;
               columns: 3;
       /*-webkit-column-gap: 0;
          -moz-column-gap: 0;
               column-gap: 0;*/
    }
}

/* ············································································· */

@media all and (max-width: 768px) {

    /* Spaltensatz */
    section.grid {
       -webkit-columns: 2;
          -moz-columns: 2;
               columns: 2;
       /*-webkit-column-gap: 0;
          -moz-column-gap: 0;
               column-gap: 0;*/
    }
}

/* ············································································· */

@media all and (max-width: 480px) {

    /* Spaltensatz */
    section.grid {
       -webkit-columns: 1;
          -moz-columns: 1;
               columns: 1;
       /*-webkit-column-gap: 0;
          -moz-column-gap: 0;
               column-gap: 0;*/
    }
}

/* ············································································· */

section.grid figure {
    width: 100%; /* Ansonsten werden die Thumbnails nicht auf die responsive Größe skaliert */
    /*display: inline-block;*/
    line-height: 0;
    /*white-space: nowrap;*/
    margin: 0 0 5px 0;
    padding: 0;
    /*border: none;*/
}

section.grid figure a {
    width: 100%; /* Ansonsten werden die Thumbnails nicht auf die responsive Größe skaliert */
    /*margin: 0;
    padding: 0;*/
    display: inline-block;
    border: none;
}

section.grid figure a:hover {
    /*color: #172983;*/
    box-shadow: 0 0 7px 0 rgba(0,0,0,0.4);
    /*background-color: rgba(118,201,214,0.9); /* türkis */
    /*padding: 0.5em;*/
}

section.grid figure a img {
    width: 100%;
    float: left; /* 6-Pixel-Fix */
    border: 1px solid rgba(0,0,0,0.3);
}

section.grid figure a:hover img {
    border: 1px solid orange;
}

/* ============================================================================= */
/* Ende Darstellung Produkte-Auswahlseite */
/* ============================================================================= */

footer {
    position: relative;
    width: 100%;
    background: #2c3843;
}

footer > section {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    padding: 60px 5% 40px 5%;
    color: whitesmoke;
}

footer ul {
    display: -webkit-flex;
    display: flex;
    flex-flow: row wrap;
    justify-content: center; /* space-between */
}

footer ul li {
    color: grey;
    padding: 2em 0;
    text-align: center;
}

footer ul li:last-child {
    margin-left: 2em;
}

footer ul li:last-child strong {
    color: lightgrey;
}

footer > section ul li a,
footer > section ul li a:visited {
    margin: 0;
    padding: 0 2em;
    color: lightgrey;
    border-right: 2px solid #51aca5;
}

footer > section a {
    color: rgba(255,255,255,0.6);
}

footer > section a:hover,
footer > section ul li a:hover {
    color: white;
}

footer > section ul li.current a {
    color: white;
}

/* Nach den Icons immer Abstand nach rechts, außer dem letzten Icon */
footer > section a:not(:last-of-type) {
    margin-right: 0.5em;
}

/* ············································································· */

@media all and (max-width: 600px) {

    footer > section ul {
       -webkit-flex-flow: column;
        flex-flow: column;
        align-items: stretch; /* stretch = default */
    }

    /*footer > section div {
        flex: none;
        padding-bottom: 30px;
    }*/

    footer ul li {
        padding: 0;
    }

    footer section ul li:last-child {
        margin: 0 0 2em 0;
        padding: 1em 5%;
    }

    footer > section ul li a,
    footer > section ul li a:visited {
        width: 100%;
        display: block;
        padding: 1em 5%;
        border-right: none;
    }

    footer section ul li a:hover {
        background-color: rgba(255,255,255,0.3);
    }

}

/* ============================================================================= */

.gototop {
    position: fixed;
    display: none;
    width: 1em;
    height: 1.04em;
    z-index: 5000;
    margin: 0;
    bottom: 0;
    right: 0;
    padding: 0 0 0 0.2em;
    line-height: 0;
    font-size: 2.5em;
    color: white;
    background-color: rgba(0,0,0,0.7);
    border-top-left-radius: 0.15em;
}

.gototop:hover {
    background-color: #b39e97; /* hellbraun */
}

/* ============================================================================= */

form {
    width: 100%;
}

fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

legend {
    width: 100%;
    margin: 0 0 3em 0;
    padding: 0;
    font-weight: 400;
}

label {
    display: block;
    margin-bottom: 0.2em;
}

/*label:after {
    content: '\A';
    white-space: pre;
}*/

label em {
    font-style: normal;
    color: indianred;
    margin-left: 0.2em;
}

button, input:not([type="checkbox"]), textarea {

   -webkit-appearance: none;

    font: 300 1em/1.5 'Roboto Condensed', 'Roboto', Tahoma, Verdana, Arial, Helvetica, sans-serif;
    border: none;
    border-bottom: 2px solid rgba(0,0,0,0.2);
   -webkit-transition: all 250ms;
   -moz-transition:    all 250ms;
   -o-transition:      all 250ms;
   -ms-transition:     all 250ms;
    transition:        all 250ms;

    width: 100%;
    padding: 0.8em 1em;
    background: #f2f2f2;
    /*border-bottom: 2px solid gainsboro;*/
    margin-bottom: 2em;
}

/* Bestimmte Input-Fields mit Icons versehen */
label.icon {
    position: relative;
}

label.icon:after {
    position: absolute;
    z-index: 1;
    top: 2.6em;
    left: 1em;
    width: 2em;
    height: 2em;
    color: darkgray;
    /*background: rgba(0,0,0,0.1);*/
    font-family: 'FontAwesome';
    font-weight: 900;
}

label.icon.user:after {
    content: "\f007"; /* fa-user */
}

label.icon.lock:after {
    content: "\f023"; /* fa-lock */
}

label.icon.phone:after {
    content: "\f095"; /* fa-phone */
}

label.icon + input {
    padding-left: 2.5em;
}
/* Ende Bestimmte Input-Fields mit Icons versehen */

/*
input:required {
  border-color: #800000;
  border-width: 1px;
}

input:required:invalid {
  border-color: #C00000;
}
*/

textarea {
    height: 6em;
    min-height: 6em;
    resize: vertical; /* none|horizontal|vertical|both */
}

input:hover, textarea:hover {
    background: rgba(255,255,255,0.5);
}

input:focus, textarea:focus {
    background: rgba(255,255,255,1) !important;
    border-bottom: 2px solid #76c9d6; /* türkis */
    outline: none;
   -moz-box-shadow: inset 0px 0px 4px rgba(0,0,0,.2);
   -webkit-box-shadow: inset 0px 0px 4px rgba(0,0,0,.2);
    box-shadow: inset 0px 0px 4px rgba(0,0,0,.2);
}

button[type="submit"] {
    width: 50%;
    margin: 1em 0;
    padding: 1em 1em 1em 1em;
    float: right;
    font-size: 1em;
    color: #2c4144; /* Schriftfarbe */
    font-weight: 600;
    text-transform: uppercase;
    background: #b39e97; /* hellbraun */
    border: none;
}

button[type="submit"]:hover {
    background: #76c9d6; /* türkis */
    cursor: pointer;
}

/* ············································································· */


/* Checkbox styles */
/* Smart: https://codepen.io/valerypatorius/pen/oXGMGL/ */
input[type="checkbox"] {
    display: none;
}

input[type="checkbox"] + label {
    display: block;
    position: relative;
    padding-left: 30px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
    user-select: none;
}

input[type="checkbox"] + label:before {
    position: absolute;
    left: 0;
    top: 4px;
    content: '';
    cursor: pointer;
    display: block;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(0,0,0,0.35);
    border-radius: 3px;
   -webkit-transition: all .12s, border-color .08s;
    transition: all .12s, border-color .08s;
}

input[type="checkbox"]:checked + label:before {
    width: 10px;
    top: -1px;
    left: 5px;
    border: 3px solid yellowgreen;
    border-radius: 0;
    border-top-color: transparent;
    border-left-color: transparent;
   -webkit-transform: rotate(35deg);
    transform: rotate(35deg);
}

/* ============================================================================= */


/* https://www.daretothink.co.uk/stop-ios-styling-your-input-fields-and-buttons/ */
textarea,
input.text,
input[type="text"],
input[type="button"],
input[type="submit"],
.input-checkbox {
   -webkit-appearance: none;
    border-radius: 0;
}

/* ============================================================================= */


/* start vom sd-server */
/*
button[type="submit"]:hover:not(:disabled), input[type="button"]:hover:not(:disabled), input[type="submit"]:hover:not(:disabled) {
    color: #fff;
    background: #91cf24;
    cursor: pointer;
    -moz-box-shadow: 0px 0px 5px rgba(0,0,0,.3);
    -webkit-box-shadow: 0px 0px 5px #0000004d;
    box-shadow: 0px 0px 5px #0000004d;
}

textarea, input.text, input[type="text"], input[type="button"], input[type="submit"], .input-checkbox {
    -webkit-appearance: none;
    border-radius: 0;
}

button[type="submit"], input[type="button"], input[type="submit"] {
    width: 100%;
    margin: 4px 0 40px 0;
    padding: 16px;
    font-family: 'Questrial', sans-serif;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 0.06em;
    font-size: 15px;
    color: #2c4144; /* Schriftfarbe */
    /*background: #91cf24;
    border: none;
}
input:hover, textarea:hover {
    background-color: #fff;
}*/

button, input:not([type="checkbox"]), textarea {
    -webkit-appearance: none;
    font: 300 1em/1.5 'Roboto', Tahoma, Verdana, Arial, Helvetica, sans-serif;
        font-size: 1em;
        font-family: "Roboto", Tahoma, Verdana, Arial, Helvetica, sans-serif;
    border: none;
    border-bottom: 2px solid #0003;
    -webkit-transition: all 250ms;
    -moz-transition: all 250ms;
    -o-transition: all 250ms;
    -ms-transition: all 250ms;
    transition: all 250ms;
    width: 100%;
    padding: 12px 16px;
    background-color: #f2f2f2;
}

button[type="submit"], input[type="button"], input[type="submit"] {
    width: 100%;
    margin: 4px 0 40px 0;
    padding: 16px;
    font-family: 'Questrial', sans-serif;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 0.06em;
    font-size: 15px;
    color: #fff;
    background: #91cf24;
    border: none;
}

input[type="button"]:disabled, input[type="submit"]:disabled {
    cursor: not-allowed;
    background-color: #8080804d;
    color: #808080;
}

/* end vom sd-server */

/* Aus main.css eingefügt */
.hey-honey {
  display: none;
}

#delay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}

#delay #clamp {
  width: 100%;
  height: 100%;
  background-image: url('../images/tr_background_black.png');
  background-repeat: repeat;
  position: relative;
}

#delay #clamp #stop-delay {
  background: url('../images/icon-close.svg') center no-repeat;
  position: absolute;
  font-size: 1.3em;
  width: 1.3em;
  height: 1.3em;
  line-height: 100%;
  top: 20px; right: 20px;
  text-decoration: none !important;
  border: none !important;
  box-shadow: none;
  color: #3087cc;
}

#delay #clamp #loader {
  background: url('../images/ajax-loader.gif') center no-repeat;
  position: absolute;
  display: block;
  padding: 10px;
  width: 50%;
  height: 50%;
  max-height: 50px;
  overflow: auto;
  margin: auto;
  top: 0; left: 0; bottom: 0; right: 0;
}

#delay #delay-info {
  color: #3087cc;
  text-align: center;
  position: absolute;
  overflow: auto;
  margin: auto;
  top: 54%;
  left: 0;
  bottom: 0;
  right: 0;
}

/* Meldungen nach Verschicken von Formularen */
#msgs-wrapper {
    position: relative;
    margin-bottom: 2em;
    background-color: #5c5261; /* lila */
    border-left: 6px solid #76c9d6; /* türkis */
    padding: 1em 1.5em 1em 1em;
    font-size: 1.1em;
    color: white;
}

#msgs-wrapper:after {
    content: '';
    position: absolute;
    bottom: -16px;
    left: calc(50% - 32px);
    width: 0px;
    height: 0px;
    transform: rotate(360deg);
    border-style: solid;
    border-width: 16px 32px 0 32px;
}

#msgs-wrapper.error {
    background-color: crimson;
}

#msgs-wrapper.error:after {
    border-color: crimson transparent transparent transparent;
}

#msgs-wrapper.ok {
    background-color: #91cf24; /* Dunkleres Grün */
}

#msgs-wrapper.ok:after {
    /*border-color: #91cf24 transparent transparent transparent;*/
    border-color: transparent;
}

/* Fontawesome Icon */
#msgs-wrapper i {
    margin-right: 0.8em;
}

/* ············································································· */

    @media all and (max-width: 700px) {

        button[type="submit"] {
            width: 100%;
            float: left;
        }

    }

/* ============================================================================= */



/* ============================================================================= */


#googlemap {
    width: 100% !important;
    /*min-height: 100% !important;*/
    height: 300px;
}
/*
iframe[width] {
    width: 100% !important;
}

iframe[height] {
    min-height: 100% !important;
}
*/

/* ············································································· */

@media all and (max-width: 700px) {


}

/* ============================================================================= */

/* CKEditor-Styles */

img.align_left {
    float: left;
    width: 100%;
    max-width: 360px;
}

img.align_right {
    float: right;
    width: 100%;
    max-width: 360px;
}