@charset "UTF-8";
/*@import url(animate.css);*/
@import url(font-awesome.min.css);
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic);

.main{
    margin: 0 auto;
    background-color: #f0f0f0;
    background-image: url(../upload/main_bg.gif) , url(../upload/main_bg.jpg);  
    background-position:top left , bottom left;
    background-repeat: no-repeat;
    padding: 15px 0 15px 0;
    min-height:1770px;

}

/*.track button{
    overflow: visible;
    position: absolute;
    margin-top: 15px;
    right: 5px;
    top: 10px;
    border: 0;
    padding: 0;
    cursor: pointer;
    height: 30px;
    width: 120px;
    font: bold 14px/27px 'lucida sans', 'trebuchet MS', 'Tahoma';
    color: #ffffff;
    background: rgb(64, 182, 212);
    border-radius: 0 6px 6px 0;
    text-shadow: 0 1px 0 rgb(45, 107, 115);
    box-shadow: inset 0px 2px 2px rgb(44, 141, 165),inset 0px -1px 2px rgb(14, 146, 183);
}*/

/*Menu*/
.menu {
    padding: 0;
    margin: 30px 0px 0px -25px;
    float: left;
    width: 670px;
    /*border: 3px solid #fff;*/
    /*background: url('../upload/menu-background.jpg');*/
    position: relative;
}

/* slide*/
#slider {
    width: 980px;
    padding: 0;
    margin: 0 auto;
    position: relative;
}

#slider .nivoSlider {
    width: 980px;
    height: 326px;
    margin: 0;
    overflow: hidden;
    /*background:url('../upload/silver-truck.jpg');*/
    /*background-size: 980px 326px;*/
    /*background-position: 75px -25px;*/
}
.slide_blog_resize {
    background: #ebebeb url(../upload/slot_bg.gif) bottom repeat-x;
    border-top: 1px solid #fff;
    /*padding: 10px 0;*/
    margin: 0;
    height:160px;
}
.slide_blog_resize_b {
width: 100%;
margin: 0px auto 0px auto;
padding: 0;
overflow: auto;
position: relative;
}

.left-section{
    min-height:230px;
    width:300px;
    float:left;
}
.phone-title{
    /*background: url('../upload/phone-title.jpg');*/
    background: #ffca3a;
    width: 290px;
    background-position: 0px -1px;
    border: 2px solid #fff;
    margin: 0px auto;
    text-shadow: 0 1px 0 rgba(239, 239, 239, 0.72);
    color: #036582;
    font: bold 16px/27px 'lucida sans', 'trebuchet MS', 'Tahoma';
    padding: 0px 5px 0px 5px;
    box-sizing: border-box;
    line-height: 28px;
}
.shadow{
    width:290px;height:8px;margin: 0px auto;
    background: url('../upload/shadow.png');
    opacity: 0.7;
}
.customer_care{
width: 286px;
height: 130px;
margin: 0px auto;
background: url('../upload/customer_care.png');
background-size: 290px 130px;
border: 2px solid #fff;
box-sizing: border-box;
box-shadow: 2px 2px 5px rgba(33, 38, 39, 0.51);
}
.facebook {
    width: 282px;
    height: 230px;
    overflow: hidden;
    margin: 0px auto;margin-bottom: 8px;
    border: 3px solid #fff;
box-shadow: 2px 2px 5px rgba(33, 38, 39, 0.51);

}
.tuyen_dung {
    width: 282px;
    height: 238px;
    overflow: hidden;
    margin: 0px auto;
    border: 3px solid #fff;
    box-shadow: 2px 2px 5px rgba(33, 38, 39, 0.51);
    background: url('../upload/recruit.jpg');
    background-size: cover;
}





.map-point{
  font-size:15px;
  font-weight: bold;
  /*text-shadow: 0 -1px 0 rgba(234, 234, 234, 0.47);*/
color: #F38C47;
margin: 0px;
}
.text-point{
color: #077e87;
font-weight: bold;
margin: 0px;
}
.active-address{    background: #fff !important;
    color: #0488ab !important;
    text-shadow: 1px 2px 1px rgb(236, 233, 233);}
