/* Have fun adding your style here :) - PS: At all times this file should contain a comment or a rule, otherwise opera might act buggy :( */

/* General Custom CSS */
/* Menu active on portfolio page */
#top.portfolio-template-default {
    .menu-item-top-level-2 {
        a {
            color: #b38e32;
        }
    }
    .avia_textblock {
        margin-bottom: 2em;
    }
}
/* Portfolio h1 and Subheadline */
.portfolio-template-default .av-special-heading.av-special-heading-h1 {
    h1 {
        font-size: 42px;
    }
    .av-subheading.av-subheading_below {
        font-family: "oswald", Helvetica, Arial, sans-serif;
        text-transform: uppercase;
        font-weight: 300;
        font-size: 27px;
        margin-top: 0.8em;
    }
}
/* Accordions */
.js_active .av-elegant-toggle .single_toggle {
    margin-bottom: 6px;
    .toggler {
        padding: 15px 55px 10px 35px;
        font-family: "oswald", Helvetica, Arial, sans-serif;
        font-weight: 500 !important;
        text-transform: uppercase;
        text-align: center;
        .toggle_icon {
            opacity: 1;
        }
    }
}

#top {
    .main_color {
        strong {
            color: #575756;
        }
        /*Buttons*/
        .avia-color-theme-color {
            color: #b38e32;
            border: 2px solid #b38e32;
            border-radius: 0;
            padding: 15px 30px;
            font-family: "oswald", Helvetica, Arial, sans-serif;
            font-size: 1.175em;
            font-weight: 500;
            background-color: inherit;
        }
    }
    #wrap_all {
        .special_amp {
            font-family: inherit;
            font-style: inherit;
            font-size: inherit;
            line-height: inherit;
            font-weight: inherit;
            color: inherit;
        }
        .container_wrap {
            border-top-width: 0px;
        }
        /* main menu */
        .av_header_transparency #header_meta {
            border-bottom: none;
        }
        #header.av_header_transparency {
            background: rgba(0, 0, 0, 0.5);
        }
        #header.header-scrolled {
            padding-top: 0.5em;
            padding-bottom: 0.5em;
            #header_meta {
                visibility: hidden;
            }
        }
        #header_meta .phone-info {
            font-size: 16px;
        }
        #header_meta .container {
            color: #fff;
        }
        #header .main_menu a:hover {
            color: #d4d4d3;
        }
        .av-main-nav > li > a {
            font-size: 1.15em;
            font-weight: 300;
        }
        .sub_menu {
            font-size: 16px;
            li {
                border: 0;
            }
        }
        #header_meta {
            padding-top: 10px;
        }
        #main {
            .avia-button {
                font-family: "oswald", Helvetica, Arial, sans-serif;
                font-size: 16px;
                font-weight: 500;
                text-transform: uppercase;
                color: #b38e32;
                border: 2px solid #b38e32;
                border-radius: 0;
                background-color: inherit;
            }
            .avia-button.avia-size-x-large {
                font-size: 1em;
                padding: 15px 30px;
                min-width: auto;
            }
            .avia-button.avia-size-x-large:hover {
                color: #fff;
            }
            .avia-button:hover {
                background-color: #b38e32;
                color: #fff;
            }
            a:where(:not(.wp-element-button)) {
                text-decoration: unset;
            }
            .avia_textblock {
                a {
                    text-decoration: underline solid 1px;
                    text-underline-offset: 4px;
                }
                a:hover {
                    text-decoration: underline solid 2px;
                }
                li {
                    font-weight: 300;
                }
            }
            .hero-section {
                padding-top: 15%;
                padding-bottom: 15%;
            }
            #footer {
                border-top: 2px solid #fafafa;
                padding: 0;
                .entry-content-header {
                    display: flex;
                    justify-content: center;
                }
                .iconbox_icon.heading-color.avia-svg-icon svg {
                    font-size: 1.2em;
                    fill: #b38e32;
                }
                .iconbox_left .iconbox_icon {
                    line-height: 52px;
                }
                .flex_cell:hover {
                    background-color: #b38e32;
                    opacity: 1;
                    .iconbox .iconbox_content_title {
                        color: #fff;
                    }
                    .iconbox_icon.avia-svg-icon svg {
                        fill: #fff;
                    }
                    .iconbox_icon {
                        color: #fff;
                    }
                }
                .iconbox_content_container {
                    display: none;
                }
                h3 {
                    margin: 0;
                }
                #routebox {
                    .iconbox_icon {
                        line-height: 40px;
                    }
                }
            }
            #footer-page {
                .avia_textblock {
                    a {
                        font-family: "oswald", Helvetica, Arial, sans-serif;
                        font-weight: 300;
                        text-transform: uppercase;
                    }
                }
            }
            /* h1 line */
            .av-special-heading.av-special-heading-h1::after {
                content: "";
                display: block;
                height: 1px;
                background: rgba(95, 95, 94, 0.25);
                margin: 2rem auto 0;
                width: 32%;
            }
            /* Home notes boxes */
            .notesbox {
                .avia-image-container {
                    background-color: #fff;
                    padding: 0 1.25rem;
                    height: 200px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }
                img {
                    border-radius: 0px;
                    width: auto;
                    text-align: center;
                    margin: 0 auto;
                    max-width: 90%;
                    display: block;
                    max-height: 160px;
                }
                .avia_textblock {
                    padding: 1.25rem;
                }
            }
            /*Kontakt Route planen*/
            #routebox {
                padding: 0;
                .entry-content-header {
                    display: flex;
                    justify-content: center;
                }
                .iconbox_left .iconbox_icon {
                    line-height: 40px;
                }
                .flex_cell:hover {
                    background-color: #b38e32;
                    opacity: 1;
                    a {
                        color: #fff;
                    }
                    .iconbox_icon.avia-svg-icon svg {
                        fill: #fff;
                    }
                }
                .iconbox_content_container {
                    display: none;
                }
                .flex_cell {
                    border-left-width: 0;
                }
            }
            /* agency gallery */
            div .avia-gallery.picture-gallery {
                img {
                    padding: 16px;
                }
                .avia-gallery-thumb {
                    a:hover {
                        opacity: 1;
                        transform: none;
                        img.avia_start_animation {
                            transform: scale(1.1);
                            transition: transform 0.5s ease;
                        }
                    }
                    a img {
                        transition: transform 0.5s ease;
                    }
                }
            }
            div .avia-gallery img {
                border: 0;
            }
            /*Kontakt*/
            .teambox {
                .av-subheading_below {
                    text-transform: uppercase;
                    font-family: "oswald", Helvetica, Arial, sans-serif;
                    font-weight: 300;
                    margin-top: 0.5em;
                }
                a {
                    font-family: "oswald", Helvetica, Arial, sans-serif;
                    font-weight: 300;
                }
            }
        }
    }
    .av_header_transparency #header_meta {
        border-bottom: 0;
    }
}

