@charset "utf-8";

html,
body,
div,
span,
strong {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}

body {
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.5;
    color: #000;
    background: #fff;
}

/* Clearfix */
.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

* html>body .clearfix {
    display: block;
    width: 100%;
}

* html .clearfix {
    height: 1%;
}

a {
    text-decoration: none;
    color: #939393;
}

a:hover {
    color: #F00;
}

img {
    border: 0;
    max-width: 100%;
}

.clear {

    overflow: hidden;
    clear: both;
}

.txtcenter {
    text-align: center;
}

table,
tr,
td {
    border-collapse: collapse;
}

.thongbao {
    border: 1px solid #0C0;
    border-radius: 5px 5px 5px 5px;
    margin: 0 auto;
    overflow: hidden;
    padding: 15px;
}

.tablelienhe span {
    color: #F00;
}

.tablelienhe td {
    height: 25px;
}

.tablelienhe .input,
.tablelienhe textarea {
    border: 1px #E9E9E9 solid;
    azimuth: center;
    width: 300px;

}

.tablelienhe .title {
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase
}

.box_news {
    clear: both;
    padding-bottom: 10px;
    padding-top: 5px;
    border: 1px solid #fcfcfc;
    ;
    margin-bottom: 10px;
    padding: 10px;
    -webkit-box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    -moz-box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    margin: 0 0 30px;
    overflow: hidden;
    position: relative;
}



.inox-tran-tinh-text {
    margin-left: 112px;
}



.boxprohg {
    margin-bottom: 22px !important;
}

div#itt-spa-left {
    padding: 12px;
    background: white;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
}


/* Thanh tìm kiếm */
         * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }

        body {
            background-color: #f5f5f5;
            padding: 20px;
        }

        .search-container {
            max-width: 600px;
            margin: 0px auto;
            position: relative;
            bottom: 60px;
        }

        #keyword {
            width: 100%;
            padding: 15px 20px;
            font-size: 16px;
            border: 2px solid #ddd;
            border-radius: 30px;
            outline: none;
            transition: all 0.3s;
        }

        #keyword:focus {
            border-color: #4d90fe;
            box-shadow: 0 0 10px rgba(77, 144, 254, 0.3);
        }

        #search-results {
            display: flex;
            flex-direction: column;
            max-height: 400px;
            overflow-y: auto;
            margin-top: 20px;
            padding: 5px;
            background-color: white;
        }

        .result-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 10px;
            border: 1px solid #ddd;
            margin-bottom: 10px;
            border-radius: 5px;
            transition: background-color 0.3s ease;
        }

        .result-item:hover {
            background-color: #f4f4f4;
        }

        .result-item img {
            max-width: 60px;
            margin-right: 10px;
        }

        .result-item a {
            flex-grow: 1;
            font-size: 16px;
            text-decoration: none;
            color: #333;
        }

        .result-item a:hover {
            color: #e53c41;
        }
/* END


/* Cho trang */




/*.box_news:hover{ background:rgba(116, 28, 77, 0.68); color:#fff}*/
.box_news h2 {
    font-size: 12px;
    margin: 0px;
}

.box_news h2 a {
    color: #0074E0;
    font-family: 'RobotoBoldCondensed';
    font-size: 16px;
}

.box_news1 {
    text-align: center;
    clear: both;
    border: 1px solid #fcfcfc;
    margin-bottom: 10px;
    padding: 30px 5px;
    -webkit-box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    -moz-box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    margin: 0 0 30px;
    overflow: hidden;
    background: #fff;
}


div#info_deals {
    clear: both;
    border: 1px solid #fcfcfc;
    margin-bottom: 10px;
    padding: 20px;
    -webkit-box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    -moz-box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    margin: 0 0 30px;
    overflow: hidden;
    background: #fff;
}

/*.box_news:hover{ background:rgba(116, 28, 77, 0.68); color:#fff}*/
.box_news1 h2 {
    font-size: 12px;
    margin: 0px;
}

.box_news1 h2 a {
    color: #999;
    font-family: fontvnf;
    font-style: italic;
    font-size: 20px;
    height: 40px;
    line-height: 40px;
}

.box_news1 .date {
    font-family: 'Oswald', sans-serif;
    font-size: 15px;
    text-transform: uppercase;
    margin-bottom: 30px;
}

@media (max-width: 320px) {

    .box_news h2 a {
        font-size: 15px;
    }
}

.box_news p {
    margin: 0px;
    padding: 0px;
    margin-bottom: 10px;
    font-family: 'RobotoCondensedRegular';
    font-size: 14px;
}

.box_news p.small {
    font-size: 11px;
    color: #666666;
}

.box_news h2 a:hover {
    color: #F00;
}

.box_news1 h2 a:hover {
    color: #F00;
}

h1.text_title {
    color: #241900;
    font-size: 12px;
}

.image_boder {
    float: left;
    margin-right: 10px;
    background: #FFF;
    padding: 5px;
    border: 1px solid #E4E4E4;
    width: 200px;
}

@media(max-width: 320px) {
    .image_boder {
        width: 100%;
    }
}

.image_boder1 {
    background: #FFF;
    padding: 5px;
}

.image_boder1 img {
    margin-top: 5px;
    float: left
}

.xemthem {
    background: #0B5C3B;
    border: 1px solid #fff;
    padding: 10px 30px;
    cursor: pointer;
    width: 170px;
}

.xemthem a {
    color: #FFFFFF;
    font: 18px fontavo;
}

.button {
    background: transparent;
    border: 1px solid #BDBDBD;
    color: #fff;
    font: 18px fontavo;
    text-transform: uppercase;
    padding: 10px 30px;
    cursor: pointer;
    background: #257441;
}

.button1 {
    background: transparent;
    border: 1px solid #BDBDBD;
    color: #8B8888;
    font: 12px;
    padding: 10px 30px;
    cursor: pointer;
}

.button:hover {
    color: #FFFFFF;
    background: #000000;
    transition: ease 0.7s;
}

.button1:hover {
    color: #fff;
    background: #BEBEBE;
    transition: ease 0.7s;
}

.boder {
    border: 3px #E0E0E0 solid;
    margin: 0px 35px;
}

.viewmore {
    text-align: right;
    padding-right: 10px;
}

.viewmore img {
    vertical-align: middle;
}

.viewmore a {
    color: #0000ff;
    font-size: 11px;
    font-weight: bold;
}


.tinlienquan a {
    color: #333
}

.textright {
    float: right;
    padding-right: 10px;
}

.textright a {
    font-style: italic;
    font-weight: normal;
    text-transform: none;
}

.othernews {
    padding-left: 10px;
    color: #666;
}

.othernews h1 {
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    color: #333;
}

.othernews ul {
    list-style: inside;
    padding: 0px;
    margin: 0px;
}

.othernews ul li {
    padding: 0px;
}

/* --------------------- Phan trang ------------------*/
.phantrang {
    text-align: center;
    padding: 10px 0px;

}

.phantrang a {
    background: rgba(1, 144, 51, 0.8);
    border: 1px solid #D2D2D2;
    /* box-shadow: 0 1px 0 #FFFFFF inset; */
    color: #FFFFFF;
    cursor: pointer;
    font-size: 14px;
    margin: 0 0 0 4px;
    padding: 6px 10px;
}

.phantrang a:hover {
    background: #019033;
    box-shadow: none;
    color: #FDFF09;
    text-decoration: none;
}

.phantrang .paginate_button_disabled,
.phantrang .paginate_button_disabled:hover {
    background: linear-gradient(to bottom, #F8F8F8 0%, #EAEAEA 100%) repeat scroll 0 0 transparent;
    border: 1px solid #D2D2D2 !important;
    color: #ADADAD !important;
    cursor: default;
    opacity: 0.7;
}

.phantrang .paginate_active,
.phantrang .paginate_active:hover {
    background: none repeat scroll 0 0 rgb(0, 144, 51);
    box-shadow: none;
    color: #EAFF00;
    font-weight: bold;
}


/* Không đụng style cũ, chỉ thêm nhẹ */
.phantrang {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.phantrang a {
    background: #173e74;
    color: #fff;
    padding: 8px 12px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 600;
}

.phantrang a.pg-num.active {
    background: #ff8a00;
}

.phantrang a.disabled {
    opacity: .5;
    pointer-events: none;
}
/*----------------------------------------------------*/
#wrapper {
    position: relative;
    width: 100%;
    margin: 0 auto;
    z-index: 1;
}

#bg_page {}

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

.center {
    width: 1200px;
    margin: 0 auto;
    padding: 0px;
}


#itt-spa-left p {
    text-align: justify;
}

