@charset "utf-8";
/*chia cot*/
.col20 { width: 18.5%;  }
.col25 { width: 23.5%;  }
.col30 { width: 28.5%;  }
.col35 { width: 32%;  }
.col40 { width: 38.5%;  }
.col50 { width: 48.5%;  }
.col60 { width: 58.5%;  }
.col70 { width: 68.5%;  }
.col80 { width: 78.5%;  }
.col90 { width: 88.5%;  }
.col100 {width: 100%;   }

/*chia cot end*/

/*css chung thuộc tính*/
.giatt-left, .giatt-right, .giatt-headersp { text-decoration:line-through; color: #717171;}
/*css chung thuộc tính end*/


/*header - avatar sanphamct */
.title-headersp { font-size: 26px; text-transform: capitalize; font-weight: bold; border-bottom: 1px dashed #96c9ff; padding-bottom: 8px; }
.title-headersp a { text-shadow: 2px 2px 3px #ffffff; color: #001a2c; filter: drop-shadow(0px 2px 2px #d9d9d9); }
.title-headersp a:hover {text-shadow: 2px 2px 3px #ffea84;transition: .5s all ease;}
.text-headersp { font-size: 14px; background: aliceblue; padding: 10px; }
.info-other { border-left: 5px solid #297cff; padding: 5px 0px; padding-left: 11px; margin: 10px 0px; background: #fbfbfb; clear: both; }
.info-other ul { display: flex ; }
.info-other ul li, .info-other ul li b {font-size: 14px;}
.info-other > ul strong {font-weight: bold;color:#006fff;}
.info-other ul li:nth-child(1)::after {content: "|";padding: 0px 5px;}
.boxgia-headersp {margin: 15px 0px 10px 0px;display: flex;flex-wrap: wrap;}
.boxgia-headersp span {padding: 5px 8px 5px 0px;}
.giaban-headersp b {color: #001c55 !important;background: #ffd800;padding: 4px 10px;font-size: 24px;font-weight: 600;}
.giatt-headersp { font-size: 15px; margin-top: 2px; }
.headersp-avatar { text-align: justify; margin: 20px 0px; border-bottom: 4px double #ffbc00; padding-bottom: 10px; display: flow-root; }
.box-avatar {width: 45%;padding-right: 10px;float: left;}
.box-avatar img { width: 100%; }
.title-bangheadersp { font-size: 18px; text-transform: uppercase; text-align: left; font-weight: 600; color: #2b3368; border-left: 7px solid #ffd200; background: #d9d9d9; padding: 10px 0px 10px 10px; }
/*header - avatar sanphamct end */

/*header - avatar sanphamct */
.title-headertin {border-bottom: 3px dotted #0089ff;text-transform: uppercase;margin: 0px 0px 20px 0px;}
.title-headertin h1 { font-size: 30px; font-weight: bold; color: #df0000; text-shadow: 0px 2px 2px #ffdd60;}
.view-headertin {text-align: right;}
.date-headertin, .view-headertin {width: 50%;}
.text-headertin { margin: 20px 0px 10px 0px; border-left: 6px solid #0095ff; padding: 10px; padding-left: 10px; text-align: left; background: #efefef; font-size: 14px; box-shadow: -3px 0px 0px #ffd200; }
/*header - avatar sanphamct end */



/*css hiển thị danhmuc */
.xemdanhmuc-right h3 {font-size: 13px;background: #00c0d3;padding: 8px 2px;text-align: center;border-left: 3px solid #ffd200;}
.xemdanhmuc-right ul {list-style-type: circle;margin-left: 21px;color: #ff6a00;}


.xemdanhmuc-left h3 {font-size: 20px;font-weight: 600;border-bottom: 1px dotted #aaa;padding: 5px 0px;margin: 20px 0px;color: #000dad;}
.xemdanhmuc-left a {color: #060606;background: #e1e1e1;padding: 5px;margin: 3px;display: block;width: fit-content;float: left;}
/*css hiển thị danhmuc end*/

/*css sanpham */


    /*hiển thị sanpham left */
    .title-listspleft {font-size: 26px;text-transform: uppercase;border-left: 5px solid blue;padding-left: 5px;margin: 30px 0px;clear: both;}
    .spleft {padding: 10px;}
    .spleft-img img {width: 100%;}
    .spleft-img img:hover {transform: scale(1.02);transition: .6s all ease;box-shadow: 0px 0px 15px #969696;}
    .title-spleft {margin: 10px 0px;text-transform: capitalize;font-size: 16px;border-bottom: 3px solid #0079d0;padding-bottom: 5px;}
    .title-spleft a {color: #3e3e3e;font-weight: 600;}
    .giaban-left {background: #0079df;padding: 2px 8px;margin-right: 10px;font-size: 16px;}
    .giaban-left, .giaban-left b { color: #fff; }
    .giatt-left {font-size: 14px;}
    .text-spleft {margin: 20px 0px;font-size: 14px;display: -webkit-box; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4;}
    .spleft ul {padding: 0;}
    /*hiển thị sanpham left end*/

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

    /*hiển thị sanpham right */
    .title-listspright {font-size: 18px;text-align: center;background: #ff3900;color: #ffffff;padding: 5px 0px 3px 4px;margin: 5px 0px 15px 0px;clear: both;}
    .list-spright { margin: 10px 0px;}
    .box-spright {margin-bottom: 15px;padding: 5px;box-shadow: 0px 0px 5px #03ff2e;}
    .title-spright {font-size: 14px;text-transform: uppercase;margin: 10px 0px;font-weight: 600;border-left: 5px solid #4b4b4b;background: #ffd200;padding: 10px 0px 5px 5px;border-radius: 3px;}    
    .title-spright a {color:#2b2b2b;}
    .giaban-right {display: block ;color: #df0000;font-size: 18px;font-weight: bold;text-align: center;padding: 5px 0px;border-bottom: 1px dotted #696969;}
    .giatt-right {display: block ;font-size: 16px;text-align: center;padding: 5px 0px;}
    .text-spright { float: left; margin: 5px 0px; padding: 8px; background: #ffffe0; color: #000; font-size: 14px; box-shadow: 0px 5px 10px #cacaca; border-radius: 5px; }    /*hiển thị sanpham right end*/
    .spright ul {padding: 0;}
/*css sanpham end */



/*css tintuc */
    /*hiển thị tin tức left */
    .title-listtinleft {border-bottom: 4px double #ffc800;text-align: center;padding-bottom: 5px;font-size: 26px;margin: 50px 0px 30px;clear: both;}
    .title-listtinleft span {border-bottom: 4px solid #007eff;text-align: center;text-transform: uppercase;padding-bottom: 6px;}
    .box-tinleft {padding: 10px 5px 10px 5px;}
    .tinleft-img {max-height: 260px;overflow: hidden;}
    .tinleft-img img {border-radius: 20px;display: block;margin: 10px auto;}
    .title-tinleft {font-size: 16px;border-bottom: 1px dotted #5f5f5f;padding-bottom: 10px;}
    .title-tinleft a {color: #474747;font-weight: 600;text-transform: uppercase;margin: auto;padding-left: 5px;display: block;border-left: 6px solid #ffb100;height: 40px;}
    .tinleft {padding: 5px 8px;background: #ccfff3;box-shadow: 0px 8px 10px #93bbbf;}
    .info-other-tinleft {background: #0066ff;padding: 5px;}
    .info-other-tinleft span {background: #ffffff;padding: 2px 8px;border-radius: 4px;margin: auto;font-size: 14px;}
    .text-tinleft { color: #000; font-size: 14px; margin: 10px 0px; text-align: left; }
    /*hiển thị tin tức left end*/

    /*hiển thị tintuc right */
    .title-listtinright {font-size: 20px;font-weight: bold;text-transform: uppercase;text-align: center;border-top: 5px solid #0072ff;padding-top: 10px;margin: 30px 0px;clear: both;}
    .title-listtinright span {border-bottom: 1px dotted #aaa;padding-bottom: 11px;}
    .list-tinright {margin: 10px 0px;}
    .tinright {margin: 5px 0px 10px 0px;}
    .tinright-img img {border-radius: 15px;padding: 5px;}
    .title-tinright {font-size: 16px;font-weight: bold;text-align: center;margin: 5px 0px;padding: 10px;text-transform: uppercase;border-bottom: 4px double #ffb100;}
    .title-tinright a {color: #007bff;}
    .tinright-info {text-align: center;font-size: 14px;}
    .text-tinright{font-size: 16px;text-align: justify;}

    /*hiển thị tintuc right end */
/*css tintuc  end*/



/* Responsive */
@media (min-width: 992px) and (max-width: 1199px)
{/*start media 1199*/


    /*css chung*/  
        /*size13*/.giatt-headersp, .text-spleft,.giatt-left, .title-spright, .text-spright {font-size: 13px!important;}
        /*size14*/.info-other, .title-spleft, .giaban-left, .xemdanhmuc-right li a,.giatt-right, .text-tinright, .text-tinleft {font-size: 14px!important;}
        /*size15*/.giaban-headersp, .giaban-right,  .title-listspright  {font-size: 15px!important;}
    /*END css chung*/    

    /*header - avatar sanphamct */
    .title-headersp {font-size: 23px!important;}
    .title-bangheadersp {font-size: 16px!important;}   
    .giaban-headersp b {font-size: 20px;}
    /*header - avatar sanphamct end */

    /*css hiển thị danhmuc */
    /*css hiển thị danhmuc end*/

    /*hiển thị sanpham left */
    /*hiển thị sanpham left end*/

    /*hiển thị sanpham right */
    .title-spright {padding: 8px 0px 5px 5px;margin: 6px 0px;}
    .giatt-right, .giaban-right {padding: 0px;}
    .text-spright {padding: 5px;}
    /*hiển thị sanpham right end*/
    
    /*hiển thị tin tức left */
    .tinleft-img { max-height: 230px;}
    .info-other-tinleft span {padding: 2px 5px;font-size: 12px!important;}
    /*hiển thị tin tức left end*/

    /*hiển thị tin tức right */
    .title-listtinright {font-size: 18px!important;border-top: 4px solid #0072ff;}
    /*hiển thị tin tức right end*/ 
    
}/*end media 1199*/

@media (max-width: 991px)
{/*start media max 991*/

    /*css hiển thị danhmuc */
    .xemdanhmuc-right li a {font-size: 14px!important;}
    /*css hiển thị danhmuc end*/

}/*end max 991*/


@media (min-width: 768px) and (max-width: 991px)
{/*start media 991*/

    /*css chung*/
        /*size12*/.title-listspright, .title-tinleft, .title-tinright, .info-other-tinleft span {font-size: 12px!important;}
        /*size13*/.title-spright, .text-tinleft,.text-tinright  {font-size: 13px!important;}
    /*END css chung*/

    /*header - avatar sanphamct */
    .title-headersp { font-size: 18px!important;}
    /*header - avatar sanphamct end */
    /*hiển thị sanpham left */

    /*hiển thị sanpham left end*/

    /*hiển thị sanpham right */
    .title-listspright {padding: 2px 0px 0px 4px;margin: 0px 0px 10px 0px;}
    .title-spright {text-transform: capitalize;}
    .text-spright { padding: 6px; font-size: 11px !important; }

    /*hiển thị sanpham right end*/
    
    /*hiển thị tin tức left */
    .tinleft-img {max-height: 180px;}
    .tinleft-img img {border-radius: 10px;width: 100%;}
    /*hiển thị tin tức left end*/
    
    /*hiển thị tin tức right */
    .title-listtinright {font-size: 16px;margin: 30px 0px 20px 0px;}
    .title-tinleft a {height: 30px!important;}
    .info-other-tinleft span {padding: 1px 6px;margin: 1px auto;}
    /*hiển thị tin tức right end*/ 
}/*end media 991*/



@media (max-width: 767px), (min-width: 768px) and (max-width: 991px)
{/*start media max-width: 767px and max 991*/

    /*css chung*/
    .giatt-headersp, .info-other {font-size: 13px!important;}
    .giaban-headersp, .title-bangheadersp{font-size: 14px!important;}
    /*END css chung*/

    /*header - avatar sanphamct */
    .boxgia-headersp b, .title-headersp {font-size: 18px!important;}
    .info-other {padding: 5px;margin: 5px 0px; }
    .box-avatar {width: 100%;padding-right: 0;padding-bottom: 20px;}
    
    /*header - avatar sanphamct end */

    /*hiển thị sanpham left */


    /*hiển thị sanpham left end*/

    /*hiển thị sanpham right */

    .giaban-right {font-size: 16px!important;padding: 0px;}
    .giatt-right {font-size: 12px!important;padding: 3px 0px;}

    /*hiển thị sanpham right end*/
    
    /*hiển thị tin tức left */
    .title-tinleft a { border: none; font-size: 13px; }
    /*hiển thị tin tức left end*/
    
    /*hiển thị tin tức right */

    .title-tinright {margin: 5px 0px;padding: 0px 0px 5px 0px;}
    .text-tinright {text-align: justify;}
    
    /*hiển thị tin tức right end*/ 

}/* end start media max-width: 767px and max 991*/

@media (max-width: 767px)
{/*start media 767*/

    /*css chung*/
        /*size13*/.title-spright, .title-tinright  {font-size: 13px!important;}
        /*size15*/.title-bangspq12, .text-tinright {font-size: 15px!important;}
        .boxgia-headersp b {font-size: 16px;}
        .title-tinleft a, .tinleft-img img{height: fit-content;}
    /*END css chung*/

    .col20,.col30,.col40,.col50,.col60,.col70,.col80,.col90{ width: 100%;}
    .col25{width: 48.5%;}
    /*header - avatar sanphamct */
    .box-avatar{width: 100%;}
    .giatt-headersp{font-size: 12px!important;}
    .info-other ul { display: flex ;}
    .info-other ul li, .info-other ul li b {font-size: 13px;}
    .boxgia-headersp {  margin: 8px 0px 0px 0px;}
    .title-headertin h1 {font-size: 20px;}
    /*header - avatar sanphamct end */
    /*hiển thị sanpham left */

    /*hiển thị sanpham left end*/
    /*hiển thị sanpham right */
    .list-spright {margin: 0px;}
    .title-listspright {font-size: 22px;padding: 4px 0px 2px 4px;margin: 50px 0px;}
    .title-spright {margin: 0px;padding: 10px 0px 8px 0px;text-align: center;}
    .spright-img img {margin: auto;display: block;padding: 10px;}
    .text-spright {padding: 8px;font-size: 14px!important;}
    /*hiển thị sanpham right end*/
    
    /*hiển thị tin tức left */
    .title-tinleft {text-align: center;font-size: 18px!important;}
    .title-tinleft a {border: none;}
    .tinleft-img img {width: 100%; padding: 10px;}
    
    /*hiển thị tin tức left end*/
    
    /*hiển thị tin tức right */
    .title-listtinright {font-size: 24px!important;margin: 50px;}
    
    /*hiển thị tin tức right end*/ 
}/*end media 767*/
@media  (max-width: 575px)
{
    .info-other ul {padding-left: 5px;flex-direction: column;}
}
@media  (max-width: 480px)
{/*start media 480*/

    .col35 { width: 100%;  }
    /*header - avatar sanphamct */
    .info-other ul li:nth-child(1)::after {content: unset; padding: 0;}
    .boxgia-headersp span {padding: 3px 5px;}
    .title-headersp {font-size: 16px !important;}
    .title-headertin h1 {font-size: 18px;}
    /*header - avatar sanphamct end */

    /*hiển thị sanpham left */
    .title-listspleft {font-size: 22px!important;margin: 39px 0px;}
    /*hiển thị sanpham left end*/

    /*hiển thị sanpham right */
    .title-listspright {font-size: 19px!important;}
    /*hiển thị sanpham right end*/
    
    /*hiển thị tin tức left */
    /*hiển thị tin tức left end*/
    
    /*hiển thị tin tức right */
    .title-listtinright {font-size: 18px !important;margin: 10px;}
    /*hiển thị tin tức right end*/ 

}/*end media 480*/

/* Responsive end */