/*Wenn die Auflösung größer 100dpi wird aktieviere das Stylesheet für Smartphones*/

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

    html,
    body {
        min-width: 320px;
        max-width: 100%;
        min-height: 100vh;
        max-height: 100vh;
    }


    body {
        font-size: 14px !important;
    }

    .header {
        position: relative;
    }

    .header .main_content {
        width: 100%;
    }
    
    .button_tuerkis {
        position: static;
        display: block;
    }
    
   

    .header .genericon-menu {
        display: block;
        position: absolute;
        z-index: 999;
        right: 16px;
        right: 1rem;
        top: 28px;
        top: 1.75rem;
        font-size: 32px;
        font-size: 2rem;
    }

    .header #top_navi {
        display: none !important;
    }

    #top_navi_mobile ul {
        list-style: none;
        text-align: left;
        margin: 30px 0 0 16px;
        margin: 1.875rem 0 0 1rem;


    }

    #top_navi_mobile li {
        text-transform: uppercase;
        display: block;
        margin-bottom: 16px;
        margin-bottom: 1rem;
        border-bottom: #ECECEC solid;
    }

    #top_navi_mobile ul li a {
        font-size: 16px;
        font-size: 1rem;
        font-weight: bold;
        color: white;
        text-decoration: none;
    }

    .container {
        margin: 0px;
    }

    .header {
        margin: 0;
        padding: 0;
    }

    /*Aufzaehlungslistenklasse*/
    .ul_background {
        padding: 0px 0 0px 0px;

    }

    #bankfin_tab {
        display: none;
    }

    .main .main_content h1 {
        font-size: 20px!important;
        font-size: 1.25rem;
        color: #707070;
        margin-top: 16px;
        margin-top: 1rem;
        margin-bottom: 16px;
        margin-bottom: 1rem;
    }

    .main .main_content h2 {
        font-size: 20px!important;
        font-size: 1.25rem!important;
        margin: 20px 0 16px 0;
        margin: 0.625rem 0 0.625rem 0;
        font-weight: 600;
        color: black;

    }

    .main .main_content h3 {
        font-weight: 600;
        margin: 20px 0 10px 0;
    }

    .main .main_content p, .main .main_content li {
        line-height: 138.7%;
        margin-bottom: 0px!important;
        font-size: 14px!important;
    }

    .main .main_content ul {
        position: relative;
        margin: 10px 0 10px 0px;
        margin: 0.625rem 0 0.625rem 0rem !important;
        line-height: 150%;
        text-align: left;
    }

    .main .main_content b {
        font-weight: 600;
        margin-bottom: 15px;
        margin-bottom: 0.9375rem;
    }

    /*Textformatierung footer*/
    .footer b,
    .footer h2 {
        margin-bottom: 7px;
        margin-bottom: 0.4375rem;
    }

    .main_sidebar_content {
        display: none !important;
    }

    .main_content {
        width: 100%;
        padding: 0 16px 0 16px !important;
    }

    .main_placeholder_content {
        display: none;
    }

    .left_side_placeholder_content {
        display: none;
    }

    .right_side_placeholder_content {
        display: none;
    }

    #footer_top {
        background: white;
    }

    #footer_center {
        padding: 8px 0 32px 5px;
        padding: 0.5rem 0 2rem 0.125rem;
        /*font-size: 8px;
        font-size: 0.5rem;*/
        font-size: 14px;
        box-sizing: border-box;
        position: relative;

    }

    #footer_center .main_content {
        position: relative;

    }

    #footer_center .main_content #logo {
        position: static;
        display: block;
        top: 0px;
        right: 16px;
        width: 250px;
        max-width: 80%;
    }

    #footer_center .main_content #info_logo {
        position: static;
        display: block;
        width: 100%;
        height: auto;
        max-width: 100%;
        margin-bottom: 50px;
        margin-top: 10px;
    }

    #footer_center .main_content #logo2 {
        position: static;
        display: block;
        top: 0px;
        right: 16px;
        width: 250px;
        max-width: 80%;
        margin-top: 10px;
    }

    #footer_center .main_content #info_logo2 {
        position: static;
        display: block;
        width: 100%!important;
        height: auto;
        max-width: 100%;
        margin-bottom: 50px;
        margin-top: 20px
    }

    #footer_center .main_content #info_logo3 {
        position: static;
        display: block;
        width: 100%x;
        height: auto;
        max-width: 100%;
        margin-bottom: 50px;
        margin-top: 10px
    }

    #footer_center .main_content #info_logo4 {
        position: static;
        display: block;
        width: 100%;
        height: auto;
        max-width: 100%;
        margin-bottom: 50px;
        margin-top: 10px
    }

    #footer_center .main_content #info_logo5 {
        position: static;
        display: block;
        width: 100%;
        height: auto;
        max-width: 100%;
        margin-bottom: 50px;
        margin-top: 10px
    }

    #footer_center .main_content #gotop {
        position: static;
        cursor: pointer;
        margin: 0;
        bottom: 5px;
        right: 16px;
        z-index: 100;
    }

    #footer_center .main_content #gotop img {
        width: 10vw;
    }

    #footer_center .main_content .adress1,
    #footer_center .main_content .adress2,
    #footer_center .main_content .adress3 {
        margin-right: 0px;
        margin-bottom: 14px;
    }

    #footer_center .main_content .adress1,
    #footer_center .main_content .adress2,
    #footer_center .main_content .adress3 {
        display: block;
        margin-top: 0.0em;
    }

    #footer_center .main_content .adress3 {
        margin-top: 0x;
        margin-top: 0rem;
    }

    #footer_center .main_content h2,
    #footer_center .main_content b {
        font-weight: bold;
        /*font-size: 9px;
        font-size: 0.5625rem;*/
        font-size: 14px;
    }

    .header #logo_top {
        width: 250px;
        max-width: 85%;
        display: block;
        float: left;
        overflow: hidden;
        clear: both;
        padding: 6px 0 12px 0;
        padding: 0.375rem 0 0.75rem 0;

    }

    br {
        line-height: 40%;
    }

    .footer hr {
        margin: 15px 0px 10px 0px;
        margin: 0.9375rem 0rem 0.625rem 0rem;
    }

    #banner {
        display: none;
    }

    .header #header_mobile {
        display: block;
    }

    #header_mobile hr {
        clear: both;
        margin: 10px 0px;
        margin: 0.625rem 0rem;
    }

    .content article {
        margin-top: 15px;
        margin-top: 0.9375rem;
        margin-bottom: 0px;
    }

    .content section {
        margin-top: 0px;
        padding: 0px;
        /*abstände links,rechts von 14px auf 0px setzen*/
    }

    .content aside section {
        margin-top: 0px;
    }

    /*Platzhalter für Client_opinion*/
    #client_opinion ul li {
        font-size: 14px !important;
        font-style: italic;
        text-align: left;
        width: 25%;
        float: left;
        clear: both;
        margin: 0px 0px 12px 0px;
        margin: 0px 0px 0.75rem 0px;
        padding: 10px 0px 0px 0px;
        display: none;
        border-right: none;
    }

    #client_opinion ul li:first-child,
    #client_opinion ul li:nth-child(2) {
        display: block;
        margin-bottom: 24px;
    }

    /*Ende*/
    /*Inhalt formatierung*/

    .introduction {
        text-align: left;
        margin-bottom: 0px;
        margin-bottom: 0rem;
    }

    .about_person {
        /*height: 100%;*/
		height: auto;
        display: block;
        overflow: hidden;
        text-align: left;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-bottom: 0rem;


    }

    .about_person #img_block {

        width: 250px;
        max-width: 25%;
        display: block;
        float: left;
        margin: 0px 16px 0px 0;
        margin: 0rem 1rem 0rem 0;
        overflow: hidden;
        text-align: center;
    }

    .about_person #img_block img {
        width: 100%;
        max-width: 100%
    }

    .img_block_r {
        width: 250px;
        max-width: 25%;
        display: block;
        float: right;
        margin: 0px 16px 0px 0;
        margin: 0rem 1rem 0rem 0;
        overflow: hidden;
        text-align: center;
    }

    .about_person #img_block_r img {
        width: 100%;
        max-width: 100%
    }

    .about_person #img_block_r1 {
        width: 100%;
        max-width: 100%;
        display: block;
        overflow: hidden;
        text-align: left;

    }

    .about_person #img_block_r2 {
        width: 100%;
        max-width: 100%;
        display: block;
        overflow: hidden;
        text-align: left;

    }

    .about_person #img_block_r3 {
        width: 100%;
        max-width: 100%;
        display: block;
        overflow: hidden;
        text-align: left;

    }


    .about_person #img_block_toc {
        max-width: 100%;
        display: block;
        overflow: hidden;
        color: #fff;
        line-height: 2em;
        background-color: #55AEBE;
        padding: 1em;
        margin: 0;
        text-align: left;
    }

    .about_person #img_block_toc_l {
        clear: both;
        max-width: 100%;
        display: block;
        overflow: hidden;
        text-align: left;
    }

    .about_person #ximg_block_toc a {
        color: #fff;
    }


    .img_block_l {

        width: 100%;
        max-width: 100%;

        overflow: hidden;
        text-align: left;
    }

    .img_block_l img {
        width: 100%;
        max-width: 100%
    }

    .img_block_3 {
        width: 100%;
        max-width: 100%;
        display: block;
        margin: 16px;
        margin-left: 0px;
        overflow: hidden;
        
    }
    
    .mob_center {
        text-align: center!important;
        margin:16px 0!important;
    }
    
    .img_block_3 img { 
     margin: 0 auto!important;
    }

    .img_block_4 {


        width: 100%;
        max-width: 100%;
        display: block;
        margin: 16px;
        margin-left: 0px;
        overflow: hidden;
        text-align: left;


    }

    .img_block_5 {


        width: 100%;
        max-width: 100%;
        display: block;
        margin: 16px;
        margin-left: 0px;
        overflow: hidden;
        text-align: left;


    }

    .img_block_6 {


        width: 100%;
        max-width: 100%;
        display: block;
        margin: 16px;
        margin-left: 0px;
        overflow: hidden;
        text-align: left;


    }

    .img_block_7,
    .about_person .img_block_7 {

        min-height: 100px!important;
        width: 90%;
        max-width: 90%;
        display: block;
        margin: 6px!important;
        margin-left: 0px;
        overflow: hidden;
        text-align: left;

    }

    .img_block_3 img {
        width: 100%;
        max-width: 100%
    }

    .about_person #img_block_2 {
        width: 100%;
        max-width: 100%;
        display: block;
        margin: 0;

        overflow: hidden;
        text-align: left;
    }

    .about_person #img_block_lr {
        width: 250px;
        max-width: 25%;
        display: block;
        float: right;
        margin: 0px 0px 0px 0;
        margin: 0rem 1rem 0rem 0;
        overflow: hidden;
        text-align: left;
    }

    .about_person #img_block_lr img {
        width: 100%;
        max-width: 100%
    }

    .about_person #img_block100 {


        max-width: 90%;
        display: block;
        overflow: hidden;
        text-align: center;
    }

    .about_person #img_block100 img {
        width: 90%;
        max-width: 90%
    }



    .about_person #div_top {
        margin-left: 0;
        margin-top: 1em;
        max-width: 100%;
        background-color: #003C72;
    }

    .about_person #img_top {
        width: 100%;
    }

    #infografik {
        width: 100%;
    }

    .about_person #text_top {
        display: none;
    }

    .about_person #div_top2 {
        margin-left: 0;
        margin-top: 1em;
        max-width: 100%;
        background-color: #55AEBE;
    }

    .about_person #img_top2 {
        width: 100%;
    }

    .about_person #text_top2 {
        display: none;
    }

    .about_person #text_top3 {
        display: none;
    }

    .about_person #img_top3 {
        width: 100%;
    }


    .about_person #img_block_profil {
        width: 100%;
        max-width: 100%;
        display: block;
        overflow: hidden;
        text-align: center;
        border: none;
    }

    .about_person #img_block_profil img {
        width: 100%;
        max-width: 100%;
        margin: 0;
        margin-bottom: 2em;
        border: none;

    }

    .about_person #text_profil {
        width: 90%;
        max-width: 90%;
        margin: 0;
        border-left: 1px solid #E4A700;
        padding-top: 2em;
        margin-top: 1em;



    }

    .about_person #profil_links {
        width: 100%;
        max-width: 100%;
        display: block;
        border: none;
        overflow: hidden;
        margin: 0;
        padding: 0;

    }

    .about_person #profil_rechts {
        width: 100%;
        max-width: 100%;
        display: block;
        overflow: hidden;
        border: none;
        margin: 0;
        padding: 0;
    }

    .about_person #text_rechts {
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding-top: 2em;
        margin-top: 1em;



    }

    .about_person ul {
        margin: 0;
        padding: 0;
    }

    .about_person li {
        margin: 0;
        padding: 0;
    }



    .short_info_1,
    .short_info_2 {
        width: 100%;
        display: block;
        text-align: left;
        margin-top: 0;
        margin-bottom: 0;

    }

    .short_info_1 {
        float: none;
        padding-right: 0%;
    }

    #inserat {
        font-weight: bold;
        font-size: 14px;
        font-size: 0.875rem;
    }

    .header .second_nav {
        margin-left: 0;
        min-width: 0;
    }

    .header .second_nav ul {
        text-align: left;
        margin: 16px 0 16px 0px;
        margin: 1rem 0 1rem 0rem;
        padding-left: 0px;

    }

    .header .second_nav ul.multiline1 {
        margin-bottom: 0.3125rem !important;
    }

    .header .second_nav ul.multiline2 {
        margin-top: 0 !important;
    }

    .header .second_nav li {
        display: block !important;
        margin-bottom: 5px;
        margin-bottom: 0.3125rem;
        padding: 0px;
    }

    .header .second_nav li:first-child {
        margin: 0px;
        margin-bottom: 5px;
        margin-bottom: 0.3125rem;

    }

    .header .second_nav li:last-child {
        margin: 0px;
        padding: 0px;

    }

    .header .second_nav li a:focus {
        border: none;
    }

    /*formstyle kontakt.php*/
    .kontakt .main_content form {
        width: 100%;
        display: table;
        border-collapse: separate;
        border-spacing: 6px;
    }

    .kontakt .main_content form .row {
        display: table-row;
    }

    .kontakt .main_content form .row .cell {
        width: auto;
        display: table-cell;
        padding-right: 0px;
        padding-bottom: 0px;
        vertical-align: top;
    }

    .kontakt .main_content form .row .cell:last-child {
        vertical-align: top;
    }

    .kontakt .main_content form input {
        height: 25px;
        width: 100%;
        border: 1px black solid;
    }

    .kontakt .main_content form textarea {
        height: 100px;
        width: 100%;
        max-width: 100%;
        max-height: 100px;
        border: 1px black solid;
    }

    .kontakt .main_content form button {
        margin: 1em 0 1em 0;
        border: medium none;
        cursor: pointer;
        display: block;
        width: 120px;
        height: 30px;
        background-color: #ECECEC;
        color: #707070;
        font-weight: 600;
        font-size: 0.9375em;
        text-align: left;
        padding-left: 40px;
        overflow: hidden;
        position: relative;
    }

    .kontakt .main_content form button span {
        color: #707070;
        font-weight: 600;
    }

    .kontakt #sendData:before {
        content: '\f410';
        font-family: Genericons;
        font-size: 2rem;
        text-decoration: none;
        position: absolute;
        left: 0;
        top: -3px;
    }

    .kontakt #sendData:hover {
        margin: 1em 0 1em 0;
        border: medium none;
        cursor: pointer;
        display: block;
        width: 120px;
        height: 30px;
        background-color: #ECECEC;
        color: #E2A612;
        font-weight: 600;
        font-size: 0.9375em;
        text-align: left;
        padding-left: 40px;
        overflow: hidden;
        position: relative;
    }

    #map_duess {
        width: 100%;
        height: 180px;
        display: block;
        margin: 10px 0 10px 0;
    }

    #map_koeln {
        width: 100%;
        height: 180px;
        display: block;
        margin: 10px 0 10px 0;
    }

    #map_bochum {
        width: 100%;
        height: 180px;
        display: block;
        margin: 10px 0 20px 0;
    }
    
    .button_blau {
        margin-top: 20px;
        text-align: center;
    }
    
     body.rbw .img_block_3 {
        max-width: none!important;
        width:100%!important;
    }
    
    body.rbw .img_block_3 img {
        max-width: none!important;
        width:100%!important;
    }
    
    .k-rbw {
        height:auto!important;
    }
}