#itt-spa-left ul {
    list-style-position: outside;
    /* Bullet ngoài text */
    padding-left: 20px;
    /* Tạo khoảng cách an toàn - chống trang bbuilet */
}
/************** Header ****************/
#header {
    position: relative;
    background: #fff;
    background-size: 100%;
    width: 100%;
    margin: 0 auto;
    box-shadow: 2px 4px 10px #ccc;
    height: 150px;
}


#header .banner {
    position: relative;
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
}

#header .banner h1 {
    display: none;
}

.topbanner {
    width: 100%;
    background: url(../image/bg_topbanner.html) no-repeat;
    text-align: center;
    /* background-size: 100% 100%; */
}


.email {
    font-size: 20px;
    color: #ffff00;
    float: left;
    background: url(../image/ico_email.png) no-repeat top 8px left 0px;
    padding-left: 30px;

}

.email span {
    font-family: 'utmavo';
    font-size: 20px;
    color: #f2f2f2;
}

.logo_header {
     position: absolute;
    top: 12px;
    z-index: 10;
    left: 0px;
}

.share {
    z-index: 10;
    margin: 7px 0px 0px 100px;
    float: left;
}

.box_lang {
    position: absolute;
    top: 7px;
    left: 35px;
    width: 155px;
    height: 25px;
}

.picmenu {
    float: left;
    width: 35px;
    margin: 10px 0px 0px 10px;
}

/***************** Container ********************/
.bg_container {
    background: #fff;
}

.bg_container .slogan {
    color: #292929;
    font-weight: bold;
    text-transform: uppercase;
    padding-top: 10px;
}

div#tienich ul {
    list-style: none;
    margin: 6px 0px;
    padding: 0px;
}

div#tienich ul li {
    padding: 3px 15px;
    height: 25px;
    line-height: 25px;
}

div#tienich ul li a {
    text-decoration: none;
    color: #000;
}

div#tienich ul li img {
    float: left;
    margin-right: 10px;
}

.container_left.right {
    background: url(../images/bg_right.html) repeat-y top left;
    border-radius: 10px 10px 0px 0px;
}

/***********CONTAINER LEFT*********/
/* Cột trái */
.container_left {
    width: 300px;
    margin-top: 10px;
    box-sizing: border-box;
}

.container_left .module_left {
    padding: 0px;
    background: #fff;
    margin-bottom: 10px;
    margin-top: 10px;
}

.container_left .module_left h2 {
    /*background: url(../image/title_left.png) no-repeat; */
    font-size: 22px;
    text-transform: uppercase;
    color: #1D9108;
    font-family: 'RobotoBoldCondensed';
    line-height: 35px;
    text-align: left;
    margin-bottom: 0px !important;
    padding: 0px;
}

.container_left .module_left h3 {
    background: url(../image/ico_title_spleft.png) no-repeat top 9px left 10px, url(../image/title_left.html) no-repeat;
    font-size: 16px;
    text-transform: uppercase;
    color: #fff;
    font-family: 'texgyreadventorregular';
    height: 40px;
    line-height: 42px;
    text-align: left;
    padding-left: 45px;
    margin-bottom: 0px !important;
}


.container_left .module_left .content {
    background: #fff;
    padding: 0px;
    z-index: 10;
    border: 1px solid #ccc;
    border-radius: 2px 2px;
}

.container_left .module_left .content.padding10 {
    padding: 10px;
}

.container_left .module_left .text_info {
    background: #FFF;
    padding: 3px 5px;
    font-size: 11px;
    font-weight: bold;
    color: #2f2f2f;
}

.container_left .module_left .text_info span {
    color: #ff0000;
    font-size: 13px;
    font-weight: bold;
}

.container_left .module_left .text_info span.email {
    font-size: 12px;
    color: #011bd0;
    font-weight: normal;
}

.container_left .module_left .items_support {
    background: #FFF;
    padding: 15px 0px;
}

.container_left .module_left .item_support {
    float: left;
    width: 50%;
    text-align: center;
    color: #830000;
    font-weight: bold;
    font-size: 11px;
}

.container_left .module_adv {
    margin-bottom: 10px;
}

.container_left .list_static {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

.container_left .list_static li {
    border-bottom: 1px solid #e5e5e5;
    padding: 6px 0px 5px;
}

.container_left ul.list_news li:last-child,
.container_left .list_static li:last-child {

    border: none;
}

.container_left ul.list_news {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

.container_left ul.list_news li {
    border-bottom: 1px dashed #e5e5e5;
    padding: 10px 0px 9px;
}

.item-pr .image {
    border: solid 1px #ccc;
    box-shadow: 0px 10px 0px #f2f2f2;
    margin-bottom: 10px;
}

.item-pr .name {
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    text-align: center;
    text-transform: uppercase;
}

.item-pr .name a {
    color: #027CDF;
}

.container_left ul.list_news li img {}

.container_left ul.list_news li a {
    font-weight: bold;
}

.container_left .module_left .titledm {
    background: url(../image/ico_title_spleft.png) no-repeat;

}

.titleprolist a {
    text-transform: uppercase;
}


/**********************************/

/*******CONTAINER MID********/





section.about-us  {
    padding: 12px;
    background: white;
    border-radius: 5px; /* bo góc 3px */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); /* bóng đổ nhẹ */
}







/* Các phần tử trong .container_mid */
.container_mid {
    flex: 1;
    /* Chiếm toàn bộ phần còn lại */
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
}


.container_mid .box_content {
    padding: 12px;
    background: white;
    border-radius: 5px; /* bo góc 3px */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); /* bóng đổ nhẹ */
}


.container_mid .content img {
    /* Các style ảnh ở đây */
}

.readmoreabout {
    padding: 5px 0px 0px 30px;
    font-style: italic;
    font-size: 12px;
    font-weight: bold;
    background: url('../images/bg_readmore.png') no-repeat center center;
    position: absolute;
    bottom: 0px;
    right: 30px;
}

.readmoreabout a:hover {
    color: #F00505;
}

.readmoreabout a {
    color: #80badd;
    transition: ease 0.7s;
}

/* Ảnh đại diện trong trang product */
.picprodai {
    width: 100%;
    max-width: 460px;   /* hoặc 500px tùy ý */
    margin: 0 auto 16px auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}
/* Sản phẩm liên quan */
/* ================== GRID SẢN PHẨM CÙNG LOẠI ================== */
.hienthisoluongsp {
    /* 4-cột desktop, tự co còn 3-2-1 khi hẹp màn hình */
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 20px;
    /* khoảng hở giữa ô */
    padding: 10px 0;
    /* tránh dính lề */
}

/* xoá float / margin cũ của từng ô */
.hienthisoluongsp .item_product {
    float: none;
    width: auto;
    margin: 0;
}

/* tuỳ chọn: cân chiều cao và đổ bóng nhẹ cho đẹp */
.hienthisoluongsp .item_product {
    display: flex;
    flex-direction: column;
    height: 100%;
    /* các ô cao bằng nhau */
    box-shadow: 0 2px 6px rgba(0, 0, 0, .08);
    transition: transform .25s;
}

.hienthisoluongsp .item_product:hover {
    transform: translateY(-4px);
}
/* Khung ảnh trong item */
.hienthisoluongsp .item_product .images {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    /* vuông, tự co theo chiều rộng */
    overflow: hidden;
}

/* Ảnh fit khung, không vỡ */
.hienthisoluongsp .item_product .images img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* hoặc contain nếu muốn full hình */
}

/* ==== MOBILE (≤ 600 px) – hiển thị 2 sản phẩm / hàng ==== */

/* ==== MOBILE (≤ 600 px) – 2 sản phẩm / hàng ===================== */
@media (max-width:600px) {

    /* 1) Dùng GRID 2-cột gọn gàng */
    .hienthisoluongsp {
        display: grid;
        /* thay vì float */
        grid-template-columns: repeat(2, 1fr);
        /* đúng 2 ô / hàng */
        gap: 2px;
        /* khoảng cách giữa ô */
    }

    /* 2) Vô hiệu float + width cũ của từng ô */
    .hienthisoluongsp .item_product {
        float: none !important;
        /* huỷ float cũ */
        width: auto !important;
        /* Grid tự tính */
        margin: 0 !important;
        /* bỏ margin-right 15px cũ */
        box-sizing: border-box;
    }
}
/* ###################################### */


