/*
******************************************************************
(c) sinntun.codes
******************************************************************
*/

/* mobile_760px.css ist für Bildschirmbreiten von 520px - 361px */

@media only screen and (max-width: 520px) {
    #head-image img {
        height: 125px;
    }

    /*-- allgemein --*/
    h1 {
        font-size: 22px;
    }

    span.intro-text {
        font-size: 20px;
    }

    h2 {
        font-size: 20px;
    }

    /*-- header --*/
    #head-canvas {
        height: 90px;
    }

    #head-canvas.header {
        display: flex;
        width: 100%;
        height: 270px;
        margin-top: -50px;
    }

    #logo img {
        top: 25px;
        left: 0;
        position: absolute;
        max-width: 290px;
    }

    #head-right .contact-banner {
        display: none;
    }

    .nav1-mobile-div .contact-banner {
        left: -190px;
    }

    .mobile-head-wrapper {
        width: 100%;
        left: 0;
        top: 0;
    }

    .menu-trigger {
        margin-right: 0;
        right: 0;
    }

    .nav2-mobile-submenu {
        margin-left: 40px;
    }

    .nav1-mobile {
        padding: 25px 0;
    }

    .nav1-mobile-div.menu-1 {
        top: 80px;
        overflow-y: auto;
        padding-bottom: 20px;
        height: calc(100vh - 80px);
    }

    .nav1-mobile-link.active span {
        padding: 5px 0;
    }

    .nav1-mobile li.has-mobile-submenu a::before {
        margin-left: 14px;
    }

    .icon {
        right: 50px;
    }

    .breadcrumb a {
        font-size: 14px;
    }

    /*-- main --*/
    .text-main-wrapper {
        margin: 25px 0 45px 0;
    }

    .teaserboxes-wrapper {
        padding: 0;
    }

    .teaserboxes-wrapper div {
        height: auto;
        display: block;
    }

    .teaserbox .teaserbox-textcontainer {
        display: table-cell;
        vertical-align: middle;
    }

    .teaserbox-imagecontainer {
        width: 100%;
        height: auto;
    }

    .teaserbox-imagecontainer img {
        width: 100%;
        height: auto;
    }

    .overviewpages-text {
        font-size: 34px;
    }

    .event-box {
        height: auto;
    }

    .eventboxes_material .event-box {
        padding: 0;
        display: flex;
        box-sizing: border-box;
        min-height: 120px;
        justify-content: center;
        align-items: center;
    }

    .event-box p.icon::before {
        width: 60px;
        line-height: 50px;
    }

    .event-box p {
        float: unset;
        margin-top: 0;
        margin-right: 25px;
        margin-left: 20px;
    }

    .eventtext {
        width: calc(100% - 105px);
        padding-right: 20px;
    }

    .event-box p.download::before,
    .event-box p.video::before,
    .event-box p.new-link::before {
        font-weight: 400;
    }

    .event-box strong {
        display: block;
    }

    .media-content-wrapper div {
        height: auto;
    }

    .media-text-wrapper {
        margin-top: 50px;
    }

    .media-text .textbox {
        margin: 0 auto;
    }

    .media-text li {
        padding: 25px 20px 0 20px;
    }

    .visual-text-background {
        max-height: 150px;
    }

    .visual-text-img {
        max-height: 50px;
    }

    .visual-text {
        font-size: 18px;
        width: 70%;
        padding: 0 0 10px 80px;
    }

    /*****************************************************************
    *********** Seitenelemente
    ******************************************************************/
    .link-main a.link-main-link::before {
        left: 25px;
    }

    .link-main a.link-main-link {
        padding: 10px 55px 10px 70px;
        font-size: 22px;
        hyphens: auto;
    }

    .link-main a.link-main-link::after {
        right: 25px;
        font-size: 40px;
    }

    .news-list .image-container {
        width: 100%;
        margin: 0;
        float: none;
    }

    .news-list .text-container {
        float: none;
        width: 100%;
        margin-top: 15px;
        overflow: hidden;
        max-width: 100%;
    }


    .news-teaser-start-wrapper {
        margin: 50px 0;
    }

    .news-teaser-text li {
        margin: 10px 0;
    }

    .news-list .image-container {
        width: 100%;
        margin: 0;
        float: none;
        min-width: unset;
    }

    .news-list .text-container {
        float: none;
        width: 100%;
        margin-top: 15px;
        overflow: hidden;
        max-width: 100%;
    }

    .overviewpages-main .image-container {
        width: 80%;
        margin: 0;
    }

    .overviewpages-main .image-container img {
        width: auto;
    }

    .material-list .listitem .listitem-col-icon {
        width: 50px;
        padding-left: 0;
        padding-right: 10px;
    }

    .material-list .item-header {
        flex-direction: column;
        gap: 10px;
    }

    .material-list .item-header .item-col-content {
        width: 100%;
    }

    .material-list .item .item-col-icon {
        padding-left: 0;
    }

    .material-list .item-header .text-container {
        padding-right: 0;
    }

    .material-list .item.has_detail .item-header {
        padding-bottom: 35px;
    }

    .material-list .item.has_detail .item-detailcanvas {
        margin-bottom: 35px;
        margin-top: -35px;
    }

    .material-list .item-header.video .image-container {
        width: 100%;
        padding-right: 0;
    }

    .material-list .item .item-detailcanvas {
        padding: 10px 0 0 0;
    }

    .material-list .item-header.video .image-container video {
        width: 100%;
    }

    .material-list .item-header .button {
        padding: 10px 20px;
        width: 180px;
    }

    .material-list .item .listitem-detailcanvas {
        padding: 20px 0 20px 60px;
    }

    .material-list .item-header.youtube .image-container .yt_video {
        width: 100%;
    }

    /*-- footer --*/
    .footer-background {
        background-size: 100% 100%;
        height: 100px;
        max-width: 100%;
    }

    .footer-column-wrapper {
        display: flex;
        flex-direction: column;
        align-content: center;
        text-align: center;
        margin-bottom: -10px;
    }

    #footer-canvas .column {
        margin: 0 auto;
        padding: 30px 0 0 0;
        width: 100%;
    }

    #footer-canvas .logo-column {
        display: flex;
        justify-content: center;
    }

    #footer-canvas .socialmedia-icons {
        margin: 0 auto;
        display: inline-flex;
    }

    /*#### ELEMENTE ####*/
    .text-contentbox strong {
        font-size: 20px;
    }

    .person-main .person-container .content-container {
        padding: 10px;
    }

    .person-main .headline {
        font-size: 22px;
    }

}

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

    .lang-selector .lang-text {
        display: none !important;
    }

    /*#### gallery-list #####*/
    .gallery-list-main .item {
        width: 100%;
        margin-left: 0;
    }

    .lang-selector {
        width: 115px;
    }

    /*****************************************************************
    *********** Document
    ******************************************************************/
    /*****************************************************************
    *********** Allgemeine Selektoren
    ******************************************************************/
    /*****************************************************************
    *********** Header
    ******************************************************************/
    /*****************************************************************
    *********** Footer
    ******************************************************************/
    #footer-canvas .column {
        width: 100%;
        padding-bottom: 25px;
    }

    /*****************************************************************
    *********** Content
    ******************************************************************/
    /*****************************************************************
    *********** Seitenelemente
    ******************************************************************/
    /* overviewpages-main */
    .overview-item-container .overview-item:nth-child(2) {
        margin-right: 0;
    }

    .overview-item-container {
        flex-direction: column;
    }

    .overview-item-container .overview-item {
        flex-basis: 100%;
        margin-right: 0;
        margin-bottom: 30px;
    }

    .overviewpages-main .text-container {
        height: auto;
        width: auto !important;
        display: flex;
    }

    .text-image-main .left-column .text, .text-image-main .right-column .text {
        box-sizing: border-box;
        max-width: 100%;
        position: relative;
        transform: translateY(0%);
        top: 0;
    }

    .text-image-main .left-column {
        width: 100%;
        float: none;
        height: auto;
        overflow: hidden;
    }

    .text-image-main .right-column {
        width: 100%;
        overflow: hidden;
        float: none;
        height: auto;
    }

    .text-image-main .left-column .text {
        padding: 25px 40px !important;
        text-align: left;
    }

    .text-image-main .left-column .text {
        padding: 0 !important;
        text-align: left;
    }

    .scroll-to-top-div {
        width: 100% !important;
        bottom: 0 !important;
        left: 0;
        background-color: #D7AE86;
    }

    #scroll-to-top {
        display: block;
        margin: auto;
        width: 75px !important;
    }

    .info-teaser-main .info {
        width: 100%;
        margin: 10px 0;
    }

    .pageelement-contactform .contactform-content .contactform-contact-box .contactform-contact .text {
        padding: 0;
    }

    .contactform .textbox {
        width: 80% !important;
        margin: 10px 0;
    }

    .contactform .form-row.nachricht {
        display: block;
    }

    .contactform #nachricht {

        width: 80%;
        margin-top: 10px;
    }

    .contactform .button-submit {
        width: 100%;
        margin-left: 10px !important;
    }

    .gallery-image {
        width: 100%;
        margin: 0 0 5px;
    }

    .slick-prev, .slick-next {
        background-size: 65%;
    }

    .ort-input {
        width: calc(70% - 30px);
    }

    /* visual-text-main */
    .visual-text {
        padding: 0 0 0 80px;
    }
}

@media only screen and (max-width: 440px) {
    #logo .logo-img {
        display: none;
    }

    #logo .logo-mobile-img {
        display: block;
    }
}

@media only screen and (max-width: 420px) {
    /*****************************************************************
    *********** Seitenelemente
    ******************************************************************/
    .gallery-list-main, .gallery-container {
        grid-template-columns: 1fr;
        grid-gap: 16px;
    }

    /* visual-text-main */
    .visual-text {
        font-size: 16px;
        padding: 0 0 0 70px;
        line-height: 16px;
    }

    .visual-text-img {
        margin-left: -10px;
    }

    /* media-text */
    .media-text .text-container {
        padding: 25px 25px;
    }

    .pageelement-contactform .contactform-content .contactform-contact-box .contactform-contact .text .website .abbreviated {
        display: inline-block;
    }

    .pageelement-contactform .contactform-content .contactform-contact-box .contactform-contact .text .website .full {
        display: none;
    }
}