:root {
    --brand-primary: #003A60;
}

/******************************************************************
Stylesheet: Button Styles
******************************************************************/
.clear {
    clear: both;
}

.blue-btn, #submit, .wpcf7-form-control.wpcf7-submit, .ksk-staff-list-search-form button {
    display: inline-block;
    position: relative;
    text-decoration: none;
    color: white;
    padding: 10px 24px;
    border: 0;
    cursor: pointer;
    background-color: #003A60;
    -webkit-transition: background-color 0.14s ease-in-out;
    transition: background-color 0.14s ease-in-out;
}

.blue-btn:hover, #submit:hover, .wpcf7-form-control.wpcf7-submit:hover,
.ksk-staff-list-search-form button:hover, .blue-btn:focus, #submit:focus,
.wpcf7-form-control.wpcf7-submit:focus, .ksk-staff-list-search-form button:focus {
    color: #fff;
    background-color: #306ea9;
    text-decoration: none;
}

.blue-btn:active, #submit:active {
    background-color: #306ea9;
}

a.blue-btn {
    color: white !important;
    font-weight: normal;
}

.blue-btn.half-btn {
    position: absolute;
    bottom: -22px;
}

.lightblue-btn {
    background-color: #306ea9;
    -webkit-transition: background-color 0.14s ease-in-out;
    transition: background-color 0.14s ease-in-out;
}

.blue-btn.lightblue-btn:hover,
.blue-btn.lightblue-btn:focus {
    color: #fff;
    background-color: #003A60;
    text-decoration: none;
}

.blue-btn.lightblue-btn:active {
    background-color: #003A60;
}

.blue-btn.half-btn.is-right {
    right: 1.5em;
}


/******************************************************************
Stylesheet: Base Mobile Stylesheet
******************************************************************/

/*********************
GENERAL STYLES
*********************/
body {
    font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 100%;
    line-height: 1.5;
    color: #575656;
    background-color: #fff;
    -webkit-font-smoothing: antialiased;
}