.picprodai .MagicZoom,
.picprodai img {
    width: 100% !important;
    max-width: 460px;
    height: 340px;      /* cố định chiều cao */
    object-fit: cover;  /* hoặc contain, tùy style bạn thích */
    border-radius: 10px;
    background: #fafafa;
    display: block;
}




/* sản pẩm cùng loại */
.hienthisoluongsp {
}
/***************** Footer ********************/
#footer {
    background: #F9F9F9;
    position: relative;
    width: 100%;
    margin: 0 auto;
    border-top: 1px solid #ccc;
}

#footer .box_footer {
    padding: 10px 0px;
    margin: 0 auto;
}

#footer .conpyright p {
    margin: 0px;
}


.title_footer1 {
    color: #00B5F6;
}

.title_footer2 {
    color: #E1E9EB;
}

/*---------------------------------------*/
ul.product_info {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

ul.product_info h2 {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

ul.product_info li {
    padding: 3px 0px;
}

ul.product_info li .name_product {
    font-family: fontten;
    color: #17B6B9;
    font-size: 22px;
    float: left;
    background: url(../image/title-line.png) bottom left repeat-x;
    width: 100%;
    padding: 10px 0px;
    margin-bottom: 5px;
}

.product_info .check {
    background: url(../image/icon-check.png) left top 10px no-repeat;
    padding-left: 15px;
    font-family: 'RobotoCondensedRegular';
    font-size: 18px;
}

.usual {
    margin-bottom: 10px;
}

.usual ul#tab_content {
    margin: 0px;
    box-shadow: inset 0 -5px #E6E6E6;
    padding: 0px;
}

.usual ul#tab_content li {
    display: inline-block;
    list-style: none outside none;
    border: solid 1px #ccc;
    border-bottom: none;
}

.usual ul#tab_content a {
    color: #646464;
    display: block;
    font-family: fontten;
    font-size: 20px;
    margin: 1px 1px 1px 0;
    padding: 6px 20px;
    text-decoration: none !important;
}

.usual ul#tab_content a:hover {
    box-shadow: inset 0 -5px #646464;
    color: #17B6B9;
}

.usual ul#tab_content a.selected {
    box-shadow: inset 0 -5px #646464;
    color: #17B6B9;
    cursor: default;
    margin-bottom: 0;

}

.content_tab {
    clear: left;
    padding: 10px 0px;
   
    font-family:sans-serif;
    font-size: 18px;
}
div#tab1 p {
    text-align: justify;
    font-family: sans-serif;
    font-size: 16px;
}
h2 {
    font-family: sans-serif;
        font-size: 26px;
}

h1.itt-article-title {font-family: sans-serif;
    font-size: 26px;
}
}




    /* hoặc 32px nếu muốn chuẩn web */

.rows_comment {
    border: 1px solid #EFEFEF;
    margin: 5px;
    padding: 10px;
}

/*************************/
.title_table {
    background: #2993D1;
    color: #FFF;
    font-weight: bold;
}

/**************SẢN PHẨM****************/
.item_product {
    float: left;
    width:  calc((100% - 2 * 15px) / 3);
    margin: 0px 15px 25px 0px;
    text-align: center;
    border: 1px solid #ccc;
    position: relative;
}

.item_product:before {
    width: 100%;
    height: 15px;
    content: '';
    position: absolute;
    background: url('../images/shadow_pro.png') no-repeat bottom center;
    right: 0px;
    bottom: -16px;
    z-index: 0;
}

.item_product .images {
    position: relative;
    padding: 2px;
    /*overflow: hidden;*/
}

.item_product .images:before {
    width: 100%;
    height: 24px;
    content: '';
    position: absolute;
    background: url('../images/shadow_img_pro.png') no-repeat;
    right: 0px;
    bottom: -10px;
    z-index: 0;
}
/* Ảnh ds sản phẩm */
.item_product .images img {
    width: 300px;
    margin: auto;
    height: 175px;
    -webkit-transition: ease 0.5s;
    -o-transition: ease 0.5s;
    transition: ease 0.5s;
}

.item_product .images img:hover {
    -webkit-transform: scale(1.01);
    -ms-transform: scale(1.01);
    -o-transform: scale(1.01);
    transform: scale(1.01);
}


.item_product .name {
    padding: 5px 5px;
    overflow: hidden;
    margin-top: 13px;
    color: #000;
    line-height: 20px;
    font-family: 'RobotoCondensedRegular';
    font-size: 18px;
}

.item_product .name a {
    color: #000;
    line-height: 20px;
    font-family: 'RobotoCondensedRegular';
    font-size: 18px;
}

.item_product .name a:hover {
    color: blue;
}

.item_product .name span {
    font-family: 'RobotoCondensedRegular';
    font-size: 18px;
    color: red;
}

.boxpricart {
    width: 100%;
    padding: 5px 0px 5px 0px;
}

.boxpricart .boxpri {
    float: left;
    width: 75%;
}

.boxpricart .boxcartpro {
    float: left;
    width: 25%;
    padding-top: 0;
}

/***************/
.item_product2 {
    float: left;
    width: 215px;
    margin: 0px 35px 25px 0px;
    text-align: center;
    border: 1px solid #ccc;
    position: relative;
}

.item_product2:before {
    width: 100%;
    height: 15px;
    content: '';
    position: absolute;
    background: url('../images/shadow_pro.png') no-repeat bottom center;
    right: 0px;
    bottom: -16px;
    z-index: 0;
}

.boxprohg {

    max-height: 350px;
    overflow: hidden;
}

.item_product2 .images {
    position: relative;
    padding: 2px;
    /*overflow: hidden;*/
}

.item_product2 .images:before {
    width: 100%;
    height: 24px;
    content: '';
    position: absolute;
    background: url('../images/shadow_img_pro.png') no-repeat;
    right: 0px;
    bottom: -10px;
    z-index: 0;
}

.item_product2 .images img {
    width: 100%;
    margin: auto;
    height: auto;
    -webkit-transition: ease 0.5s;
    -o-transition: ease 0.5s;
    transition: ease 0.5s;
    max-width: 300px;
}

.item_product2 .images img:hover {
    -webkit-transform: scale(1.01);
    -ms-transform: scale(1.01);
    -o-transform: scale(1.01);
    transform: scale(1.01);
}


.item_product2 .name {
    padding: 5px 5px;
    overflow: hidden;
    margin-top: 13px;
    color: #000;
    line-height: 20px;
    font-family: 'RobotoCondensedRegular';
    font-size: 15px;
}

.item_product2 .name a {
    color: #000;
    line-height: 20px;
    font-family: 'RobotoCondensedRegular';
    font-size: 15px;
}

.item_product2 .name a:hover {
    color: blue;
}

.item_product2 .name span {
    font-family: 'RobotoCondensedRegular';
    font-size: 15px;
    color: red;
}



/* ==== MOBILE ≤ 600 px – 2 ô / hàng, gap 15 px =  (10 + 5) ==== */
@media (max-width:600px) {
    .item_product {
        float: left;
        width: calc(50% - 10px);
        /* 50 % trừ 10 px hở ngang */
        margin: 0 10px 15px 0;
        /* phải 10px, dưới 15px */
        box-sizing: border-box;
    }

    /* Cột phải (số chẵn) bỏ margin-right để không bị tràn */
    .item_product:nth-child(2n) {
        margin-right: 0;
    }

    /* Ảnh tự khớp chiều ngang ô (vẫn cần) */
    .item_product .images,
    .item_product .images img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover;
    }
}

/*******Menu Top********/
#header .menu {
    /*background: #E00000;*/
    z-index: 99;
    margin: 0 auto;
    position: relative;
}

#header .menu ul {
    padding: 0px;
    list-style: none;
}

#header .navi_menu {
    width: 100%;
    background: #23990F;
    height: 45px;
    z-index: 99;
    position: relative;

}

#cssmenu ul li .active {
    color: #FEEF00;
    /* background: url(../image/bg_limenu.png) no-repeat top 7px center;*/
    background: none;
    text-decoration: none;
    /* background: rgba(255, 255, 255, 0.37); */
}

#cssmenu>ul>li>a {
    padding: 15px 21px;
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
    white-space: nowrap;
    font-family: 'texgyreadventorregular';
}

.line {
    background: url('../image/line_menutop.html') no-repeat center left;
    width: 3px;
    height: 45px;
}

#cssmenu {
    z-index: 99999;
}

#cssmenu>ul>li:hover>a {
    color: #FFF000;
    background: none;
    /* background: url(../image/bg_limenu.png) no-repeat top 7px center ;*/
}

#cssmenu ul ul li:hover>a,
#cssmenu ul ul li a:hover {
    color: #FFF;
    background: rgba(132, 132, 132, 0.86);
}