.address>div{cursor: pointer;}
#map-canvas{
    height:223px;
}



/*camera*/
@media only screen and (min-width: 960px) {
    .camera{
    width: 980px;margin: 0px auto;    
    }
    .camera .img{
        width: 100%;
        height: 326px;
    }

    .camera >.camera-shadow{
        width: 100%;
        height: 26px;
    }

}

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

    .camera{
    width: 100%;margin: 0px auto;    
    }

    .camera .img{
        width: 100%;
        height: auto;
    }

    .camera >.camera-shadow{
        width: 100%;
        height: 26px;
    }    

}

/*header*/
@media only screen and (max-width: 959px) 
{
    .menu{width: 100%;}
    .mobile-menu-bar{
        position: fixed;
        width: 100%;
        top:0px;
        left: 0px;
        background: #fff;
        height: 50px;
        z-index: 1000;

    }
    .menu>ul{
        display: none;
        position: fixed;
        margin: 0px 10px 0px 8px;
        top: 50px;
        left: 0px;
        width: 100%;
        z-index: 20;
        list-style-type: none;
        background: #FFF;
        border: 1px solid #DDD;
        box-sizing: margin-box;
    }

.menu > ul  li {
    width: 100%;
    padding: 10px;
    color: #560303;
    font-weight: bold;
    text-shadow: 0px 1px rgba(255, 255, 255, 0.38);
    text-transform: uppercase;
}
.menu > ul a {
    text-decoration: none;
    color: #086eb0 !important;
}

.menu > ul a:hover {
    text-decoration: underline;
}

    .menu>i{
        display: block;
        float: right;
        font-size: 23px;
        line-height: 70px;
        cursor: pointer;
    }
    .logo{
        display:none;
    }
    .track{
        display: none;
    }
    #mobile-menu{
        float: right;
        font-size: 30px;
        line-height: 50px;
        margin: 0px 30px 0px 0px;
    }
    #shadow-track{
        display: none;
    }
}
@media only screen and (min-width: 960px) 
{
        
    #mobile-menu{
        display: none;
    }
        .logo {
            padding: 0;
            margin: 0;
            margin-left: -40px;
            margin-right: 20px;
            margin-top: -5px;
            width: 130px;
            float: left;
            position: relative;
            z-index: 2;
        }
        .track{
            float: right;
            height: 73px;
            margin-top: 36px;
            margin-left:-100px; 
            width: 360px;
            padding: 25px 20px 0px 5px;
            box-sizing: border-box;
            position: relative;
            z-index: 2;
            /*background: #ffca3a;*/
            background: url('../upload/track.png');
            background-size: 350px 89px;
            background-position: 15px 0px;
            background-repeat: no-repeat;
            /*border-radius: 15px 15px 0px 0px;*/

            /*box-shadow: inset 0px 5px 5px rgba(241, 181, 15, 0.86), inset 0px -5px 5px #f5b415,0px 3px 4px rgba(148, 147, 138, 0.58);*/
        }
        .track input{
            /*border-radius: 20px;*/
            border-radius: 6px;
            width: 290px;
            margin: 0px;
            border: none;
            height: 30px;
            float: right;
            box-sizing: border-box;
            box-shadow: inset 0px 2px 4px #ddd,2px 2px 1px rgba(241, 159, 10, 0.78),inset 0px -2px 0px rgba(221, 221, 221, 0.48);
            padding-left: 10px;
            color: rgba(7, 126, 128, 0.9);
            font-weight: bold;
            background: rgb(255, 255, 255);
        }
        .track button {
            overflow: visible;
            position: absolute;
            margin-top: 15px;
            right: 5px;
            top: 10px;
            border: 0;
            padding: 0;
            cursor: pointer;
            height: 30px;
            width: 120px;
            font: bold 14px/27px 'lucida sans', 'trebuchet MS', 'Tahoma';

            color: rgb(253, 29, 29);
            background: #c3c5c7;
            border-radius: 0 6px 6px 0;
            text-shadow: 0 1px 0 rgba(251, 253, 253, 0.23);
            box-shadow: inset 0px 2px 2px rgb(181, 177, 165),inset 0px -1px 2px rgb(181, 167, 129);
        }

        .menu ul {
            text-align: left;
            padding: 15px 0 0 0;
            margin: 0;
            list-style: none;
            border: 0;
            float: right;
        }
        .menu ul li {
            float: left;
            margin: 0;
            padding: 13px 7px;
            border: 0;

        }
        .menu ul li a {
            float: left;
            margin: 0;
            padding: 13px 0 13px 0;
            color: #5e5e5e;
            font: bold 14px  Arial, Helvetica, sans-serif;
            text-decoration: none;
        }
        .menu ul li a:hover {
            color: #fff;
            background: url(../upload/r_menu.jpg) no-repeat right;
        }   
        .menu ul li a.active {
            color: #fff;
            background: url(../upload/r_menu.jpg) no-repeat right;
        }

        .menu ul li a.active span {
            color: #fff;
            background: url(../upload/l_menu.jpg) no-repeat left;
            text-shadow: 0px 1px rgb(21, 41, 45);
        }
        .menu ul li a span {
            padding: 13px 10px;
            background: none;
            text-shadow: 0px 1px rgb(255, 255, 255);

        }
        .menu ul li a:hover span {
            color: #fff;
            background: url(../upload/l_menu.jpg) no-repeat left;
            text-shadow: 0px 1px rgb(21, 41, 45);
        }


}
/*main*/

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

    .header {
        padding: 0;
        margin: 0 auto;
        width: 1080px;
    }

}

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

    .main{
        width: 100%;margin: 0px auto;    
    }  

    .header {
        padding: 0;
        margin: 0 auto;
        width: 100%;
    }   

}