/********************
WORDPRESS BODY CLASSES
********************/
.berater-bg {
    clear: both;
    min-height: 250px;
    color: #fff;
    background: #003a60; /* Old browsers */
    background: -moz-linear-gradient(left, #003a60 0%, #306ea9 100%);
    background: -webkit-linear-gradient(left, #003a60 0%, #306ea9 100%);
    background: linear-gradient(to right, #003a60 0%, #306ea9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003a60', endColorstr='#306ea9', GradientType=1);
}

.berater-bg .ksk-staff-list-search span.ksk-staff-list-search-result ul li a {
    color: #fff;
}

.berater-content {
    background-color: #e3e3e3;
    color: #575656;
    padding: 0 1.5em;
    margin: 4em 0;
    position: relative;
}

.know-how--box1 {
    background-color: #e3e3e3;
    padding: 0.1em 1em;
    text-align: right;
    position: relative;
}

.know-how--box1 .blue-btn {
    font-weight: normal;
    color: white;
}

.know-how--box1 .blue-btn:hover {
    font-weight: normal;
    color: white;
}

.drop-shadow {
    -webkit-box-shadow: 2px 2px 15px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 2px 2px 15px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 2px 2px 15px 0px rgba(0, 0, 0, 0.2);
}

@media screen and (max-width: 1030px) {
    .mobile-m-bottom {
        margin-bottom: 40px;
    }
}

@media screen and (min-width: 1030px) {
    .desktop-m-top {
        margin-top: 60px;
    }

    .know-how--box1 .know-how--box1-zertifikat {
        position: absolute;
        left: 20px;
        top: -55px;
    }

    .know-how--box2 .know-how--box2-manuals {
        position: absolute;
        left: 35px;
        top: -40px;
    }
}

.know-how--box2 {
    background-color: #306ea9;
    color: #fff;
    padding: 0.1em 1em;
    text-align: right;
    position: relative;
    margin-top: 50px;
}

.know-how--box2 .blue-btn {
    font-weight: normal;
    color: white;
}

.know-how--box2 .blue-btn:hover {
    font-weight: normal;
    color: white;
}

.know-how--box2 h2 {
    color: #fff;
}

@media screen and (min-width: 1030px) {
    .product-item {
        min-height: 769px;
    }
}

.product-item {
    background-color: #575656;
    color: #fff;
    padding: 1em;
}

.product-item h3 {
    color: #fff;
}

.product-item img {
    width: 100%;
}

.termine-bg {
    background-color: #e3e3e3;
    color: #575656;
    border-top: 5px #003A60 solid;
    border-bottom: 5px #003A60 solid;
    padding-bottom: 2em;
}

.category-container {
    width: 100%;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
}

.category-container .item {
    margin-right: 2px;
    width: calc(100% * (1 / 4) - 5px - 1px);
    height: 216px;
    float: left;

    background-size: cover;
    position: relative;
}

.category-container .item.care {
    background: url(/wp-content/uploads/2017/12/cat-care.jpg) no-repeat;
}

.category-container .item.klinik {
    background: url(/wp-content/uploads/2017/12/cat-klinik.jpg) no-repeat;
}

.category-container .item.catering {
    background: url(/wp-content/uploads/2017/12/cat-catering.jpg) no-repeat;
}

.category-container .item.junior {
    background: url(/wp-content/uploads/2017/12/cat-junior.jpg) no-repeat;
}

.category-container .item h2 {
    position: absolute;
    bottom: 0;
    left: 20px;
    padding: 4px 15px;
    color: #fff;
    margin: 0;
    background: #003a60; /* Old browsers */
    background: -moz-linear-gradient(left, #003a60 0%, #306ea9 100%);
    background: -webkit-linear-gradient(left, #003a60 0%, #306ea9 100%);
    background: linear-gradient(to right, #003a60 0%, #306ea9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003a60', endColorstr='#306ea9', GradientType=1);
}

/*********************
LAYOUT & GRID STYLES
*********************/
.wrap {
    width: 96%;
    margin: 0 auto;
}

/*********************
LINK STYLES
*********************/
a, a:visited {
    color: #575656;
    font-weight: bold;
}

a:hover, a:focus, a:visited:hover, a:visited:focus {
    color: #003A60;
}

a:link, a:visited:link {
    /* this highlights links on iPhones/iPads. so it basically works like the :hover selector for mobile devices.*/
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
}

/******************************************************************
H1, H2, H3, H4, H5 STYLES
******************************************************************/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
    text-rendering: optimizelegibility;
    font-weight: 600;
    color: #003A60;
    font-family: 'DroidSerif-Regular';
}

h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a, h4 a, .h4 a, h5 a, .h5 a {
    text-decoration: none;
}

h1, .h1 {
    font-size: 2.2em;
    line-height: 1.333em;
}

h2, .h2 {
    font-size: 1.75em;
    line-height: 1.4em;
    margin-bottom: 0.375em;
}

h3, .h3 {
    font-size: 1.3em;
}

h4, .h4 {
    font-size: 1.1em;
    font-weight: 700;
}

h5, .h5 {
    font-size: 0.846em;
    line-height: 2.09em;
    text-transform: uppercase;
    letter-spacing: 2px;
}

/*********************
HEADER STYLES
*********************/
.header {
    background-color: #fff;
    padding-bottom: 1em;
    border-bottom: 6px #003A60 solid;
}

.logo {
    margin: 0.75em 0;
    width: 100%;
    max-width: 300px;
}

.header-top {
    padding: 0.5em 0;
    color: #fff;
    background: #003a60; /* Old browsers */
    background: -moz-linear-gradient(left, #003a60 0%, #306ea9 100%);
    background: -webkit-linear-gradient(left, #003a60 0%, #306ea9 100%);
    background: linear-gradient(to right, #003a60 0%, #306ea9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003a60', endColorstr='#306ea9', GradientType=1);
}

#hepta_internet_explorer_bar {
    padding: 0.5em 0;
    text-align: center;
    color: #fff;
    background: #878787; /* Old browsers */
}

.logo-subline {
    float: right;
    color: #003A60;
    font-size: 2.2rem;
    font-family: 'DroidSerif-Regular';
    margin-bottom: 0;
    margin-top: 31px;
}

div#n2-ss-13-align,
div#n2-ss-14-align,
div#n2-ss-15-align,
div#n2-ss-16-align,
div#n2-ss-17-align,
div#n2-ss-18-align,
div#n2-ss-19-align,
div#n2-ss-20-align,
{
    border-bottom: 6px #003A60 solid;
}

#n2-ss-13-placeholder,
#n2-ss-14-align, #n2-ss-14-placeholder,
#n2-ss-15-align, #n2-ss-15-placeholder,
#n2-ss-16-align, #n2-ss-16-placeholder,
#n2-ss-17-placeholder,
#n2-ss-18-align, #n2-ss-18-placeholder,
#n2-ss-19-align, #n2-ss-19-placeholder,
#n2-ss-20-align, #n2-ss-20-placeholder,
#n2-ss-23-placeholder,
#n2-ss-24-align, #n2-ss-24-placeholder,
#n2-ss-25-align, #n2-ss-25-placeholder,
#n2-ss-26-align, #n2-ss-26-placeholder {
    display: none;
}

@media only screen and (min-width: 481px) {
    #n2-ss-13-align, #n2-ss-17-align, #n2-ss-23-align {
        display: none;
    }
}

@media only screen and (min-width: 481px) and (max-width: 768px) {
    #n2-ss-14-align, #n2-ss-18-align, #n2-ss-24-align {
        display: block;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
    #n2-ss-15-align, #n2-ss-19-align, #n2-ss-25-align {
        display: block;
    }
}

@media only screen and (min-width: 1025px) {
    #n2-ss-16-align, #n2-ss-20-align, #n2-ss-26-align {
        display: block;
    }
}

/*********************
NAVIGATION STYLES
*********************/
.nav {
    border-bottom: 0;
    margin: 0;
    padding: 0;
}

.nav li a {
    display: block;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: normal;
}

.nav .sub-menu li a {
    text-transform: inherit;
    font-size: 12px;
}

.nav li a:hover, .nav li a:focus {
    color: #fff;
    text-decoration: underline;
}

/*********************
POSTS & CONTENT STYLES
*********************/
#content {
}

.hentry {
    background-color: #fff;
    margin-bottom: 1.5em;
}

.hentry header {
    border-bottom: 1px solid #f8f9fa;
    padding: 1.5em;
}

.hentry footer {
    padding: 1.5em;
    border-top: 1px solid #f8f9fa;
}

.hentry footer p {
    margin: 0;
}

.single-title,
.page-title,
.entry-title {
    margin: 0;
    margin-bottom: 10px;
}

.byline {
    color: #9fa6b4;
    font-style: italic;
    margin: 0;
}

/* entry content */
.entry-content {
    padding: 1.5em 1.5em 0;
}

.entry-content p {
    margin: 0 0 1.5em;
}

.entry-content table {
    width: 100%;
    border: 1px solid #eaedf2;
    margin-bottom: 1.5em;
}

.entry-content table caption {
    margin: 0 0 7px;
    font-size: 0.75em;
    color: #9fa6b4;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.entry-content tr {
    border-bottom: 1px solid #eaedf2;
}

.entry-content tr:nth-child(even) {
    background-color: #f8f9fa;
}

.entry-content td {
    padding: 7px;
    border-right: 1px solid #eaedf2;
}

.entry-content td:last-child {
    border-right: 0;
}

.entry-content th {
    background-color: #f8f9fa;
    border-bottom: 1px solid #eaedf2;
    border-right: 1px solid #eaedf2;
}

.entry-content th:last-child {
    border-right: 0;
}

.entry-content blockquote {
    margin: 0 0 1.5em 0.75em;
    padding: 0 0 0 0.75em;
    border-left: 3px solid #2980b9;
    font-style: italic;
    color: #9fa6b4;
}

.entry-content dd {
    margin-left: 0;
    font-size: 0.9em;
    color: #787878;
    margin-bottom: 1.5em;
}

.entry-content img {
    margin: 0 0 1.5em 0;
    max-width: 100%;
    height: auto;
}

.entry-content .size-auto,
.entry-content .size-full,
.entry-content .size-large,
.entry-content .size-medium,
.entry-content .size-thumbnail {
    max-width: 100%;
    height: auto;
}

.entry-content pre {
    background: #323944;
    color: #f8f9fa;
    font-size: 0.9em;
    padding: 1.5em;
    margin: 0 0 1.5em;
    border-radius: 3px;
}

.wp-caption {
    max-width: 100%;
    background: #eee;
    padding: 5px;
}

.wp-caption img {
    max-width: 100%;
    margin-bottom: 0;
    width: 100%;
}

.wp-caption p.wp-caption-text {
    font-size: 0.85em;
    margin: 4px 0 7px;
    text-align: center;
}

.tags {
    margin: 0;
}

/******************************************************************
CREDENTIALS
******************************************************************/
.cat-credentials {
    width: 100%;
}

.entry-content .cat-credentials img {
    margin-right: 0.75em;
}

/******************************************************************
PAGE NAVI STYLES
******************************************************************/
.pagination,
.wp-prev-next {
    margin: 1.5em 0;
}

.pagination {
    text-align: center;
}

.pagination ul {
    display: inline-block;
    background-color: white;
    white-space: nowrap;
    padding: 0;
    clear: both;
    border-radius: 3px;
}

.pagination li {
    padding: 0;
    margin: 0;
    float: left;
    display: inline;
    overflow: hidden;
    border-right: 1px solid #eaedf2;
}

.pagination a, .pagination span {
    margin: 0;
    text-decoration: none;
    padding: 0;
    line-height: 1em;
    font-size: 1em;
    font-weight: normal;
    padding: 0.75em;
    min-width: 1em;
    display: block;
    color: #2980b9;
}

.pagination a:hover, .pagination a:focus, .pagination span:hover, .pagination span:focus {
    background-color: #2980b9;
    color: white;
}

.pagination .current {
    cursor: default;
    color: #575656;
}

.pagination .current:hover, .pagination .current:focus {
    background-color: white;
    color: #575656;
}

/* fallback previous & next links */
.wp-prev-next .prev-link {
    float: left;
}

.wp-prev-next .next-link {
    float: right;
}

/*********************
SIDEBARS & ASIDES
*********************/
.widget ul li {
}

.no-widgets {
    background-color: white;
    padding: 1.5em;
    text-align: center;
    border: 1px solid #cccccc;
    border-radius: 2px;
    margin-bottom: 1.5em;
}

.sidebar--produkte {
    background: #eee;
    padding: 15px;
    text-align: center;
}

/*********************
FOOTER STYLES
*********************/
.footer {
    clear: both;
    color: #fff;
    background: #003a60; /* Old browsers */
    background: -moz-linear-gradient(left, #003a60 0%, #306ea9 100%);
    background: -webkit-linear-gradient(left, #003a60 0%, #306ea9 100%);
    background: linear-gradient(to right, #003a60 0%, #306ea9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003a60', endColorstr='#306ea9', GradientType=1);
    padding: 4em 0;
}

li#menu-item-147 a {
    background: #306ea9;
    padding: 3px 6px;
    margin-bottom: 13px;
    width: 96px;
}

li#menu-item-2805 a {
    background: #306ea9;
    padding: 3px 6px;
    margin-bottom: 13px;
    width: 96px;
}

li#menu-item-3624 a {
    background: #306ea9;
    padding: 3px 6px;
    margin-bottom: 13px;
    width: 96px;
}

.button-footer {
    text-align: center;
    font-size: 13px;
    margin-top: 2em;
}

p.source-org.copyright {
    border-bottom: 2px solid #E3E3E3;
    padding-bottom: 1em;
}

@media only screen and (min-width: 768px) and (max-width: 1218px) {
    #menu-footer li#menu-item-126 {
        clear: both;
    }

    .footer-links ul li {
        width: 225px;
    }
}

/*********************
PLZ SEARCH
*********************/
#search-form, #search-result, .list-item, .list-item > div {
    display: flex;
}

