/*BankMed style sheet for mobile*/
/*Media Queries */

@media only screen and (min-width:1600px) {
    .message-banner .img-responsive {
        max-width: none;
        width: 100%; /*max-height:360px*/
    }
}

@media only screen and (max-width:1400px) {
    .timeline-content > div {
        width: 45%;
        margin-left: 19px;
    }

    .intl-content {
        width: 65%;
    }

    .flag-wrapper, .location {
        margin-left: 33%;
    }

    .service .service-title {
        max-width: 275px;
    }

    .intl-content-wrapper {
        width: 66%;
    }

    .wedding-account .inline-block.ew-second .input-field {
        width: 67%;
    }

    .wedding-account .input-field.phone-no {
        width: 62% !important;
    }
}

@media only screen and (max-width:1399px) {
    .corporate-links div.infograph {
        left: -35px;
    }

    #header #header-top .grid .top-menu ul li {
        padding: 0px 7px;
    }

    .account-number {
        width: 51% !important;
    }
}

@media only screen and (max-width:1280px) {
    .timeline-content > div {
        width: 45%;
        margin-left: 19px;
    }

    .intl-content {
        width: 50%;
    }
}

@media only screen and (max-width:1080px) {
    .fixed-contact {
    }

        .fixed-contact .rights {
            width: 30px;
            height: 30px;
        }

            .fixed-contact .rights img {
                width: 80%;
            }

    #banner {
        margin-top: 120px;
        border-bottom: 2px solid #223e6e;
    }

    .jspPane table {
        min-width: initial
    }

    .service-menu-mobile {
        display: block !important
    }

    .service-menu-web {
        display: none
    }

    /****tabs-panel*/
    .tab-content {
        width: 100%;
    }

    .tabs-panel {
        width: auto;
    }

    .recruit-content {
        width: 95%;
    }

    #header #logo-header .logo img {
        margin-top: 8px;
    }

    #header #logo-header {
        height: 83px;
        border-bottom: 1px solid #ababab;
    }
    /*********Corporate**************/
    .back-icon {
        display: none
    }

    #SectionCorporate {
        display: none
    }

    .career-banner img {
        min-width: initial
    }

    .tlh-border {
        width: 36%;
    }

    .tl-landmark {
        width: 25%;
    }

    .grid-form .input-field, .grid-form .input-field, .grid-form .input-field-textarea {
        width: 90%;
    }

    .grid-form { /*max-width:390px;*/
    }

        .grid-form .input-field-textarea {
            min-width: 385px;
        }

    .contact-branch.grid-form .sbHolder {
        width: 90% !important;
    }

    .grid-form .input-field-sm {
        width: 90%;
    }

    .med-table tr.tr-header td, .tbl-total tr td:first-child {
        font-size: 15px;
    }

    .med-table tr td {
        font-size: 13px;
    }

    .ho-content-wrapper {
        max-width: 100%;
    }

    .ho-image {
        display: inline-block;
        max-width: none !important;
        float: none !important;
    }

    #topContents .data-content {
        padding-top: 17px;
    }

    .service .data .title-black {
        font-size: 17px;
    }

    .eligibilty-list div {
        width: 95%;
    }

    #header #services-menu .services-menu ul li.business .services-menu-hover, #header #services-menu .services-menu ul li.consumer .services-menu-hover, #header #services-menu .services-menu ul li.financial .services-menu-hover, #header #services-menu .services-menu ul li.news .services-menu-hover { /*background-position: 0px -17px;*/
    }

        #header #services-menu .services-menu ul li.business .services-menu-hover:hover, #header #services-menu .services-menu ul li.business .active {
            background-image: url('../images/service-business-over-mobile-active.png') !important;
        }

        #header #services-menu .services-menu ul li.consumer .services-menu-hover:hover, #header #services-menu .services-menu ul li.consumer .active {
            background-image: url('../images/service-consumer-over-mobile-active.png') !important;
        }

        #header #services-menu .services-menu ul li.financial .services-menu-hover:hover, #header #services-menu .services-menu ul li.financial .active {
            background-image: url('../images/service-financial-over-mobile-active.png') !important;
        }

        #header #services-menu .services-menu ul li.news .services-menu-hover:hover, #header #services-menu .services-menu ul li.news .active {
            background-image: url('../images/service-news-over-mobile-active.png') !important;
        }

    #header #header-top .grid .top-menu ul li ul.sub li.active a:before {
        display: none
    }

    #header #services-menu .services-menu ul li .services-menu-hover div {
        display: block;
    }

        #header #services-menu .services-menu ul li .services-menu-hover div a img {
            max-width: 62%;
            margin-top: 10px
        }

    #mBusiness .service-menu-mobile a img {
        margin-left: -53px
    }

    #mConsumer .service-menu-mobile a img {
        margin-left: -26px;
    }

    #mFinancial .service-menu-mobile a img {
        margin-left: -25px;
    }

    #mNews .service-menu-mobile a img {
        margin-left: -1px;
        max-width: 69% !important;
    }

    .recruit-content {
        margin-top: 20px;
    }

    .grid-form .file-upload {
        display: inline-block;
        width: 100%;
    }

    .timeline-content > div {
        width: auto;
    }

    .message-banner {
        margin-top: 1px;
    }

    .branch-wrapper .branch-map-wrapper {
        width: 60%;
        margin-left: 10px
    }

    .branch-wrapper .new-branch { /*width: 49%;*/
    }


    .service .features-holder .apply {
        float: right;
        margin-top: -4px;
        margin-bottom: 20px
    }

    .service .breadcrumb {
        display: block;
        padding-right: 10px
    }

    .service .service-title {
        display: block;
        padding-top: 4px;
    }

    .service .sub-service-holder.level-2 ul li .sub-service-item.active {
        min-height: initial
    }

    .service .data .text .data-text {
        display: block;
    }

    .mobile-product-title {
        display: block
    }

        .mobile-product-title .service {
            margin-top: 0px;
            margin-left: 5px;
            padding-top: 0px;
            display: block
        }

    .flag-wrapper, .location {
        margin-left: 0%;
    }

    .location-map {
        width: 50% !important;
    }

    .service .breadcrumb {
        max-width: 250px;
        padding-bottom: 10px;
    }

    .news-publication .service .sub-service-holder ul li .sub-service-item {
        width: 90%;
    }

    .content-wrapper {
        margin-left: 45px;
        width: 54%
    }

    .dl-content {
        max-width: 163px;
    }

    .dates-wrapper {
        width: 38% !important;
    }

    .news-publication .jspPane {
        width: 70% !important;
    }

    .service .sub-service-holder.level-2 ul li .sub-service-item.active:after {
        left: 42%;
    }

    .service .feature-details table, .service .exp-features table {
        width: 100% !important
    }

    #header #logo-header .logo img {
        max-height: 68px !important;
        margin-top: 3px;
    }

    .branch-wrapper .legend div span {
        padding-right: 0px;
    }

    .branch-wrapper .legend {
        text-align: initial
    }

        .branch-wrapper .legend div {
            margin-right: 20px
        }

    .intl-content-wrapper {
        width: 100%;
    }

    .flag {
        margin-top: 20px;
        margin-bottom: 0px;
    }

    .captcha .input-field {
        margin-top: 10px;
    }

    .recruit-content .captcha .input-field {
        width: 90%
    }

    #SectionEwdding .grid-form .inline-block {
        width: 95%;
    }

    .wedding-account .inline-block.ew-first {
        width: 100%;
    }

        .wedding-account .inline-block.ew-first .input-field {
            width: 90%;
        }

    .wedding-account .inline-block.ew-second {
        width: 100%;
    }

        .wedding-account .inline-block.ew-second .input-field {
            width: 67%;
        }

    .wedding-account .ew-third {
        margin-top: 0 !important;
    }

        .wedding-account .ew-third .input-field {
            width: 90%;
        }

    .wedding-account .input-field.phone-no {
        width: 71% !important;
    }

    .mobile-view {
        margin-top: 120px;
    }
}