#cssmenu ul li a:hover {
    transition: ease 0.4s;
}

#cssmenu ul ul li a {
    padding: 5px;
    font-size: 13px;
    text-decoration: none;
    color: #000;
    font-family: 'texgyreadventorregular';
    display: block;
    text-transform: uppercase;
    line-height: 30px;
}

/*********************************/





.btn_chitiet {
    margin-top: 10px;
    text-transform: none;
}

.btn_chitiet a {
    padding: 5px 10px;
    /* border:1px solid #ccc; */
    border-radius: 20px 20px 20px 20px;
    color: #d00000 !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px !important;
    font-style: italic !important;
    font-weight: 100 !important;
    box-shadow: 0px 1px 5px 1px rgba(22, 112, 192, 0.84);
    transition: all 2s;
}

.btn_chitiet a:hover {
    color: #fff !important;
    background: rgba(22, 112, 192, 0.84);

}

/*------------------- Doi tac css -------------------*/
.box_partner {
    padding: 10px 0px;
    width: 100%;
}

.ma-brand-slider-contain {
    width: 510px;
    padding: 15px;
}

.brand-slider .jcarousel-container {
    -moz-border-radius: 10px;
    background: #fff;
    border: 2px solid #000;
}

.brand-slider .jcarousel-container-horizontal {
    width: 1000px;
    padding: 10px 0px;
    padding-left: 40px;
    margin: 0 auto;
    margin-top: 80px
}

.brand-slider .jcarousel-clip-horizontal {
    width: 960px;
    height: 154px;
}

.brand-slider .jcarousel-item {
    width: 135px;
    float: left;
    list-style: none outside none;
    text-align: center;
}

.brand-slider .jcarousel-item-horizontal {
    margin-right: 9px;
    position: relative;
    height: 102px;
    width: 162px;
    border: 1px solid #afafaf;
    border-radius: 5px;
}

.brand-slider .jcarousel-item-horizontal img {
    border-radius: 5px;
}

.brand-slider .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

.brand-slider .product-image {
    display: inline-block;
    margin: 0 0 8px;
}

/**
 *  Horizontal Buttons
 */
.ma-brand-slider .jcarousel-next-horizontal {
    position: absolute;
    top: 30%;
    right: -25px;
    width: 35px;
    height: 36px;
    cursor: pointer;
    background: url(../images/next.png) no-repeat top left;
}

.ma-brand-slider .jcarousel-next-horizontal:hover {}

.ma-brand-slider .jcarousel-next-horizontal:active {}

.ma-brand-slider .jcarousel-next-disabled-horizontal,
.ma-brand-slider .jcarousel-next-disabled-horizontal:hover,
.ma-brand-slider .jcarousel-next-disabled-horizontal:active {
    cursor: default;
}

.ma-brand-slider .jcarousel-prev-horizontal {
    position: absolute;
    top: 30%;
    left: -25px;
    width: 35px;
    height: 36px;
    cursor: pointer;
    background: url(../images/prev.html) no-repeat top left;
}

.ma-brand-slider .jcarousel-prev-horizontal:hover {
    background-position: 0 100%;
}

.ma-brand-slider .jcarousel-prev-horizontal:active {
    background-position: 0 100%;
}

.ma-brand-slider .jcarousel-prev-disabled-horizontal,
.ma-brand-slider .jcarousel-prev-disabled-horizontal:hover,
.ma-brand-slider .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: 0 100%;
}

/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.ma-brand-slider .jcarousel-container {
    position: relative;
}

.ma-brand-slider .jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.ma-brand-slider .jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.ma-brand-slider .jcarousel-next {
    z-index: 3;
    display: none;
}

.ma-brand-slider .jcarousel-prev {
    z-index: 3;
    display: none;
}

.ma-brand-slider .ma-des {
    position: absolute;
    bottom: 10px;
}

.ma-brand-slider .ma-des-title {}

.ma-brand-slider .ma-des-title h2 {}

.ma-brand-slider .ma-des-content {}

/*************************************/
.box_video .title {
    font-weight: bold;
    padding-top: 5px;
}

#galleria {
    height: 485px;
    background: #FFF
}

/*-------------- Map css ------------*/
#map_canvas {
    height: 280px;
    border: solid 1px;
    width: 100%;
    margin: 10px auto;
}

#map_canvas1 {
    height: 500px;
    width: 100%;
}

.map_description {
    color: #000000;
    overflow: auto;
    width: 275px;
}

.map_description .default {
    color: #FF0000;
}

.map_description div {
    line-height: 18px;
    margin: 3px;
}

.map_list_address {
    float: left;
    height: 500px;
    overflow: hidden;
    width: 250px;
}

.map_list_address .list {
    line-height: 18px;
    margin-bottom: 5px;

}

.map_list_address span {
    color: #FCFF46;
}

.map_title {
    color: #30A602;
    font-weight: bold;
}

.navigate .C {
    width: 970px;
}

/************************************/

.title_news {
    color: #999;
    font-family: simpli;
    font-size: 22px;
    height: 40px;
    line-height: 40px;
    text-align: center;
}

/*Menu dọc*/

ul.list_cat_product {
    padding: 0px;
    margin: 0px;
    list-style: none;
    padding-bottom: 5px;
}

ul.list_cat_product li {
    /*background: url(../image/line_menuleft.png) no-repeat bottom left;*/
    padding-bottom: 1px;
    list-style: none;
    border-bottom: 1px solid #ccc;
}

ul.list_cat_product li:last-child {
    background: none;
}

ul.list_cat_product li:last-child {
    border-bottom: none;
}

ul.list_cat_product li ul {
    display: none;
}

ul.list_cat_product li a {
    color: #0E0757;
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    font-weight: bold;
    background: url(../image/ico_left.png) no-repeat 10px 11px;
    padding: 5px 5px 5px 25px;
    text-transform: uppercase;
    transition: all 1s;
}

ul.list_cat_product li a:hover {
    color: #000000;
}

ul.list_cat_product li ul li a {
    color: #5F6052;
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    background: url(../image/ico_menuleft.png) no-repeat 0px 10px;
    padding: 5px 5px 5px 15px;
}

.clickmenu {
    background: url(../image/ico_left.png) no-repeat 0px 3px;
    width: 25px;
    height: 15px;
}

#lkweb {
    width: 100%;
    height: 30px;
}

#soluong {
    width: 300px;
    height: 30px;
    text-align: center;
}

.boxslider {
    margin: 12px 0px 15px 0px;
}


.tcat {
    width: 100%;
    margin-bottom: 10px;
    background: #E90000;
    border-left: 5px solid #252525;
    padding-top: 4px;
    min-width: 350px;
}

.tcat .icon {}


.tcat .icon a {

    line-height: 30px;
    color: #fff;
    font-size: 20px;
    text-transform: uppercase;
    font-family: 'RobotoRegular';
    padding-left: 20px;
}




/*Xem thêm*/
.readmore {
    padding: 3px 15px;
    border: solid 1px #ccc;
    border-radius: 10px 10px;
    text-transform: uppercase;
    font-size: 12px;
    text-align: center;
    font-style: normal;
    position: absolute;
    bottom: 10px;
    right: 10px;
    font-family: 'RobotoBoldCondensed';
}

.readmore a {
    color: #0074E0;
    transition: ease 1s;
}

.readmore:hover {
    color: #0074E0;
    background: rgba(50, 143, 230, 0.28);
    transition: ease 1s;
}

.readmore:hover a {
    color: #fff;
}

.check {
    background: url(../image/icon-check.png) left top 5px no-repeat;
    padding-left: 15px;
}

/*Button báo giá*/
.btn-lg,
.btn-group-lg>.btn {
    padding: 5px 15px;
    font-size: 18px;
    line-height: 1.33;
    border-radius: 6px;
    margin-top: 10px;
}

.toptintuc {
    width: 100%;
    height: 40px;
    background: #fff;
}

.titletintuctop {
    width: 30%;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    color: #3a3a3a;
    font-size: 18px;
    line-height: 40px;
}

.divmarquee {
    width: 65%;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 40px;
    font-size: 16px;
}

.divmarquee a:hover {
    color: #EA1313;
}

.titlechuyen {
    width: 30%;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    color: #3a3a3a;
    font-size: 18px;
    line-height: 40px;
}

.divmarquee2 {
    width: 65%;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 40px;
    font-size: 16px;

}




.item-pr .image1 {}

.item-pr .image1 img {
    width: 75px;
    height: 70px;
    border: 1px solid #ccc;
    padding: 5px;
    float: left;
}