/* Custom CSS for the Masonrys */
#top .project-masonry.av-masonry {
    .av-masonry-entry {
        position: static !important;
    }
    .av-inner-masonry-sizer {
        padding-bottom: 0 !important;
        height: 31rem !important;
    }
    .av-masonry-image-container {
        height: 16.5rem !important;
        opacity: 1;
    }
    .main_color h3 {
        color: #b38e32;
        text-transform: uppercase;
        font-size: 1rem;
    }
    a {
        text-transform: none;
    }
    .av-masonry-entry-categories {
        margin-bottom: 10px;
        font-family: "oswald", sans-serif;
        font-weight: 300;
        text-transform: uppercase;
        font-size: 16px;
    }
    .av-masonry-entry-content {
        display: -webkit-box; /* Flexbox für Webkit-Browser */
        -webkit-line-clamp: 3; /* Maximal 3 Zeilen */
        -webkit-box-orient: vertical;
        overflow: hidden; /* Versteckt den Rest */
        font-weight: 300;
        font-size: 1rem;
        line-height: 1.5;
        margin: 0px;
        padding: 15px 0px 5px;
        margin-bottom: 15px;
        border-top: 1px solid #d3d3d3;
    }
    .avia-arrow {
        display: none;
    }
    /* .avia-button {
        font-family: "oswald", Helvetica, Arial, sans-serif;
        font-weight: 500;
        font-size: 16px;
        text-transform: uppercase;
    } */
    /* Filter */
    .av-masonry-sort {
        margin-bottom: 30px !important;
        a {
            border: 1px solid rgba(85, 85, 85, 0.5);
            padding: 8px 16px;
            color: #575756;
            font-weight: 300;
        }
        a:hover {
            background-color: #b38e324d;
            border: 1px solid #b38e324d;
            color: #575756;
        }
        .active_sort {
            background-color: #b38e32;
            border: 1px solid #b38e32;
            .inner_sort_button {
                color: #fff;
            }
        }
        .active_sort:hover {
            background-color: #b38e32;
            border: 1px solid #b38e32;
        }
        .avia_show_sort {
            margin-bottom: 10px;
        }
        .text-sep {
            visibility: hidden;
            width: 2px;
        }
    }
    .av-masonry-entry .av-inner-masonry-content {
        bottom: 50px;
    }
}
/* Home Project-Masonry */
.home .av-masonry-col-3 .av-masonry-entry {
    width: 100%;
}