@media only screen and (max-width:1024px) {
    .branch-wrapper .branch-map-wrapper {
        width: 100%;
        top: 0px;
    }
}

@media only screen and (max-width:1000px) {
    .container {
        width: auto !important
    }

    .menu-banking-bg {
        display: none;
    }

    .container {
        width: 100%;
        padding: 0px 10px
    }

    .timeline-content .tl-title {
        margin-top: 20px
    }
}


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

    .intl-content {
        width: 50%;
    }

    .ho-circle-hover {
        position: static;
        margin-left: 0;
        width: 118px;
    }

    .ho-circle-wrapper:nth-child(3) {
        clear: both;
    }

    .ho-network > div:nth-child(2) {
        width: 325px;
        margin: 0 auto;
    }

    .content-wrapper {
        margin-left: 0px;
        width: 50%;
    }

    .dates-wrapper {
        width: 48% !important;
    }

    .dl-content {
        margin: 10px auto;
        max-width: 49%;
    }
}

@media only screen and (max-width:767px) {
    /*********About**************/
    .ho-image {
        width: 95%;
    }

    .awards-carousal {
        -webkit-transform: scale(0.7,0.7);
        -moz-transform: scale(0.7,0.7);
        transform: scale(0.7,0.7)
    }

    .location-detail, .location-map {
        width: 100% !important;
    }

    .location-map {
        margin-top: 10px
    }

    .branch-wrapper .branch-map-wrapper {
        width: 100%
    }

    #topContents .data-content .title {
        font-size: 18px;
    }

    #topContents .data-content p {
        font-size: 13px;
    }

    .intl-content {
        width: 100%;
        margin-top: 20px
    }

    .service .service-title {
        max-width: 170px;
    }

    .branch-wrapper .branch-map-wrapper {
        top: 0px;
    }

    .web-popup {
        max-width: 80%;
        padding: 25px 15px;
    }

    .wedding-account .inline-block.ew-second .input-field {
        width: 57%;
    }

    .wedding-account .mobile-box {
        clear: both;
        width: 100%;
    }

    .wedding-account .input-field.area-code {
        width: 57% !important;
    }

    .wedding-account .input-field.phone-no {
        width: 57% !important;
    }

    .gmap-wrapper {
        height: 140px
    }

    .button-gradient {
        margin-top: 10px;
    }

    .re-item .description-button {
        /*margin-left: 0px;*/
    }

    .re-item .description-button, .re-item .gallery-button {
        height: auto;
    }
}


