/* # General styles ================================================== */
 * {
     margin: 0px;
     _margin: 0px;
     padding: 0px;
}
 *::after, *::before {
     box-sizing: content-box;
}
 ol, ul {
     margin: 0px;
     padding: 0px;
}
 body {
     
    /* background-color: #EBEBEB; */
     
}
 a {
     text-decoration: none;
}
 a:hover {
     text-decoration: none;
}
/*===== Common classes =====*/



.color-main
{
 color: #FFFF00;    
}
 img {
     height: auto;
     max-width: 100%;
}
 .clear-5 {
     clear: both;
     height: 5px;
}
 .red-italic {
     color: #CC0000;
     font-style: italic;
     font-size: 12px;
}
 .uppercase {
     text-transform: uppercase;
     font-weight: bold;
}
 .NoRecordHome {
     color: #333;
     padding: 5px 0px 5px 10px;
     font-weight: bold;
     font-size: 13px;
     float:left;
}
 .NoRecord-2 {
     font-weight: bold;
     font-size: 13px;
}
/*

 .embed-container {
     position: relative;
     padding-bottom: 56.25%;
     height: 0;
     overflow: hidden;
     max-width: 100%;
}
 .embed-container iframe, .embed-container object, .embed-container embed {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}
*/

/*  play video  */ 
.vid {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.vid iframe,
.vid object,
.vid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*  /video youtube */

.paging
{
 margin-bottom:20px;   
 }
 
 
 .img-responsive {
    display: inline;
 }
 
 
/*===== Page =====*/
div.fixed-top {
    position: fixed;
    z-index: 1030;
    top: 0px;
    left: 0px;
    right: 0px;
  
}
 
/*===== Header =====*/
 .nav-w {
     margin-bottom:0px;
}
 .inner-nav {
     margin-left:0px;
     margin-right:0px;
}
 .w-logo h3 {
     margin-top: 10px;
     margin-bottom: 0px;
}
 .w-header-between {
     padding-top: 10px;
     margin-bottom: 10px;
}
 .w-header-between p {
     margin-bottom:5px;
}
 
/*===== Page Content =====*/
.w-content
{
  /*  border-radius: 3px;
    -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.05);
    box-shadow: 0 3px 5px rgba(0,0,0,0.05);
    padding: 10px;
    background-color: #fff;
    margin-bottom:20px;
    */
}
 #wrapper-site-content {
     margin: 0px auto;
     padding: 0px;
     width: 100%;
     display: block;
     position: relative;
}
/*===== Sidebar left =====*/
 #sidebar-left {
     position: relative;
     margin: 0px;
     padding: 0px;
     width: 220px;
     float: left;
}
 .box-sidebar-left-w {
     padding: 0px;
     margin: 0px;
     width: 220px;
}
 .box-sidebar-left-title {
     margin: 0px auto;
     padding: 5px;
     width: 100%;
     height: 32px;
     font-weight: bold;
     border-radius: 3px 3px 0px 0px;
     background-color: #006782;
     color: #fff;
     text-align: center;
}
 .box-sidebar-left-content {
     margin: 0px auto;
     padding: 0px;
     border: 1px solid #E5E5E5;
     width: 100%;
}
 .page-header {
     padding-bottom: 0px;
     margin-bottom: 10px;
     margin-top: 10px;
     border-bottom: 1px solid #ddd;
}
 h1.post-detail-title {
     font-size: 20px;
     margin-bottom: 10px;
     margin-top: 0px;
     font-weight:600;
}
 .post-detail {
     text-align: justify;
     color: #000;
}
 .panel {
     margin-bottom: 20px;
        
    
     border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
    

}
 .panel-primary 
 {
     /*
     border-color: #ddd;
*/
border:none;
}
 .panel-primary > .panel-heading {
  
     color:#fff;
     background-color:#1367CB;
     padding: 10px;
   
     
     border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
     font-weight: 600;
     font-size:15px;
     border-bottom:none;

    /* border-left:4px solid #fff500;
   font-weight: 600;
     font-size:15px;
 padding: 10px;
 color:#fff;
  background-color: #1b8f4a ;
  border-radius:0px;
  border-bottom:none;
*/
}
 .panel-body
{
    background-color: #fff;
    padding: 6px 2px 6px 10px;
    border: 1px solid #dedede; 
    border-top:none;
}

 .body-inner {
     padding:10px;
}
 .panel-heading span {
     font-size: 16px;
}
 .pn-heading {
     background-color: #1473e6;
     border-top-left-radius: 3px;
     border-top-right-radius: 3px;
     margin-bottom:10px;
}
 .pn-heading h3 {
     padding: 11px 10px;
     font-size: 15px;
     margin-top: 0px;
     color: #fff;
     font-weight: 500;
     margin-bottom:5px;
}
 .pn-heading h3 a.pull-right span {
     text-transform:none;
}
 .pn-heading a {
     color: #fff;
}