/* Kunden-Logo Masonry*/
#top {
    .avia-logo-element-container .slide-entry {
        height: 140px;
        background: white;
        margin: 3px;
        padding: 5px;
        width: calc(16.666% - 6px) !important;
        display: flex;
        align-items: center;
        img {
            transition: All 0.5s ease;
            -webkit-transition: All 0.5s ease;
            opacity: 0.8;
            filter: grayscale(100%);
            -webkit-filter: grayscale(100%);
            -moz-filter: grayscale(100%);
            -ms-filter: grayscale(100%);
            -o-filter: grayscale(100%);
            filter: gray;
            -webkit-filter: grayscale(1);
            max-height: 100px;
            max-width: 140px;
            margin: 0 auto;
            width: auto;
            height: fit-content;
        }
        &:hover img,
        img:hover {
            transform: scale(1.1);
            -webkit-transform: scale(1.1);
            filter: grayscale(0%);
            -webkit-filter: grayscale(0%);
            -moz-filter: grayscale(0%);
            -ms-filter: grayscale(0%);
            -o-filter: grayscale(0%);
            filter: gray;
            -webkit-filter: grayscale(0);
        }
    }
}

/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */

@media only screen and (min-width: 768px) {
    #top {
        #wrap_all {
            #main {
                #footer {
                    .flex_cell.avia-builder-el-first {
                        border: none;
                        width: 33.38%;
                    }
                    .flex_cell {
                        border-color: #fafafa;
                        border-left-width: 3px;
                    }
                }
            }
        }
    }
}

/*
Tablet Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */

@media only screen and (max-width: 989px) {
    #top {
        #wrap_all {
            #header_meta {
                display: none;
            }
            #header_main {
                padding: 15px 0;
            }
        }
    }
}

@media only screen and (min-width: 768px) and (max-width: 989px) {
    #top {
        #wrap_all {
            .logo {
                a {
                    display: flex;
                    align-items: center;
                }
            }
        }
    }
}

@media only screen and (min-width: 480px) and (max-width: 989px) {
    #top {
        #wrap_all {
            .logo {
                img {
                    max-height: 65px !important;
                }
            }
        }
    }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .responsive #top.home .av-masonry-entry {
        width: 100%;
    }
}

/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */

@media only screen and (max-width: 767px) {
    #top {
        #wrap_all {
            .avia-section-huge .content {
                padding-top: 70px !important;
                padding-bottom: 70px !important;
            }
            #main {
                #footer {
                    .flex_cell {
                        border-left-width: 0;
                    }
                }
            }
        }
    }
}

@media only screen and (max-width: 479px) {
    #top {
        #wrap_all {
            .logo {
                img {
                    max-height: 55px !important;
                }
            }
            #header_main {
                padding: 0;
            }
        }
    }
}