@media only screen and (max-width:600px) {
    /**********About*************
    .ho-content-wrapper,.ho-image{width: auto;}*/




    .board-member {
        width: 290px;
    }

        .board-member div {
            min-height: 139px;
        }



    .tlh-border {
        width: 29%;
    }

    .tl-landmark {
        width: 39%;
    }

    .timeline-content .tl-img-desc {
        max-width: 100%
    }

    .med-table tr.tr-header td, .tbl-total tr td:first-child {
        font-size: 14px;
    }

    .med-table tr td, .panel-graph .panel-title {
        font-size: 12px;
    }

    #topContents .data-content {
        padding-top: 0px
    }

        #topContents .data-content .title {
            font-size: 22px;
        }

        #topContents .data-content p {
            font-size: 14px;
        }

    .board-member .view-profile {
        width: 288px;
    }

    #header #logo-header .logo img {
        max-height: 60px !important;
        margin-top: 8px;
    }


    #header #services-menu .services-menu ul li .services-menu-hover div a img {
        max-width: 70%;
    }

    #mBusiness .service-menu-mobile a img {
        margin-left: -43px
    }

    #mConsumer .service-menu-mobile a img {
        margin-left: -23px;
    }

    #mFinancial .service-menu-mobile a img {
        margin-left: -21px;
    }

    #mNews .service-menu-mobile a img {
        margin-left: -5px;
        max-width: 79% !important;
    }
    .board-members-wrapper .board-member:last-child > div:first-child {
        width: 139px !important;
        margin: 0 !important;
    }
    .board-members-wrapper .board-member:last-child > .detail {
        width: 149px !important;
        margin: 0 !important;
    }
    .board-members-wrapper .board-member:last-child{
        flex-wrap:wrap;
    }
    .board-members-wrapper .board-member:last-child .view-profile{
        position:static;
        width:288px;
    }
}