/*  ---- btn ------ */

 .btn-primary-orange {
     background-color: #04861e    ;
     border-color: #04861e    ;
     color: #fff;
}
 .btn-primary-orange:hover {
     background-color: #04861e    ;
     border-color: #04861e    ;
     color: #fff;
}


 .btn-view-detail {
     background-color: #1367CB    ;
     border-color:#1367CB    ;
     color: #fff;
  
}

 .btn-view-detail:hover {
     background-color: #1367CB  ;
     border-color: #1367CB  ;
     color: #fff;
  
}

 .btn-danger-red {
     background-color: #C9302C;
     line-height:2;
}


 .btn-popup {
     background-color: #0066BF ;
     border: 1px solid #0066BF ;
     color: #fff;
}


 .btn-popup:hover {
     background-color: #0066BF  ;
     border: 1px solid #0066BF ;
     color: #fff;
}

/* ------------ Under auto color --------- */
 .classic-title {
     margin-bottom: 16px;
     padding-bottom: 12px;
     border-bottom: 2px solid #eee;
     font-weight: 300;
}
 .classic-title span {
     padding-bottom: 10px;
     border-bottom: 2px solid;
     font-weight: 600;
     text-transform: uppercase;
     color: #000;
}
 .classic-title span {
     border-bottom-color: #04538D;
}
 .classic-title a {
     color: #000;
}
 h2.classic-title {
     margin: 0;
     font-size: 16px;
     line-height: 16px;
}
/* ------------/Under auto color--------- */
/* -------title-box-------- */
 .title-box {
     border-bottom: 1px solid #ddd;
     margin: 10px 0 20px 0;
     padding-bottom: 10px;
     text-transform:uppercase;
     font-size:18px;
     font-weight:600;
}
 .title-box a {
     color:#333;
     font-weight:600;
}
 .title-box span {
     border-bottom: 3px solid #1367CB ;
     padding-bottom: 8px;
}
/* -------/title-box-------- */

/*===== Sidebar content =====*/
 .box-sidebar-content-w {
     padding: 0px;
     margin: 0px auto 5px auto;
     background-color: #FFFFFF;
}
 .box-sidebar-content-title {
     background: transparent url("../images/cleftr.png") repeat-x scroll right top;
     border-radius: 3px 3px 0px 0px;
     margin: 0px;
     padding: 5px 1px 0px 5px;
     height: 35px;
}
 .box-sidebar-content-title span {
     color: #000;
     font-size: 13px;
     font-weight: bold;
}
 .box-sidebar-content-inner {
     margin: 0px auto;
     padding: 5px 0px 0px 0px;
     border: 1px solid #E5E5E5;
     border-top: none;
}
 .box-sidebar-content .row {
     margin: 0px -5px;
}
/* ==== box-items-detail ==== */
 .post-thumb {
     float: left;
     background: #FFF none repeat scroll 0% 0%;
     margin: 1px 7px 10px 5px;
     padding: 3px;
     border: 1px solid #EEE;
     border-radius: 3px;
}
 .post-thumb img {
     width: 150px;
     height: 150px;
}
 .post-detail {
     margin-top: 10px;
     color: #333;
     font-size: 16px;
     text-align: justify;
     margin-bottom: 20px;
}
 h4.product-title {
     margin-top: 17px;
     padding: 0;
     font-weight: 600;
     font-size: 15px;
     text-align: center;    
     margin-bottom:10px;
     
    
}
 h4.product-title-sroll {
     margin: 0px;
     font-size: 14px;
     font-weight: 400;
     text-align: left;
     min-height: 30px;
}
 h4.post-title-news-top {
     margin-bottom: 5px;
     text-align: left;
     font-size: 14px;
     margin-top: 0px;
}
 h4.post-title-news-top a {
}
 .product-title a, .news-title a, a.post-title , .post-title-news-top a, .product-title-sroll a {
     color: #333  ;
}
 .product-title a:hover, .news-title a:hover, a.post-title:hover, .post-title-news-top a:hover, .product-title-sroll a:hover {
     color: #2A579A;
     text-decoration: none;
}