.item-pr .nametinnb {
    width: 140px;
    float: left;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    font-style: italic;
    padding-left: 5px;
}

.item-pr .nametinnb a {
    color: #0079C0;
}





.box_icon_ft .icon {
    width: 40px;
    float: right;
}

.box_icon_ft img {
    transition: all 1s;
}

.box_icon_ft img:hover {
    transform: rotate(360deg);
}

.boxtitlefooter {
    width: 100%;
    text-align: center;
    color: #d8ff00;
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
}

.box_icon_ft {
    float: right;
    margin-top: 20px;
}

/* Hỗ Trợ trực tuyến */
.boxhotrotructuyen .hotrotop {
    background: url(../image/pic_hotrotructuyen.html) no-repeat;
    width: 240px;
    height: 160px
}

.boxhotrotructuyen .hotromid .hotlinehotro {
    background: url(../image/ico_phone.png) no-repeat top 4px left 5px;
    height: 30px;
    width: 100%;
    padding-left: 38px;
    color: #FF0000;
    font-size: 20px;
    font-family: 'UTMColossalis';
}

.boxhotrotructuyen .hotromid .emailhotro {
    padding-left: 10px;
}

.boxhotrotructuyen .hotromid .hotroonline {
    height: 30px;
    margin: 0 auto;
    width: 130px;
    margin-top: 5px;
    margin-bottom: 5px;
}


/*HÌNH ẢNH NỔI BẬT*/
.boxhinhanhnoibat {
    width: 98%;
    margin: 0 auto;
    margin-top: 10px;
    margin-left: 20px;
}

.boxhinhanhnoibat .owl-next {
    width: 35px !important;
    height: 55px !important;
    background: url(../image/pre.html) no-repeat !important;
    position: absolute;
    top: 20% !important;
    right: 15px !important;
}

.boxhinhanhnoibat .owl-prev {
    width: 35px !important;
    height: 55px !important;
    background: url(../image/next.html) no-repeat !important;
    position: absolute;
    top: 20% !important;
    left: 5px !important;
}

.containerimgnb {
    width: 175px;
}

.namehinhanhnb {
    width: 100%;
    text-align: center;
    color: #838383;
    font-style: italic;
    font-family: 'RobotoCondensedRegular';
    font-size: 14px;
    text-transform: uppercase;
}



/*************GIỚI THIỆU - BÁN XE TRẢ GÓP***************/

/** timeline box structure **/
.timeline {
    list-style: none;
    padding: 5px 0 20px;
    position: relative;
}

.timeline:before {
    top: 5px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 3px;
    background-color: #eee;
    left: 2%;
    margin-left: -1.5px;
}

.tldate {
    display: block;
    width: 80px;
    background: #414141;
    border: 3px solid #212121;
    color: #ededed;
    margin: 0;
    padding: 3px 0;
    font-weight: bold;
    text-align: center;
    -webkit-box-shadow: 0 0 11px rgba(0, 0, 0, 0.35);
}

.timeline li {
    margin-bottom: 20px;
    position: relative;
}

.timeline li:before,
.timeline li:after {
    content: " ";
    display: table;
}

.timeline li:after {
    clear: both;
}

.timeline li:before,
.timeline li:after {
    content: " ";
    display: table;
}

/** timeline panels **/
.timeline li .timeline-panel {
    width: 865px;
    float: right;
    margin-right: 3%;
    border: 1px solid #d4d4d4;
    padding: 10px;
    position: relative;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
}

/** panel arrows **/
.timeline li .timeline-panel:before {
    position: absolute;
    top: 26px;
    left: -15px;
    right: auto;
    display: inline-block;
    border-top: 15px solid transparent;
    border-left: 15px solid #ccc;
    border-right: 0 solid #ccc;
    border-bottom: 15px solid transparent;
    border-left-width: 0;
    border-right-width: 15px;
    content: " ";
}

.timeline li .timeline-panel:after {
    position: absolute;
    top: 27px;
    left: -14px;
    right: auto;
    display: inline-block;
    border-top: 14px solid transparent;
    border-left: 14px solid #fff;
    border-right: 0 solid #fff;
    border-bottom: 14px solid transparent;
    border-left-width: 0;
    border-right-width: 14px;
    content: " ";
}

.timeline li .timeline-panel.noarrow:before,
.timeline li .timeline-panel.noarrow:after {
    top: 0;
    right: 0;
    display: none;
    border: 0;
}


/** timeline circle icons **/
.timeline li .tl-circ {
    position: absolute;
    top: 23px;
    left: 1.5%;
    text-align: center;
    /*background: url('../images/id.png');*/
    color: #fff;
    width: 45px;
    height: 45px;
    line-height: 35px;
    margin-left: -15px;
    z-index: 9;
    background-repeat: no-repeat;
    background-size: contain;
}

.timeline li .panel_giaphuc {
    width: 85% !important;
}

.timeline li .gp_logo {
    background: url('../images/logo_giaphuc-50.html') !important;
    background-size: cover;
    width: 120px;
}


/** timeline content **/

.tl-heading h4 a {
    margin: 0;
    color: #003C97;
    transition: all 1s;
    font-family: 'RobotoBoldCondensed';
}

.tl-heading h4 a:hover {
    color: #ED1B24;
}

.tl-body p,
.tl-body ul {
    margin-bottom: 0;
}

.tl-body>p+p {
    margin-top: 5px;
}

/** media queries **/
.timeline li .timeline-panel {
    width: 44%;
}

.page-header h1 {
    font-size: 1.8em;
}

ul.timeline:before {
    left: 40px;
}

.tldate {
    width: 140px;
}

ul.timeline li .timeline-panel {
    width: calc(100% - 90px);
    width: -moz-calc(100% - 90px);
    width: -webkit-calc(100% - 90px);
}

ul.timeline li .tl-circ {
    top: 22px;
    left: 22px;
    margin-left: 0;

}

ul.timeline>li>.tldate {
    margin: 0;
}

ul.timeline>li>.timeline-panel {
    float: right;
}

ul.timeline>li>.timeline-panel:before {
    border-left-width: 0;
    border-right-width: 15px;
    left: -15px;
    right: auto;
}

ul.timeline>li>.timeline-panel:after {
    border-left-width: 0;
    border-right-width: 14px;
    left: -14px;
    right: auto;
}

.pictimeline {
    width: 180px;
    height: 145px;
    float: left;
    margin: 0px 10px 0px 0px;
    padding: 5px;
    border: solid 1px #ccc;
    transition: all 1s;
}

.pictimeline:hover {
    border: solid 1px #FF0000;
    border-radius: 10px 10px;
}

.pictimeline img {
    width: 170px;
    height: 133px;
    transition: all 1s;
}

.pictimeline img:hover {
    border-radius: 10px 10px;
}

.readmoreabout {
    padding: 5px 0px 0px 30px;
    font-style: italic;
    font-size: 12px;
    font-weight: bold;
    background: url(images/bg_readmore.html) no-repeat center center;
    position: absolute;
    bottom: 1% !important;
    right: 5% !important;
}

ul.timeline p {
    padding: 0px;
    margin: 0px;
}

ul.timeline h4 {
    padding: 0px;
    margin: 0px;
}

.timeline-panel .tl-body {
    font-family: 'RobotoCondensedRegular';
    font-size: 15px;
    color: #464545;
}

/*******************************/
/**********DỊCH VỤ***********/
.containerdv {
    width: 48%;
    min-height: 130px;
    float: left;
    margin-right: 4%;
    padding-bottom: 10px;
    margin-bottom: 11px;
    position: relative;
    border-bottom: 1px dotted #ccc;
}

.containerdv h2 {
    padding: 0px;
    margin: 0px;
}

.containerdv .picdv {
    width: 155px;
    float: left;
    padding: 5px;
    border: solid #ccc 1px;
    transition: all 1s;
    margin-right: 10px;
}

.containerdv .picdv:hover {
    border: solid #FF0000 1px;
    cursor: pointer;
}

.containerdv .contentdv {
    width: 100%;
    /* float: left; */
    padding: 5px;
    text-align: justify;
    font-family: 'RobotoCondensedRegular';
    font-size: 15px;
}

.containerdv .contentdv h2 a {
    font-size: 16px;
    color: #000;
    font-weight: bold;
    font-family: 'RobotoBoldCondensed';
    transition: all 1s;
    line-height: 23px;
}

.containerdv .contentdv h2 a:hover {
    color: #0074E0;
}