@media only screen and (max-width:568px) {
    .recruit-apply > span:first-child {
        font-size: 18px;
    }

    #SectionAwards {
        padding-top: 0px
    }

    .award-content {
        max-width: 278px;
    }

    .branch-wrapper .branch-map-wrapper {
        width: 90%;
        margin-left: 0px
    }

    .branch-wrapper .new-branch { /*width:95%;*/
    }

    .service .breadcrumb, .service .service-title {
        display: none;
    }

    #header #header-top .grid .top-menu ul li ul.sub li {
        display: none !important
    }

    #header #header-top .grid .top-menu ul li.hover ul {
        opacity: 1;
        height: auto;
        -webkit-transition: all .6s ease .1s;
        -moz-transition: all .6s ease .1s;
        -o-transition: all .6s ease .1s;
        -ms-transition: all .6s ease .1s;
        transition: all .6s ease .1s;
    }

        #header #header-top .grid .top-menu ul li.hover ul li {
            display: list-item !important;
        }
}

@media only screen and (max-width:480px) {
    .grid-form {
        max-width: 300px;
    }

        .grid-form .input-field, .grid-form .input-field-textarea {
            min-width: 264px;
        }

        .grid-form .apply-wrapper > span:first-child {
            margin-bottom: 10px
        }

        .grid-form .apply-wrapper span {
            display: block
        }

        .grid-form .sbHolder {
            min-width: 269px;
        }

        .grid-form .sbOptions {
            width: 265px;
        }


    .tl-history {
        width: 74%;
    }

    .timeline-content > div {
        margin-left: 0px;
    }

    .awards-carousal {
        -webkit-transform: scale(0.4,0.4);
        -moz-transform: scale(0.4,0.4);
        transform: scale(0.4,0.4)
    }

    .about-bg {
        padding-top: 0px
    }

    .awards-carousal {
        height: 180px;
    }

    .award-title {
        font-size: 23px;
    }

    .award-title-sm {
        font-size: 19px
    }

    .award-year {
        font-size: 15px;
    }

    .recruit-apply span {
        display: block
    }

        .recruit-apply span.apply-btn {
            margin-top: 15px
        }

    .gov-header .index {
        font-size: 33px;
        padding-right: 8px;
    }

    .gov-header .title {
        font-size: 20px;
    }

    .tl-history {
        font-size: 18px
    }

    .tl-stars {
        top: 0px
    }

    .ho-title, .ho-detail {
        max-width: 220px;
    }

    .bg-wrapper {
        width: auto;
    }

    .gov-header {
        margin: 5px 5px;
    }

    .full {
        width: 290px;
    }

    .grid {
        width: 300px;
    }

    #home .tab {
        margin: 15px;
    }

    #header #services-menu .services-menu ul li.business .services-menu-hover, #header #services-menu .services-menu ul li.consumer .services-menu-hover, #header #services-menu .services-menu ul li.financial .services-menu-hover, #header #services-menu .services-menu ul li.news .services-menu-hover {
        background-position: initial;
    }

    .recruit-content {
        width: 100%
    }

    #tabsCareers .grid-form {
        padding-left: 10px;
    }

    .service .sub-service-holder ul li .sub-service-item a img {
        max-width: 65px;
    }

    #topContents .data-content, #topContents .data-image {
        display: block;
        width: auto
    }

    .flag:hover span, .flag span.selected {
        top: 150px;
    }

    .dates-wrapper {
        width: 98% !important;
    }

    .news-publication .jspPane {
        width: 80% !important;
    }

    .content-wrapper {
        margin-left: 0px;
        width: 100%;
        margin-top: 20px
    }

    .dl-content { /*width: 100%;*/
        margin: 15px auto; /*max-width: none;*/
    }

    .service .features-holder .apply {
        float: none !important;
        display: block
    }

    .service .exp-features table {
        font-size: 13px !important
    }

    .service .sub-service-holder ul li {
        word-break: break-word;
        width: 30%
    }


    #header #services-menu .services-menu ul li .services-menu-hover div a img {
        max-width: 71%;
        margin-top: 3px
    }

    #mBusiness .service-menu-mobile a img {
        margin-left: -31px
    }

    #mConsumer .service-menu-mobile a img {
        margin-left: -16px;
    }

    #mFinancial .service-menu-mobile a img {
        margin-left: -13px;
    }

    #mNews .service-menu-mobile a img {
        margin-left: -5px;
        max-width: 77% !important;
    }

    .wedding-account .inline-block.ew-second .input-field {
        min-width: 73%;
    }

    .e-wed-button a .add-text {
        display: none;
    }

    .e-wed-button a .add-icon {
        display: block;
    }

    .re-item .table-with-image div {
        width: 100% !important;
        max-width: 280px;
        display: block;
        position: relative;
    }
}