a.title-item-product
{
    font-size:18px;
    color:#333;
    font-weight:600;
}
a.title-item-product:hover
{
     color:#1367CB  ;
}

 h4.post-title {
     margin-top: 0px;
}
 .box-img-sroll img {
     border: 1px solid #f1f1f1;
}
 .box-img-news img {
     border: 1px solid #eee;
     padding: 5px;
     margin-bottom: 10px;
}
/* ==== /box-items-detail ==== */
/* ==== Paging ==== */
 .paging {
     padding-top: 0px;
     text-align: center;
}
 .pagination {
     margin: 0px;
}
 .pagination > li > a, .pagination > li > span {
     padding: 3px 12px;
}
 .pagination {
    /* display: inline-block; */
     margin-bottom: 0px;
     margin-top: 0;
     padding-left: 15px;
}
 .pagination li:first-child a, .pagination li:first-child span {
     border-bottom-left-radius: 0;
     border-top-left-radius: 0;
     margin-left: 0;
}
 .pagination li:last-child a, .pagination li:last-child span {
     border-bottom-right-radius: 0;
     border-top-right-radius: 0;
}
 .pagination .active a, .pagination .active span, .pagination .active a:hover, .pagination .active span:hover, .pagination .active a:focus, .pagination .active span:focus {
     background-color: #1e73be;
     border-color: #1e73be;
     color: #fff;
     cursor: default;
     z-index: 2;
}
 .pagination li a, .pagination li span {
     background-color: #f0f0e9;
     border: 0;
     float: left;
     line-height: 1.42857;
     margin-left: -1px;
     padding: 6px 12px;
     position: relative;
     text-decoration: none;
     margin-right: 7px;
     color: #000;
}
 .pagination li a:hover {
     background: #1e73be   ;
     color: #fff;
}
/* ==== /Paging ==== */
 .tab-content-detail .nav-tabs li.active a, .tab-tour .nav-tabs li.active a:hover, .tab-tour .nav-tabs li.active a:focus {
     border-radius: 3px 3px 0px 0px;
     border-top: 2px solid #04861e;
     color: #333;     
}
 .tab-content-detail .nav-tabs li a {
     border-top: 2px solid #fff;
     color: #cf3030;
}
 .tab-content-detail .nav > li > a {
     padding: 7px 15px;
}
/* nav-tabs > li > a {
     border: none;
}
 .nav-tabs > li > a:hover {
     border: none;
}
 .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
     border: none;
     background-color: #ddd;
     padding: 7px;
     color: #333;
}
 */
/* ==== breadcrumb ==== */
.w-breadcrumb
{    
    background-color:#f1f1f1;
    margin-bottom:10px;
}


 .breadcrumb > li + li:before {
     color: #CCCCCC;
     content: "/ ";
     padding: 0 5px;
}
 .breadcrumb a:hover {
     color: #1367CB  ;
     text-decoration: none;
}
 .breadcrumb-inner {
     padding: 10px 0px;
     margin-bottom: 0px;
     background-color: #f1f1f1;
     padding-top: 8px;
}
 .breadcrumb-inner a {
     color: #333;
     font-size:15px;
}


/* -------------- */

.section-header {
  margin-bottom: 30px;
}
.section-header .section-title {
  font-size: 25px;
  color: #333;
 
  text-transform: uppercase;
  position: relative;
  padding-bottom: 20px;
  margin: 0 0 20px;
  /*
  font-family:'Roboto-medium';font-weight:500;*/
}
.section-header .section-title:before {
  content: "";
  position: absolute;
  width: 160px;
  bottom: 0;
  left: 50%;
  margin-left: -80px;
  height: 1px;
  background: #ddd;
}
.section-header .section-title:after {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  bottom: -9px;
  left: 50%;
  margin-left: -12px;
  border: 5px solid #fff;
  border-radius: 20px;
  background: #2A579A;
}
.section-header a {
    color: #333;
}
/* -------------- */