#search-form {
    justify-content: center;
    align-items: center;
    clear: both;
}

#search-result {
    height: 55vh;
    flex-direction: column;
}

#search-result .list-item {
    min-height: 40px;
    min-width: 400px;
    max-width: 970px;
    justify-content: space-between;
}


/*********************
LARGER MOBILE DEVICES
This is for devices like the Galaxy Note or something that's larger than an iPhone but smaller than a tablet. Let's call them tweeners.
*********************/
@media only screen and (min-width: 481px) {
    /******************************************************************
    Stylesheet: 481px and Up Stylesheet
    ******************************************************************/
    /*********************
    NAVIGATION STYLES
    *********************/
    /*********************
    POSTS & CONTENT STYLES
    *********************/
    .entry-content .alignleft, .entry-content img.alignleft {
        margin-right: 1.5em;
        display: inline;
        float: left;
    }

    .entry-content .alignright, .entry-content img.alignright {
        margin-left: 1.5em;
        display: inline;
        float: right;
    }

    .entry-content .aligncenter, .entry-content img.aligncenter {
        margin-right: auto;
        margin-left: auto;
        display: block;
        clear: both;
    }
}

/*********************
FOOTER STYLES
*********************/

/*********************
TABLET & SMALLER LAPTOPS
This is the average viewing window. So Desktops, Laptops, and in general anyone not viewing on a mobile device. Here's where you can add resource intensive styles.
*********************/
@media only screen and (min-width: 768px) {
    /******************************************************************
    Stylesheet: Tablet & Small Desktop Stylesheet
    ******************************************************************/
    /*********************
    LAYOUT & GRID STYLES
    *********************/
    .wrap {
        max-width: 760px;
    }

    /*********************
    NAVIGATION STYLES
    *********************/
    .nav {
    }

    .nav li ul.sub-menu,
    .nav li ul.children {
        padding: 0;
        /* highlight sub-menu current page */
    }

    .nav li ul.sub-menu li,
    .nav li ul.children li {
        float: unset;
        padding: 0;
    }

    .nav li ul.sub-menu li:last-child a,
    .nav li ul.children li:last-child a {
    }

    /*********************
    SIDEBARS & ASIDES
    *********************/
    .sidebar {
        margin-top: 2.2em;
    }

    .widgettitle {
        border-bottom: 2px solid #003A60;
        margin-bottom: 0.75em;
    }

    .widget {
        padding: 0 10px;
        margin: 2.2em 0;
    }

    .widget ul li {
        margin-bottom: 0.75em;
        /* deep nesting */
    }

    .widget ul li ul {
        margin-top: 0.75em;
        padding-left: 1em;
    }

    /*********************
    FOOTER STYLES
    *********************/
    .footer-links ul li {
        float: left;
        padding-right: 1.4em;
    }

    .footer-links ul li:last-child {
        padding: 0;
    }

    #menu-item-134 ul {
        margin: 0;
    }

}