.containerdv .contentdv .read {
    padding: 5px 0px 0px 30px;
    font-style: italic;
    font-size: 12px;
    font-weight: bold;
    background: url(../image/bg_readmore.png) no-repeat center center;
    position: absolute;
    bottom: 0px;
    right: 5%;
}

.read a {
    color: #80badd;
    transition: ease 0.7s;
}

.read a:hover {
    color: #F00505;
}

/*******************************/
.containerdt {
    width: 48%;
    min-height: 130px;
    float: left;
    margin-right: 4%;
    padding-bottom: 10px;
    margin-bottom: 11px;
    position: relative;
}

.containerdt .picdt {
    width: 100%;
    float: left;
    transition: all 0.5s;
    margin-right: 10px;
}

.containerdt .picdt img {
    width: 100%;
}

.containerdt .picdt:hover {
    border: solid #FF0000 1px;
    cursor: pointer;
}

/****************** MENU HÌNH ẢNH*********************/
.boxpicture {
    float: left;
    width: 205px;
    margin: 0px 30px 0px 0px;
    text-align: center;
}

.boxpicture .picpicture {
    width: 205px;
    padding: 3px;
    border: 1px solid #ccc;
    position: relative;
}

/*.boxpicture .picpicture:after{		
    width: 100%;
    height: 10px;
    content: '';
    position: absolute;
    z-index: 1;
    background: url(../image/bongsp.png) no-repeat;
    right: -13px;
    bottom: -7px;
    }*/
.boxpicture .picpicture img {

    width: 100%;
    margin: auto;
}

.boxpicture .namepicture {
    padding: 5px 5px;
    overflow: hidden;
    text-transform: uppercase;
}

.boxpicture .namepicture a {
    color: #004FC2;
    line-height: 20px;
    font-weight: bold;
    transition: all 2s;
}

.boxpicture .namepicture a:hover {
    color: #110076;
}

/***************************************/

.title-dt {
    background: url(../image/title_doitac.html) no-repeat left center;
    height: 30px;
    line-height: 30px;
    /* border-bottom: dashed 1px #ccc;*/
    padding-left: 30px;
    font-family: 'texgyreadventorregular';
    font-size: 20px;
    margin-bottom: 20px;
    width: 1200px;
    margin: 0 auto;
    color: #fff;
}

/*********FANPAGE RIGHT*****/
.fanpage_facebook {
    position: fixed;
    right: -300px;
    z-index: 9999;
    top: 210px;
}

/*********TIN KHÁC*********/
.box_newskhac {
    clear: both;
    border-bottom: 1px dashed rgb(197, 197, 197);
    padding: 10px 5px 10px 0px;
    -moz-box-shadow: 1px 2px 6px rgba(0, 0, 0, .18);
    overflow: hidden;
    width: 100%;
}

.box_newskhac .image_boder {
    float: left;
    margin-right: 10px;
    background: #FFF;
    padding: 5px;
    border: 1px solid #E4E4E4;
    width: 120px;
    overflow: hidden;
}

.box_newskhac .image_boder img {
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -ms-transition: all 2s;
    -o-transition: all 2s;
    transition: all 2s;
}

.box_newskhac .image_boder img:hover {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);

}

.box_newskhac h2 {
    font-size: 12px;
    margin: 0px;
    line-height: 20px;
}

.box_newskhac h2 a {
    color: #d70000;
    font-family: 'RobotoBoldCondensed';
    font-size: 21px;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.box_newskhac h2 a:hover {
    color: blue;
}

.box_newskhac p {
    margin: 0px;
    padding: 0px;
    margin-bottom: 10px;
    line-height: 20px;
    font-family: 'RobotoCondensedRegular';
    font-size: 14px;
    color: #5D5555;
    text-align: justify;
}

.box_newskhac span {
    font-weight: bold;
    font-style: italic;
}

.tablebaogia {
    border: 1px solid #ccc;
    width: 100%;

}

.tablebaogia tr,
.tablebaogia td {
    border: 1px solid #ccc;
    padding: 0px 15px;
    text-transform: uppercase;
    line-height: 30px;
    font-size: 17px;
    text-align: center;
}

.tablebaogia th {
    font-family: 'RobotoBoldCondensed';
    font-size: 16px;
    background: #5d5d5d;
    text-align: center;
    border: 1px solid #ccc;
    padding: 0px 15px;
    color: #fff;
}

.tablebaogia tr:nth-child(2n+1) {
    background: #E6E4E4;
}

.tablebaogia tr:nth-child(2n) {
    background: #f2f2f2;
}

.tablebaogia tr,
.tablebaogia td a {
    color: #000;
}

/**************Giỏ hàng màu và size*************/
.titlecolorpro {
    color: blue;
    font-size: 16px;
    font-weight: bold;
}

.colorpro {
    width: 30px;
    height: 30px;
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin-right: 10px;
    border: 1px solid #FF910F;
    box-shadow: none;
}

.colorpro span {
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    position: absolute;
    top: 2px;
    left: 2px;
}

.sizepro {
    display: inline-block;
    padding: 5px 10px;
    border: 1px solid #ccc;
    position: relative;
    cursor: pointer;
    margin-right: 5px;
    font-weight: bold;
    box-shadow: none;
}

.colorpro.active,
.sizepro.active {
    box-shadow: 3px 2px 5px #ccc;
    border: 2px solid #FF910F;
}

.colorpro.active:before,
.sizepro.active:before {
    bottom: 0px;
    right: 0px;
    width: 15px;
    height: 15px;
    display: block;
    content: "";
    background: url(../images/tick.png) no-repeat;
    background-size: 100% 100%;
    position: absolute;
    z-index: 1;
}

.picprodai.load {
    background: url('../images/load_bar.gif') no-repeat center;
    min-height: 200px;
}

.buytocartpro {
    width: 130px;
    background: #009033;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    margin-top: 20px;
    border-radius: 5px 5px;
}

.buytocartpro span {
    color: #fff;
    -webkit-transition: ease-in-out 0.5s;
    -o-transition: ease-in-out 0.5s;
    transition: ease-in-out 0.5s;
    display: block;
}

.buytocartpro span:hover {
    color: #000;
    cursor: pointer;
}

.deletecart a {
    font-size: 24px;
    color: #818181;
    -webkit-transition: ease-in-out 0.5s;
    -o-transition: ease-in-out 0.5s;
    transition: ease-in-out 0.5s;
}

.deletecart a:hover {
    color: red;
}

.tablecart th {
    color: #fff;
    text-align: center;
    background: #5d5d5d;
    padding: 5px 0px;
    font-size: 17px;
    text-transform: uppercase;
    font-family: 'RobotoBoldCondensed';
}

.tablecart tr>td {
    font-family: 'RobotoCondensedRegular';
    font-size: 16px;
    color: #464646;
    padding: 5px 0px;
}

.tablecart tr:nth-child(2n) {
    background: #EBEBEB;

}

.tablecart tr:nth-child(2n+1) {
    background: #F5F5F5;

}

.tablecart tr:last-child {
    background: none !important;
}

.imgpro_cart img {
    max-width: 120px;
    border-radius: 5px;
}

.imgpro_cart img:hover {
    opacity: 0.9;
}

.button_cart {
    background: transparent;
    border: 1px solid #BDBDBD;
    color: #fff;
    font-family: 'RobotoBoldCondensed';
    text-transform: uppercase;
    padding: 10px 30px;
    cursor: pointer;
    background: #257441;
    margin: 10px 10px 0px 0px;
    border-radius: 5px;
    font-size: 15px;
    -webkit-transition: ease 0.5s;
    -o-transition: ease 0.5s;
    transition: ease 0.5s;
}

.button_cart:hover {
    color: #FFFFFF;
    background: #059A39;
    box-shadow: 1px 1px 3px #327349;
}

.table_infopaycart {
    max-width: 600px;
    margin: 0 auto;
}

.table_infopaycart td {
    text-align: center;
    padding: 10px 0px;
    font-size: 15px;
    font-family: 'RobotoCondensedRegular';
}

.table_infopaycart td span {
    color: red;
    font-size: 15px;
    font-family: 'RobotoCondensedRegular';
}

.table_infopaycart .info_customers {
    font-family: 'RobotoBoldCondensed';
    text-transform: uppercase;
    cursor: pointer;
    font-size: 24px;
    color: #000;
}

/*********************************************************************************************************/
/*****************************/
.iconbanner {
    margin-bottom: 12px;
    transform: translateY(-15px);
}

.boxtopbanner {
     width: 100%;
    min-height: 60px;
    background: url(../images/bg_bannertop.png);
    display: none;
}

.topbanner_l,
.topbanner_r {
    float: left;
    width: 50%;
    line-height: 35px;
}

.topbanner_l ul {
    padding: 0px;
    margin: 0px;
}

.topbanner_l ul li {
    list-style: none;
    text-decoration: none;
    float: left;
    margin-right: 50px;
    line-height: 50px;
}

.topbanner_l ul li:nth-of-type(3) {
    margin-right: 0px;
    position: relative;
}

.topbanner_l ul li:nth-of-type(3) span {
    position: absolute;
    color: red;
    font-weight: bold;
    top: 10px;
    left: 40px;
    font-size: 16px;
    min-width: 115px;
}

.topbanner_r ul {
    margin: 0px;
    padding: 0px;
}

.topbanner_r ul li {
    float: right;
    text-decoration: none;
    list-style: none;
    line-height: 50px;
}

.topbanner_r ul li a {
    color: #000;
    font-size: 14px;
    padding: 0px 13px;
}

.topbanner_r ul li a:hover {
    color: #EA0000;
}

/******************************/
.boxcart {
    position: absolute;
    bottom: 10px;
    right: 0px;
}

/*************************/
.boxflashintro {
    width: 33%;
    float: left;
}

.box_slider {
    width: 67%;
    float: right;
}

#wowslider-container1 .ws_images {
    box-shadow: none !important;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    border: none !important;
}



