/* 
* Created on : Jun 14, 2015, 12:15:10 PM
* Author     : trungthuc
* File name  : mobile.css
*/
@charset "UTF-8";
@media
only screen and (max-width : 640px){
    #all {
        width: 100%;
        box-shadow: none;
    }

    #all #banner
    {
        width:100%;
        height:100%;
        padding: 10px 0px 0px 0px;
        background:url(images/banner.png) no-repeat scroll top center;
        position:initial;
    }

    #all #banner ul.menu_header, #all #banner #language, #all #banner #search {

        display: none;
    }

    #all #banner #logo
    {
        position:initial;
        text-align: center;
    }

    #all #banner h3
    {
        position:initial;
        text-align: center;
        color:#290859;
        font-size:13px;
        font-weight:bold;
        text-transform:uppercase;
        text-shadow: 0 1px 4px #FFF;
        margin-bottom: 10px;
    }

    .btn-gnav{
        display:block;
        padding: 0.7em;
        cursor: pointer;
        font-size: 13px;
        font-weight: bold;
        padding-left: 25px;
        color:#FFF;
        background: url(images/icon-arrow.png) 10px center no-repeat #29aae2;
    }

    ul.menu {
        display: none;
        position: initial;
        width:100%;
        background: #FFF;
        border-radius: 0;
        height: 100%;
        padding: 0;
    }
    
    ul.sub_menu {
        display: block;
    }

    ul.showMenu
    {
        display: block;
        background: #FFF;
    }
    ul.showMenu li
    {
        display:list-item;
        float:none;
        background:#e00000;
        border-radius: 0;
        padding: 2px 5px;
        border-top: 1px #FFF solid;

    }
    ul.showMenu li:last-child {
        background:#e00000;
    }
    ul.showMenu li a
    {
        display:block;
        padding:5px 25px;
        font-size:12px;
        color:#FFF;
        border-radius: 5px;
        text-align: center;
    }
    ul.showMenu li#active a,ul.menu li a:hover
    {
        background:none;
        color: #333;
    }
    /**/
    #all #main
    {
        background:url(images/background_main.png) repeat-x scroll top center #FFF;
        width:100%;
        padding:0;
        float:none;
    }
    .navigation {
        width: 100%;
        height: 150px;
        margin-bottom: 20px;
        border-radius: 0;
    }
    .slide {
        width: 100%;
        float: none;
    }
    #slideshow li img
    {
        width: 100%;
        height: 150px;
        border-radius: 0;

    }

    #slideshow li.previous 
    {
        z-index: 2;
    }

    #slideshow li.current 
    {

        z-index: 3;
    }
    .support {
        display: none;
    }

    #all #footer
    {
        width:100%;
        float:none;
        border-top:5px #e00000 solid;
    }
    #all #footer ul.menu_footer
    {
        display:none;
    }
    #all #footer #info
    {
        padding:10px;
    }

    #all #main #top_main
    {
        width:100%;
        margin-bottom:10px;
        position:inherit;
        height: 100%;
    }
    #all #main #top_main #intro
    {
        background:url(images/icon_hiteco.png) no-repeat scroll 5px 0px;
        position:inherit;
        width:80%;
        padding: 0 5% 0 15%;
        height: 100%;
        margin-bottom: 10px;
    }

    #all #main #top_main #service
    {
        position:inherit;
        width:80%;
        height: 100px;
        background:url(images/icon_hiteco.png) no-repeat scroll 0px 0px;
        padding: 0 5% 0 15%;
    }

    #all #main #mid_main
    {
        width:100%;
        float:none;
    }
    #all #main #mid_main #dichvu
    {
        width:100%;
        float:none;
        background: none;

    }
    #all #main #mid_main #dichvu h3
    {
        background:#29aae2;
    }
    #all #main #mid_main #dichvu .content_dichvu
    {
        margin-top:0;
        width:90%;
        padding:10px 5%;
        border-left:none;
        border-right:none;
    }

    #all #main #mid_main #sanpham
    {
        width:100%;
        float:none;
        margin-left:0;
        padding-bottom:15px;
        background: none;

    }
    #all #main #mid_main #sanpham h3
    {
        background:#e00000;
    }
    #all #main #mid_main #sanpham .content_sanpham
    {
        margin-top:-5px;
        width:90%;
        padding:10px 5%;
        float:none;
        border-left:none;
        border-right:none;
    }
    #all #main #mid_main #sanpham .content_sanpham .sanpham_one
    {
        width:100%;
        float:none;
        margin:10px 0px;

    }
    #all #main #mid_main #duan
    {
        width:100%;
        float:none;
        margin-left:0;
        background:none;
    }
    #all #main #mid_main #duan h3
    {
        background:#e00000;
    }
    #all #main #mid_main #duan .content_duan
    {
        margin-top:0;
        width:90%;
        padding:10px 5%;
        float:none;
        border-left:none;
        border-right: none;
    }
    #all #doitac
    {
        width:100%;
        float:none;
    }
    #all #doitac h3
    {
        background:url(images/icon_custom.png) no-repeat scroll 20px 0px;
        font-size:13px;
        color:#ae1939;
        padding:11px 0px 11px 70px;
    }
    #all #doitac .doitac
    {
        width:100%;
        height:70px;
        border-left:none;
        border-right:none;
    }
    span.readmore
    {
        margin-right: 10px;

    }
    /*CSS SAN PHAM*/
    .content
    {
        width:100%;
    }
    .content #left_content
    {
        width:100%;
        padding-right: 0;
    }
    .content_product
    {
        width:100%;
    }
    .pro
    {
        width:40%;
        padding:10px 1%;
        float:left;
        border:1px #ccc dashed;
        margin: 15px 3%;
        text-align: center;
        min-height: 200px;
    }
    .pro a.img
    {
        display:block;
        width:100%;
        height:111px;
        text-align: center;
    }
    .pro h4 {
        padding: 5px 0px;
        width: 100%;
        text-align: center;
    }
    .pro h4 a {
        text-align: center;
        width: 100%;
    }

    .content #right_content 
    {
        display: none;
        width:250px;
        margin-left:30px;
        padding-top:30px;
    }
    .mod_right
    {
        width:228px;
        margin-bottom: 5px;
        border:1px #CCC solid;
        border-radius: 7px;
        padding: 10px;
        background: #FFF;
    }
    .mod_right marquee {
        min-height: 400px;
    }
    #right_content h4 {
        text-align: center;
        font-size: 12px;
        font-weight: bold;
        padding: 7px 0px;
        background: url(images/bg_menu.png) repeat-x scroll center center;
        color: #FFF;
        border-radius: 6px;
        margin-bottom: 10px;
    } 
    ul.menu_right > li {
        border-bottom: 1px #CCC dotted;
        position: relative;
    }
    ul.menu_right > li > a
    {
        display:block;
        padding:10px 0px 10px 20px;
        font-weight:bold;
        font-size:12px;
        color:#4e4e4e;
    }
    ul.menu_right > li:hover > ul {
        display: block;
    }
    ul.menu_right > li > ul {
        display: none;
        position: absolute;
        top: -1px;
        left: -200px;
        width: 200px;
        border:1px #CCC solid;
        background: #FFF;
    }
    ul.menu_right > li > ul > li {
        border-bottom: 1px #CCC dotted;
    }
    ul.menu_right > li > ul > li > a {
        display:block;
        padding:10px 0px 10px 20px;
        font-weight:bold;
        font-size:12px;
        color:#4e4e4e;
    }
    ul.menu_right > li > ul > li > a:hover, ul.menu_right > li > a:hover {
        text-decoration: underline;
    }
    .mod_other
    {
        width:230px;
        margin:15px 0px 15px 20px;
    }
    .mod_right .pro_hots
    {
        width:230px;
        float:left;
        margin:12px 0px;
    }
    .mod_right .pro_hots a.img
    {
        display:block;
        width:65px;
        height:48px;
        border:1px #e6e4e5 solid;
        float:left;
        margin-right:18px;
    }
    .mod_right .pro_hots a.img img {
        width:65px;
        height:48px;
    }
    .mod_right .pro_hots a.img:hover
    {
        border:1px #acacac solid;
    }
    .mod_right.pro_hots a.img img
    {
        width:65px;
        height:48px;
    }
    .mod_right .pro_hots h5
    {
        font-weight:normal;
        font-size:13px;
    }
    .mod_right .pro_hots h5 a
    {
        color:#555555;
    }
    .mod_right .pro_hots span
    {
        color:#555;
    }

    .mod_right a.adv
    {
        display:block;
        width:230px;
        margin-bottom:10px;
    }
    .mod_right a.adv img
    {
        width:230px;
    }
    .content_product .img_sanpham img
    {
        width:204px;
        height:190px;
        border:1px #ab9f9f solid;
        float:left;
        margin-right:32px;
    }
    .content #left_content .product .content_product p
    {
        line-height:18px;
    }
    .content #left_content .product .content_product .detail
    {
        width:90%;
        float:none;
        margin:20px 0px;
        padding: 0px 5%;
    }

    .content #left_content .product .content_product .project
    {
        width:625px;
        float:left;
        padding:25px 0px;
        border-bottom:1px #666 dotted;
    }
    .content #left_content .product .content_product .project a.img
    {
        display:block;
        width:170px;
        height:120px;
        float:left;
        margin-right:30px;
    }
    .content #left_content .product .content_product .project a.img img
    {
        width:170px;
        height:120px;
    }
    .content #left_content .product .content_product .project h4
    {
        font-size:13px;
        font-weight:bold;
    }
    .content #left_content .product .content_product .project h4 a
    {
        color:#22359b;
    }
    .content #left_content .product .content_product .project h4 a:hover
    {
        text-decoration:underline;
    }
    .content #left_content .product .content_product .project p
    {
        font-size:12px;
        line-height:18px;
    }

    span.xemtiep a
    {
        display:block;
        padding:5px 0px 5px 10px;
        font-size:12px;
        color:#2037a1;
        background:url(images/xemtiep.png) no-repeat scroll 0px 10px;
        float:left;
    }
    span.xemtiep a:hover
    {
        text-decoration:underline;
    }
    #phantrang
    {
        float:right;
        margin:20px 0px;
    }
    #phantrang a
    {
        display:block;
        float:right;
        margin-left:2px;
    }
    #phantrang a span
    {
        font-size:12px;
        padding:2px 5px;
        background:#d5d5d5;
        color:#454545;
    }
    #phantrang a span#active, #phantrang a:hover span
    {
        font-weight:bold;
    }
    .news
    {
        width:96%;
        margin: 10px 2%;
    }
    .news .left_news
    {
        width:96%;
        padding-right:0;
        margin: 10px 2%;
        border-bottom: 1px #CCC solid;
        text-align: center;
    }
    .news tr
    {
        display:block;
        padding:10px 0px;
        border-bottom:none;
        float:none;
    }
    .news .right_news
    {
        width:100%;
        float:none;
        text-align: center;
    }
    .news .left_news a.img, .news .right_news a.img
    {
        width:100%;
        height:100%;
        display:block;
        float:none;
        margin-right:0;
        text-align: center;
    }
    .news .left_news a.img img, .news .right_news a.img img
    {
        width:100%;
        height:100%;
    }
    .news .left_news h4, .news .right_news h4
    {
        font-size:12px;
        font-weight:bold;
        text-align: center;
    }
    .ticket
    {
        width:80%;
        float:none;
        margin-left: 0;
        margin:10px 10%;
    }
    .ticket tr td
    {
        padding:5px 0px 5px 0px;
        height:20px;
    }
    table.ticket tr td.h4 h4
    {
        font-weight:bold;
        font-size:13px;
        color:#035aa9;
    }
    table.ticket tr td.left_ticket
    {
        width:50%;
        font-size:12px;
        color:#565758;
        padding-right:20px;
    }
    table.ticket tr td.left_ticket input
    {
        height:19px;
        width:100%;
        border:1px #d6d6d6 solid;
        color:#565758;
        font:12px;
        padding:4px 0px 5px 0px;
    }
    table.ticket tr td.right_ticket
    {
        width:50%;
    }
    table.ticket tr td.right_ticket input
    {
        height:19px;
        width:100%;
        border:1px #d6d6d6 solid;
        color:#565758;
        padding:4px 0px 5px 0px;
    }
    table.ticket tr td.mid_ticket
    {
        width:100%;
    }
    table.ticket tr td.mid_ticket input
    {

        height:19px;
        width:100%;
        border:1px #d6d6d6 solid;
        color:#565758;
        padding:4px 0px 5px 0px;
    }
    table.ticket tr td input#submit
    {
        font-size:12px;
        padding:4px 10px 5px 10px;
        background:#3e67a4;
        color:#FFF;
        border:none;
        font-weight:bold;
    }
    table.ticket tr td textarea#noidung
    {
        height:130px;
        width:100%;
        border:1px #d6d6d6 solid;
        color:#565758;
        padding:4px 0px 5px 0px;
    }
    .pagination {
        margin: 15px 0px;
    }
    .pagination a {
        color: #000;
        padding: 2px 5px;
        border:1px #FFF solid;
    }
    .pagination a:hover {
        border:1px #F00 solid;
    }
    .pagination strong {
        font-weight: normal;
        border:1px #F00 solid;
        padding: 2px 5px;
        background: #F00;
        color: #FFF;
    }

    ul.other_news li
    {
        background:url(images/dot_li_ul_home.png) no-repeat scroll 0px 15px;
    }
    ul.other_news a
    {
        display:block;
        color:#555555;
        padding:10px 0px 10px 20px;
    }
    ul.other_news li a:hover
    {
        text-decoration:underline;
        color:#000;
    }

    .other_product {
        display: none;
    }
    .content .detail, ul.other_news {
        width: 90%;
        padding: 5%;
    }
   
}