/*********************
DESKTOP
This is the average viewing window. So Desktops, Laptops, and in general anyone not viewing on a mobile device. Here's where you can add resource intensive styles.
*********************/
@media only screen and (min-width: 1030px) {
    /******************************************************************
    Stylesheet: Desktop Stylsheet
    ******************************************************************/
    .wrap {
        max-width: 1180px;
    }
}

@media only screen and (min-width: 1240px) {
    /******************************************************************
    Stylesheet: Super Large Monitor Stylesheet
    ******************************************************************/
}

/*********************

RETINA (2x RESOLUTION DEVICES)
This applies to the retina iPhone (4s) and iPad (2,3) along with other displays with a 2x resolution. You can also create a media query for retina AND a certain size if you want. Go Nuts.
*********************/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
    /******************************************************************
    Stylesheet: Retina Screens & Devices Stylesheet
    ******************************************************************/
    /*

    EXAMPLE
    Let's say you have an image and you need to make sure it looks ok
    on retina screens. Let's say we have an icon which dimension are
    24px x 24px. In your regular stylesheets, it would look something
    like this:

    .icon {
      width: 24px;
      height: 24px;
      background: url(img/test.png) no-repeat;
    }

    For retina screens, we have to make some adjustments, so that image
    doesn't look blurry. So, taking into account the image above and the
    dimensions, this is what we would put in our retina stylesheet:

    .icon {
      background: url(img/test@2x.png) no-repeat;
      background-size: 24px 24px;
    }

    So, you would create the same icon, but at double the resolution, meaning
    it would be 48px x 48px. You'd name it the same, but with a @2x at the end
    (this is pretty standard practice). Set the background image so it matches
    the original dimensions and you are good to go.

    */
}