/* ----------- section-title ----------- */

.section-title-container
{
 margin-bottom:20px;   
 }

   .section-title-top {
    position: relative;
    -js-display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
}
.section-title-bold-center span, .section-title-bold span {
   /* border: 2px solid rgba(0,0,0,0.1); */
    padding: .5em .8em;
    font-weight:600;
    font-size:18px;
}
.section-title-top b {
    display: block;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 2px;
    opacity: .1;
    background-color: currentColor;
}

.section-title-main {
    margin-left: 10px;
    margin-right: 10px;
    text-transform:uppercase;
    background-color:#1367CB ;
    color:#fff;
}

/* ----------- /section-title ----------- */
 
 .box-support
   {
    border-left: 1px solid #ddd;    
      border-right: 1px solid #ddd;    
        border-bottom: 1px solid #ddd;    
        text-align:center;
        padding:10px;
   }
   
/* -------------- */
 .w-news-home {
   /*  background: url("../images/sneaker_mesh_fabric.png");
     overflow-x: hidden;
*/
   
}


/*===== Footer =====*/
 .footer-w
{
    background-color: #006599;
    padding: 25px 0px;
    color: #fff;
   /* background-image: url("../images/bg-footer.jpg");
    position: relative;
    background-position: none center;
    background-repeat: no-repeat;
    */
}



 .footer p {
     margin-bottom: 5px;
}
 .footer-col-1 {
     padding-top: 0px;
}
 .footer-col-3 h4 {
     font-weight: normal;
     text-transform: uppercase;
}
.text-link-footer a
{
    color: #fff ;
}

.text-link-footer a:hover
{
   font-weight: bold;
}