/*middle*/
@media only screen and (min-width: 972px) {

.track_mobile{
    display: none;
}

    .middle{
        margin: 0px auto;
        padding: 5px;
        background: rgb(217, 233, 249);
        border: 5px solid #fff;
        width: 972px;
        min-height: 500px;
        box-sizing: border-box;
        box-shadow: 1px 1px 4px rgba(101, 121, 126, 0.8);
        position: relative;
        z-index: 10;
        overflow: auto;
    }

.service{
        width: 640px;
        height: 145px;
        margin: 0px auto;
        margin-top: 8px;
        margin-bottom: 17px;
    }
    .service>img{
        width:260px;
        height:126px;
        border:2px solid #fff;
        box-shadow: 2px 2px 5px rgba(33, 38, 39, 0.51);
        float:left;
    }
    .service-title{
    float:right;
    /*background: url('../upload/phone-title.jpg');*/    
    background: #2d81a5;
    width:370px;
    height:30px;
    background-position:0px -1px;
    border: 2px solid #fff;
    margin: 0px auto; 
    text-shadow: 0 1px 0 rgba(14, 45, 54, 0.3);
    color: #fff;
    font: bold 16px/27px 'lucida sans', 'trebuchet MS', 'Tahoma';
    padding:0px 5px 0px 5px;
    box-sizing: border-box;
    line-height: 28px;
    background-size: 370px;
    text-align: center;
    }
    .service-text{
      height: 92px;
    width: 370px;
    border: 2px solid #fff;
    box-shadow: 2px 2px 5px rgba(33, 38, 39, 0.51);
    float: right;
    box-sizing: border-box;
    background: url('../upload/text-service.jpg');
    background-position: -10px 0px;
    padding: 15px;
    color: rgba(52, 82, 111, 0.94);
    text-shadow: 0px 1px rgb(255, 255, 255);
    text-align: justify;
    }

    .right-section{
        width:650px;
        min-height: 800px;
        float: right;
    }

    .service-header{
        width:640px;
        height:30px;
        margin: 0px auto;
        border: 2px solid #fff;
        text-shadow: 0 1px 0 rgba(14, 45, 54, 0.3);
        color: #fff;
        font-size: 20px;
        padding:0px 5px 0px 5px;
        box-sizing: border-box;
        line-height: 26px;
        font-weight: bold;
        background: #0071A0;
        box-shadow: 2px 2px 2px #79ACB0,-2px -2px 2px #DBDCE7;
    }    

    .article{
        width:950px;
        min-height:480px;
        margin: 0px auto;
        padding: 10px 40px;
        box-sizing: border-box;
        box-shadow: 1px 1px 4px rgba(101, 121, 126, 0.8);
        background: #fff;
    }   

    /* đối tác*/
        #doitac{
            width: 970px;
            border: solid 2px #fff;
            border-radius: 7px;
            height: 100px;
            overflow: auto;
            margin: 5px auto 15px auto;
            background: url('../upload/text-service.jpg');
            box-shadow: 2px 2px 5px rgba(33, 38, 39, 0.51);
            background-size: 1000px 70px;
        }     