@media print {
    /******************************************************************
    Stylesheet: Print Stylesheet
    ******************************************************************/
    * {
        background: transparent !important;
        color: black !important;
        text-shadow: none !important;
        filter: none !important;
        -ms-filter: none !important;
    }

    a, a:visited {
        color: #444 !important;
        text-decoration: underline;
    }

    a:after, a:visited:after {
        content: " (" attr(href) ")";
    }

    a abbr[title]:after, a:visited abbr[title]:after {
        content: " (" attr(title) ")";
    }

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr, img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

    .sidebar,
    .page-navigation,
    .wp-prev-next,
    .respond-form,
    nav {
        display: none;
    }
}

/* STICKY - ICONS */

.sticky-0 {
    position: fixed;
    top: 285px;
    z-index: 99;
    transition: all 1s ease-in;
    right: 0;
}

.sticky-0 .tel-support {
    background: #003a60;
    color: white;
    padding: 1px 20px 1px 0;
    display: block;
    text-decoration: none;
    transition: 0.3s;
    margin-right: -145px;
}

.sticky-0 .tel-support:hover {
    background-color: #306ea9;
    text-decoration: none;
    color: white;
    margin-right: 0px;
}

.sticky-1 {
    position: fixed;
    top: 345px;
    z-index: 99;
    transition: all 1s ease-in;
    right: -10px;
}

.sticky-1 .mail-support {
    background: #003a60;
    color: white;
    padding: 1px 20px 1px 0;
    display: block;
    text-decoration: none;
    transition: 0.3s;
    margin-right: -145px;
}

.sticky-1 .mail-support:hover {
    background-color: #306ea9;
    text-decoration: none;
    color: white;
    transition: 0.3s;
    margin-right: 0px;
}

.sticky-2 {
    position: fixed;
    top: 405px;
    z-index: 99;
    transition: all 1s ease-in;
    right: 49px;
}

.sticky-2 .berater-support {
    background: #003a60;
    color: white;
    padding: 1px 20px 1px 0;
    display: block;
    text-decoration: none;
    transition: 0.3s;
    margin-right: -145px;
}

.sticky-2 .berater-support:hover {
    background-color: #306ea9;
    text-decoration: none;
    color: white;
    transition: 0.3s;
    margin-right: -49px;
}

.sticky-item {
    margin-bottom: 5px;
}

.sticky-item a:hover {
    background-color: white !important;
    text-decoration: none;
}

.sticky-item img {
    vertical-align: middle;
}

/* LANGUAGE PICKER & TOP-BAR */
.language--picker {
    float: right;
}

.language--picker .wpml-ls-statics-shortcode_actions {
    padding: 0;
}

.header-top--content {
    float: left;
    margin-right: 20px;
}

.header-top--content a {
    color: white;
}

@media screen and (max-width: 434px) {
    .header-top--content {
        display: none;
    }
}

/* +++++ STARTSEITE CONTENT +++++ */

/* PRODUKTBERATER CONTENT */

.berater--icons {
    background: none;
    display: grid;
    grid-template-rows: 1fr 1fr;
    grid-template-columns: 24% 28% 24% 24%;
}