@media only screen and (max-width:386px) {
    .flag-wrapper {
        margin-left: -3px
    }

    .location {
        margin-left: 0px
    }


    .branch-wrapper .branch-map-wrapper {
        width: 95%;
        height: auto
    }

    .branch-wrapper .branch-selector {
        width: 80% !important; /*margin:0px auto !important;*/
        display: block;
    }
}

@media only screen and (max-width:320px) {
    .flex-direction-nav {
        left: 12px;
    }

    .recruit-menu {
        width: 250px;
    }

    .ho-network > div:nth-child(2) {
        width: 185px;
    }

    .tlh-border {
        width: 20%;
    }

    .tl-landmark {
        width: 54%;
    }

    #topContents .data-image {
        margin-top: 30px
    }

    .exp-banking-content .service {
        margin-top: 30px;
    }

    .ui-slider-tabs-content-container {
        width: auto;
    }

    .intl-menu {
        width: 300px;
    }

    .form-bg, .tabs-panel {
        width: 93%;
    }
}

/************************************SIMULATOR CSS*****************************/
@media screen and (min-width: 1400px) {
    .clsSimulatorContent .grid {
        width: 1180px;
    }
}

@media screen and (min-width: 1500px) {
    .clsSimulatorContent .grid {
        width: 1280px;
    }
}

@media only screen and (max-width:1399px) {
    .clsSimulatorContent .checkbox-wrapper {
        width: 805px;
    }

    .slider-bottom-line {
        width: 805px;
    }

    .clsSimulatorContent .apply-wrapper {
        width: 805px;
    }

    #divInsuranceType {
        width: 805px;
    }

    .slider-inline {
        width: 445px;
    }

    .slider-checkbox {
        width: 445px;
    }

    .second-slider-checkbox {
        width: 345px;
    }

    #calculateMonthlyPayment {
        width: 805px;
    }
}

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

    #calculateMonthlyPayment {
        width: 100%;
    }
}