/**************container_SPA**************/
.SPA {
    display: flex;
   
}




/**************container_right**************/
.container_right {
    width: 265px;
    margin-top: 10px;
    box-sizing: border-box;
}

.module_right {
    border: 1px solid #ccc;
    margin-bottom: 20px;
}

.module_right .title h2 {
    background: #E90000;
    color: #fff;
    font-family: 'RobotoRegular';
    font-size: 20px;
    text-align: center;
    line-height: 40px;
}

/************************************************************/
.hinhhotro {
    /*    	padding-left: 10px;
    	padding-top: 150px;
    	float: left;
    	background: url('../images/bg_support.png') no-repeat top 0px left 10px;
    	height: 185px;
    	width: 100%;
    	font-size:16px;
    	font-family: 'RobotoRegular';*/
    padding-left: 10px;
    padding-top: 10px;
    float: left;
    background: none;
    height: 45px;
    width: 100%;
    font-size: 16px;
    font-family: 'RobotoRegular';
}

.hinhhotro span {
    font-size: 18px;
    font-weight: bold;
    font-family: 'RobotoRegular';
    color: #008BC2;
}

.hotlindirector {
    background: url('../images/hotline_hotro.png') no-repeat left 10px top, url('../images/line_menuleft.png') no-repeat bottom center;
    padding: 2px 0px 0px 60px;
    line-height: 50px;
    color: #D60000;
    font-size: 26px;
    font-weight: bold;
    font-family: 'RobotoRegular';
    height: 75px;
}

.dtlienhe {
    width: 100%;
    height: 35px;
    padding-left: 25px;
    line-height: 30px;
    color: #4e4e4e;
    font-weight: bold;
    font-size: 15px;
}

.emaillienhe {
    width: 100%;
    height: 35px;
    padding-left: 25px;
    line-height: 30px;
    font-weight: bold;
    font-size: 15px;
    color: #4e4e4e;
}

.box-icon {
    width: 100%;
    margin-bottom: -5px;
    overflow: hidden;
}

.namehotro {
    width: 100%;
    line-height: 25px;
    font-weight: bold;
    padding-left: 30px;
    color: #696969;
    font-size: 14px;
    background: url('../images/advisory.png') no-repeat left top;
    padding: 0px 0px 5px 25px;
}

.ico-zalo {
    height: 40px;
    float: left;
    margin-right: 5px;
}

.ico-sky {
    height: 40px;
    float: left;
}

.box-hotro {
    margin: 5px 5px 5px 5px;
    border-bottom: dashed 1px #ccc;
}

.linehotro {
    border: 1px solid #ccc;
    height: 1px;
    width: 150px;
}

.dthotro {
    width: 100%;
    background: url('../images/call.png') no-repeat top 0px left 5px;
    padding-left: 30px;
    line-height: 20px;
    margin-bottom: 8px;
}

.emailhotro {
    width: 100%;
    line-height: 13px;
    background: url('../images/email.png') no-repeat top 0px left 5px;
    padding-left: 30px;
    padding-bottom: 20px;
}

.boxnamecall {
    float: left;
    width: 60%;
}

.boxiconsuppo {
    float: left;
    width: 40%;
}

/***********************************/
.topfooter {
    width: 100%;
    background: url('../images/bg_footer.png');
    border-top: 10px solid red;
    padding: 20px 0px 10px 0px;
}

.topfooter_l,
.topfooter_mid1,
.topfooter_mid2,
.topfooter_r {
    width: 25%;
    float: left;
    padding-right: 10px;
}

.topfooter_mxh,
.topfooter_total {
    width: 50%;
    float: left;
}

ul.dvfooter {
    margin: 0px;
    padding: 0px;
}

ul.dvfooter li {
    text-decoration: none;
    list-style-image: url('../images/ico_dv.png');
    line-height: 22px;
    padding: 5px 0px;
}

ul.dvfooter li a {
    color: #767676;
}

ul.dvfooter li a:hover {
    color: #FF0000;
}

.titledvfooter {
    color: #656363;
    font-size: 16px;
    font-weight: bold;
}

/**********************************/
/*Thống kê truy cập*/
.khungtktc {
    float: right;
}

.boxthongketc {
    color: #7C7474;
    font-size: 15px;
    margin-top: 25px;
}

.online {
    background: url('../images/ico_online.png') no-repeat center left 0px;
    padding-left: 25px;
    float: left;
    margin-right: 10px;
}

.visit {
    background: url('../images/total.png') no-repeat center left 0px;
    padding-left: 25px;
    float: left;
}

.today,
.tomonth {
    padding-left: 0px;
    float: left;
    margin-right: 10px;
}

/*******************************/
.boxitempartner {
    width: 305px;
}

.imgpartner {
    width: 48%;
    float: left;
    margin: 0px 1% 5px 1%;
    position: relative;
    border: 1px solid #ccc;
}

.imgpartner img {
    width: 100%;
}

/*************************************/
/* ========== MEGA MENU ========== */
.boxmenumega {
    width: 100%;
    border-bottom: 2px solid #ccc;
    margin-bottom: 0;
    position: relative;
}

.boxmenumega .center ul {
    margin: 0;
    padding: 0;
}

.boxmenumega .center ul li {
    list-style: none;
    text-decoration: none;
}

/* Mỗi item làm mốc cho submenu */
.boxmenumega .center > ul > li {
    float: left;
    padding: 15px 0 5px 0;
    list-style: none;
    position: relative;              /* thêm */
}

/* Ô icon + tiêu đề danh mục */
.boxprolmenu {
    min-height: 75px;
    transition: all .5s;
    padding: 35px 30px 0;
    text-align: center;
    position: relative;              /* thêm */
    width: 150px;
}

/* Anchor phủ full ô => bấm icon cũng đi link */
.boxprolmenu > a {
    position: absolute;              /* thêm */
    inset: 0;                        /* thêm: top/right/bottom/left = 0 */
    display: flex;                   /* thêm */
    align-items: flex-end;           /* thêm: chữ ở dưới */
    justify-content: center;         /* thêm */
    padding: 8px 10px;               /* thêm: khoảng thở cho chữ */
    color: #000;
    font-size: 13px;
    font-family: 'RobotoRegular';
    text-align: center;
}

.boxmenumega .center ul li:hover .boxprolmenu {
    /* nếu muốn giữ hiệu ứng cũ, để nguyên */
    padding-top: 0;
    background-position: bottom center !important;
    cursor: pointer;
}

/* Submenu */
.boxshowitem {
    display: none;
    position: absolute;
    top: 95px;                       /* giữ nguyên vị trí cũ */
    left: 0;
    width: 100%;
    background: #fff;
    padding: 10px;
    z-index: 99999;
    pointer-events: none;            /* thêm: khi ẩn không chặn click */
    width: 1200px;
}
.boxmenumega .center > ul > li:hover > .boxshowitem {
    display: block;
    pointer-events: auto;            /* thêm: khi hover mới cho tương tác */
}

.boxshowitem > ul > li {
    float: left;
    width: 19%;
    margin: 5px 1% 0 0;
}

.titleitempro {
    background: #000;
    padding: 3px;
    text-align: center;
}