.berater--icons--entry {
    text-align: center;
    color: #E3E3E3;
}

.berater--icons--entry span {
    margin-top: -20px;
    font-size: 0.9em;
}

.berater--icons:before {
    display: none;
}

/* PRODUKTIONSVERFAHREN CONTENT */
.product-item {
    position: relative;
    height: 100%;
}

.product-item--icon {
    text-align: right;
}

.product-item--icon img {
    width: unset;
}

.product-item-bottom {
    float: right;
}

.product-item-bottom p {
    text-align: right;
}

.product-item .product-item-bottom a {
    color: white;
}

.product-item .product-item-bottom a:hover {
    text-decoration: underline;
}

@media screen and (min-width: 1030px) {
    .product-item-bottom {
        position: absolute;
        bottom: 0;
        right: 20px;
    }
}

/* MESSETERMINE CONTENT */

.termine--entry {
    margin-bottom: 1.5em;
}

.termine--entry-title {
    background: #306ea9;
    text-align: center;
    color: white;
    font-weight: normal;
    padding: 4px 4px;
}

.termine--entry-content {
    text-align: center;
    background: white;
    padding: 4px 4px;
}

.termine--entry-date {
    color: #306ea9;
    font-weight: bold;
}


/* +++++++ STARTSEITE ENDE ++++++++ */

/* CARE / KLINIK / CATERING / JUNIOR FULLSCREEN */
.category-content {
    padding: 15px;
    width: 100%;
}

.category-content:nth-child(2n) {
    background-color: #f6f6f6;
}

.category-content .item {
    margin-right: 15px;
}

/* +++++++++++ PRODUKTE SEITEN ++++++++++ */

.produkte--title img {
    margin: 0 15px 0 0;
    vertical-align: middle;
    float: left;
}

/* +++++++++++ ANALYSE +++++++++++++++ */

.steps {
    padding: 16px 16px 0 16px;
    background-color: #fff;
    width: 100%;
    z-index: 1;
}

.checkout-progress {
    clear: both;
    display: table;
    padding: 10px 0 20px;
    width: 100%;
    z-index: 1;
}

.checkout-progress .progress-bar {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.checkout-progress .progress-bar li {
    position: relative;
    float: left;
    background: #eee;
    border-left: 1px solid #fff;
    margin-right: 10px;
}

.checkout-progress .progress-bar li:hover {
    cursor: pointer;
    text-decoration: underline;
}

.checkout-progress .progress-bar li .triangle, .checkout-progress .progress-bar li .triangle2 {
    display: block;
    position: absolute;
    top: 0;
    right: -10px;
    height: 0;
    width: 0;
    border-top: 15px solid transparent;
    border-left: 10px solid #eee;
    border-bottom: 15px solid transparent;
    z-index: 1;
}

.checkout-progress .progress-bar li .triangle2 {
    border-left-color: white;
    left: 0;
}

.checkout-progress .progress-bar li:first-child {
    border: 0;
}

.checkout-progress .progress-bar li.current-step {
    background: #003A60;
}

.checkout-progress .progress-bar li.current-step .triangle {
    border-left: 10px solid #003A60;
}

.checkout-progress .progress-bar li.current-step a {
    color: white;
}

.checkout-progress .progress-bar li.current-step a .step-number {
    border-color: white;
}

.checkout-progress .progress-bar li.visited-step {
    background: #bbb;
}

.checkout-progress .progress-bar li.visited-step .triangle {
    border-left: 10px solid #bbb;
}

.checkout-progress .progress-bar li a {
    letter-spacing: 1px;
    display: block;
    line-height: 30px;
    padding: 0 20px;
    color: #003A60;
    text-decoration: none;
    cursor: pointer;
}

.checkout-progress .progress-bar li a em {
    display: inline-block;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: none;
    width: 18px;
    height: 18px;
    line-height: 17px;
    text-align: center;
    margin-right: 14px;
    border: 1px solid #999;
    font-size: 13px;
    font-style: normal;
}

/* NAVIGATION */
#mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-flyout ul.mega-sub-menu {
    width: 170px;
}

#mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link {
    line-height: 15px;
    padding: 10px;
}

@media only screen and (max-width: 768px) {
    .mega-sub-menu {
        width: 100% !important;
    }
}

@media only screen and (max-width: 768px) {
    #mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item.mega-toggle-on > a.mega-menu-link,
    #mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item > a.mega-menu-link:hover,
    #mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item > a.mega-menu-link:focus,
    #mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link,
    #mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item.mega-current-menu-ancestor > a.mega-menu-link,
    #mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item.mega-current-page-ancestor > a.mega-menu-link {
        color: #fff;
    }
}

@media only screen and (min-width: 310px) and (max-width: 369px) {
    .logo {
        max-width: 150px !important;
    }

    .logo-subline {
        font-size: 1rem !important;
        margin-top: 22px !important;
    }
}