@media only screen and (max-width:1080px) {
    #header #header-top .grid .top-menu ul li.menu-iban-calclator {
        display: block;
    }

    #header #header-top .grid .top-menu ul li.menu-loan-calclator, #header #header-top .grid .top-menu ul li.menu-onlinetrading {
        display: block;
    }

    .clsSimulatorContent .slider-inline {
        width: 370px;
    }

    .clsSimulatorContent .slider-checkbox {
        width: 370px;
    }

    .clsSimulatorContent .first-slider-checkbox {
        width: 360px;
    }

    .clsSimulatorContent .grid {
        width: 745px;
    }

    .clsSimulatorContent .apply-wrapper {
        width: 100%;
    }

    #Iban-Calculator .apply-wrapper {
        width: 100%;
    }

    .slider-bottom-line {
        width: 100%;
    }

    #divInsuranceType {
        width: 100%;
    }

    .clsSimulatorContent .checkbox-wrapper {
        width: 100%;
    }

    #call-center #nbr1270 {
        display: none;
    }

    #call-center #nbr1270Mobile {
        display: inline;
    }
}

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

    #divStyleLoan {
        display: block !important;
    }
}

@media only screen and (max-width:900px) {
    .clsSimulatorContent .slider-inline {
        width: 100%;
    }

    .clsSimulatorContent .grid {
        width: 90%;
    }

    .clsSimulatorContent .first-slider-checkbox {
        width: 100%;
    }

    .clsSimulatorContent .slider-checkbox {
        width: 100%;
    }

    .clsSimulatorContent .checkbox input[type=radio] + label {
        width: 100%;
    }
}

@media only screen and (max-width:480px) {
    /*Simulator Silder*/
    .slider-container {
        background-size: contain;
        width: 270px;
    }

    .slider-label {
        width: 270px;
    }

    .jq-slider {
        width: 198px;
    }

    .ui-slider-horizontal {
        top: 14px !important;
        left: 34px !important;
        height: 4px;
    }

    .ui-slider-handle:after {
        background-size: contain !important;
        top: 4px;
        width: 85%;
        height: 80%;
    }

    .ui-timepicker-div .ui-slider-horizontal {
        top: initial !important;
        left: initial !important;
        height: .8em;
    }

    .clsSimulatorContent .grid-form {
        max-width: 100%;
    }

    .simulatorResult-inline {
        max-width: 100%;
    }

    #SimulatorResults .apply-wrapper {
        margin: 0;
    }

    .simulator-result-box {
        width: 250px;
        margin: auto;
    }

        .simulator-result-box .simulatorResultBox {
            width: 230px;
        }

    .simulator-result-buttons {
        width: 235px;
        margin: auto;
    }

    #SimulatorResults .grid, #Iban-Calculator .grid {
        width: 250px;
    }

    #Iban-Calculator #txtAccno {
        width: 240px;
    }

    #iban-simulation .contact-branch.grid-form .sbHolder {
        width: 270px !important;
        min-width: 270px;
    }

    #div-apply-content .full {
        width: 250px;
    }

    #div-apply-content .grid {
        width: 250px;
    }

    #div-apply-content input[type=text] {
        min-width: 240px;
    }

    .iban-result-box {
        width: 255px;
        margin-left: -10px;
    }
}

@media screen and (max-width: 759px) and (min-width: 480px) {
    .grid {
        width: 440px;
    }

    .full {
        width: 400px;
    }
}

@media only screen and (max-width:768px) {
    .fixed-footer #footer {
        position: initial;
        margin-bottom: 63px;
    }

    .re-item li.half {
        width: 100%;
    }

    .description-button, .gallery-button {
        height: auto;
    }
}

@media only screen and (min-width:769px) {

    .re-item li.half {
        height: 310px;
    }
}

@media screen and (width:1024px) and (height:768px) {
    .re-item li.half {
        height: 380px;
    }

    .button-gradient {
        margin-top: 10px;
    }

    .re-item .description-button {
        margin-left: 0px;
    }

    .re-item .description-button, .re-item .gallery-button {
        height: auto;
    }
}

@media screen and (width:1366px) {
    .re-item .table-with-image p {
        line-height: 16px;
        font-size: 12px;
    }
}