/*#########################*/

@media only screen and (max-width: 320px) {
    #sb-site {
        width: 100% !important;
        padding: 0 !important;
        display: block;
    }
    
    .main_content {
        width:92%!important;
        margin: 0 auto!important;
        padding:0!important;
    }
    
    .tab_cell {
        display:block!important;
    }
    
    .main .main_content h1, .main .main_content h2 {
        font-size:18px!important;
    }
    .img_block_5, .img_block_7 {
        margin:0!important;
        width:100%!important;
        max-width: 100%!important;
        padding:0!important;
    }
    
    .img_block_7, .about_person .img_block_7 {
        min-height: 100px!important;
    width: 100%;
    max-width: 100%;
    margin: 0px!important;
    overflow: visible;
    text-align: left;
    }
    
    .img_block_7, .about_person .img_block_7 p {
        padding:10px;
    }
    
    .main_sidebar_content {
        display: none !important;
    }
    
    #backward-button {
        display:none!important;
    }
    
     body.rbw .img_block_3 {
        max-width: none!important;
        width:100%!important;
    }
    
    body.rbw .img_block_3 img {
        max-width: none!important;
        width:100%!important;
    }
	
	.about_person {
    height: auto !important;;
    display: block;
	}
	
	.container {
    height: auto !important;
    width: auto;
    display: table;
    margin: 0 8px 8px 8px;
	}
	
}


#tab_bankfin {
    width: 90%;
}


/*#########################*/


@media only screen and (max-width: 320px) {
    .about_person li span.bold {
        display: block;
    }
}


#tab_bankfin {
    width: 90%;
}