@media only screen and (min-width: 370px) and (max-width: 430px) {
    .logo {
        max-width: 185px !important;
    }

    .logo-subline {
        font-size: 1rem !important;
        margin-top: 29px !important;
    }
}


@media only screen and (max-width: 767px) {
    .logo {
        max-width: 215px;
    }

    .logo-subline {
        font-size: 1.2rem;
    }
}

@media only screen and (min-width: 748px) and (max-width: 791px) {
    #mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item > a.mega-menu-link {
        padding: 0 5px;
    }
}

@media only screen and (min-width: 791px) and (max-width: 1024px) {
    #mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item > a.mega-menu-link {
        padding: 0 8px;
    }
}

#mega-menu-wrap-main-nav #mega-menu-main-nav li.mega-menu-flyout.mega-menu-item-has-children > a.mega-menu-link:after,
#mega-menu-wrap-main-nav #mega-menu-main-nav li.mega-menu-flyout li.mega-menu-item-has-children > a.mega-menu-link:after,
#mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-item-has-children > a.mega-menu-link:after {
    margin: 0 0 0 1px;
}

#mega-menu-wrap-main-nav .mega-menu-toggle {
    background: #306ea9;
}


#mega-menu-wrap-main-nav .mega-menu-toggle #mega-toggle-block-1 {
    float: left;
    margin-left: 6px;
}

/* FAQ Glossar */

h3.arconix-faq-term-title {
    display: none;
}

.arconix-faq-wrap {
    border-radius: 0px !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px #003A60 solid !important;
    background: none !important;
}

.arconix-faq-title {
    font-weight: 700;
    background: url("/wp-content/uploads/2018/01/open-toggle.jpg") no-repeat left !important;
}

.arconix-faq-title.faq-open {
    background: url("/wp-content/uploads/2018/01/close-toggle.jpg") no-repeat left !important;
}


/* GESCHICHTE */
.jahreszahl {
    font-size: 2em;
    text-rendering: optimizelegibility;
    font-weight: 600;
    color: #003A60;
    font-family: 'DroidSerif-Regular';
}

.subline {
    font-size: 1.1em;
    text-rendering: optimizelegibility;
    font-weight: 600;
    color: #575656;
    font-family: 'DroidSerif-Regular';
}

/* Kontaktformular */
input[type="text"], textarea {
    max-width: 790px;
}

.wpcf7-form {
    width: 100%;
}

.wpcf7-form-control-wrap {
    float: left;
    width: 50%;
    padding-right: 2%;
}

.wpcf7-form-control-wrap.ihre-strasse, .wpcf7-form-control-wrap.ihre-nachricht {
    width: 100%;
}

.wpcf7-form-control.wpcf7-submit {
    float: right;
    margin-right: 2%;
}

@media only screen and (max-width: 425px) {
    .wpcf7-form-control-wrap {
        width: 100%;
    }
}

/* Staff List */
.ksk-staff-list-search-form input {
    height: 40px;
    width: 79%;
}

span.ksk-staff-list-search-result img {
    margin: 1.5em;
    height: auto;
}

span.ksk-staff-list-search-result {
    display: block;
}

span.ksk-staff-list-search-result ul {
    padding-left: 1.5em;
    margin: 0;
}

span.ksk-staff-list-search-result ul li {
    list-style: none;
}

span.ksk-staff-list-search-result ul li:first-child {
    /*margin-top: 4em;*/
}

span.ksk-staff-list-search-result ul li:last-child {
    margin-bottom: 4em;
}

@media only screen and (min-width: 320px) {
    .ksk-staff-list-search-form input {
        width: 43%;
    }

    span.ksk-staff-list-search-result img {
        width: auto;
        max-height: 210px;
    }
}

@media only screen and (min-width: 480px) {
    .ksk-staff-list-search-form input {
        width: 64%;
    }

    span.ksk-staff-list-search-result ul {
        padding-left: 1.5em;
        margin: 1.5em 0;
    }

    span.ksk-staff-list-search-result {
        padding-bottom: 1.5em;
    }

    span.ksk-staff-list-search-result img {
        max-width: 150px !important;
        margin: 0 1.5em;
        float: left;
    }

    .ksk-staff-list-search-result ul {
        height: 180px;
        margin-top: 80px;
    }
}