/*===== Fomat title =====*/
 .line_above_auto_color {
     position: relative;
     margin: 0px;
     border-top: 2px solid #DDD;
    /* rgba(0, 39, 59, 0.08);
     */
     padding: 0px;
}
 .line_above_auto_color ol, ul {
    /* list-style: none;
     text-align: center;
     */
}
 .line_above_auto_color > ul > li {
     float: left;
}
 .line_above_auto_color > ul > li > a {
     display: block;
     margin: 0px;
     padding: 0px;
     color: #000;
     font-weight: 700;
     font-size: 14px;
     line-height: 1.8;
     position: relative;
}
 .line_above_auto_color:after {
     clear: both;
     display: table;
     content: "";
     line-height: 0;
}
 .line_above_auto_color > ul > li > a:after {
     content: " ";
     display: block;
     right: 0px;
     height: 2px;
     background: none repeat scroll 0% 0% #0055A8;
    /* green #2E9FFF;
     */
     position: absolute;
     top: -2px;
     left: 0px;
}
/*=============*/
 .line_under_auto_color {
     position: relative;
     margin-bottom: 10px;
     border-bottom: 2px solid #DDD;
    /* rgba(0, 39, 59, 0.08);
     */
     padding: 0px;
}
 .line_under_auto_color ol, ul {
     /*list-style: none;
     text-align: center;
     */
}
 .line_under_auto_color > ul > li {
     float: left;
}
 .line_under_auto_color > ul > li > a {
     display: block;
     margin: 0px;
     padding: 0px;
     color: #000;
     font-weight: 700;
     font-size: 16px;
     line-height: 1.8;
     position: relative;
}
 .line_under_auto_color:after {
     clear: both;
     display: table;
     content: "";
     line-height: 0;
}
 .line_under_auto_color > ul > li > a:after {
     content: " ";
     display: block;
     right: 0px;
     height: 2px;
     background: none repeat scroll 0% 0% #0055A8;
    /* green #2E9FFF;
     */
     position: absolute;
    /* top: 0px;
     */
     left: 0px;
}
/* line_under_auto_color-sp*/
 .line_under_auto_color_sp {
     position: relative;
     margin-bottom: 10px;
     border-bottom: 2px solid #337AB7;
    /* rgba(0, 39, 59, 0.08);
     */
     padding: 0px;
}
 .line_under_auto_color_sp ol, ul {
     /* list-style: none;
    /* text-align: center;
     */
}
 .line_under_auto_color_sp > ul > li {
     float: left;
}
 .line_under_auto_color_sp > ul > li > a {
     display: block;
     margin: 0px;
     padding: 0px 15px;
     color: #fff;
     font-weight: 700;
     font-size: 14px;
     line-height: 2.2;
     position: relative;
}
 .line_under_auto_color_sp:after {
     clear: both;
     display: table;
     content: "";
     line-height: 0;
}
 .line_under_auto_color_sp > ul > li > a:after {
     content: " ";
     display: block;
     right: 0px;
     height: 3px;
     background: none repeat scroll 0% 0% #337AB7;
    /* green #2E9FFF;
     */
     position: absolute;
    /* top: 0px;
     */
     left: 0px;
}
/* ------box-header-line-color -------*/
 h3.box-header-line-color::after {
     margin-bottom: -1px;
}
 h3.box-header-line-color {
     font-size: 15px;
     font-weight: 600;
     color: #333;
     margin-bottom: 10px;
     border-bottom: 1px solid #E2E6E7;
     margin-top:7px;
     text-transform:uppercase;
}
 h3.box-header-line-color::after {
     display: block;
     content: "";
     background: #1473e6;
     width: 40px;
     height: 3px;
     margin-top: 10px;
}
 h3.box-header-line-color a.cat-name {
     color:#337AB7;
}
 h3.box-header-line-color a.cat-name:hover {
     color:#D0301b;
}
 h3.box-header-line-color a.pull-right {
     color:#337AB7;
}
 h3.box-header-line-color a.pull-right:hover {
     color:#D0301b;
}
 h3.box-header-line-color a {
     color:#337AB7;
}
 h3.box-header-line-color a:hover {
     color:#D0301b;
}
/* ------/------- */
/* ------box-header-line-color-footer -------*/
 h3.box-header-line-color-footer::after {
     margin-bottom: -1px;
}
 h3.box-header-line-color-footer {
     font-size: 20px;
     font-weight: 600;
     color: #fff   ;
     margin-bottom: 0px;
     border-bottom: 1px solid #E2E6E7;
     margin-top:0px;
     text-transform:uppercase;
}
 h3.box-header-line-color-footer::after {
     display: block;
     content: "";
     background: #fff  ;
     width: 40px;
     height: 3px;
     margin-top: 10px;
}
/* ------/------- */
/*=============*/
/* -------post home-------- */
 .top-news {
     margin: 5px;
}
 .top-news img {
     width: 150px;
     float: left;
     margin-right: 5px;
     border: 1px solid #CCC;
     padding: 3px;
}
 .top-news a {
     color: #000;
}
 .top-news a:hover {
     color: #004F8B;
}
 .row-list-news h3 {
     margin: 5px 0px 6px 0px;
     padding-left: 10px;
     background: url(../images/ic01.png) 0px 7px no-repeat;
     font-size:15px;
     color:#333;
}
 .row-list-news a {
     color: #333;
}
 .row-list-news a:hover {
     color: #004F8B;
}
/* ------------- */
/* ==== row-other-items ==== */
 .row-other-items {
     list-style: none;
     margin-top: 10px;
     padding: 0;
}
 .row-other-items li {
     margin: 0;
     padding: 0px 0px 5px 13px;
     clear: both;
     display: inline-block;
     width: 100%;
     position: relative;
}
 ul.row-other-items li::before {
     background: transparent none repeat scroll 0px 0px;
     content: "";
     margin: 0px;
     padding: 0px;
     position: absolute;
     top: 7px;
     left: 3px;
     height: 0px;
     width: 5px;
     border: 5px solid transparent;
     border-radius: 0px;
     border-left-color: #AAA;
}
 ul.row-other-items li:hover::before {
     background: transparent none repeat scroll 0px 0px;
     content: "";
     margin: 0px;
     padding: 0px;
     position: absolute;
     top: 7px;
     left: 3px;
     height: 0px;
     width: 5px;
     border: 5px solid transparent;
     border-radius: 0px;
     border-left-color: #1367CB    ;
}
 .row-other-items a {
     text-decoration: none;
     font-size: 16px;
}
 .row-other-items a:hover {
     color: #1367CB;
}
 .row-other-items .thumbnail-img {
     border: 1px solid #dedede;
     padding: 3px;
     margin-right: 5px;
     border-radius: 3px;
}
/* ==== /row-other-items ==== */
 #row-thong-ke {
     padding: 0px;
}
 #row-thong-ke li {
     padding: 7px 5px;
     border-bottom-style: dotted;
     border-bottom-width: 1px;
     border-bottom-color: #CCCCCC;
     text-align: left;
     display: block;
     vertical-align: top;
     list-style: outside none none;
}
/* ===== row-lien-ket ===== */
 .row-lien-ket {
     padding: 0px;
}
 .row-lien-ket li {
     padding: 5px 0px;
     text-align: left;
     display: block;
     vertical-align: top;
     list-style: outside none none;
}
 .row-lien-ket li a:hover {
     text-decoration:none;
}
 .row-lien-ket i {
     font-size: 12px;
     color: #FF0000;
}
/* ===== /row-lien-ket ===== */
/* ==== */
 .row-items {
     list-style: none;
     margin: 0;
     padding: 0;
}
 .row-items li {
     margin: 0;
     padding: 0px 0px 5px 13px;
     clear: both;
     display: inline-block;
     width: 100%;
    /* border-bottom: 1px dotted #ddd;
     */
     position: relative;
}
 ul.row-items li::before {
     background: transparent none repeat scroll 0px 0px;
     content: "";
     margin: 0px;
     padding: 0px;
     position: absolute;
     top: 7px;
     left: 3px;
     height: 0px;
     width: 5px;
     border: 5px solid transparent;
     border-radius: 0px;
     border-left-color: #AAA;
}
 ul.row-items li:hover::before {
     background: transparent none repeat scroll 0px 0px;
     content: "";
     margin: 0px;
     padding: 0px;
     position: absolute;
     top: 7px;
     left: 3px;
     height: 0px;
     width: 5px;
     border: 5px solid transparent;
     border-radius: 0px;
     border-left-color: #04861e    ;
}
 .row-items a {
     color: #333;
     text-decoration: none;
     font-size: 16px;
}
 .row-items a:hover {
     color: #04861e ;
}
 .row-items .thumbnail-img {
     border: 1px solid #dedede;
     padding: 3px;
     margin-right: 5px;
     border-radius: 3px;
}
/* ==== row-items-news ==== */
 .row-items-news {
     list-style: none;
     margin: 0px 5px;
     padding: 0;
}
 .row-items-news li {
     display: inline-block;
     width: 100%;
    /* border-bottom: 1px dotted #ddd;
     */
     position: relative;
     border-bottom: 1px solid #DCDCDC;
    /* box-shadow: 2px 2px 2px #DCDCDC;
     */
     padding: 0px 0px 10px 0px;
     margin-bottom: 15px;
     border-bottom-style: dotted;
}
 .row-items-news a {
     color: #333;
     text-decoration: none;
     font-weight: bold;
     font-size: 16px;
}
 .row-items-news a:hover {
     color: #004f8b;
}
 .row-items-news .thumbnail-img {
     border: 1px solid #dedede;
     padding: 3px;
     margin: 0px 5px;
     border-radius: 3px;
}
/* ==== /row-items-news ==== */
/* ===== Hover zoom image =====*/
 .box-grid {
     border-style: solid;
     border-width: 1px;
     border-top-color: #ddd;
     border-right-color: #FF0000;
     border-bottom-color: #FF0000;
     border-left-color: #ddd;
     border-top: none;
     border-left: none;
}

 .box-image-item {
     margin-top: 0px;
     margin-bottom:20px;
    /* margin-right: -5px;
     margin-left: -5px;
     */
     padding: 5px;
     position: relative;
     z-index: 1;
     border: 1px solid #ddd;
     text-align: center;
     background-color:#fff;
}
 .box-image-item:hover {
     -moz-box-shadow: 0px 0px 7px -1px #ccc;
     -webkit-box-shadow: 0px 0px 7px -1px #ccc;
     box-shadow: 0px 0px 7px -1px #ccc;
}

 .box-image-item img {
    /* CSS for image within container */
     position: relative;
     z-index: 2;
     -moz-transition: all 0.5s ease;
    /* Enable CSS3 transition on all props */
     -webkit-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
     -ms-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
}
 .box-image-item:hover img {
    /* CSS for image when mouse hovers over main container */
    /* -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     */
     -moz-transform: scale(1.1, 1.1);
     -webkit-transform: scale(1.1, 1.1);
     -ms-transform: scale(1.1, 1.1);
     -o-transform: scale(1.1, 1.1);
     transform: scale(1.1, 1.1);
     
}
 .box-image-item .box-image {
     height: 262px;
     overflow:hidden;
}
 .box-image-item .box-image-2 {
     height: 200px;
}
 .box-image-item img.width-full {
     width: 100%;
     height: 100%;
    object-fit: cover;
}
 .box-image-item p {
     margin-bottom:0px;
}
/* ------------ */
.box-top-product img
{
     height: 260px;
     width: 100%;
     object-fit: cover;
    
 }