.titleitempro a {
    color: #fff;
    font-size: 14px;
    font-family: 'RobotoRegular';
}

.titleitempro:hover { background: #ccc; }
.titleitempro a:hover { color: #000; }

.boxshowitem > ul > li ul.ul-itemmenu li {
    width: 100%;
    padding: 3px 0 3px 15px;
    background: url('../images/icon_next.gif') no-repeat left 8px top;
}

.boxshowitem > ul > li ul.ul-itemmenu li a {
    color: #000;
    font-size: 13px;
    font-family: 'RobotoRegular';
    transition: ease-in-out .5s;
}

.boxshowitem > ul > li ul.ul-itemmenu li a:hover {
    padding-left: 5px;
    color: red;
}
/* 1) Cho .center làm mốc định vị */
.boxmenumega .center { position: relative; }

/* 2) Để submenu định vị theo .center (không theo <li>) */
.boxmenumega .center > ul > li { position: static; }  /* ghi đè lại dòng position:relative cũ nếu có */

/* 3) Căn giữa panel 1200px */
.boxshowitem{
  left: 50% !important;
  transform: translateX(-50%);
  top: 95px;             /* giữ như bạn đang dùng */
  width: 1200px;         /* hoặc max-width:1200px; */
}

/* ========== /MEGA MENU ========== */



/**************************************************/
.titleprolist {
    background: url('../images/title_left.png') no-repeat;
    padding: 0px 5px 0px 35px;
    background-size: 100% 100%;
    line-height: 36px;
    border-bottom: 2px solid #fff;
    text-transform: uppercase;
    color: red;
    font-weight: bold;
    font-size: 14px;
}

.titleprolist a {
    color: red;
    font-size: 17px;
    font-family: 'RobotoRegular';
    text-transform: uppercase;
}

.boxmenuleft ul {
    margin: 0px;
    padding: 0px;
}

.boxmenuleft ul li {
    text-decoration: none;
    list-style: none;
}

.boxmenuleft>ul>li>a {
    background: url('../images/ico_menuleft.png') no-repeat left 5px top 20px, url('../images/line_menuleft.png') no-repeat bottom -5px center;
    line-height: 25px;
    display: block;
    padding: 10px 5px 20px 15px;
    color: #000;
    -webkit-transition: ease-in-out 0.5s;
    -o-transition: ease-in-out 0.5s;
    transition: ease-in-out 0.5s;
    font-size: 14px;
}

.boxmenuleft>ul>li>a:hover {
    color: red;
    padding-left: 20px;
}

.boxmenuleft>ul>li>ul>li>a {
    background: url('../images/ico_menuleft.png') no-repeat left 15px top 15px, url('../images/line_menuleft.png') no-repeat bottom center;
    line-height: 25px;
    display: block;
    padding: 5px 5px 20px 35px;
    color: #000;
    -webkit-transition: ease-in-out 0.5s;
    -o-transition: ease-in-out 0.5s;
    transition: ease-in-out 0.5s;
    font-size: 14px;
}

.boxmenuleft>ul>li>ul>li>a:hover {
    color: red;
    padding-left: 40px;
}

.ulmenul {
    display: none;
}

/*     .boxmenuleft>ul>li:hover .ulmenul
     {
     	display: block;
     	}*/

.boxfotoen {
    display: none;
}

.boxfotofl {
    display: block;
}

#w_menu_mobile {
    position: fixed;
    width: 40px;
    height: 40px;
    background: rgba(0, 0, 0, 0.7);
    display: block;
    z-index: 10000000001;
    top: 20px;
    left: 10px;
}

.header div:not(.name) a {
    display: block;
    position: absolute;
    top: 0;
    left: 1.5%;
    background: url(../images/icon_menu.png) center no-repeat;
    width: 48px;
    height: 48px;
}

.timkiem2 {
    /* background: url(../images/bg_search.png) no-repeat left top; */
    width: 90%;
    height: 26px;
    margin: 20px auto 10px;
    /* position: absolute; */
    /* display: inline-block; */
    /* top: 12px; */
    /* right: 10px; */
    background: #fff;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.box_search2 {
    width: calc(100% - 20px);
    height: 26px;
    line-height: 26px;
    border: none;
    color: #000;
    font: 13px Arial;
    text-indent: 10px;
    background: none;
    outline: none;
}

.btn_search2 {
    cursor: pointer;
    display: block;
    /* width: 15px; */
    /* height: 15px; */
    /* background: url(../images/icon_search.png) no-repeat 0 0; */
    border: none;
    padding: 0;
    margin: 0;
    /* text-indent: -9999999999px; */
    overflow: hidden;
    float: right;
    position: relative;
    top: 3px;
    right: 6px;
    color: #000;
}

em.mm-counter {
    right: 35px !important;
}

.boxbannermenu {
    position: relative;
    z-index: 2;
}

.mm-listview>li:not(.mm-divider):after {
    left: 0 !important;
}

.combomobile {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 100000;
}

.combomobile btn-primary {
    background-color: #f00;
    border-color: #f00;
}

.blink_me {
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;

    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;

    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@-moz-keyframes blinker {
    0% {
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        opacity: 1.0;
    }
}

@-webkit-keyframes blinker {
    0% {
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        opacity: 1.0;
    }
}

@keyframes blinker {
    0% {
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        opacity: 1.0;
    }
}




/*******product-detail********/

/* Cố định vị trí .product-detail */
.product-detail {
    padding: 40px 0;
}

.product-detail .container {
    max-width: 1200px;
    margin: 0 auto;
}

.product-detail .row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.product-detail .product-image img {
    width: 100%;
    max-width: 500px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.product-detail .product-info {
    margin-left: 30px;
}

.product-detail h1 {
    font-size: 36px;
    color: #333;
}

.product-detail .category {
    font-size: 16px;
    color: #777;
}

.product-detail .price {
    font-size: 24px;
    font-weight: bold;
    color: #e74c3c;
}

.product-detail .description {
    font-size: 16px;
    color: #555;
    line-height: 1.6;
    margin: 20px 0;
}

.product-detail .btn {
    padding: 10px 20px;
    font-size: 16px;
    background-color: #3498db;
    color: #fff;
    border: none;
    cursor: pointer;
    border-radius: 5px;
}

.product-detail .btn:hover {
    background-color: #2980b9;
}




/* Responsive cho mobile */
@media (max-width: 480px) {
  .timeline {
    padding: 10px 0;
  }
  .tcat .icon a {
    line-height: 30px;
    color: #fff;
    font-size: 16px;
    text-transform: uppercase;
    font-family: 'RobotoRegular';
    padding-left: 20px;
}
  
  .timeline li {
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 12px;
  }

  .timeline .timeline-panel {
    width: 100%;
    padding: 10px;
  }

  .timeline .timeline-image {
    width: 60px;
    height: 60px;
    flex-shrink: 0;
    margin-right: 10px;
  }

  .timeline .timeline-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
  }

  .timeline .timeline-heading h4 {
    font-size: 14px;
    margin: 0;
  }

  .timeline .timeline-body p {
    font-size: 13px;
    margin-top: 4px;
  }

  .timeline .btn-more {
    font-size: 12px;
    padding: 3px 6px;
  }




.content {
    display: grid
;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;

}
.tcat {
    width: 100%;
    margin-bottom: 10px;
    background: #E90000;
    border-left: 5px solid #252525;
    padding-top: 4px;
    min-width: 300px;
}




}



@media (max-width: 480px) {
    .logo_header {
        position: relative;
        top: 0;
        z-index: 10;
        left: 120px;
        margin-bottom: 12px;
        width: 30%;
    }
    .inox-tran-tinh-text {
    margin-left: 112px;
    display: none;
    }


#keyword {
    width: 80%;
    padding: 0;
    font-size: 16px;
    border: 2px solid #ddd;
    border-radius: 30px;
    outline: none;
    transition: all 0.3s;
    align-items: center;
    transform: translateX(40px);
    transform: translateY(65px) translateX(32px);
}

#header {
    background-size: 100%;
    width: 100%;
    margin: 0 auto;
    height: 150px;
}
.boxmenumega .center ul {
    margin: 0px;
    padding: 0px;
    display: inline;
    transform: translateX(-20px);
}

.container_mid {
    width: 120%;
    transform: translateX(-17px);
}

#header {
    position: relative;
    background: #fff;
    background-size: 100%;
    width: 100%;
    margin: 0 auto;
    box-shadow: none;
    height: 150px;
}



.boxmenumega .center > ul > li {
    float: left;
    padding: px 0 px 0 !important;
    
}





}