/*Extra large devices (large desktops, 1200px and up)*/
@media (max-width: 1200px) {
    .container{width: 960px;margin:0 auto;}
}

/*Large devices (desktops, 992px and up)*/
@media (max-width: 992px) {
    h1{font-size: 28px;}
    h2{font-size: 22px;}
    h3{font-size: 16px;}
    h4{font-size: 14px;}
    h5{font-size: 14px;}
    h6{font-size: 14px;}

    .TopHeading{
        -webkit-box-shadow: 0px 2px 5px 0px rgba(221,221,221,1);
        -moz-box-shadow: 0px 2px 5px 0px rgba(221,221,221,1);
        box-shadow: 0px 2px 5px 0px rgba(221,221,221,1);
        padding: 5px;
    }
    .headinglogo{float: none;margin:0 auto;text-align: center;width: 100%;}
    .headinglogo img{width: auto;height: 65px;}

    .hkaaa-top{display: none;}
    .heading-right{float: none;
        position: absolute;
        top: 50px;
        right: 20px;
    }

    .nav-no-js .nav-button:hover+.nav,.nav-no-js .nav-button:hover+.nav+.nav-close,.nav-no-js .nav:hover,.nav-no-js .nav:hover+.nav-close{
        display:block
    }
    .nav{width: 100%;}
    .navbar .container{padding: 0;}
    .nav ul,.nav ul ul{background: transparent;}
    .nav a, .nav a:active, .nav a:hover, .nav a:visited{padding: 12px 15px;background-color: transparent;color: #fff;}
    .nav li.nav-active>a, .nav li:hover>a{background-color:#009cd5; color: #fdd454;}
    .nav .nav-submenu>ul{background-color: #004787;}
    .nav .nav-submenu>ul a{padding-left:30px}
    .nav .nav-submenu>ul a:hover{padding-left:30px;background-color: transparent;}
    .nav .nav-submenu>a:after{top:13px;}

    .logo-full{display:none;}
    .logo-mobile{display:inline-block;}

    .container{width: 100%;margin:0 auto;}

    .colour_section{padding: 35px 0;height: 174px;}
    .colour_section i{font-size: 50px;}

    .home-content{width: 100%;}
    .ads{width:250px;margin:20px auto;float: none;clear: both}

    .wrapper{padding-bottom: 0;}
    footer{position: relative;}
    .footer-logo img{width: auto;height: 75px;}

    .box-news-03{width:50%;}

    /*hkteam*/
    .equalHMR{width: 100%;}

    /*hkteam*/
    .team_img,.team_profile,.profile_table_container{width: 100%;}
    .team_img{margin-bottom: 10px;}
    .team_content{padding: 0 0 10px 0;}

    .grid-item,.box-album {width: 50%;}

    .supports_lg{width: 50%;float: left;padding-right: 15px;margin-bottom: 15px;}
    .supports_md{width: 33%;float: left;padding-right: 15px;margin-bottom: 15px;}
    .supports_sm{width: 25%;float: left;padding-right: 15px;margin-bottom: 15px;}



}

/*Medium devices (tablets, 768px and up)*/
@media (max-width: 768px) {
    .gh-01,.gh-02,.title,.stlyeTitle{font-size: 22px;}
    .container{width: 100%;margin:0 auto;}

    .colour_section{width: 50%; height: 154px;}
    .colour_section{padding: 30px 0;}
    .colour_section i{font-size: 40px;}



    .supports{width: 50%;margin-bottom: 20px;text-align: left;}

    .footer-logo img{width: auto;height: 65px;max-width: 100%;}
    .footer-links{padding: 20px 0}
    .footer-links a{
        display: inline-block;
        width: 49%;
        margin:0;
        padding: 12px 0;
    }
    .copyright{font-size: 12px;}

    .schedule_table tr {
        border: 2px solid #eee;
        display: block;
        margin:0 0 20px 0;
    }
    .schedule_table thead{display: none;}
    .schedule_table td {
        display: block;
        border-bottom: 1px solid #eee;
        font-size: 15px;
        padding: 8px 15px;
        text-align: left;
    }
    .schedule_table td::before {
        content: attr(data-label);
        float: left;
        margin-right: 15px;
    }
    .schedule_table td:last-child {border-bottom: 0;}

    .schedule_table tr:nth-child(odd){background-color: #fff;}

    .table-green tr a,.table-blue tr a{
        padding: 6px 10px;
        border-radius: 2px;
        color: #fff;text-decoration: none;
        display: inline-block;
        margin-right: 10px;
    }
    .table-green tr a{background-color: #22ad38;}
    .table-blue tr a{background-color: #0057a6;}
    .secondTable{margin-top: 10px;}
    .tab_control button{
        width: 50%;
        margin:0;
        float: left;
        display: block;
        font-size: 16px;
    }

    .tab_control .fl{width: 100%;margin-bottom: 20px;}
    .tab_control .fr{width: 100%;}
    .selectbox select{min-width: 100%;}

    /*transportation*/
    #map{height: 400px;}
    .traffic_row table th,.traffic_row table td{width: auto;padding: 8px 10px;}
    .traffic_row table td:first-child{width: 100px;}

    /*profile upload*/
    .profile-name,.form{width: 100%;}

    .form{margin-top: 25px;border-top: 1px solid #ddd;padding-top: 25px;}
    .form .col-30{padding: 0 15px 0 0;}

    .supports_lg{width: 70%;float: left;padding-right: 15px;margin-bottom: 15px;}
    .supports_md{width: 50%;float: left;padding-right: 15px;margin-bottom: 15px;}
    .supports_sm{width: 33%;float: left;padding-right: 15px;margin-bottom: 15px;}

    /* duplicate */
    .international_form .col-50{width: 100%;}
    .international_form .col-25,.international_form .col-33{width: 50%;}

    .scale-img img{object-position:left;}
}

/*Mobile*/
@media (max-width: 576px) {
    .mobile-hide{display: none;}
    .mobile-show{display: block !important;}
    .headinglogo img{width: auto;height: 50px;}

    .media-Lang{top: -32px;}
    .nav-mobile{top: 20px;}

    .section,.sponsor{padding: 20px 0;}

    .box-news{width: 100%;}

    .tab_control .fl{width: 100%;margin-bottom: 0px;}

    .tab_control button{
        width: 100%;
        display: block;
        margin-bottom: 12px;
        background-color: #eee;
        color: #999;
        padding: 14px 0;
    }

    .tab_control button.active{
        color: #fff;
        background-color: #0057a6;
    }

    /*hkteam*/
    .team_img,.team_profile{width: 100%;}
    .team_img{margin-bottom: 10px;}
    .team_content{padding: 0 0 10px 0;}

    .grid-item,.box-album {width: 100%;}

    /*transportation*/
    #map{height: 280px;}

    /*login*/
    .login_form{width: 100%;}
    .login_form img{height: 65px;}

    /*profile upload*/
    .form .half_col{width: 100%;}
    .full_col .submit-btn{width: 100%;padding: 15px 0;margin-bottom: 40px;}

    /*preview image*/
    .preview_img{min-height: 200px;}
    .preview_img input{min-height: 200px;}
    .preview_img img{height: 198px;}

    .success img{width: auto;height: 80px;margin-bottom: 10px;}

    .supports_lg{width: 70%;float: left;padding-right: 10px;margin-bottom: 10px;}
    .supports_md{width: 50%;float: left;padding-right: 10px;margin-bottom: 10px;}
    .supports_sm{width: 33%;float: left;padding-right: 10px;margin-bottom: 10px;}
}