/* ------------ */

 .box-image-item-home {
     margin-top: 0px;
     margin-bottom:20px;
    /* margin-right: -5px;
     margin-left: -5px;
     */
     padding: 5px;
     position: relative;
     z-index: 1;
     border: 1px solid #ddd;
     text-align: center;
}
 .box-image-item-home:hover {
     -moz-box-shadow: 0px 0px 7px -1px #ccc;
     -webkit-box-shadow: 0px 0px 7px -1px #ccc;
     box-shadow: 0px 0px 7px -1px #ccc;
}

.box-image-item-home img {
    /* CSS for image within container */
     position: relative;
     z-index: 2;
     -moz-transition: all 0.5s ease;
    /* Enable CSS3 transition on all props */
     -webkit-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
     -ms-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
}
 .box-image-item-home:hover img {
    /* CSS for image when mouse hovers over main container */
    /* -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     */
    -moz-transform: scale(1.1, 1.1);
     -webkit-transform: scale(1.1, 1.1);
     -ms-transform: scale(1.1, 1.1);
     -o-transform: scale(1.1, 1.1);
     transform: scale(1.1, 1.1);
    
}
 .box-image-item-home .box-image-home {
     height: 360px;
     overflow:hidden;
}
 .box-image-item-home img.width-full {
     width: 100%;
     height: 100%;
}
/* ----------------- */