.footer-section{
    width:975px;
    height:270px;
    margin: 0px auto;
    box-sizing: border-box;
    padding-top:0px;
    margin-top: 7px;
}          

.map-canvas{
    width: 975px;
    margin: 0 auto;
    height: 238px;
    background: #fff;
    background-position: 0px 20px;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    box-shadow: 2px 2px 10px rgb(173, 165, 145);
}
.address{
    min-height: 35px;
    width: 975px;
    margin: 0px auto;
    box-sizing: border-box;
    background: #ffca3a;
    padding: 5px 0px 0px 5px;
    margin-top: -10px;
    overflow: hidden;

}
.address-map{
    height: 30px;
    padding: 0px;
    width: 33.1%;
    text-align: center;
    line-height: 28px;
    float: left;
    color: rgb(13, 92, 117);
    font-weight: bold;
    text-shadow: 0px 1px rgba(255, 255, 255, 0.57);
}

.map,.map_2,.map_3{
  width:975px;
  margin:0px auto;
  height:230px;
  margin-top: 10px;
  border: 3px solid #fff;
  box-sizing: border-box;
}

.footer-shadow{
 margin: 0px auto;
 display: block;
 opacity: 0.35;
 margin-top: 10px;
 width: 980px;height: 26px;
}

#mobile_td{
    display: none;
}


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



    .track_mobile{
        display: block;
        float: left;
        width: 100%;
        box-sizing: border-box;
        margin-bottom: -40px;
        padding: 13px 0px 0px 7px;
    }

        .track_mobile input{
            /*border-radius: 20px;*/
            border-radius: 6px 0px 0px 6px;
            width: 150px;
            margin: 0px;
            border: none;        
            box-sizing: border-box;
            box-shadow: inset 0px 2px 4px #ddd,inset 0px -2px 0px rgba(221, 221, 221, 0.48);
            padding-left: 10px;
            color: rgba(7, 126, 128, 0.9);
            font-weight: bold;
            background: rgb(255, 255, 255);
            line-height: 26px;
            font-size: 12px;
        }
        .track_mobile button {
            overflow: visible;
            right: 5px;
            top: 10px;
            border: 0;
            padding: 0;
            cursor: pointer;
            width: 80px;
            font: bold 12px/27px 'lucida sans', 'trebuchet MS', 'Tahoma';
            color: #036582;
            background: #ffca3a;
            border-radius: 0 6px 6px 0;
            text-shadow: 0 1px 0 rgba(239, 239, 239, 0.72);
            box-shadow: inset 0px 2px 2px rgb(216, 138, 51);
            margin: -3px 0px 0px -5px;
        }


    .middle{
    margin: 0px auto;
    padding: 0px;
    background: rgb(217, 233, 249);
    border: 5px solid #fff;
    width: 100%;
    min-height: 500px;
    box-sizing: border-box;
    box-shadow: 1px 1px 4px rgba(101, 121, 126, 0.8);
    position: relative;
    z-index: 10;
    overflow: auto;
    }


.service{
        width: 100%;
        min-height: 145px;
        margin: 5px auto;
        margin-top: 8px;
        margin-bottom: 17px;
    }
.service>img{
    width:100%;
    display: none;
}