@media only screen and (min-width: 320px) and (max-width: 768px) {
    img.abcfslImgCenter.abcfslImgCenter {
        margin: 0 auto;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1030px) {
    .abcfslLstCol.abcfslLstImgCol {
        width: 40%;
    }

    .abcfslLstCol.abcfslLst1TxtCol {
        width: 60%;
    }
}


/**********************************
                TABS
**********************************/
.responsive-tabs ul.responsive-tabs__list {
    margin: 0 !important;
}

.responsive-tabs .responsive-tabs__list__item--active, .responsive-tabs .responsive-tabs__list__item--active:hover {
    background-color: #003A60 !important;
    border-color: #003A60 !important;
    color: #fff !important;
}

.responsive-tabs .responsive-tabs__panel {
    border: 1px solid #003A60 !important;
    border-top: 1px solid #003A60 !important;
}

.abcfslBB1Color2 > div, .abcfslLstCntrBB > div {
    border-bottom-color: #306ea9;
}

.responsive-tabs .responsive-tabs__list__item:hover {
    color: #306ea9 !important;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .responsive-tabs .responsive-tabs__list__item {
        padding: 10px 2px !important;
    }
}


/*********************
RESPONSIVE STARTSEITE
*********************/

@media only screen and (max-width: 1191px) {
    .progress-bar .checkout-step1,
    .progress-bar .checkout-step2,
    .progress-bar .checkout-step3,
    .progress-bar .checkout-step4,
    .progress-bar .checkout-step4 {
        clear: both;
        margin-bottom: 10px;
        width: 100%;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1029px) {
    .category-container .item {
        width: calc(100% * (2 / 4) - 5px - 1px)
    }
}

@media only screen and (max-width: 767px) {
    .category-container .item {
        width: calc(100% * (4 / 4) - 5px - 1px)
    }

    .berater--icons {
        background: none;
        display: grid;
        grid-template-rows: 1fr;
        grid-template-columns: 50% 50%;
    }
}

@media only screen and (max-width: 480px) {
    .berater--icons {
        background: none;
        display: grid;
        grid-template-rows: 1fr;
        grid-template-columns: 100%;
    }

    h1, .h1 {
        font-size: 2em;
    }

    h2, .h2 {
        font-size: 1.5em;
    }

    h3, .h3 {
        font-size: 1.15em;
    }

    .mega-sub-menu {
        width: 100% !important;
    }

    .produkte--title h1 {
        display: flex;
        flex-direction: column;
    }

    .produkte--title p span {
        display: block;
        clear: both;
        margin-top: 3px;
    }

    .image-insul-solid {
        margin: 0 !important;
    }

    .progress-bar .checkout-step1,
    .progress-bar .checkout-step2,
    .progress-bar .checkout-step3,
    .progress-bar .checkout-step4,
    .progress-bar .checkout-step4 {
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 480px) {
    .img-mobile-off {
        display: none;
    }

    .img-mobile-on {
        display: block;
    }
}

@media only screen and (min-width: 480px) {
    .img-mobile-off {
        display: block;
    }

    .img-mobile-on {
        display: none;
    }
}

/*
@media screen (min-width: 768px) and (max-width:1029px) {
  .home-category-container .item {
    width: 50%;
    margin: 0 auto;
    margin-bottom: 10px;
  }

  .home-category-container p {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .home-category-container .item {
    width: 100%;
    margin: 0 auto;
    margin-bottom: 10px;
  }

  .home-category-container p {
    display: none;
  }

  .berater--icons {
    background: none;
    display: grid;
    grid-template-rows: 1fr;
    grid-template-columns: 100%;
  }
}

*/

/***** 404 *******/

span.fehlersuche-404 input, span.fehlersuche-404 button {
    float: left;
}

.search {
    padding: 1.5em 1.5em 0;
}


p.byline.entry-meta.vcard {
    display: none;
}

p.footer-category {
    display: none;
}


@media screen and (orientation: landscape) and ( min-height: 320px ) and (max-height: 380px ) {
    .sticky-0, .sticky-1, .sticky-2 {
        margin-top: -150px;
    }
}

@media screen and (orientation: landscape) and ( min-height: 381px ) and (max-height: 420px ) {
    .sticky-0, .sticky-1, .sticky-2 {
        margin-top: -100px;
    }
}

@media screen and (orientation: landscape) and ( min-height: 421px ) and (max-height: 450px ) {
    .sticky-0, .sticky-1, .sticky-2 {
        margin-top: -50px;
    }
}

@media screen and (orientation: landscape) and ( min-height: 451px ) and (max-height: 520px ) {
    .sticky-0, .sticky-1, .sticky-2 {
        margin-top: -20px;
    }
}

header.article-header {
    display: none;
}

#cookieChoiceInfo {
    background-color: #306ea9 !important;
    color: #fff;
}

#cookieChoiceInfo a {
    color: #306ea9;
    padding: 5px;
    background-color: #fff;
}

#cookieChoiceInfo div {
    padding: 5px;
}


.p-10 {
    padding: 12px;
}

.font-fa {
    font-size: 15px;
}

.font-fa-18 {
    font-size: 18px;
}

.ali-img-size img {
	margin-top: 10px;
    width: 130px;
}

.mt-40 {
	margin-top: 40px;
}