/* ------------ */

 .box-image-item-news-home:hover {
     
}

.box-image-item-news-home img {
    /* CSS for image within container */
     position: relative;
     z-index: 2;
     -moz-transition: all 0.5s ease;
    /* Enable CSS3 transition on all props */
     -webkit-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
     -ms-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
}
 .box-image-item-news-home:hover img {
    /* CSS for image when mouse hovers over main container */
    /* -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
     */
    -moz-transform: scale(1.1, 1.1);
     -webkit-transform: scale(1.1, 1.1);
     -ms-transform: scale(1.1, 1.1);
     -o-transform: scale(1.1, 1.1);
     transform: scale(1.1, 1.1);
    
}
 .box-image-item-news-home .box-image-news-home {
    
     overflow:hidden;
     
}
 .box-image-item-news-home img.width-full {
     width: 100%;
     height: 100%;
     object-fit: contain;
}
/* ----------------- */

 .box-img-other-product {
     height: 200px;
     overflow:hidden;
}
.box-img-other-product .width-full
{    
      width: 100%;
  height: 300px;
  object-fit: contain;
}
} 

/* --------Hotline Home--------- */
.w-support{

    padding:20px 0px;
    
    background-color: #fff;
    background-image: url("../images/bg-support.jpg");
    background-position: 0px -40px;    
    position:relative;
    background-position: none center;
   /* background-repeat:no-repeat; */
}

.w-support .elementor-background-overlay {
    background-color: #0c0c0c;
    opacity: 0.3;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}
.w-support .elementor-background-overlay{
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    z-index:800;
}
.w-text
{    
    
    z-index:1000;
    position:relative;
    padding-top:20px;
}
/* -------- /Hotline Home --------- */


/* ------ call footer ------ */
 .support-now {
     background: #f1f1f1;
     position: fixed;
     bottom: 0px;
     left: 0px;
     right: 0px;
     z-index: 9;
     color: #fff;
     font-weight: 500;
     text-align: center;
     border-top: 2px solid #c62828;
     padding-bottom: 6px;
     padding-top: 4px;
     border-top-color: #CCCCCC;
}
 .support-now .support-price-call {
     background: #fff;
}
 .support-now .support-price {
     display: inline-table;
}
 .support-now a {
     color: #fff;
     font-size: 18px;
}
 .support-now .support-price-call img {
     width: 90px;
     height: auto;
}
 .btn-orange {
     background-color: #ff9900;
     border: 1px solid #ff9900;
     color: #fff;
     border-radius: 3px;
}
 .btn-orange:hover {
     background-color: #ff9900;
     border: 1px solid #ff9900;
     color: #fff;
     border-radius: 3px;
}

 .btn-call {
     background-color: #c62828;
     border: 1px solid #c62828;
     color: #fff;
     border-radius: 3px;
}
 .btn-call:hover {
     background-color: #c62828;
     border: 1px solid #c62828;
     color: #fff;
     border-radius: 3px;
}

