﻿@charset "utf-8";
/* CSS Document */

/*media queries*/
@media (max-width: 767px) {
    .navbar-brand {
        padding: 5px 0;
        width: 127px;
    }

    .navbar-header {
        height: 54px;
        padding: 0px;
    }

    .navbar-toggle {
        float: left !important;
        top: 0px; /*khoang cach 3 gach (-) luc chuyen mobile*/
        background-size: 20px;
        background-position: center;
    }

    .navbar-brand {
        float: right !important;
    }

    .logo {
        background: #fff;
        height: inherit;
        position: absolute;
        right: 0;
        top: 0;
    }

    .ddMenu > li.dropdown.dropdown-language {
        border-left: none;
        border-right: none;
    }
    
    .ddMenu1 > li.dropdown.dropdown-language { /*menu English - VN mobile*/
        border-left: none;
        border-right: none;
    }


    #mobileMenu ul {
        background-color: #fff;
    }

    #mobileMenu ul > li a :hover {
        background-color: transparent;
    }

    .nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
        background-color: transparent;
        color: #333;
    }

    .greenHeader ul > li > a.dropdown-toggle:hover, .greenHeader ul > li > a.dropdown-toggle:focus {
        background-color: transparent;
        color: #333;
    }

    #mobileMenu > li > ul > li > a {
        color: #333;
    }

    .greenHeader {
        background-color: #fff;
        border-bottom: 0;
    }

    .lang { /*dau gach truoc English mobile*/
        height: 54px;
        border-left: 1px solid #ccc;
        margin-left: 15px;
    }
    

    .lang > span {
        display: inline-block;
        position: relative;
        top: 30px;
        left: 15px;
        font-size: 16px;
    }

    .hdWidth {
        width: 100%;
    }

    footer {
        background-color: #0083bb;
        background-image: none;
        border-bottom: none;
    }

    .platform_width {
        width: 100% !important;
    }

    .greenBb img {
        border-bottom: 0;
    }
    /* mv created on 12-06-2015 */
    .hdWidth {
        width: 100% !important;
    }

    .container-fluid, .navbar-collapse {
        padding-left: 15px;
        padding-right: 15px;
    }

    .home_3col_boxes .col-lg-4 {
        width: auto;
    }

    .submitEnquiry {
        text-align: left;
    }

    .submitEnquiry span {
        left: 10px;
    }

    .submitEnquiry h1 {
        left: 30px;
    }

    .news li > a .newstitle {
        font-size: 16px;
    }

    .font32, .font28 {
        font-size: 18px;
    }

    .font20 {
        font-size: 14px;
    }

    .submitEnquiry h1 {
        font-size: 30px;
        left: 20px;
    }

    .content_body {
        padding-top: 30px !important;
        padding-bottom: 0px;
    }

    .greenBorder-left {
        border: none;
    }

    .mobPadding0 {
        padding: 0;
    }

    .panel, .panel-heading, .panel-group .panel {
        border-radius: 0;
        box-shadow: none;
    }

    .footer-logo2 {
        width: 100%;
        margin: 30px 0;
    }
}

@media screen and (min-device-width: 767px) and (max-width: 1280px) {
    .navbar-nav {
        margin-left: 183px;
    }

    .platform_width {
        width: 1280px;
    }

    .hdWidth {
        width: 1200px;
    }

    .nav > li > a {
        padding: 17px;
    }
    
    .nav1 > li > a { /*menu English - VN mobile*/
        padding: 17px;
    }


    .greenHeader ul > li > a {
        color: #fff;
        font-size: 16px;
    }

    .marginL12 {
        margin-left: 16%;
    }
}

@media screen and (min-device-width: 767px) and (max-width: 991px) and (orientation: portrait) {
    .protradeVietnam {
        margin-left: 85px !important;
    }

    .protradeVietnam > li > a {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }
}

@media screen and (min-device-width: 767px) and (max-width: 1024px) and (orientation: landscape) {
    .protradeVietnam {
        margin-left: 183px !important;
    }

    .protradeVietnam > li > a {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }
}

@media screen and (min-device-width: 767px) and (max-width: 1600px) {

    .protradeVietnam > li > a{
        padding-left: 10px !important; 
        padding-right: 10px !important;
    }
    .navbar-nav {
        margin-left: 183px;
    }

    .hdWidth {
        width: 1200px;
    }

    .nav > li > a {
        padding: 17px;
    }
    
    .nav1 > li > a {
        padding: 17px;
    }


    .greenHeader ul > li > a {
        color: #fff;
        font-size: 16px;
    }

    .marginL12 {
        margin-left: 16%;
    }

    .content_body {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}

@media screen and (min-device-width: 481px) and (max-device-width: 768px) {
    /* STYLES HERE */
}
/* CSS CODE for Opening for Bank Account TABLE */
@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {

    /* Force table to not be like tables anymore */

    table#openAccount, #openAccount thead, #openAccount tbody, #openAccount th, #openAccount td, #openAccount tr,
    table#vieatAccountOpen, #vieatAccountOpen thead, #vieatAccountOpen tbody, #vieatAccountOpen th, #vieatAccountOpen td, #vieatAccountOpen tr, 
    table#vieatAccountOpen2, #vieatAccountOpen2 thead, #vieatAccountOpen2 tbody, #vieatAccountOpen2 th, #vieatAccountOpen2 td, #vieatAccountOpen2 tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #openAccount thead tr, #vieatAccountOpen thead tr, #vieatAccountOpen2 thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    #openAccount tr, #vieatAccountOpen tr, #vieatAccountOpen2 tr {
        border: 1px solid #333333;
        border-bottom: none;
    }

    #openAccount td, #vieatAccountOpen td, #vieatAccountOpen2 td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 30%;
    }

    #openAccount td:before, #vieatAccountOpen td:before, #vieatAccountOpen2 td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }

    /* Mobile view table border gray border */
    #openAccount tr:nth-child(even) td,
    #vieatAccountOpen tr:nth-child(even) td,
    #vieatAccountOpen2 tr:nth-child(even) td {
        border-color: -moz-use-text-color -moz-use-text-color #FFF;
        border-bottom: 1px solid #FFF;
    }

    /*	Label the data 		*/
    #openAccount td:nth-of-type(1):before {
        content: "Name";
    }

    #openAccount td:nth-of-type(2):before {
        content: "Website";
    }

    #openAccount td:nth-of-type(3):before {
        content: "Contact";
    }

    #vieatAccountOpen td:nth-of-type(1):before {
        content: "Tên";
    }

    #vieatAccountOpen td:nth-of-type(2):before {
        content: "Website";
    }

    #vieatAccountOpen2 td:nth-of-type(1):before {
        content: "Name";
    }

    #vieatAccountOpen2 td:nth-of-type(2):before {
        content: "Website";
    }
}

/* Smartphones (portrait and landscape) ----------- */

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {

    table#openAccount, table#vieatAccountOpen, table#vieatAccountOpen2 {
        padding: 0;
        margin: 0;
        width: 100%;
    }

    .msidenav {
        padding-left: 0;
        padding-right: 0;
    }
}

/* iPads (portrait and landscape) ----------- */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    table#openAccount, table#vieatAccountOpen, table#vieatAccountOpen2 {
        width: 495px;
    }
}
