/*
        author: tl | lurgenstein@digitalroyal.de
*/

@media only screen and (max-width: 640px) {
    .clearfix_mobil:before, .clearfix_mobil:after {
        content: "";
        display: table;
    }

    .clearfix_mobil:after {
        clear: both;
    }

    .clearfix_mobil {
        zoom: 1;
    }

    /* IE7-Patch clearfix_mobil*/
    *:first-child + html .clearfix_mobil {
        min-height: 0;
    }

    #content .page.termin_interessent {
        width: 100%;
    }

    #wrapper {
        margin-top: 57px;
        min-height: calc(100vh - 57px - 73px - 40px);
    }

    #bg {
        display: none;
    }

    .contentheader {
        margin: 0;
        padding: 0 0;
        width: 100%;
        background-color: var(--primary-01-contrast);
        text-align: center;
    }

    .contentheader .icon {
        float: none;
        margin: 20px auto 0;
        width: 144px;
        height: 154px;
    }

    .contentheader .icon span {
        font-size: 95px;
    }

    .contentheader .icon span:after {
        top: -23px;
        margin-left: -10px;
        width: 22px;
        height: 22px;
    }

    .contentheader .headline {
        float: none;
        background-color: transparent;
        margin: 0 auto;
        height: auto;
    }

    .contentheader .headline h1,
    .contentheader .headline h2 {
        color: var(--primary-01);
        text-align: center;
        padding: 0 25px 20px;
        font-size: 18px;
        line-height: 1.2
    }

    #headerwrapperholder {
        height: 58px;
    }

    #header {
        height: 57px;
    }

    #header h1,
    #header h2.h1 {
        font-size: 16px;
        line-height: 58px;
    }

    #header .logo-sk {

    }

    #header .logo-sk .text {
        display: none;
    }

    #header .logo-sk .icon-logo-sk {
        font-size: 25px;
        left: -22px;
        top: -6px;
    }

    #headerwrapper .simulator {
        display: none !important;
    }

    #headerwrapper .simulator_opener {
        display: none !important;
    }

    .input_prename, .input_name {
        float: none;
        width: 99%;
    }

    .input_birth, .input_email {
        float: none;
        width: 99%;
    }

    .input_birth p, .input_email p {
        margin-bottom: 10px;
        padding-left: 0;
        padding-right: 20px;
        box-sizing: border-box;
    }

    .error_bg, .success_bg {
        width: 301px;
    }

    .error_head, .success_head {
        font-size: 18px;
    }

    .error_copy, .success_copy {
        width: 178px;
    }

    h1,
    h2.h1 {
        margin-left: 20px;
        margin-right: 20px;
        font-size: 24px;
        line-height: 24px;
    }

    h2 {
        margin-left: 20px;
        margin-right: 20px;
    }

    p {
        padding: 0 15px;
        font-size: 12px;
    }

    .innerContent {
        padding: 20px 0 25px 0;
    }

    .innerContent .inner_headline {
        font-size: 16px;
    }

    .footer_right .logotext {
        display: none !important;
    }

    .footer_right .logo-sk {
        display: inline-block;
        float: none;
        text-align: left;
    }

    .themenHeader h1,
    .themenHeader h2.h1 {
        font-size: 18px;
        line-height: 21px;
    }

    .themenHeader .choose {
        display: none;
    }

    .themenHeader.active {
        margin-bottom: -14px;
        padding-bottom: 10px;
    }

    .themenHeader .dropdown_holder {
        display: inline-block;
        margin-top: 10px;
    }

    .themenFooterLink p {
        font-size: 17px;
        line-height: 22px;
        margin-bottom: 10px;
    }

    /*videoChatHeader*/
    .videoChatHeader {
        padding-bottom: 1px;
    }

    .videoChatHeader .innerCenter {
        padding: 0 0;
    }

    .videoChatHeader h1,
    .videoChatHeader h2.h1 {
        font-size: 18px;
        line-height: 21px;
    }

    /*filialList*/
    .filialList .innerCenter,
    .beraterList .filialList .innerCenter {
        padding: 0 0;
    }

    .filialList .innerCenter.imageSlider, .beraterList .filialList .innerCenter.imageSlider {
        padding: 0 0;
    }

    .filialList h1,
    .filialList h2.h1 {
        font-size: 18px;
        line-height: 21px;
    }

    .filialList .contentdivider {
        display: none;
    }

    .filialList .header {
        margin-bottom: 10px;
    }

    .filialList .innerCenter .left {
        float: none;
        text-align: center;
        margin-left: 0;
        width: 100%;
        margin-top: 10px;
    }

    .filialList.innerContent .left p {
        font-size: 16px;
        background-color: var(--readable-02);
        padding: 10px;
    }

    .filialList .icon-marker {
        display: none;
    }

    .filialList.innerContent .count {
        color: var(--primary-01-contrast);
    }

    .filialList .innerCenter .right {
        float: none;
        text-align: center;
        width: 100%;
        margin-top: 15px;
        clear: both;
    }

    .filialList .dropdown_holder {
        width: 273px;
        margin: 5px 4px 5px 4px;
    }

    .filialList.innerContent .right p {
        font-size: 14px;
        margin-left: 10px;
        margin-right: 10px;
    }

    .filialList.innerContent .right p .text {
        display: block;
    }

    .search_plz_input {
        width: 273px;
        margin: 5px 4px 0 4px;
    }

    .filialList .icon-close {
        margin-top: 20px;
    }

    .filialList .scrollcontent_holder,
    .beraterslider .scrollcontent_holder {
        width: 279px;
        height: 118px;
        margin: 0 auto;
        position: relative;
    }

    .col2 .scrollcontent_holder {
        height: 236px;
    }

    .filialList .imageSlider .scrollcontent_holder,
    .beraterslider .scrollcontent_holder {
        width: calc(100% - 12px);
        height: 218px;
    }

    .filialList .col2.imageSlider .scrollcontent_holder,
    .beraterslider.col2 .scrollcontent_holder {
        height: 436px;
    }

    .filialList .listElement.active .arrow {
        border-top: 13px solid var(--success-01);
        bottom: -15px;
    }

    .filialList .bt_prev,
    .beraterslider .bt_prev {
        /*margin-top: -120px;*/
        left: -10px;
        background-color: var(--primary-01-contrast);
        box-shadow: 0 0 6px 0;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
        padding-right: 14px;
        z-index: 1222;
    }

    .filialList .bt_next,
    .beraterslider .bt_next {
        /*margin-top: -120px;*/
        right: -10px;
        background-color: var(--primary-01-contrast);
        box-shadow: 0 0 6px 0;
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
        padding-left: 14px;
        z-index: 1223;
    }

    .filialList .scrollcontent_holder:before,
    .beraterslider .scrollcontent_holder:before {
        content: '';
        display: block;
        position: absolute;
        background: -moz-linear-gradient(left, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 0) 100%);
        background: -webkit-linear-gradient(left, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(to right, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 0) 100%);
        width: 55px;
        height: 218px;
        z-index: 1111;
        top: 5px;
        left: -60px;
        transition: left .3s;
    }

    .filialList .col2 .scrollcontent_holder:before,
    .beraterslider.col2 .scrollcontent_holder:before {
        height: 440px;
    }

    .filialList .scrollcontent_holder:after,
    .beraterslider .scrollcontent_holder:after {
        content: '';
        display: block;
        position: absolute;
        background: -moz-linear-gradient(right, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 0) 100%);
        background: -webkit-linear-gradient(right, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(to left, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 1) 48%, rgba(255, 255, 255, 0) 100%);
        width: 55px;
        height: 218px;
        z-index: 1111;
        right: -60px;
        top: 5px;
        transition: right .3s;
    }

    .filialList .col2 .scrollcontent_holder:after,
    .beraterslider.col2 .scrollcontent_holder:after {
        height: 440px;
    }

    .beraterslider .copyContent .entry {
        margin-left: 9px;
    }

    .innerCenter.imageSlider .beraterslider .copyContent .entry {
        margin-left: 9px;
    }

    .filialList .no_result {
        font-size: 14px;
        line-height: 14px;
    }

    .filialList .footer .subline {
        width: 270px;
    }

    .filialList .footer .subsubline {
        font-size: 14px;
        width: 270px;
        margin-top: 5px;
    }

    .filialList .footer .subsubline.choose {
        margin-top: 0;
        display: block;
    }

    /*----------*/
    .videoChatHeader .choose,
    .filialList .choose,
    .beraterList .choose {
        padding: 0 10px;
        /*max-width: 290px;*/
    }

    .videoChatHeader .chooseButton,
    .filialList .chooseButton,
    .beraterList .chooseButton {
        width: calc(50% - 6px);
        padding: 0 5px;
    }

    .videoChatHeader .chooseButton p,
    .filialList .chooseButton p,
    .beraterList .chooseButton p {
        font-size: 15px;
    }

    /*beraterList*/
    /*filialList*/
    .beraterList .innerCenter {
        padding: 0 0;
    }

    .beraterList .innerCenter.imageSlider {
        padding: 0 0;
    }

    .beraterList h1,
    .beraterList h2.h1 {
        font-size: 18px;
        line-height: 21px;
    }

    .beraterList .contentdivider {
        display: none;
    }

    .beraterList .header {
        margin-bottom: 10px;
    }

    .beraterList .innerCenter .left {
        float: none;
        text-align: center;
        margin-left: 0;
        width: 100%;
        margin-top: 10px;
    }

    .beraterList.innerContent .left p {
        font-size: 16px;
        background-color: var(--readable-02);
        padding: 10px;
    }

    .beraterList .icon-berater {
        display: none;
    }

    .beraterList.innerContent .count {
        color: var(--primary-01-contrast);
    }

    .beraterList .innerCenter .right {
        float: none;
        text-align: center;
        width: 100%;
        margin-top: 15px;
        clear: both;
    }

    .beraterList.innerContent .right p {
        font-size: 14px;
        margin-left: 10px;
        margin-right: 10px;
    }

    .beraterList.innerContent .right p .text {
        display: block;
    }

    .beraterList .search_plz_input {
        margin: 5px 4px 0 4px;
        font-size: 12px;
        max-width: 90%;
    }

    .beraterList .icon-close {
        margin-top: 20px;
    }

    .beraterList .no_result {
        font-size: 14px;
        line-height: 14px;
    }

    .beraterList .footer .subline {
        width: 270px;
    }

    .beraterList .footer .subsubline {
        font-size: 14px;
        width: 270px;
        margin-top: 5px;
    }

    .beraterList .footer .subsubline.choose {
        margin-top: 0;
        display: block;
    }

    /*------------*/
    /* Calendar */
    .calendarNavi .tab:nth-child(5) {
        display: none;
    }

    .calendarNavi .tab:nth-child(6) {
        display: none;
    }

    .calendarNavi .tab:nth-child(7) {
        display: none;
    }

    .calendarNavi .tab:nth-child(8) {
        display: none;
    }

    .calendar .days {
        float: none;
        width: auto;
        max-width: 100%;
        margin-bottom: 10px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .calendar .days .day_page {
        width: 100%;
        box-sizing: border-box;
    }

    .calendar .day {
        margin-right: 2px;
        width: calc(20% - 2px);
        max-width: none;
        margin-bottom: 6px;
    }

    .calendar .day .bt_day,
    .calendar .day.small .bt_day {
        height: 45px;
        line-height: 45px;
        font-size: 19px;
    }

    .calendar .day .day_arrow,
    .calendar .day.small .day_arrow {
        top: 69px;
    }

    .calendar .days .day_page .header .datum {
        font-size: 16px;
    }

    .calendar .days .day_page .header .count {
        font-size: 16px;
    }

    .calendar .days .day_page .inner .headline {
        font-size: 14px;
    }

    .calendar .days .choose_day {
        margin-bottom: 15px;
        font-size: 14px;
        padding: 0 15px;
    }

    .desc {
        float: none;
        width: auto;
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .desc_week_legende {
        float: none;
        width: auto;
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
        margin-top: -5px;
        margin-bottom: 15px;
    }

    .desc_week_legende .week {
        float: left;
        font-size: 14px;
        margin-top: 3px;
    }

    .desc_week_legende .calendarMonth {
        float: right;
        font-size: 17px;
    }

    .desc_week_legende .legende {

    }

    .desc_week_legende .legende .label {
        display: block;
    }

    .desc .address .bt_filiale {
        display: block;
        width: 100%
    }

    .desc .address .cont_left, .desc .address .cont_right, .desc .slot .cont_left, .desc .slot .cont_right {
        float: none;
        margin: 0;
    }

    .desc .address .cont_left .label,
    .desc .address .cont_left .head,
    .desc .address .cont_left .gst,
    .desc .address .cont_left .street,
    .desc .address .cont_left .plz,
    .desc .address .cont_left .phone,
    .desc .slot .cont_left .label,
    .desc .slot .cont_left .date,
    .desc .slot .cont_left .time {
        text-align: center;
    }

    .desc .address .cont_left .label, .desc .slot .cont_left .label, .desc .berater .cont_left .label, .desc .dropdown_berater .label {
        font-size: 16px;
    }

    .desc .address .cont_left .head,
    .desc .address .cont_left .gst,
    .desc .address .cont_left .street,
    .desc .address .cont_left .plz,
    .desc .slot .cont_left .date,
    .desc .slot .cont_left .time,
    .desc .berater .cont_left .salutation,
    .desc .berater .cont_left .name {
        font-size: 18px;
    }

    .desc .address .cont_right .icon-marker {
        display: none;
    }

    .desc .address .cont_right .map {
        display: none;
    }

    .desc .address .cont_right .map.mobil {
        display: block;
    }

    .choose_day_on_berater .address .cont_left, .choose_day_on_berater .address .cont_right {
        float: none;
        margin: 0;
    }

    .choose_day_on_berater .address .cont_right .icon-marker {
        display: none;
    }

    .choose_day_on_berater .address .cont_right .map {
        display: none;
    }

    .choose_day_on_berater .address .cont_right .map.mobil {
        display: block;
    }

    .desc .slot .cont_right .cal {
        display: none;
    }

    .desc .slot .cont_right .cal.mobil {
        display: block;
    }

    .desc .confirm .headline {
        text-align: center;
    }

    .desc .dropdown_berater .label, .desc .dropdown_berater .counter {
        text-align: center;
    }

    .desc .matrix_berater .label, .desc .matrix_berater .counter {
        text-align: center;
    }

    .dropmenu .right .salutation {
        font-size: 17px;
    }

    .dropmenu .right .name {
        font-size: 19px;
    }

    .dropmenu .right {
        margin-top: 13px;
        margin-left: 10px;
        max-width: 100%;
    }

    .desc .dropdown_berater .counter {
        font-size: 11px;
    }

    .desc .berater {
        text-align: center;
    }

    .desc .matrix_berater .counter {
        font-size: 11px;
    }

    .beratermatrix {
        text-align: center;
    }

    .beratermatrix .entry {
        width: 160px;
        height: 218px;
    }

    .beratermatrix .entry .address {
        padding-top: 220px;
    }

    .beratermatrix .entry .name {
        max-width: 125px;
    }

    .calendar .userdata {
        padding: 0 10px;
    }

    .calendar .userdata .headline {
        font-size: 18px;
    }

    .calendar .userdata .required {
        position: relative;
        right: auto;
        left: 3px;
        top: -10px;
        margin: 0;
        text-align: left;
    }

    .calendar .userdata .telefonnummer .left {
        margin-bottom: 10px;
        width: calc(100% - 20px);
    }

    .calendar .userdata .telefonnummer .right {
        width: 100%;
        float: left;
        margin: 0 auto;
    }

    .calendar .immobiliendata {
        width: calc(100% + 20px);
        left: -10px;
        padding: 0 10px;
    }

    .calendar .immobilien_sliderHolder {
        margin-bottom: 20px;
    }

    .calendar .immobiliendata .subline {
        font-size: 13px;
    }

    .calendar .immobiliendata .subline {
        font-size: 13px;
    }

    .calendar .immobiliendata .immobilien_dropdownHolder_type {
        width: 100%;
    }

    .calendar .immobiliendata .immobilien_use_sliderHolder {
        width: auto;
        float: none;
    }

    .calendar .immobiliendata .form_text,
    .calendar .immobiliendata #immobilien_found_input,
    .calendar .immobiliendata #immobilien_plz_input,
    .calendar .immobiliendata #immobilien_costs_input {
        width: 100%;
    }

    .innerContent .options {
        padding: 20px 10px 10px 10px;
    }

    .innerContent .options .overline {
        margin-left: -45px;
        left: 50%;
    }

    .innerContent .options .headline {
        font-size: 13px;
    }

    .innerContent .box_checkbox {
        float: none;
        width: auto;
        padding: 0;
    }

    .innerContent .box_checkbox .copy {
        padding: 0;
        max-width: 270px;
        margin: 0;
    }

    .innerContent .options .right {
        float: none;
        width: auto;
        padding: 0;
    }

    /*----------*/
    .innerContent .checkbox {
        margin-top: 0;
    }

    .innerContent .dsgvo {
        padding: 0 40px;
    }

    .bt_reserve span {
        display: none;
    }

    /*--------------*/
    /*confirmation*/
    .confirmation {
        padding-top: 0;
        margin-top: 20px;
    }

    .confirmation .header h1,
    .confirmation .header h2.h1 {
        margin: 5px 0 5px 5px;
    }

    .confirmation .header p {
        font-size: 15px;
        margin: 0 0 0 5px;
    }

    .confirmation .header .icon-checkmark {
        display: none;
    }

    .confirmation .desc .left {
        float: none;
        width: 100%;
        max-width: 100%;
    }

    .confirmation .desc .address {
        border-bottom: 1px solid var(--ui-02);
        padding: 25px 0 25px;
    }

    .confirmation .desc .berater {
        float: none;
        width: 100%;
        max-width: 100%;
    }

    .confirmation .desc .berater .cont_left .label {
        text-align: center;
    }

    .confirmation .desc .berater .cont_left .salutation {
        float: none;
        font-weight: normal;
        text-align: center;
    }

    .confirmation .desc .berater .cont_left .name {
        text-align: center;
    }

    .confirmation .desc .berater .cont_right {
        text-align: center;
    }

    /*--------------*/
    .innerContent .email .copy {
        float: none;
        width: 100%;
    }

    .innerContent .email .right {
        margin-top: 5px;
        float: none;
        width: 100%;
        text-align: left;
    }

    .loaderText, .loaderTextU {
        font-size: 14px;
        margin: 18px;
    }

    .checkSlider .slider {
        float: none;
        margin: 0 auto;
    }

    .checkSlider h2 {
        text-align: center;
        font-size: 16px;
        float: none;
    }
}

@media only screen and (max-width: 374px) {
    .beratermatrix .entry {
        width: 123px;
        height: 167px;
    }

    .beratermatrix .entry .address {
        padding-top: 167px;
    }

    .beratermatrix .entry .name {
        max-width: 98px;
        font-size: 12px;
    }

    .beratermatrix .entry .name .function {
        font-size: 11px;
    }

    .filialList .imageSlider .scrollcontent_holder.hideLeft:before,
    .beratersliderXXX .scrollcontent_holder.hideLeft:before {
        display: block;
        left: 0;
    }

    .filialList .imageSlider .scrollcontent_holder.hideRight:after,
    .beratersliderXXX .scrollcontent_holder.hideRight:after {
        display: block;
        right: 0;
    }
}