/* ------ /call footer ------ */


/* ---- hotline Left ---- */
 .btn_call_detail {
     padding: 0px 0px;
     margin-bottom: 10px;
}
 .btn-base {
     color: #fff !important;
     background-color: #e91b23;
     border: 1px solid #d6151c;
     border-radius: 2px;
     padding-left: 60px;
     margin-bottom: 0px;
     position:relative;
}
 .btn-icon.btn-lg span {
     font-size:16px;
}
 .btn-base::before {
     background-color: #bf1219;
}
 .btn-icon.btn-lg::before {
     width: 50px;
     
     line-height: 46px;
}
 .btn-icon.btn-lg::before, .btn-icon.btn-xl::before, .btn-icon.btn::before {
     border-top-left-radius: 2px;
     border-bottom-left-radius: 2px;
}
 .btn-icon::before {
     position: absolute;
     top: 0;
     left: 0;
     bottom: 0;
     width: 36px;
     color: #fff;
     border-right: 0;
     -webkit-transition: background .1s linear;
     -moz-transition: background .1s linear;
     -ms-transition: background .1s linear;
     transition: background .1s linear;
     font-family: FontAwesome;
     line-height: 32px;
}
/* ---- /hotline Left ---- */



/* --------- wating-send-left ------ */
.wating-send 
{
    text-align:center;
}

.wating-send img
{
    width:100px;   
    
}

.wating-send p
{
    color: #FF0000;
    font-size:22px;    
    text-align:justify;
    padding:10px;
}

/* --------- /wating-send-left ------ */
/* scroll to top */
 .scrollup{
     position:fixed;
     width:40px;
     height:40px;
     bottom:130px;
     right:17px;    
     z-index:1000;
}
 a.scrollup {
     outline:0;
     text-align: center;
}
 a.scrollup:hover,a.scrollup:active,a.scrollup:focus {
     opacity:1;
     text-decoration:none;
}
 a.scrollup i {
     display: block;
     width: 40px;
     height: 40px;
     line-height: 38px;
     color: #fff;
     border-radius: 50%;
     -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
     -o-border-radius: 50%;
   
     text-align: center;
     background-color: #E8330F  ;
     transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
     -webkit-transition: all 0.2s ease-in-out;
     -o-transition: all 0.2s ease-in-out;
}
 a.scrollup i:hover
{
    text-decoration: none;
    background-color: #E8330F ;
}
/* /scroll to top */

#call-zalo {

    position: fixed;
    bottom: 50px;
    right: 5px;
    z-index: 1000;
    width: 55px;

}
.col-between {
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: #FFFFFF;
border-right-style: solid;
border-right-width: 1px;
border-right-color:    #FFFFFF;
}
 @media (max-width: 768px) 
 {
     
    
     .w-logo h3 {
         margin-top:10px;
    }
     .w-support {
         padding-top:0px;
    }
     .top-bar-w {
         margin-bottom: 0px;
    }
     .nav-w {
         margin-bottom: 5px;
    }
     .box-image-item .box-image, .box-image-item .box-image-2 {
         height: auto;
    }
    
    
    .box-top-product img
{
     height: auto;
     width: 100%;
    
 }
     .inner-nav {
         margin-left:-15px;
         margin-right:-15px;
    }
     
     
     .menu.mobile ul.open > li:last-child span {
         background-color: transparent !important ;
         color: #ff0000 ;
         padding-left:0px;
    }   
    
 
     .menu ul.open > li:last-child i {
         color:#ff0000 ;
    }
     .col-between
    {
        border:none;
    }
     .box-img-other-product {
     height: auto;
        
    }
    .box-top-product img 
    {
  object-fit: cover;
  height: 270px;
  width: 100%;
}
}