.right-section{
    width: 97% !important;
    float: left;
    padding: 10px 0px 10px 5px;
}
.service .shadow{
    float: none;
    width: 100% !important;
    background-size: 100% 8px !important;
}


    .service-header{
        width:100%;
        height:30px;
        margin: 0px auto;
        border: 2px solid #fff;
        text-shadow: 0 1px 0 rgba(14, 45, 54, 0.3);
        color: #fff;
        font-size: 20px;
        padding:0px 5px 0px 5px;
        box-sizing: border-box;
        line-height: 26px;
        font-weight: bold;
        background: #0071A0;
        box-shadow: 2px 2px 2px #79ACB0,-2px -2px 2px #DBDCE7;
    }
    .service-title{
    /*background: url('../upload/phone-title.jpg');*/    
    background: #2d81a5;
    width:100%;
    min-height:30px;
    background-position:0px -1px;
    border: 2px solid #fff;
    margin: 0px auto 0px auto; 
    text-shadow: 0 1px 0 rgba(14, 45, 54, 0.3);
    color: #fff;
    font: bold 16px/27px 'lucida sans', 'trebuchet MS', 'Tahoma';
    padding:0px 5px 0px 5px;
    box-sizing: border-box;
    line-height: 28px;
    background-size: 370px;
    text-align: center;
    }

    .service-text{
    min-height: 92px;
    width: 100%;
    border: 2px solid #fff;
    box-shadow: 2px 2px 5px rgba(33, 38, 39, 0.51);

    box-sizing: border-box;
    background: url('../upload/text-service.jpg');
    background-position: -10px 0px;
    padding: 15px;
    color: rgba(52, 82, 111, 0.94);
    text-shadow: 0px 1px rgb(255, 255, 255);
    text-align: justify;
    text-decoration: none !important;
    }

    .article{
        width:100%;
        min-height:480px;
        margin: 0px auto;
        padding: 10px 40px;
        box-sizing: border-box;
        box-shadow: 1px 1px 4px rgba(101, 121, 126, 0.8);
        background: #fff;
    }   

    /* đối tác*/
    #doitac{
        width: 97%;
        border: solid 2px #fff;
        border-radius: 7px;
        height: 100px;
        overflow: auto;
        margin: 5px auto 15px auto;
        background: url('../upload/text-service.jpg');
        box-shadow: 2px 2px 5px rgba(33, 38, 39, 0.51);
        background-size: 1000px 70px;
    }    

    .footer-section{
        width:100%;
        min-height:270px;
        margin: 0px auto;
        box-sizing: border-box;
        padding-top:0px;
        margin-top: 7px;
    }

    .map-canvas{
        width: 100%;
        margin: 0 auto;
        height: 238px;
        background: #fff;
        background-position: 0px 20px;
        border-top: 2px solid #fff;
        border-bottom: 2px solid #fff;
        box-shadow: 2px 2px 10px rgb(173, 165, 145);
    }
    .address{
        min-height: 35px;
        width: 100%;
        margin: 0px auto;
        margin-top: 5px;
        box-sizing: border-box;
        background: #ffca3a;
        padding: 5px 5px 0px 5px;
        margin-top: -10px;
        overflow: auto;
    }
    .address-map{
        min-height: 30px;
        padding: 0px;
        width: 100%;
        text-align: center;
        line-height: 28px;
        float: left;
        color: rgb(13, 92, 117);
        font-weight: bold;
        text-shadow: 0px 1px rgba(255, 255, 255, 0.57);
    }

.map,.map_2,.map_3{
  width:100%;
  margin:0px auto;
  height:230px;
  margin-top: 10px;
  border: 3px solid #fff;
  box-sizing: border-box;
}

.footer-shadow{
 margin: 0px auto;
 display: block;
 opacity: 0.35;
 margin-top: 0px;
 width: 100%;height: auto;
}
#tuyen_dung{
    display: none;
}

#none_mobile{
    display: none !important;
}

.mobile_div,.mobile_div_title{
    text-align: left;
    padding: 5px 5px 0px 5px;
    line-height: 20px;    
}    
.mobile_div_title{
    font-weight: bold;
    background: orange;
    color: #fff;

}
.mobile_div{

}

}