@charset "UTF-8";





@font-face {

    font-family: 'NunitoRegular';

    src: url('../fonts/NunitoRegular.eot');

    src: url('../fonts/NunitoRegular.eot') format('embedded-opentype'), url('../fonts/NunitoRegular.woff2') format('woff2'), url('../fonts/NunitoRegular.woff') format('woff'), url('../fonts/NunitoRegular.ttf') format('truetype'), url('../fonts/NunitoRegular.svg#NunitoRegular') format('svg');

}



@font-face {

    font-family: 'NunitoBold';

    src: url('../fonts/NunitoBold.eot');

    src: url('../fonts/NunitoBold.eot') format('embedded-opentype'), url('../fonts/NunitoBold.woff2') format('woff2'), url('../fonts/NunitoBold.woff') format('woff'), url('../fonts/NunitoBold.ttf') format('truetype'), url('../fonts/NunitoBold.svg#NunitoBold') format('svg');

}



@font-face {

    font-family: 'SFUBodoniBoldCondensed';

    src: url('../fonts/SFUBodoniBoldCondensed.eot');

    src: url('../fonts/SFUBodoniBoldCondensed.eot') format('embedded-opentype'), url('../fonts/SFUBodoniBoldCondensed.woff2') format('woff2'), url('../fonts/SFUBodoniBoldCondensed.woff') format('woff'), url('../fonts/SFUBodoniBoldCondensed.ttf') format('truetype'), url('../fonts/SFUBodoniBoldCondensed.svg#SFUBodoniBoldCondensed') format('svg');

}







/* Main */

:root {

    --color-red: #f00;

    --color-medium-red: #cc2c32;

    --color-dark-red: #c31829;

    --color-green: #28a745;

    --color-dark-green: #207d36;

    --color-black: #212529;

    --color-gray: #6c757d;

}



body {

    font-size: 14px;

    font-family: 'Roboto', sans-serif;

    overflow-x: hidden !important
}



img {

    max-width: 100%;

    height: auto;

    vertical-align: top;

}



a,

input,

textarea {

    outline: none;

    padding: 0px;

}

a:hover {
    text-decoration: none;
}

p {

    margin: 0;

}



input[type=number]::-webkit-outer-spin-button,

input[type=number]::-webkit-inner-spin-button {

    -webkit-appearance: none;

    margin: 0;

}



.slick * {

    outline: none;

}



.w-clear:after {

    display: block;

    content: "";

    clear: both;

}



.hidden {

    display: none;

}



.clear {

    clear: both;

}



.none {

    display: none;

}



.hidden-seoh {

    visibility: hidden;

    height: 0px;

    margin: 0px;

    overflow: hidden;

}



.wrap-main,

.wrap-content {

    max-width: 1200px;

    margin: auto;

}



.wrap-home {

    max-width: 100%;

    padding: 0px;

}



.wrap-content {

    margin: auto;

    align-items: center;

}



.alert {

    width: 100%
}



.in-page .breadCrumbs {

    margin-bottom: 15px;

}



.in-page .logo-header a {

    width: 70%;

    height: 122px;

    transition: all 0.6s;

}



.in-page .logo-header a img {

    max-width: 80%;

    transition: all 0.6s
}



.in-page .footer {

    margin-top: 25px;

}



/* Lazyload */

img.lazy {

    opacity: 0;

}



img:not(.initial) {

    transition: opacity 1s;

}



img.initial,

img.loaded,

img.error {

    opacity: 1;

}



img:not([src]) {

    visibility: hidden;

}



.top {

    background-color: #fff;

}



/* General */

.title-main {

    margin-bottom: 1.5rem;

    text-align: center;

    margin-bottom: 21px;

    position: relative;

}



.title-main span {

    padding-bottom: 15px;

    text-transform: capitalize;

    color: #324b86;

    font-size: 35px;

    font-family: 'Arial';

    text-transform: uppercase;

    font-weight: bold;

}



.title-main:after {

    content: '';

    position: absolute;

    left: calc((100% - 70px)/2);

    width: 70px;

    height: 2px;

    background: #000;

    bottom: 0px;

    display: none;

}



.title-main-index {

    margin-bottom: 8px;

    text-align: center;

    width: 100%;

}



.title-main-index span {

    text-transform: capitalize;

    color: #006BC9;

    font-size: 46px;

    font-family: 'UTMAlpineKT';

}



.title-main-index p {

    color: #737373;

    font-size: 15px;

    font-family: 'NunitoRegular';

    margin-bottom: 0;

    display: inline-block;

    margin: auto;

    background: url('../images/web/bgtieude.png')no-repeat bottom center;

    padding-left: 21px;

    padding-bottom: 30px;

}



.title-main-index h3 {

    text-transform: capitalize;

    color: #009343;

    font-size: 24px;

    font-family: 'Arial';

    text-transform: uppercase;

    text-align: center;

    font-weight: bold;

}



.time-main {

    margin-bottom: 0.75rem;

    color: #999999;

}



.time-main i {

    vertical-align: top;

    margin: 3px 7px 0px 0px;

}



.time-main span {

    vertical-align: top;

    display: inline-block;

}



.social {

    list-style: none;

    padding: 0px;

    margin: 0px;

}



.social li {

    display: inline-block;

    vertical-align: top;

}



.social li:last-child {

    margin-right: 0px;

}



.social1 {

    list-style: none;

    padding: 0px;

    margin: 0px;

}



.social1 li {

    display: inline-block;

    vertical-align: top;

    margin-right: 9px;

}



.social1 li:last-child {

    margin-right: 0px;

}



.control-carousel {

    position: absolute;

    top: calc(50% - 30px/2);

    margin-bottom: 0px;

    width: 30px;

    height: 30px;

    text-align: center;

    line-height: 30px;

    border: 1px solid #eee;

    z-index: 2;

    background-color: #fff;

    color: #ccc;

    cursor: pointer;

}



.control-carousel:hover {

    background-color: var(--color-red);

    border-color: var(--color-red);

    color: #fff;

}



.prev-carousel {

    left: 0px;

}



.next-carousel {

    right: 0px;

}









/* Menu */

.menu {

    transition: all 0.6s;

    background: #324b86;

    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;

}



.menu-fixed-scroll {

    position: relative;

    top: 0;

    z-index: 3;

}



.menu ul {

    list-style: none
}



.menu.sticky {

    position: fixed;

    top: 0px;

    left: 0px;

    width: 100%;

    z-index: 9000;

}



#menu-box {

    width: 100%;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: flex-start;

}



.list-btn {

    display: inline-block;

    width: 285px;

    position: relative;

    background: #FF0000;

    padding-left: 10px;

}



.list-btn h5 {

    text-transform: uppercase;

    color: #FFF;

    font-size: 19px;

    font-weight: 700;

    line-height: 50px;

    text-align: left;

    padding-left: 50px;

    position: relative;

    cursor: pointer;

    margin-bottom: 0rem;

}



.list-btn h5 span {

    position: absolute;

    display: inline-block;

    width: 24px;

    height: 4px;

    background: #FFF;

    left: 10px;

    top: calc(50% - 2px);

    content: '';

}



.list-btn h5 span:after {

    position: absolute;

    display: inline-block;

    width: 24px;

    height: 4px;

    background: #FFF;

    right: 0px;

    top: -8px;

    content: '';

}



.list-btn h5 span:before {

    position: absolute;

    display: inline-block;

    width: 24px;

    height: 4px;

    background: #FFF;

    right: 0px;

    bottom: -8px;

    content: '';

}



.list-btn h5 b {

    border: 1px solid #fff;

    border-radius: 50%;

    width: 30px;

    height: 30px;

    display: flex;

    align-items: center;

    justify-content: center;

    position: absolute;

    left: 10px;

    top: calc(25% - 2px);

    visibility: hidden;

    opacity: 0;

    transition: all 0.6s;

}



.list-btn h5.active b {

    opacity: 1;

    transition: all 0.6s;

    visibility: inherit;

}



.list-btn h5.active span {

    opacity: 0;

    visibility: hidden;

}



.list-btn-position {

    list-style: none;

    position: relative;

    top: 130%;

    width: 100%;

    left: 0px;

    z-index: 5;

    opacity: 0;

    transition: all 0.6s;

    background: #FFF;

    visibility: hidden;

    padding-inline-start: 0px;

    border-top: 0px solid #FF0000;

}



.list-btn-position.show {

    top: 100%;

    opacity: 1;

    visibility: visible;

}



.list-btn-position li {

    padding: 12px 10px;

    position: relative;

    text-align: left;

    /* border-bottom: 1px solid #ccc; */

    padding-inline-start: 0px;

    padding-left: 10px;

    box-sizing: border-box;

}



.list-btn-position li:hover {

    background: #009343;

}



.back-list:hover {

    background: #f00 url('../images/web/icon_left_dm.png')no-repeat 15px 15px !important;

}



.back-list>a {

    padding-left: 30px;

}



.list-btn-position li:hover>a,

.list-btn-position li:hover>span {

    color: #FFF;

}



.list-btn-position li span {

    position: absolute;

    right: 0px;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 38px;

    height: 38px;

    top: 8px;

    z-index: 9;

    cursor: pointer;

}



.list-btn-position li a {

    color: #333;

    display: block;

    font-size: 15px;

    text-decoration: none;

    text-transform: uppercase;

}



.list-btn-position li:hover>ul {

    transform: translateX(100%);

    z-index: 2;

    opacity: 1;

    visibility: visible;

    padding-inline-start: 0px;

}



.list-btn-position ul {

    position: absolute;

    width: 100%;

    background: #FFF;

    left: 0px;

    top: 0px;

    transform: translateX(80%);

    z-index: -1;

    opacity: 0;

    visibility: hidden;

    transition: all 0.2s;

    list-style: none;

}



.menu-list {

    width: 41%;

}



.cart-temp {

    display: flex;

    flex-wrap: wrap;

    justify-content: flex-start;

    align-items: center;

    margin-left: 20px;

    cursor: pointer;

}



.cart-temp>span {

    display: inline-block;

    width: 40px;

    height: 40px;

    line-height: 40px;

    text-align: center;

    background: #ff5151;

    color: #FFF;

    margin-right: 10px;

    border-radius: 3px;

}



.cart-temp>div>p:nth-child(1) {

    font-weight: 700;

}



.search-bar {

    width: 70%;

    height: 50px;

    border: none;

    background-color: rgb(0 0 0 / .8);

    transition: all 0.6s;

    z-index: 12;

    border: none;

    position: absolute;

    border-radius: 0px;

    overflow: hidden;

    display: block;

    top: 130%;

    opacity: 0;

    transition: all 0.6s;

    visibility: hidden;

    right: 0;

}



.search-bar.open {

    top: 100%;

    opacity: 1;

    visibility: visible;

}



.search-bar input.search-text {

    background-color: transparent;

    border: none;

    height: 50px;

    width: 100%;

    font-size: 14px;

    padding: 5px 10px 5px 10px;

    outline: none;

    position: relative;

    z-index: 2;

    color: #FFF;

}



.search-bar .search-btn {

    width: 50px;

    height: 50px;

    border: none;

    background-color: transparent;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #fff;

    position: absolute;

    top: 0px;

    right: 0px;

    cursor: pointer;

    z-index: 2;

}



/* Search */

.search {

    width: 60%;

    background: none;

    display: flex;

    border-radius: 22px;

    position: relative;

    transition: all 0.6s;

    border: 1px solid #000000;

    background-color: transparent;

    margin: 0px auto;

}



.search p {

    position: absolute;

    width: 86px;

    height: 100%;

    line-height: 40px;

    cursor: pointer;

    text-align: center;

    color: #ffffffb5;

    font-size: 18px;

    background: #324b86;

    border-radius: 12px;

    /* margin-right: 3px; */

    right: -3px;

    height: 42px;

    top: -2px;

}



.search input {

    width: calc(100% - 35px);

    height: 38px;

    outline: none;

    padding: 0px;

    border: 0px;

    background: transparent;

    text-indent: 10px;

    font-size: 12px;

    color: #fff;

}



.search input::-webkit-input-placeholder {

    color: #000;

    font-size: 14px
}



.search input:-moz-placeholder {

    color: #ccc;

}



.search input::-moz-placeholder {

    color: #ccc;

}



.search input:-ms-input-placeholder {

    color: #ccc;

}



.search.active {

    visibility: visible;

    opacity: 1;

    transition: all 0.6s;

}



.icon-search1 {

    width: 35px;

    line-height: 12px;

    color: #fff;

    border-left: 1px solid #fff;

    display: inline-block;

    cursor: pointer
}



/* Menu RP */

.menu-res {

    display: none;

    height: 55px;

    z-index: 10;

    background: #DC1500;

    position: relative;

    line-height: normal;

    position: sticky;

    z-index: 9999;

    overflow: hidden;

    top: 0;

}



.menu-bar-res {

    height: 55px;

    padding: 0px 10px;

    display: -webkit-flex;

    display: -moz-flex;

    display: -ms-flex;

    display: -o-flex;

    display: flex;

    align-items: center;

    justify-content: space-between;

}



#hamburger {

    display: block;

    width: 45px;

    height: 23px;

    position: relative;

}



#hamburger:before,

#hamburger:after,

#hamburger span {

    background: #fff;

    content: '';

    display: block;

    width: 100%;

    height: 3px;

    position: absolute;

    left: 0px;

}



#hamburger:before {

    top: 0px;

}



#hamburger span {

    top: 10px;

}



#hamburger:after {

    top: 20px;

}



#hamburger:before,

#hamburger:after,

#hamburger span {

    -webkit-transition: none 0.5s ease 0.5s;

    transition: none 0.5s ease 0.5s;

    -webkit-transition-property: transform, top, bottom, left, opacity;

    transition-property: transform, top, bottom, left, opacity;

}



.mm-wrapper_opening #hamburger:before,

.mm-wrapper_opening #hamburger:after {

    top: 10px;

}



.mm-wrapper_opening #hamburger span {

    left: -50px;

    opacity: 0;

}



.mm-wrapper_opening #hamburger:before {

    transform: rotate(45deg);

}



.mm-wrapper_opening #hamburger:after {

    transform: rotate(-45deg);

}



.mm-menu_opened {

    display: block !important;

}



/* Search RP */

.search-res {

    position: relative;

    width: 80%;

}



.search-res .icon-search {

    width: 40px;

    height: 40px;

    cursor: pointer;

    text-align: center;

    line-height: 42px;

    color: #fff;

    font-size: 17px;

    margin: 0px;

}



.search-res .icon-search.active {

    color: var(--color-red);

    background: #fff;

    border-radius: 100%;

}



.search-res .search-grid {

    position: relative;

    top: 0px;

    right: 0px;

    width: 100%;

    height: 40px;

    overflow: hidden;

    background: #fff;

    border: 1px solid var(--color-red);

    z-index: 2;

    /* opacity:0; */

    /* border-radius:25px; */

    line-height: normal;

}



.search-res .search-grid p {

    width: 35px;

    height: 38px;

    cursor: pointer;

    outline: none;

    border: none;

    margin: 0px;

    font-size: 17px;

    display: block;

    color: var(--color-red);

    line-height: 40px;

    text-align: center;

}



.search-res .search-grid input {

    width: calc(100% - 35px);

    float: right;

    line-height: 38px;

    outline: none;

    border: none;

    color: var(--color-red);

}



.search-res .search-grid input::-webkit-input-placeholder {

    color: #ccc;

}



.search-res .search-grid input:-moz-placeholder {

    color: #ccc;

}



.search-res .search-grid input::-moz-placeholder {

    color: #ccc;

}



.search-res .search-grid input:-ms-input-placeholder {

    color: #ccc;

}



/* Slideshow */

.slideshow {

    position: relative;

}



.content-show-slider {

    width: 100%;

    display: flex;

    justify-content: flex-end;

}



.content-show-slider>div {

    width: 75.833333333%;

    position: relative;

    padding-top: 5px;

}



.slideshow a {

    display: block;

    cursor: pointer;

}



.slideshow a img {

    width: 100%;

}



.slideshow:hover .control-slideshow {

    opacity: 0.3;

}



.slideshow .control-slideshow:hover {

    opacity: 0.8;

}



.control-slideshow {

    opacity: 0;

    position: absolute;

    z-index: 2;

    top: calc(50% - 50px/2);

    width: 35px;

    height: 50px;

    text-align: center;

    line-height: 50px;

    font-size: 25px;

    cursor: pointer;

    margin: 0px;

    background-color: #000000;

    border-radius: 3px;

}



.control-slideshow i {

    color: #ffffff;

}



.prev-slideshow {

    left: 20px;

    padding-right: 3px;

}



.next-slideshow {

    right: 20px;

    padding-left: 3px;

}









/* Partner */

.wrap-partner {

    padding: 50px 10px;

    background: #F4F4F4;

}



.wrap-partner .wrap-content {

    max-width: 1200px;

    padding: 0px;

    position: relative;

    border: 1px solid #ccc;

}



.owl-partner {

    padding: 0px 0px;

}



.partner {

    display: block;

}



.partner img {

    width: 100%;

}



.wrap-partner .title-main3 span {

    color: #333;

}



.wrap-partner .title-main3 {

    background: none;

    padding-bottom: 30px;

    margin-bottom: 20px;

}



.wrap-partner .title-main3 span:before {

    height: 2px;

    background: #FFBA00;

    top: calc(50% - 1px);

    opacity: 0;

}



.wrap-partner .title-main3 span:after {

    height: 2px;

    background: #FFBA00;

    top: calc(50% - 1px);

    opacity: 0;

}



.wrap-partner .title-main3 p {

    margin-top: 18px;

    font-family: 'Roboto';

    font-size: 16px;

}



/* Breadcrumb */

.breadCrumbs {

    text-align: center;

    width: fit-content;

    margin: auto;

}



.breadCrumbs .wrap-content {

    padding: 0.75rem 10px;

    max-width: 1200px;

}



.breadCrumbs .wrap-content .breadcrumb {

    padding: 0;

    margin-bottom: 0;

    background-color: transparent;

    border-radius: 0;

}



.breadCrumbs .wrap-content .breadcrumb-item a {

    color: #ffffff;

}



.breadCrumbs .wrap-content .breadcrumb-item.active a {

    color: #ffffff;

}



/* Intro */

.wrap-custom-news {

    background: #f2f2f2;

    padding: 25px 0;

}



.wrap-news {

    padding: 30px 10px;

}



.wrap-intro {

    margin-bottom: 50px;

}



.left-intro {

    width: 48.75%;

}



.right-intro {

    width: 48.75%;

}



.title-intro {

    margin-bottom: 1.5rem;

}



.title-intro span {

    display: block;

    position: relative;

    font-size: 20px;

    color: #69A21F;

    font-size: 30px;

    font-family: 'UVFAphroditePro';

    line-height: 59px;

    width: 100%;

}



.title-intro span:after {

    content: "";

    position: absolute;

    width: 100%;

    height: 1px;

    bottom: 0px;

    left: 0px;

    border-bottom: 1px dashed #ccc;

}



.title-intro span:before {

    content: "";

    position: absolute;

    width: 92px;

    height: 4px;

    bottom: -2px;

    left: 0;

    z-index: 1;

    background: url('../images/web/bgafter_news.png')no-repeat top center;

}



.newshome-best {

    width: 43%;

    display: block;

    margin-right: 1.5%;

}



.pic-newshome-best img {

    width: 100%;

}



.name-newshome {

    color: var(--color-black);

    font-size: 14px;

    line-height: 18px;

    margin-bottom: 0.25rem;

}



.name-newshome.text-split {

    -webkit-line-clamp: 1;

    font-size: 15px;

    text-transform: uppercase;

    font-weight: 700;

}



.name-newshome.text-split a {

    text-decoration: none;

    color: #000
}



.name-newshome.text-split:hover a {

    color: #f00
}



.time-newshome {

    color: var(--color-gray);

    margin-bottom: 0.25rem;

    font-size: 14px;

    font-style: italic;

    font-family: 'Roboto';

}



.desc-newshome {

    color: var(--color-black);

    margin-bottom: 0px;

}



.view-newshome {

    display: inline-block;

    border: 1px solid var(--color-black);

    padding: 8px 15px;

    color: var(--color-black);

    text-transform: capitalize;

    font-weight: 600;

    margin-top: 1rem;

}



.view-newshome:hover {

    background-color: var(--color-black);

    color: #fff;

}



.newshome-scroll {

    width: calc(100%);

    height: 450px;

    overflow: hidden;

}



.newshome-scroll ul li {

    margin-bottom: 15px !important;

    border-bottom: 1px dashed #ccc;

    padding-bottom: 10px;

}



.newshome-scroll ul li .comment-count {

    color: #f00;

    font-family: 'Roboto';

    font-weight: 500;

    font-style: italic;

}



.newshome-normal {

    display: flex;

    width: 100%;

    justify-content: space-between;

}



.newshome-intro {

    display: flex;

    justify-content: space-between;

    width: 100%;

}



.pic-newshome-normal {

    width: 35%;

    margin-bottom: 0px;

}



.custom-opinion .newshome-normal {

    align-items: center;

    margin-bottom: 10px;

}



.custom-opinion .pic-newshome-normal {

    width: 110px;

    margin-bottom: 0px;

    height: 110px;

    border-radius: 50%
}



.custom-opinion .pic-newshome-normal img {

    border-radius: 50%
}



.custom-opinion .desc-newshome {

    margin-bottom: 10px;

    font-size: 14px;

    background: url('../images/web/after_cus.png')no-repeat top left;

    padding-top: 25px;

    box-sizing: border-box;

    line-height: 25px;

    margin-bottom: 13px;

}



.custom-opinion .info-newshome-normal {

    width: calc(100% - 125px);

}



.custom-opinion .name-newshome.text-split a {

    color: #f00
}



.custom-opinion .name-newshome.text-split:hover a {

    color: #333
}



.custom-opinion .newshome-scroll ul li {

    margin-bottom: 20px !important
}



.pic-newshome-normal img {

    width: 100%;

}



.info-newshome-normal {

    width: calc(100% - 41%);

}



.video-main {

    position: relative;

    height: 385px;

}



.video-main iframe {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0px;

    left: 0px;

}



.listvideos {

    width: 100%;

    height: 45px;

    padding: 0px 10px;

    border: 1px solid #ccc;

    color: var(--color-black);

    margin-top: 10px;

    cursor: pointer;

    outline: none;

}



.content-news-index-list .post-content {

    background: none !important;

    padding-top: 0 !important;

}



.content-news-index-list .post-content .meta-content {

    font-family: 'Roboto';

    display: -webkit-box;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;

    overflow: hidden;

}



.content-news-index {

    display: flex;

    justify-content: space-between;

    flex-wrap: wrap;

    width: 100%;

}



.content-news-index-one p {

    margin-bottom: 0
}



.date-post {

    font-size: 14px;

    margin-bottom: 0px;

    color: #000;

}



.date-post span {

    display: inline-block;

    margin-bottom: 11px;

    color: #999;

    font-size: 14px;

}



.date-post a {

    text-decoration: none;

    color: #DB0000
}



.date-post:hover a {

    color: #333
}



.content-news-index-one {

    width: 100%;

    display: flex;

    justify-content: space-between;

    margin-bottom: 20px;

}



.content-news-index-one h3.nowrap {

    display: -webkit-box;

    -webkit-line-clamp: 1;

    -webkit-box-orient: vertical;

    overflow: hidden;

    text-overflow: ellipsis;

}



.content-news-index-one h3 {

    border-bottom: 0px;

    padding-bottom: 0px;

    line-height: 18px;

    font-size: 20px;

    font-family: 'SVNProductSansRegular';

    margin-bottom: 13px;

    font-weight: normal;

    color: #333;

}



.content-news-index-one h3 a {

    font-size: 20px;

    color: #333;

    line-height: 25px;

    text-decoration: none;

}



.content-news-index-one h3:hover a {

    color: #f00;

}



.content-news-index-one .meta-content {

    display: -webkit-box;

    -webkit-line-clamp: 5;

    -webkit-box-orient: vertical;

    overflow: hidden;

    font-size: 14px;

    line-height: 25px;

    font-family: 'MuliRegular';

}



.content-news-index-one p img {

    transform: scale(1);

    transition: all 0.6s
}



.content-news-index-one div:nth-child(2) {

    width: calc(100% - 385px);

}



.content-news-index-list {

    width: calc(100% + 16px);

    margin: 0 -8px;

}



.content-news-index-list .post-inner {

    margin-bottom: 12px;

    padding: 0 8px;

}



.news-index .post-content {

    width: 100%;

    margin-top: 5px;

}



.content-news-index-list .post-inner h3.nowrap {

    display: -webkit-box;

    -webkit-line-clamp: 1;

    -webkit-box-orient: vertical;

    overflow: hidden;

    text-overflow: ellipsis;

}



.content-news-index-list .post-inner h3 {

    margin-bottom: 3px;

    border-bottom: 0px;

    padding-bottom: 0px;

    line-height: 25px;

    font-size: 16px;

    font-family: 'SVNProductSansRegular';

    margin-top: 10px;

}



.content-news-index-list .post-inner h3 a {

    font-size: 16px;

    color: #333;

    line-height: 25px;

    text-decoration: none;

}



.content-news-index-list .post-inner:hover h3 a {

    color: #f00;

}



/* About*/

.content-about-index {

    position: relative;

    display: flex;

    justify-content: space-between;

    max-width: 820px;

    margin: auto;

    padding: 55px 0;

}



.content-about-index-left {

    width: 100%;

    /* padding: 0px 0; */

}



.content-about-index-left .title-main-index {

    text-align: left
}



.content-about-index-left .title-main-index>p:nth-child(1) {

    margin-left: -30px;

    padding-left: 30px;

}



.content-about-index-left h4 {

    font-size: 17px;

    text-transform: uppercase;

    font-weight: normal;

    margin-top: -15px;

    margin-bottom: 50px;

    color: #999;

}



.descs-about-index {

    font-size: 14px;

    color: #333;

    font-family: 'Arial';

    text-align: center;

}



.title-main3 {

    margin-bottom: 1.5rem;

    text-align: center;

    margin-bottom: 25px;

    position: relative;

    background: url(../images/web/bgtieude_index.png)no-repeat bottom center;

    padding-bottom: 20px;

}



.title-main3 span {

    color: #DC1500;

    font-size: 30px;

    text-align: center;

    position: relative;

    font-family: 'UTMHelvetIns';

    text-transform: uppercase;

}



.title-main3 p {

    font-size: 16px;

    font-family: 'Roboto';

    color: #333;

    text-align: center;

    margin-bottom: 0;

    margin-top: 10px;

}



.form-newsletter {

    width: 100%;

    box-sizing: border-box;

    position: relative;

}



.form-newsletter>div {

    width: 100%;

    position: relative;

    z-index: 2;

}



.form-newsletter>div>h2 {

    color: #FFF600;

    font-size: 30px;

    font-family: 'SVNALoveOfThunder';

    text-align: center;

}



.form-newsletter>div>p {

    color: #fff;

    font-size: 14px;

    text-align: center;

    line-height: 25px;

    margin-bottom: 10px;

}



.about-desc {

    font-size: 14px;

    line-height: 25px;

    text-align: justify;

    text-align-last: left;

    font-family: 'Roboto';

}



.about-desc h3 {

    font-size: 25px;

    font-family: 'UTMHelvetIns';

    color: #333333;

    position: relative;

    border-bottom: 3px solid #E6E6E6;

    padding-bottom: 10px;

}



.about-desc h3:after {

    content: '';

    position: absolute;

    left: 0;

    width: 90px;

    height: 3px;

    background: #DC1500;

    bottom: -3px;

}



.about-desc>div {

    display: -webkit-box;

    -webkit-line-clamp: 6;

    -webkit-box-orient: vertical;

    overflow: hidden;

}



.view-more-about {

    margin-top: 45px;

    text-align: left;

}



.view-more-about a {

    text-decoration: none;

    color: #fff;

    background: none;

    padding: 9px 24.5px;

    font-size: 14px;

    font-family: 'Roboto';

    background: #DC1500;

    display: inline-block;

    font-weight: 500;

    margin-top: 15px;

}



.view-more-about:hover a {}



.content-input-index {

    overflow: hidden;

}



.form-newsletter>div span {

    position: absolute;

    background: #E6E6E6;

    display: inline-block;

    height: 38px;

    width: 50px;

    z-index: 1;

    line-height: 38px;

    text-align: center;

    color: #333;

    border-top-left-radius: 5px;

    border-bottom-left-radius: 5px;

}



.content-input-index .newsletter-input {

    width: 100%;

    margin-bottom: 10px;

}



/* Video */

.video {

    width: 23.5%;

    margin: 0 2% 2% 0;

    text-align: center;

    cursor: pointer;

}



.video:nth-child(4n+1) {

    clear: both;

}



.video:nth-child(4n) {

    margin-right: 0px;

}



.pic-video {

    position: relative;

}



.pic-video:before {

    content: "";

    position: absolute;

    width: 50px;

    height: 35px;

    top: calc(50% - 50px/2);

    left: calc(50% - 35px/2);

    z-index: 1;

    background-repeat: no-repeat;

    background-image: url(../images/play.png);

}



.pic-video img {

    width: 100%;

}



.name-video {

    font-size: 16px;

    color: var(--color-black);

    margin-bottom: 0px;

}



/* Album */

.album-index {

    background: url('../images/web/bgabout.jpg')repeat top center;

    padding: 50px 0;

    margin-bottom: 35px;

}



.album {

    width: calc(100% / 4);

    cursor: pointer;

    padding: 0 10px;

    box-sizing: border-box;

    margin-bottom: 20px;

}



.pic-album {

    position: relative;

}



.pic-album img {

    width: 100%;

}



.name-album {

    font-size: 16px;

    color: var(--color-black);

    margin-bottom: 0px;

}



/* Brand */

.wrap-brand {

    margin-bottom: 50px;

    padding: 0px 10px;

}



.wrap-brand .wrap-content {

    max-width: 1200px;

    padding: 0px;

    position: relative;

}



.owl-brand {

    padding: 0px 40px;

}



.brand {

    display: block;

    border: 1px solid #eee;

}



.brand img {

    width: 100%;

}



/*Poduct index*/

.wrap-show-product {

    background: #fff;

    padding: 50px 0;

}



.wrap-show-product:nth-child(even) {

    background: #F8F8F8;

}



.title-main2 {

    margin-bottom: 1.5rem;

    text-align: left;

    position: relative;

    margin-bottom: 30px;

    flex-wrap: wrap;

}



.title-main2>span {

    color: #fff;

    font-size: 16px;

    font-family: 'Roboto';

    text-align: center;

    position: relative;

    z-index: 1;

    text-transform: uppercase;

    background: #225486;

    display: inline-block;

    /* padding-left: 100px; */

    /* padding-right: 35px; */

    line-height: 40px;

    font-weight: bold;

    padding: 0 20px;

}



.title-main2 a {

    text-decoration: none;

    font-size: 14px;

    color: #f00;

    line-height: 30px;

    display: flex;

    align-items: center;

    display: inline-block;

    position: relative;

    z-index: 1;

    background: #fff;

    padding-left: 10px;

    text-transform: uppercase;

    font-family: 'Roboto';

}



.title-main2 a i {

    font-size: 25px;

    margin-left: 5px
}



.list-catalogy-cat {

    width: 100%;

    text-align: center;

    margin-bottom: 0px;

}



.list-catalogy-cat span {

    margin-right: 13px;

    display: inline-block;

    border: 1px solid #ccc;

    font-size: 16px;

    font-family: 'NunitoBold';

    padding: 6px 25px;

    cursor: pointer;

    text-transform: uppercase;

    color: #0342AC;

    margin-bottom: 12px;

    border-radius: 5px;

}



.list-catalogy-cat span:hover,

.list-catalogy-cat span.active {

    border: 1px solid #EA1D27;

    background: #EA1D27;

    color: #fff;

}



.wrap-productnb {

    background: url('../images/web/bgspnb.jpg')no-repeat top center;

    background-size: cover;

    width: 100%;

    padding: 60px 0;

    background-attachment: fixed;

    background-position: center;

    min-height: 715px;

    position: relative;

}



.wrap-productnb:after {

    content: '';

    background: url('../images/web/after_ponb_le.png')no-repeat top center;

    width: 283px;

    height: 224px;

    position: absolute;

    left: 0;

    bottom: -23%;

}



.wrap-productnb:before {

    content: '';

    background: url('../images/web/before_ponb_ri.png')no-repeat top center;

    width: 193px;

    height: 247px;

    position: absolute;

    right: 0;

    bottom: -22%;

}



.title-main1 {

    margin-bottom: 1.5rem;

    text-align: center;

    background: url('../images/web/bgtitle1.png')no-repeat bottom center;

    padding-bottom: 17px;

}



.title-main1 span {

    color: #fff;

    font-size: 30px;

    font-family: 'RobotoCondensedBold';

    text-align: center;

    position: relative;

    z-index: 1;

    text-transform: uppercase;

}



.title-main1 p {

    font-size: 33px;

    font-family: 'OpenSansBold';

    color: #FFE400;

    text-transform: uppercase;

    text-align: center;

    margin-top: -10px;

}



.slick-product-nb {

    width: calc(100% + 30px);

    margin: 0 -15px;

}



.itempro-slick {

    padding: 0 15px;

    box-sizing: border-box;

}



.itempro-slick .product {

    padding: 0;

    background: none;

    box-shadow: 0 0 0;

}



.itempro-slick .name-product a {

    color: #fff !important
}



.itempro-slick .name-product:hover a {

    color: #FFE400 !important
}



.itempro-slick .price-new {

    color: #fff
}



.itempro-slick .price-new b {

    color: #E5CD00
}



.fullmrzalo {

    width: 100% !important;

    margin: auto !important;

    padding-bottom: 20px;

}



.item-slick-product {

    padding: 0 15px;

}



.item-slick-product .box-product {

    width: calc(100%);

    padding: 0;

    margin-bottom: 55px;

}



.slick-product-index {

    width: calc(100% + 30px);

    margin: 0 -15px;

    /* margin-top: 0px; */

}



.show-data-product {

    margin-bottom: 35px;

}



.view-more-catalogy-list-index {

    width: 100%;

    text-align: center;

    margin-bottom: 0;

}



.view-more-catalogy-list-index a {

    border: 2px solid #0346B8;

    padding: 7px 50px;

    text-transform: uppercase;

    color: #222121;

    font-size: 16px;

    font-family: 'BeVietnamMedium';

    text-decoration: none;

    display: inline-block;

}



.view-more-catalogy-list-index:hover a {

    background: #0346B8;

    color: #fff
}



/* Product */

.wrap-product {}



.text-decoration-none {

    position: relative;

    /* margin-bottom: 30px; */

}



.content-main {

    display: flex;

    flex-wrap: wrap;

    width: 100%;
}



.grid-page {

    width: calc(100% + 20px);

    margin: 0 -10px;

    display: flex;

    justify-content: flex-start;

    flex-wrap: wrap;

}



.box-product {

    width: calc(100% / 4);

    padding: 0 10px;

    margin-bottom: 20px;

    box-sizing: border-box;

}





.box-product {

    position: relative;

    display: block;

    margin-bottom: 20px;

}



.pic-product {

    background: #fff;

    position: relative;

}



.pic-product img {

    width: 100%;

}



.name-product {

    font-size: 16px;

    color: #333;

    text-align: center;

    padding: 0 10px;

    box-sizing: border-box;

    font-weight: normal;

    font-family: 'Arial';

    margin-top: 20px;

}



.name-product a {

    text-decoration: none;

    color: #333;

}



.name-product:hover a {

    color: #f00;

}



.name-product.text-split {

    -webkit-line-clamp: 1;

}



.view-more-product {

    width: 100%;

    text-align: center;

    font-weight: 500;

    font-size: 15px;

}



.view-more-product a {

    color: #0033cc;

    text-transform: uppercase;

    text-decoration: underline;

}



.view-more-product:hover a {

    color: #f00
}



.price-product {

    margin-bottom: 0px;

    text-align: center;

    margin-block-start: 0em;

    margin-block-end: 0em;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 10px;

}



.price-new {

    font-size: 20px;

    color: #333;

    font-family: 'Roboto';

    text-align: center;

    margin: auto;

}



.price-new>span:last-child {

    font-family: 'BeVietnamRegular';

}



.price-new b {

    font-size: 16px;

    color: #EA1D27;

    margin-left: 5px;

    font-weight: bold;

}



.price-old {

    padding-left: 10px;

    font-size: 13px;

    color: #999;

    text-decoration: line-through;

    font-family: 'Roboto';

}



.price-per {

    position: absolute;

    top: 6px;

    right: -10px;

    color: #fff;

    background: #CE2020;

    font-size: 11px;

    width: 45px;

    height: 25px;

    text-align: center;

    line-height: 25px;

    /* overflow-x: hidden; */

}



.price-per:after {

    content: '';

    width: 0;

    height: 0;

    border-top: 10px solid #9C1919;

    border-right: 10px solid transparent;

    bottom: -6px;

    right: 0px;

    position: absolute;

    z-index: -1;

}



.price-hot {

    position: absolute;

    top: 5px;

    left: 5px;

    color: #fff;

    background: #c33;

    font-size: 11px;

    border-radius: 50%;

    width: 35px;

    height: 35px;

    text-align: center;

    line-height: 35px;

    /* border: 1px solid #D3CAAD; */

    font-family: 'Roboto';

    /* font-weight: bold; */

}



.none-per {

    left: 5px !important;

}



.cart-product {

    margin-bottom: 0px;

}



.cart-product span {

    cursor: pointer;

    width: 49%;

    color: #fff;

    text-transform: capitalize;

    text-align: center;

    padding: 7px 5px;

    border-radius: 3px;

}



.cart-add {

    margin-right: 2%;

    background-color: var(--color-red);

}



.cart-add:hover {

    background-color: var(--color-dark-red);

}



.cart-buy {

    background-color: var(--color-green);

}



.cart-buy:hover {

    background-color: var(--color-dark-green);

}



/* Product  Detail */

.tabs-pro-detail {

    width: 100%;

}



.grid-pro-detail {

    margin-bottom: 50px;

    display: flex;

    justify-content: space-between;

    flex-wrap: wrap;

}



.left-pro-detail {

    position: relative;

    width: 100%;

    text-align: center;

    margin-right: 2%;

    background: white;

}



.left-pro-detail .MagicZoom {

    border: 1px solid #eee;

    border-radius: 16px;

    overflow: hidden;
}



.right-pro-detail {

    width: 100%;

}



.gallery-thumb-pro {

    position: relative;

    margin-top: 10px;

}



.owl-thumb-pro {

    padding: 0px 40px;

}



.thumb-pro-detail {

    display: block !important;

    border: 1px solid #eee;

    padding: 5px;

    border-radius: 3px;

    cursor: pointer;

}



.thumb-pro-detail.mz-thumb.mz-thumb-selected {

    border-color: #cecfd2;

}



.thumb-pro-detail img {

    box-shadow: none !important;

    filter: brightness(100%) !important;

    border-bottom: 0px !important;

    padding-bottom: 0px !important;

}



.title-pro-detail {

    text-transform: capitalize;

    font-size: 20px;

    display: block;

    font-weight: 700;

}



.social-plugin-pro-detail {

    margin-bottom: 1rem;

    margin-top: 0px !important;

}



.desc-pro-detail {

    margin-bottom: 1rem;

}



.attr-pro-detail {

    list-style: none;

    padding: 0px;

}



.attr-pro-detail li {

    margin-bottom: 0.5rem;

}



.attr-label-pro-detail {

    margin: 0px 5px 0px 0px;

}



.attr-label-pro-detail.d-block {

    display: block;

    margin: 0px 0px 5px 0px;

}



.attr-content-pro-detail {

    display: inline-block;

    margin-bottom: 0px;

}



.price-new-pro-detail {

    font-weight: 700;

    font-size: 20px;

    color: var(--color-red);

}



.price-old-pro-detail {

    font-weight: 500;

    color: var(--color-gray);

    text-decoration: line-through;

    padding-left: 10px;

}



.color-pro-detail {

    display: inline-block;

    vertical-align: top;

    position: relative;

    width: 35px;

    height: 30px;

    margin: 0px 0px 3px 0px;

    border: 1px solid transparent;

}



.size-pro-detail {

    border: 1px solid #ccc;

    padding: 3px 10px 4px 10px;

    display: inline-block;

    position: relative;

}



.size-pro-detail.active,

.color-pro-detail.active {

    border-color: #e5101d;

    color: #e5101d;

}



.color-pro-detail.active:before,

.size-pro-detail.active:before {

    content: '';

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0px;

    left: 0px;

    bottom: 0px;

    right: 0px;

    margin: auto;

    z-index: 1;

    background-image: url(../images/check-cart.png);

    background-repeat: no-repeat;

    background-position: bottom right;

}



.color-pro-detail input[type=radio],

.size-pro-detail input[type=radio] {

    outline: none;

    position: absolute;

    cursor: pointer;

    width: 100%;

    height: 100%;

    -webkit-appearance: none;

    border: 0px;

    top: 0px;

    left: 0px;

}



.quantity-pro-detail {

    width: 100%;

    max-width: 110px;

    line-height: normal;

    display: flex;

    align-items: center;

    justify-content: space-between;

    text-align: center;

}



.quantity-pro-detail span {

    line-height: 25px;

    padding: 0px;

    width: 30px;

    height: 30px;

    color: #5f5f5f;

    cursor: pointer;

    font-size: 22px;

    border: 1px solid #cccccc;

}



.quantity-pro-detail span.quantity-plus-pro-detail {

    border-left: 0px;

}



.quantity-pro-detail span.quantity-minus-pro-detail {

    border-right: 0px;

}



.quantity-pro-detail input {

    height: 30px;

    border: 1px solid #cccccc;

    width: calc(100% - 60px);

    text-align: center;

    font-size: 14px;

    padding: 5px;

}



.cart-pro-detail {

    margin-bottom: 1rem;

    display: flex;

    align-items: stretch;

    justify-content: flex-start;

}



.cart-pro-detail a {

    width: auto;

    text-align: center;

    color: #fff;

    padding: 8px 15px;

    text-transform: uppercase;

    border-radius: 3px;

    cursor: pointer;

}



.cart-pro-detail a.addnow {

    margin-right: 10px;

    background: #fd6e1d;

    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fd6e1d), to(#f59000));

    background: -webkit-linear-gradient(top, #f59000, #fd6e1d);

    background: -moz-linear-gradient(top, #f59000, #fd6e1d);

    background: -ms-linear-gradient(top, #f59000, #fd6e1d);

    background: -o-linear-gradient(top, #f59000, #fd6e1d);

}



.cart-pro-detail a.buynow {

    background-color: var(--color-green);

}



.cart-pro-detail a.buynow:hover {

    background-color: var(--color-dark-green);

}



.cart-pro-detail a i {

    vertical-align: top;

    margin-top: 3px;

    margin-right: 8px;

}



.tags-pro-detail {

    margin: 1rem 0px 2rem 0px;

    display: flex;

    justify-content: flex-start;

    flex-wrap: wrap;

}



.tags-pro-detail a {

    font-size: 12px;

    color: #fff;

    padding: 5px 10px 7px 10px;

    margin-right: 5px;

    margin-bottom: 5px;

    background-color: var(--color-red);

    border-radius: 3px;

}



.tags-pro-detail a:hover {

    background-color: var(--color-medium-red);

}



.tags-pro-detail a i {

    font-size: 10px;

    margin: 5px 5px 0px 0px;

}



.tabs-pro-detail .ul-tabs-pro-detail {

    padding: 0px;

    list-style: none;

    margin-bottom: 1rem;

    border-bottom: 1px solid #e7e7e7;

    display: flex;

    justify-content: flex-start;

    width: 100%;

    margin-top: 15px;

}



.tabs-pro-detail .ul-tabs-pro-detail li {

    cursor: pointer;

    margin-right: 5px;

    margin-bottom: 5px;

    background: #eee;

    padding: 5px 10px;

}



.tabs-pro-detail .ul-tabs-pro-detail li.active {

    background: #333;

    color: #fafafa;

}



.tabs-pro-detail .ul-tabs-pro-detail li:last-child {

    margin-right: 0px;

}



.tabs-pro-detail .content-tabs-pro-detail {

    display: none;

    width: 100%;

}



.tabs-pro-detail .content-tabs-pro-detail.active {

    display: block;

}



/* Toc */

.box-readmore {

    padding: 8px 15px;

    border: 1px solid #dedede;

    margin-bottom: 2rem;

    border-radius: 5px;

    background-color: #eeeeee;

}



.box-readmore li ul>li {

    margin: 0;

    margin-bottom: 8px
}



.box-readmore li ul>li:before {

    content: counters(item, ".") " "

}



.box-readmore ul {

    list-style-type: none;

    counter-reset: item;

    margin-bottom: 0px;

    padding-left: 0px !important;

    margin-top: 8px;

}



.box-readmore ul li {

    display: table;

    counter-increment: item;

    margin-bottom: 5px
}



.box-readmore ul li:before {

    content: counters(item, ".") ". ";

    display: table-cell;

    padding-right: 5px
}



.box-readmore ul li a {

    color: #333333;

    cursor: pointer;

    font-weight: 600;

}



.box-readmore ul li a:hover {

    color: #767676;

}



/* Post  */

.news {

    width: 100%;

    margin-bottom: 25px;

    display: flex;

    flex-wrap: wrap;

}



.pic-news {

    margin-right: 4%;

    width: 36%;

}



.pic-news img {

    width: 100%;

}



.info-news {

    width: 60%;

}



.name-news {

    color: #333;

    font-size: 16px;

    display: block;

    line-height: normal;

    margin-bottom: 5px;

}



.name-news a {

    color: #333;

    text-decoration: none;

}



.name-news:hover a {

    color: var(--color-red);

}



.time-news {

    color: var(--color-gray);

    margin-bottom: 0.25rem;

}



.desc-news {

    color: #333;

    margin-top: 5px;

    line-height: 22px;

    display: -webkit-box;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;

    overflow: hidden;

}



.share {

    padding: 17px 10px 10px 10px;

    line-height: normal;

    background: rgba(128, 128, 128, 0.15);

    margin-top: 15px;

    border-radius: 5px;

}



.share b {

    display: block;

    margin-bottom: 5px;

}



.othernews b {

    margin-bottom: 10px;

}



.list-news-other {

    padding-left: 17px;

    list-style: square;

}



.list-news-other li {

    margin-bottom: 2px;

}



.list-news-other li a {

    text-transform: none;

    color: #333333;

}



.list-news-other li a:hover {

    color: var(--color-red);

}



/* Contact */

.top-contact {

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    margin-bottom: 30px;

    width: 100%;

}



.top-contact .article-contact {

    width: 48%;

}



.form-contact {

    width: 100%;

}



.input-contact {

    position: relative;

    margin-bottom: 15px;

}



.input-contact input,

.input-contact textarea {

    width: 100%;

    padding: 0px;

    outline: none;

    font-size: 14px;

}



.input-contact input {

    text-indent: 10px;

}



.input-contact textarea {

    resize: none;

    height: 150px;

    padding: 10px;

}



.input-contact .custom-file-label::after {

    content: attr(title);

}



.bottom-contact {

    position: relative;

    height: 500px;

}



.bottom-contact iframe {

    position: absolute;

    top: 0px;

    left: 0px;

    width: 100% !important;

    height: 100% !important;

}



/* Footer */

.footer {

    background: #0342AC;

    color: #000;

    background-size: cover;

    position: relative;

    z-index: 9;

}



.footer>.wrap-content {

    padding: 48px 0px;

    width: 100%;

    box-sizing: border-box;

    position: relative;

}



.footer-news:nth-child(1) {

    width: 40%;

}



.footer-news:nth-child(2) {

    width: 17.5%;

}



.footer-news:nth-child(3) {

    width: 31.666666666%;

}



.footer-news:nth-child(4) {

    width: 25%;

}



.title-footer {

    text-transform: uppercase;

    margin-bottom: 40px;

    font-size: 15px;

    font-family: 'Roboto';

    position: relative;

}



.title-footer:after {

    content: '';

    position: absolute;

    left: 0;

    width: 40px;

    height: 3px;

    background: #fff;

    bottom: -19px;

}



.title-footer1 {

    text-transform: uppercase;

    margin-bottom: 40px;

    font-size: 20px;

    font-family: 'NunitoBold';

    position: relative;

    color: #fff;

}



.title-footer2 {

    text-transform: uppercase;

    font-size: 40px;

    font-family: 'SFUBodoniBoldCondensed';

    position: relative;

    color: #EA1D27;

    text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;

}



.info-footer {

    font-family: 'NunitoRegular';

    font-size: 14px;

    color: #fff
}



.footer-ul {

    list-style: none;

    padding: 0px;

    margin: 0px;

    font-family: 'NunitoRegular';

    font-size: 15px;

}



.footer-ul li {

    margin-bottom: 10px;

}



.footer-ul li:last-child {

    margin-bottom: 0px;

}



.footer-ul li a {

    color: #fff;

}



.footer-ul li:hover a {

    color: #ff0;

}



.slogan-newsletter {

    margin-bottom: 0.5rem;

    color: #fff;

}



.newsletter-input {

    position: relative;

    border-radius: 0;

}



.newsletter-input input {

    padding: 0px;

    font-size: 14px;

    text-indent: 10px;

    border-radius: 0px;

    border: none;

    height: 38px;

    padding-left: 5px;

    width: 100%;

}



.newsletter-button {

    position: relative;

    right: 0;

    background: #EDAE00;

}



.newsletter-button input[type=submit] {

    border: 0px;

    background-color: #EDAE00;

    color: #fff;

    display: inline-block;

    text-transform: uppercase;

    cursor: pointer;

    font-size: 14px;

    font-family: 'Roboto';

    width: 100%;

    height: 38px;

    /* border-radius: 5px; */

    text-align: center;

}



.newsletter-button input[type=submit]:hover {

    background: #ccc;

    color: #fff;

}



#content-index {

    width: 100%;

    padding: 10px;

    box-sizing: border-box;

    border: none;

}



.footer-tags {

    background: #eee;

}



.footer-tags .wrap-content {

    padding: 30px 10px;

}



.label-tags {

    font-weight: 600;

    font-size: 15px;

}



.list-tags {

    list-style: none;

    padding: 0px;

    margin: 0px;

}



.list-tags li {

    margin: 0px 5px 5px 0px;

}



.list-tags li a {

    color: #fff;

    background-color: var(--color-red);

    padding: 6px 15px 8px 15px;

    border-radius: 3px;

    display: block;

}



.list-tags li a:hover {

    background-color: var(--color-medium-red);

}



.footer-powered {

    color: #666;

    /* background-color: #0342AC; */

    font-family: 'Roboto';

    font-weight: normal;

    font-size: 14px;

}



.footer-powered .wrap-content {

    padding: 19.5px 0px;

}



.footer-powered b {

    color: #666;

    font-weight: normal;

}



.copyright {

    margin-bottom: 0px;

    text-align: center;

    width: 100%;

}



.statistic {

    margin-bottom: 0px;

}



.statistic span {

    padding-right: 10px;

}



.statistic span:last-child {

    padding-right: 0px;

}



#footer-map {

    position: relative;

    height: 440px;

}



#footer-map iframe {

    position: absolute !important;

    width: 100% !important;

    height: 100% !important;

    top: 0px !important;

    left: 0px !important;

}



/* Like Share */

.social-plugin {

    display: flex;

    justify-content: flex-start;

    margin-top: 0px;

    gap: 9px;

}



.pagination-home {

    width: 100%;

}



.social-plugin .at-share-btn {

    margin-bottom: 0px !important;

}



.social-plugin .zalo-share-button {

    margin-left: 3px;

}



.social-link a {

    display: inline-block;

    margin-right: 10px;

}



.social-product li {

    margin-top: 0px;

    margin-right: 8px;

}



.social-product button {

    width: 30px;

    display: flex;

    height: 30px;

    border: none;

    cursor: pointer;

    color: #ffffff;

    border-radius: 3px;

    padding: 0px;

    font-size: 15px;

    transition: all 0.3s;

    justify-content: center;

    align-items: center;

}



.social-product ul {

    display: flex;

    justify-content: flex-start;

    margin-top: 0px;

    padding-left: 0px;

    list-style: none;

    margin-bottom: 0px;

}



.social-product button:hover {

    transform: translateY(-5px);

}



.social-product .sharer1 {

    background: #1c96e8;

}



.social-product .sharer2 {

    background: #3d548e;

}



.social-product .sharer3 {

    background: #3294bd;

}



.social-product .sharer4 {

    background: #cb362d;

}



.social-product .sharer5 {

    background: #df0022;

}



.tool-right {

    position: fixed;

    width: 50px;

    right: 23px;

    bottom: 115px;

    z-index: 9090;

    margin-top: -90px;

}



.tool-right li {

    margin: 5px 0px;

}



.pagination-home .pagination .page-item .page-link {

    color: #555555;

    font-size: .875rem;

}



.pagination-home .pagination .page-item.active .page-link {

    color: #ffffff;

    background-color: #555555;

    border-color: #555555;

}



.pagination-ajax {

    text-align: center;

}



.pagination-ajax a {

    display: inline-block;

    vertical-align: top;

    margin: 0px 2px 3px 2px;

    color: #333;

    background: #eee;

    border: 1px solid rgba(161, 161, 161, 0.4);

    font-size: 12px;

    cursor: pointer;

    padding: 3px 10px 5px 10px;

    border-radius: 2px;

}



.pagination-ajax a.current,

.pagination-ajax a:hover {

    background: var(--color-red);

    color: #fff;

    border-color: var(--color-red);

}



/* Popup custom */

.modal-custom .modal-footer {

    padding: 0.5rem;

}



.modal-custom .modal-footer .btn {

    font-size: 14px;

}



/* Popup */

#popup .modal-body {

    padding: 0px;

}



/* Hidden Google Captcha */

.grecaptcha-badge {

    display: none !important;

    width: 0px !important;

    height: 0px !important;

    visibility: hidden !important;

    overflow: hidden;

}



/* Hidden Check Grammar Coccoc */

coccocgrammar {

    display: none;

}



/* Scroll Top */

.scrollToTop {

    width: 41px;

    height: 41px;

    text-align: center;

    font-weight: bold;

    color: #444;

    text-decoration: none;

    position: fixed;

    bottom: 65px;

    right: 25px;

    display: none;

    z-index: 10;

    cursor: pointer;

}



/* Text Hide */

.text-split {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: normal;

    -webkit-box-orient: vertical;

    display: -webkit-box;

    -webkit-line-clamp: 2;

}



/* Transition All */

.transition {

    -webkit-transition: 0.3s ease-out;

    -moz-transition: 0.3s ease-out;

    -o-transition: 0.3s ease-out;

    transition: 0.3s ease-out;

}



/* Scale IMG */

.scale-img {

    overflow: hidden;

    display: block;

}



.scale-img img {

    -webkit-transition: 0.3s ease-out;

    -moz-transition: 0.3s ease-out;

    -o-transition: 0.3s ease-out;

    transition: 0.3s ease-out;

    -moz-transform: scale(1, 1);

    -webkit-transform: scale(1, 1);

    -o-transform: scale(1, 1);

    -ms-transform: scale(1, 1);

    transform: scale(1, 1);

}



.scale-img:hover img {

    -webkit-transition: 0.3s ease-out;

    -moz-transition: 0.3s ease-out;

    -o-transition: 0.3s ease-out;

    transition: 0.3s ease-out;

    -moz-transform: scale(1.1, 1.1);

    -webkit-transform: scale(1.1, 1.1);

    -o-transform: scale(1.1, 1.1);

    -ms-transform: scale(1.1, 1.1);

    transform: scale(1.1, 1.1);

}



/* Blink */

.blink {

    -webkit-animation-name: blink;

    -webkit-animation-duration: 1s;

    -webkit-animation-timing-function: linear;

    -webkit-animation-iteration-count: infinite;

    -moz-animation-name: blink;

    -moz-animation-duration: 1s;

    -moz-animation-timing-function: linear;

    -moz-animation-iteration-count: infinite;

    animation-name: blink;

    animation-duration: 1s;

    animation-timing-function: linear;

    animation-iteration-count: infinite;

}



@-moz-keyframes blink {

    0% {

        opacity: 1.0;

    }



    50% {

        opacity: 0.0;

    }



    100% {

        opacity: 1.0;

    }

}



@-webkit-keyframes blink {

    0% {

        opacity: 1.0;

    }



    50% {

        opacity: 0.0;

    }



    100% {

        opacity: 1.0;

    }

}



@keyframes blink {

    0% {

        opacity: 1.0;

    }



    50% {

        opacity: 0.0;

    }



    100% {

        opacity: 1.0;

    }

}



/* Button Frame */

.btn-frame {

    display: block;

    width: 50px;

    height: 50px;

    position: fixed;

    right: 20px;

    z-index: 10;

    cursor: pointer;

}



.btn-frame i {

    display: flex;

    display: -ms-flex;

    justify-content: center;

    align-items: center;

    -ms-flex-align: center;

    width: 50px;

    height: 50px;

    border-radius: 50%;

    background: #1182FC;

    position: relative;

    z-index: 1;

}



.btn-frame i img {

    vertical-align: middle;

    width: 70%;

}



.btn-frame .animated.infinite {

    animation-iteration-count: infinite;

}



.btn-frame .kenit-alo-circle {

    width: 60px;

    height: 60px;

    top: -5px;

    right: -5px;

    position: absolute;

    background-color: transparent;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

    border: 2px solid rgba(7, 41, 103, 0.8);

    opacity: .1;

    border-color: #1182FC;

    opacity: .5;

}



.btn-frame .zoomIn {

    animation-name: zoomIn;

}



.btn-frame .animated {

    animation-duration: 1s;

    animation-fill-mode: both;

}



.btn-frame .kenit-alo-circle-fill {

    width: 70px;

    height: 70px;

    top: -10px;

    right: -10px;

    position: absolute;

    -webkit-transition: all 0.2s ease-in-out;

    -moz-transition: all 0.2s ease-in-out;

    -ms-transition: all 0.2s ease-in-out;

    -o-transition: all 0.2s ease-in-out;

    transition: all 0.2s ease-in-out;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

    border: 2px solid transparent;

    -webkit-transition: all .5s;

    -moz-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

    background-color: rgba(7, 41, 103, 0.35);

    opacity: .4;

}



.btn-frame .pulse {

    animation-name: pulse;

}



/* Zalo */

.btn-zalo {

    bottom: 315px;

}



/* Phone */

.btn-phone {

    bottom: 230px;

}



/* Messenger */

.js-facebook-messenger-container.closed,

.js-facebook-messenger-tooltip.closed {

    display: none !important
}



.js-facebook-messenger-tooltip {

    bottom: 97px;

    right: 97px
}



.js-facebook-messenger-tooltip {

    color: #404040;

    background: #fff
}



.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

    z-index: 999
}



.js-facebook-messenger-tooltip {

    display: none;

    position: fixed;

    text-align: center;

    border-radius: 10px;

    overflow: hidden;

    font-size: 12px;

    line-height: 1;

    padding: 10px;

    border: 1px solid rgba(0, 0, 0, 0.1);

    box-shadow: rgba(0, 0, 0, 0.15) 0 2pt 10pt;

    z-index: 1.0E+30
}



.js-facebook-messenger-close-tooltip {

    width: 10px;

    height: 10px;

    display: inline-block;

    cursor: pointer;

    margin-left: 10px
}



.js-facebook-messenger-box.rubberBand {

    -webkit-animation-name: rubberBand;

    animation-name: rubberBand
}



.js-facebook-messenger-box.animated {

    -webkit-animation-duration: 1s;

    animation-duration: 1s;

    -webkit-animation-fill-mode: both;

    animation-fill-mode: both
}



.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

    z-index: 999
}



.js-facebook-messenger-box {

    display: block;

    position: fixed;

    cursor: pointer;

    bottom: 150px;

    right: 17px;

    width: 56px;

    height: 56px;

    text-align: center;

    background: #1182FC;

    border-radius: 100%;

    overflow: hidden;

    z-index: 99;

    -webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);

    -moz-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);

    box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3)
}



.js-facebook-messenger-box.rotate svg#fb-msng-icon {

    transform: rotate(0deg)
}



.js-facebook-messenger-box svg#fb-msng-icon {

    width: 32px;

    height: 33px;

    position: absolute;

    top: 13px;

    left: 12px;

    opacity: 1;

    overflow: hidden;

    -webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

    -moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

    -o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

    transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

}



.js-facebook-messenger-box.rotate svg#close-icon {

    transform: rotate(-45deg)
}



.js-facebook-messenger-box svg#close-icon {

    opacity: 0;

    width: 19px;

    height: 20px;

    position: absolute;

    top: 19px;

    left: 19px;

    -webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

    -moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

    -o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

    transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

}



.js-facebook-messenger-container,

.js-facebook-messenger-container-button {

    z-index: 1000
}



.js-facebook-messenger-container {

    position: fixed;

    opacity: 0;

    transform: translateY(50px);

    bottom: 110px;

    right: 90px;

    border-radius: 10px;

    pointer-events: none;

    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06), 0 2px 32px rgba(0, 0, 0, 0.16);

    -webkit-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

    -moz-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

    -o-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

    transition: transform 160ms ease-in-out, opacity 160ms ease-in-out
}



.js-facebook-messenger-top-header {

    width: 220px
}



.js-facebook-messenger-top-header {

    color: #fff;

    background: #1182FC
}



.js-facebook-messenger-top-header {

    display: block;

    position: relative;

    width: 220px;

    background: #1182FC;

    color: #fff;

    text-align: center;

    line-height: 1;

    padding: 10px;

    font-size: 14px;

    border-top-left-radius: 10px;

    border-top-right-radius: 10px
}



.js-facebook-messenger-container iframe,

.js-facebook-messenger-container-button iframe {

    border-bottom-left-radius: 10px;

    border-bottom-right-radius: 10px
}



.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

    z-index: 999
}



.js-facebook-messenger-container,

.js-facebook-messenger-container-button {

    z-index: 1000
}



.js-facebook-messenger-top-header {

    color: #fff;

    background: #1182FC
}



.js-facebook-messenger-top-header {

    width: 220px
}



.js-facebook-messenger-tooltip {

    color: #404040;

    background: #fff
}



.js-facebook-messenger-container.open {

    transform: translateY(0px);

    opacity: 1;

    pointer-events: all
}



.js-facebook-messenger-tooltip {

    bottom: 97px;

    right: 97px
}



.js-facebook-messenger-box.open svg#fb-msng-icon {

    opacity: 0
}



.js-facebook-messenger-box.rotate.open svg#close-icon {

    transform: rotate(0deg)
}



.js-facebook-messenger-box.open svg#close-icon {

    opacity: 1
}



/* Cart fix */

.cart-fixed {

    position: fixed;

    right: 20px;

    bottom: 390px;

    z-index: 10;

    background: #4b4f56;

    width: 50px;

    height: 50px;

    text-align: center;

    color: #fff !important;

    border-radius: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.cart-fixed i {

    font-size: 20px;

}



.cart-fixed span {

    position: absolute;

    top: 0px;

    right: -5px;

    color: #fff;

    width: 25px;

    height: 25px;

    background: var(--color-red);

    text-align: center;

    line-height: 25px;

    font-size: 11px;

    border-radius: 100%;

}



/* Toolbar */

.toolbar {

    background: var(--color-red);

    width: 100%;

    padding: 3vw;

    bottom: 0px;

    position: fixed;

    z-index: 500;

    height: auto;

    left: 0px;

}



.toolbar ul {

    list-style: none;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0px;

    margin: 0px;

}



.toolbar ul li {

    text-align: center;

    width: 25%;

}



.toolbar ul li a {

    display: block;

    width: 100%;

    cursor: pointer;

}



.toolbar ul li a img {

    height: 6vw;

    width: auto;

}



.toolbar ul li a span {

    font-weight: 400;

    color: #fff;

    font-size: 3.5vw;

    display: none;

}



/* Fixbar */

.fixbar {

    bottom: 0;

    display: block;

    background: #f0eff4;

    border-top: 1px solid #ddd;

    width: 100%;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

    position: fixed;

    margin: 0;

    z-index: 500;

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;

    height: 50px;

}



.fixbar ul {

    margin: 0px;

    padding: 0px;

    list-style: none;

}



.fixbar ul li {

    display: inline-block;

    margin: 0 auto 10px;

    text-align: center;

    width: 25%;

}



.fixbar .icon-cart-mobile,

.fixbar .icon-cart-new,

.fixbar .icon-home-new,

.fixbar .icon-hotdeal-new {

    width: 20px;

    height: 20px;

    display: block;

    margin: 8px auto 0;

}



.fixbar .icon-cart-mobile {

    background: url(../images/cart-mobile.png) no-repeat;

}



.cart-total-header-mobile {

    font-size: 10px;

    position: absolute;

    background: red;

    color: #fff !important;

    border-radius: 50%;

    height: 15px;

    width: 15px;

    line-height: 15px;

    top: 5px;

    margin-left: 5px;

}



.fixbar ul li a {

    font-size: 11px;

    text-decoration: none;

    color: #333;

}



.fixbar ul li a i {

    font-size: 20px;

}



/* Plugbar */

.plugbar {

    position: fixed;

    bottom: 0;

    left: 0;

    border-top: 1px solid #eae6e6;

    width: 100%;

    right: 0;

    max-width: 767px;

    margin: 0 auto;

    background: #fff;

    padding: 9px 10px 10px 7px;

    z-index: 10;

}



.plugbar ul {

    list-style: none;

    padding: 0;

    margin: 0px;

    display: -webkit-flex;

    display: -moz-flex;

    display: flex;

    justify-content: space-between;

    align-items: center;

}



.plugbar ul li {

    width: 20%;

}



.plugbar ul li a {

    display: block;

    color: #696969;

    font-size: 12px;

    text-align: center;

    position: relative;

}



.plugbar ul li a i {

    font-size: 20px;

    color: #696969;

}



.plugbar ul li a span {

    position: absolute;

    width: 50px;

    height: 50px;

    top: -40px;

    left: calc(50% - 50px/2);

    font-size: 14px;

    display: block;

    border: 1px solid rgba(234, 230, 230, 0.5);

    border-radius: 100%;

}



/* Combo Phone */

.support-online {

    position: fixed;

    z-index: 999;

    left: 10px;

    bottom: 0px;

}



.support-online a {

    position: relative;

    margin: 20px 10px;

    text-align: left;

    width: 40px;

    height: 40px;

}



.support-online i {

    width: 40px;

    height: 40px;

    background: #43a1f3;

    color: #fff;

    border-radius: 100%;

    font-size: 20px;

    text-align: center;

    line-height: 1.9;

    position: relative;

    z-index: 999;

}



.support-online a span {

    border-radius: 2px;

    text-align: center;

    background: rgb(103, 182, 52);

    padding: 9px;

    display: none;

    width: 180px;

    margin-left: 10px;

    position: absolute;

    color: #ffffff;

    z-index: 999;

    top: 0px;

    left: 40px;

    transition: all 0.2s ease-in-out 0s;

    -moz-animation: headerAnimation 0.7s 1;

    -webkit-animation: headerAnimation 0.7s 1;

    -o-animation: headerAnimation 0.7s 1;

    animation: headerAnimation 0.7s 1;

}



.support-online a:hover span {

    display: block;

}



.support-online a {

    display: block;

}



.support-online a span:before {

    content: "";

    width: 0;

    height: 0;

    border-style: solid;

    border-width: 10px 10px 10px 0;

    border-color: transparent rgb(103, 182, 52) transparent transparent;

    position: absolute;

    left: -10px;

    top: 10px;

}



.support-online .kenit-alo-circle-fill {

    width: 60px;

    height: 60px;

    top: -10px;

    position: absolute;

    -webkit-transition: all 0.2s ease-in-out;

    -moz-transition: all 0.2s ease-in-out;

    -ms-transition: all 0.2s ease-in-out;

    -o-transition: all 0.2s ease-in-out;

    transition: all 0.2s ease-in-out;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

    border: 2px solid transparent;

    -webkit-transition: all .5s;

    -moz-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

    background-color: rgba(0, 175, 242, 0.5);

    opacity: .75;

    right: -10px;

}



.support-online .kenit-alo-circle {

    width: 50px;

    height: 50px;

    top: -5px;

    right: -5px;

    position: absolute;

    background-color: transparent;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

    border: 2px solid rgba(30, 30, 30, 0.4);

    opacity: .1;

    border-color: #0089B9;

    opacity: .5;

}



.support-online .support-online .btn-support {

    cursor: pointer;

}



.support-online .mes i {

    background: orange;

}



.support-online .sms i {

    background: red;

}



.support-online .call-now i {

    background: green;

}



/* Phone Switch */

.widget-mobile {

    position: fixed;

    left: 50%;

    transform: translateX(-50%);

    bottom: 10px;

    z-index: 9999999;

}



#my-phone-circle {

    position: relative;

    width: 50px !important;

    height: 50px !important;

}



.wcircle-open .wcircle-icon i:before {

    content: '\f00d';

}



.wcircle-icon {

    background: #1282fc;

    border-radius: 50%;

    display: flex !important;

    display: -ms-flex !important;

    align-items: center;

    -ms-flex-align: center;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    position: relative !important;

}



.wcircle-icon:before {

    position: absolute;

    content: '';

    width: 60px;

    height: 60px;

    background: rgba(18, 130, 252, .5);

    border: 1px solid #fff;

    border-radius: 50%;

    left: -5px;

    top: -5px;

    -webkit-animation: pulse 1s infinite ease-in-out;

    -moz-animation: pulse 1s infinite ease-in-out;

    -ms-animation: pulse 1s infinite ease-in-out;

    -o-animation: pulse 1s infinite ease-in-out;

    animation: pulse 1s infinite ease-in-out;

}



.wcircle-icon:after {

    position: absolute;

    content: '';

    width: 80px;

    height: 80px;

    background: rgba(18, 130, 252, .5);

    border-radius: 50%;

    left: -15px;

    top: -15px;

    -webkit-animation: zoomIn 2s infinite ease-in-out;

    -moz-animation: zoomIn 2s infinite ease-in-out;

    -ms-animation: zoomIn 2s infinite ease-in-out;

    -o-animation: zoomIn 2s infinite ease-in-out;

    animation: zoomIn 2s infinite ease-in-out;

}



.wcircle-menu {

    position: absolute !important;

    left: 0;

    top: 0;

    display: none;

}



.wcircle-menu-item {

    width: 50px;

    height: 50px;

    background: #1282fc;

    border-radius: 50%;

    display: flex;

    display: -ms-flex;

    align-items: center;

    -ms-flex-align: center;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

}



.wcircle-menu-item img {

    width: 50px;

    height: 50px;

    display: block;

    border-radius: 50%;

}



.wcircle-menu-item i,

.wcircle-icon i {

    font-size: 25px;

    color: #fff;

    position: relative;

    z-index: 9999;

}



.shake-anim {

    -webkit-animation: shake-anim 1s infinite ease-in-out;

    -moz-animation: shake-anim 1s infinite ease-in-out;

    -ms-animation: shake-anim 1s infinite ease-in-out;

    -o-animation: shake-anim 1s infinite ease-in-out;

    animation: shake-anim 1s infinite ease-in-out;

    -webkit-transform-origin: 50% 50%;

    -moz-transform-origin: 50% 50%;

    -ms-transform-origin: 50% 50%;

    -o-transform-origin: 50% 50%;

    transform-origin: 50% 50%
}



/*Album */

.album-content {

    width: 100%;

    display: flex;

    justify-content: space-between;

    margin: auto;

    flex-wrap: wrap;

}



.box-album-index {

    display: flex;

    width: 100%;

    flex-wrap: wrap;

    justify-content: space-between;

    padding: 0 15px;

    margin-bottom: 30px;

}



.box-item-album {

    position: relative;

    overflow: hidden;

}



.box-item-album h3 {

    position: absolute;

    left: 0;

    width: 100%;

    bottom: -150px;

    transition: all 0.3s;

    background: rgba(0, 0, 0, .5);

    text-align: center;

    margin-bottom: 0;

    font-family: 'Arial';

    font-size: 22px;

    padding: 10px 5px;

    text-transform: uppercase;

    font-weight: bold;

}



.box-item-album h3 a {

    text-decoration: none;

    color: #fff;

}



.box-item-album:hover h3 {

    bottom: 0;

    transition: all 0.3s;

}



.box-item-album h3:hover a {

    color: #ff0;

}



.box-item-album:hover img {

    filter: brightness(0.7);

}



.list-album {

    width: 100%;

    text-align: center;

    margin-bottom: 20px;

}



.list-album p {

    display: inline-block;

    padding: 0 2px;

    margin-bottom: 10px;

}



.list-album p span {

    padding: 10.5px 15.5px;

    border: 1px solid #ccc;

    cursor: pointer;

    font-size: 14px;

    font-weight: normal;

    text-transform: uppercase;

    display: inline-block;

}



.list-album p span.active,

.list-album p span:hover {

    border: 1px solid #69A21F;

    transition: all 0.6s
}



/*social*/

.social-footer {

    line-height: 40px;

    font-size: 15px;

    font-family: 'Arial';

    text-transform: unset;

    text-transform: uppercase;

    margin-top: 15px;

}



.social-footer>p {

    margin-bottom: 0
}



.social-footer p b {

    font-family: 'MuliBold';

    font-size: 15px;

    text-transform: capitalize
}



.item-slick-partner {

    border-right: 1px solid #ccc;

    background: #F8F8F8;

    text-align: center;

}



.item-slick-partner span {

    padding: 10px 0;

    display: inline-block;

}



.social-footer li {

    margin-right: 10px;

}



.item-slick {

    padding: 0 15px;

    box-sizing: border-box;

}



/*News video index*/

.news-video-index {

    padding: 30px 0;

    margin-bottom: 30px;

}



.news-video-index .wrap-content {

    flex-wrap: wrap;

}



.news-index {

    width: 40.594059405%;

}



.video-index {

    width: 48.333333333%;

}



.boxshow-index {

    display: flex;

    justify-content: space-between;

    align-items: center;

    /* flex-wrap: wrap; */

    transition: all 0.6s;

    position: relative;

    padding-left: 18px;

    box-sizing: border-box;

    border-bottom: 1px dashed #ccc;

    padding-bottom: 20px;

    margin-bottom: 20px;

}



.boxshow-index>span {

    width: 55px;

    height: 55px;

    border-radius: 50%;

    display: flex;

    justify-content: center;

    align-items: center;

    background: #979797;

    color: #fff;

    font-family: 'Arial';

    font-weight: 900;

    font-size: 26px;

}



.boxshow-index>span.active {

    background: #ED1B2F;

}



.date-post-fixed>b {

    font-size: 30px;

    font-style: normal;

    font-family: 'BeVietnamMedium';

    font-weight: normal;

}



.boxshow-index>div {

    width: calc(100% - 75px);

    font-family: 'Roboto';

    position: relative;

    top: 0;

    background: #F5F5F5;

    /* padding: 20px; */

    color: #333;

}



.boxshow-index>div h3 {

    font-size: 14px;

    font-family: 'Arial';

    position: relative;

    margin-bottom: 6px;

}



.boxshow-index>div h3 a {

    text-decoration: none;

    color: #333;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

    overflow: hidden;

}



.boxshow-index>div h3:hover a {

    color: #009343
}



.boxshow-index:hover img {

    transform: scale(1.01);

    transition: all 0.6s
}



.descs-news-index {

    font-size: 13px;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

    overflow: hidden;

    color: #999;

    font-weight: normal;

    line-height: 25px;

    font-family: 'Arial';

}



.view-more-news-index a {

    text-decoration: none;

    color: #FFCC00;

    font-size: 16px;

    font-weight: 700;

}



.view-more-news-index:hover a {

    color: #fff
}



.change-order>div {

    order: 1;

}



.change-order>span {

    order: 1;

    transition: all 0.6s;

}



#video-slick {

    width: 100%;

    display: flex;

    justify-content: space-between;

}



.video_popup {

    position: relative;

    padding-bottom: 38%;

    padding-top: 35px;

    height: auto;

    overflow: hidden;

    width: 74.827586206%;

}



.video_popup iframe,

.video_popup object,

.video_popup embed {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}



#clickvideo {

    width: 23.275862069%;

    box-sizing: border-box;

    max-height: 410px;

    overflow: hidden;

}



.slick-news-index {

    width: calc(100% + 46px);

    margin: 0 -23px;

    margin-top: 40px;

}



.slick-news-index .item-slick {

    /* padding: 0 23px; */

}



.view_video img {

    min-height: 128px;

}



.title-video-news-index {

    font-size: 35px;

    font-family: 'Roboto';

    color: #225486;

    text-transform: uppercase;

    margin-bottom: 40px;

    text-align: center;

    font-weight: bold;

    position: relative;

}



.title-video-news-index:after {

    content: '';

    position: absolute;

    left: calc((100% - 70px)/2);

    width: 70px;

    height: 2px;

    background: #808080;

    bottom: -9px;

}



/*Table download*/

.tablediv-file {

    font-family: 'Roboto';

}



.title-item-table {

    width: 100%;

    display: flex;

    justify-content: space-between;

    background: #DC1500;

    line-height: 40px;

    color: #fff;

    text-transform: uppercase;

    font-size: 15px;

}



.title-item-table-row {

    width: 100%;

    display: flex;

    justify-content: space-between;

    background: #f6f6f6;

    line-height: 40px;

    color: #fff;

    text-transform: uppercase;

    font-size: 15px;

}



.title-item-table>div:nth-child(1),

.title-item-table-row>div:nth-child(1) {

    width: 10%;

    text-align: center
}



.title-item-table>div:nth-child(2),

.title-item-table-row>div:nth-child(2) {

    width: 70%;

    text-align: left;

}



.title-item-table>div:nth-child(3),

.title-item-table-row>div:nth-child(3) {

    width: 20%;

    text-align: center
}



.title-item-table-row,

.title-item-table-row a {

    color: #333;

}



.title-item-table-row:hover a {

    color: #f00
}



.title-item-table-row:nth-child(odd) {

    background: #dcdcdc;

}



.title-item-table-row:hover {

    background: #ccc;

}



/*adv*/

.wrap-adv {

    width: 100%;

}



.wrap-adv .slick-slide img {

    display: inline-block;

    margin: auto;

}



.wrap-adv .item-slick {

    text-align: center
}



.wrap-product-bc {

    margin-bottom: 35px;

    width: 100%;

}



.drop-down-control.active .drop-down-select {

    display: block;

}



.drop-down-language {

    width: 180px;

    text-align: left;

    padding-left: 20px;

}



.content-web {

    width: 100%;

    display: flex;

    justify-content: space-between;

}



.catalogy-left {

    width: 320px;

    position: sticky;

    top: 0;

    padding-top: 40px;

    background: #fff;

    z-index: 9
}



.content-web-show {

    width: calc(100% - 320px);

    background: #F7F7F7;

    padding-right: calc((100% - 1200px)/2);

}



.content-box-in {

    width: 100%;

    display: flex;

    justify-content: space-between;

}



.left-box {

    width: 25%;

}



.content-box {

    width: 73%;

}



.box-left-menu {

    border-radius: 5px;

    padding-bottom: 1px;

    position: sticky;

    top: 70px;

    z-index: 9;

    padding: 0 10px;

}



.catalogy-left h2 {

    background: #009343;

    color: #fff;

    text-transform: uppercase;

    font-size: 20px;

    text-align: center;

    line-height: 45px;

    position: relative;

    top: -1px;

    width: calc(100% + 2px);

    left: -1px;

    margin-bottom: 0;

}



.box-newsletter {

    background: url('../images/web/bgdknt.jpg')no-repeat top center;

    background-size: cover;

    padding: 50px 0;

    margin-bottom: 20px;

}



.color-white-child>h3 {

    color: #fff
}



.menu .item-big {

    text-align: center;

    position: relative;

    margin-bottom: 0;

    display: flex;

    justify-content: center;

    flex-wrap: wrap;

    align-items: center;

    padding-inline-start: 0;

    width: 100%;

}



.menu .item-big .nav-item {

    display: inline-block;

    position: relative;

    position: relative;

}



.menu .item-big .nav-item:after {

    content: '';

    position: absolute;

    height: 1px;

    bottom: 0;

    right: 0;

    width: 0%;

    left: 50%;

    background: #fff;

    transition: all 0.6s
}



.menu .item-big .nav-item:hover:after,

.menu .item-big .nav-item.active:after {

    left: 0;

    transition: all 0.6s;

    width: 100%;

}



.menu .item-big .nav-item:last-child {

    border-right: none
}



.menu .item-big .nav-item>a {

    padding: 0px 40px;

    display: block;

    text-align: center;

    font-size: 16px;

    line-height: 50px;

    text-decoration: none;

    color: #ffffff;

    position: relative;

    font-family: 'Roboto';

    font-weight: normal;

}



.menu .item-big .nav-item>span {

    display: block;

    text-align: center;

    font-size: 18px;

    text-decoration: none;

    color: #FFF;

    font-weight: 400;

    position: relative;

    text-transform: uppercase;

    cursor: pointer;

    border-radius: 50%;

    background: #fff;

    color: #02C7F2;

    width: 37px;

    height: 37px;

    display: flex;

    align-items: center;

    justify-content: center;

}



.menu .item-big .nav-item>a i {

    font-size: 15px;

}



.menu .item-big .nav-item>a i.home {

    font-size: 25px;

}



.menu .item-big .nav-item.active>a,

.menu .item-big .nav-item:hover>a {

    color: #ffffff;

}



.menu .item-big .nav-item>.item_small {

    overflow: hidden;

    display: block;

    max-height: 0px;

    max-width: 0px;

    opacity: 0;

    -webkit-transform: perspective(600px) rotateX(-90deg);

    -moz-transform: perspective(600px) rotateX(-90deg);

    -ms-transform: perspective(600px) rotateX(-90deg);

    -o-transform: perspective(600px) rotateX(-90deg);

    transform: perspective(600px) rotateX(-90deg);

    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end;

    -o-transition: -o-transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end;

    transition: transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end;

    position: absolute;

    top: 100%;

    left: 0px;

    width: 250px;

    padding: 0;

    background-color: #fff;

    box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -webkit-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -moz-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -o-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -os-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -webkit-transform-origin: 0% 0%;

    -moz-transform-origin: 0% 0%;

    -ms-transform-origin: 0% 0%;

    -o-transform-origin: 0% 0%;

    transform-origin: 0% 0%;

    z-index: 99;

}



.menu .item-big .nav-item:hover>ul {

    overflow: visible;

    max-height: 3000px;

    max-width: 3000px;

    min-width: 250px;

    opacity: 1;

    -webkit-transform: perspective(600px) rotateX(0deg);

    -moz-transform: perspective(600px) rotateX(0deg);

    -ms-transform: perspective(600px) rotateX(0deg);

    -o-transform: perspective(600px) rotateX(0deg);

    transform: perspective(600px) rotateX(0deg);

    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end;

    -o-transition: -o-transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end;

    transition: transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end;

}



.menu .item-big .nav-item.has-mega {

    position: static !important;

}



.menu .item-big .mega-content {

    background: #fff;

    overflow: hidden;

    display: block;

    max-height: 0px;

    min-width: 250px;

    opacity: 0;

    -webkit-transform: perspective(600px) rotateX(-90deg);

    -moz-transform: perspective(600px) rotateX(-90deg);

    -ms-transform: perspective(600px) rotateX(-90deg);

    -o-transform: perspective(600px) rotateX(-90deg);

    transform: perspective(600px) rotateX(-90deg);

    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end;

    -o-transition: -o-transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end;

    transition: transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end;

    box-shadow: 0 1px 2px 2px rgba(0, 0, 0, 0.2);

    -webkit-transform-origin: 0% 0%;

    -moz-transform-origin: 0% 0%;

    -ms-transform-origin: 0% 0%;

    -o-transform-origin: 0% 0%;

    transform-origin: 0% 0%;

    margin: 0;

    padding: 0px;

    position: absolute;

    top: 100%;

    left: 0px;

    z-index: 99;

    width: 100%;

    border: none;

    text-align: left;

    box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -webkit-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -moz-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -o-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -os-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

}



.menu .item-big .nav-item:hover>.mega-content {

    overflow: visible;

    max-height: 3000px;

    max-width: 3000px;

    min-width: 250px;

    opacity: 1;

    -webkit-transform: perspective(600px) rotateX(0deg);

    -moz-transform: perspective(600px) rotateX(0deg);

    -ms-transform: perspective(600px) rotateX(0deg);

    -o-transform: perspective(600px) rotateX(0deg);

    transform: perspective(600px) rotateX(0deg);

    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end;

    -o-transition: -o-transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end;

    transition: transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end;

}



.menu .item-big .nav-item:hover>.mega-content {

    display: block;

}



.menu .item-big .mega-content .parent {

    width: calc(100% / 3);

    padding: 0px 20px;

}



.menu .item-big .mega-content .parent h4 a {

    font-size: 15px;

    font-weight: 400;

    text-transform: uppercase;

    display: block;

    color: #0056BB;

    margin-bottom: 5px;

}



.menu .item-big .mega-content .parent h4 a:hover,

.menu .item-big .mega-content .level1 .level2 a:hover,

.menu .item-big .nav-item>ul>li>a:hover,

.menu .item-big .nav-item>ul>li>ul>li>a:hover {

    color: #0346B8;

}



.menu .item-big .mega-content .level1 .level2 a {

    font-size: 14px;

    color: #333;

    display: block;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

    line-height: 20px;

    padding: 5px 0px 5px;

    border-bottom: 1px dashed #CCC;

}



.menu .item-big .nav-item>ul li a {

    font-weight: 400;

    font-size: 14px;

    line-height: 24px;

    display: block;

    padding: 7px 5px 7px 0px;

    color: #282828;

    position: relative;

    border-bottom: dashed 1px #e5e6ec;

    text-align: left;

    padding-left: 15px;

    text-decoration: none;

}



.menu .item-big .nav-item>ul li:last-child>a {

    border-bottom: 0;

}



.menu .item-big .nav-item>ul li a i {

    position: absolute;

    right: -10px;

    padding: 0px 10px;

    top: 0;

    line-height: 38px;

}



.menu .item-big .nav-item>ul li {

    padding: 0px;

}



.menu .item-big .nav-item li {

    position: relative;

}



.menu .item-big .nav-item>ul li ul {

    visibility: hidden;

    opacity: 0;

    margin-top: 20px;

    left: 100%;

    top: 0px;

    position: absolute;

    width: 250px;

    padding: 0;

    background-color: #fff;

    z-index: 99;

    box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -webkit-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -moz-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -o-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    -os-box-shadow: 0px 10px 21.6px 2.4px rgba(0, 0, 0, 0.06);

    transition: all 0.6s;

}



.menu .item-big .nav-item>ul li:hover>ul {

    visibility: visible;

    opacity: 1;

    margin-top: 0px;

}



.box-menu-bottom-left {

    position: relative;

    left: 0;

    width: 100%;

    top: 100px;

}



.bottom-menu {

    margin-bottom: 15px;

}



.bottom-menu a,

.bottom-menu1 a {

    text-decoration: none;

    color: #333;

    text-transform: uppercase;

    font-family: 'Arial';

    font-size: 15px;

}



.bottom-menu a i,

.bottom-menu1 a i {

    font-size: 20px;

    color: #009343;

    margin-right: 5px;

}







/*check Form*/

.wrap-maini {

    background: #009343;

}



.check-form-content {

    max-width: 800px;

    margin: auto;

}



.check-form-content h2 {

    background: #009343;

    color: #fff;

    font-size: 20px;

    font-family: 'Roboto';

    text-transform: uppercase;

    padding: 10px 0;

}



.menu-step {

    background: #ED1B2C;

    font-size: 25px;

    font-family: 'Roboto';

    color: #000;

    padding: 35px;

    text-align: center;

    font-weight: bold;

    text-transform: uppercase;

}



.menu-step span {

    cursor: pointer;

}



.menu-step span.active {

    color: #fff;

}



.catalogy-item .pic-product {

    margin-bottom: 0
}



.catalogy-item .name-product {

    position: absolute;

    left: 26px;

    width: calc(100% - 52px);

    line-height: 50px;

    bottom: -25px;

    border: 1px solid #ccc;

    background: #fff;

    font-family: 'Arial';

    font-weight: bold;

    text-transform: uppercase;

    padding: 0;

    margin-bottom: 0;

}



.catalogy-item:hover .name-product {

    background: #ED1B2F;

}



.catalogy-item:hover .name-product a {

    text-decoration: none;

    color: #fff
}



.catalogy-item .name-product {}



.catalogy-item .name-product a {

    color: #000
}



.form-check-product {

    width: 100%;

    max-width: 350px;

    margin: auto;

    padding: 0 35px;

    box-sizing: border-box;

    margin-top: 20px;

}



.form-check-product input {

    width: 100%;

    height: 35px;

    padding-left: 10px;

    border: 1px solid #ccc;

}



.form-check-product button {

    width: 100%;

    margin-top: 10px;

    height: 35px;

    color: #fff;

    font-size: 14px;

    text-align: center;

    font-family: 'Roboto';

    background: #ED1B2C;

    border: none;

    text-transform: uppercase;

}



.check-header {

    padding-top: 20px;

    background: #fff;

    padding-bottom: 10px;

    box-sizing: border-box;

}



.check-footer {

    background: #666666;

    color: #fff;

    padding: 30px 0;

}



.check-content {

    text-align: center;

    padding: 50px 0;

    max-width: 800px;

    margin: auto;

    background: #fff;

}



.show-messenger {

    position: relative;

    font-size: 15px;

    font-family: 'Roboto';

    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    position: relative;

}



.tooltip1 {

    display: inline-block;

    width: 30px;

    height: 30px;

    cursor: pointer
}



.tooltip1 .tooltiptext1 {

    visibility: hidden;

    width: 100%;

    background-color: black;

    color: #333;

    text-align: center;

    border-radius: 6px;

    padding: 5px 0;

    font-size: 14px;

    font-family: 'Roboto';

    border: 1px solid #ccc;

    background: #fff;

    padding: 20px;

    position: absolute;

    z-index: 1;

    left: 0;

    top: 25px;

    text-align: left;

    font-size: 14px;

    font-family: 'Roboto';

}



.tooltip1:hover .tooltiptext1 {

    visibility: visible;

}



.tooltip2 {

    display: inline-block;

    width: 30px;

    height: 30px;

    cursor: pointer
}



.tooltip2 .tooltiptext2 {

    visibility: hidden;

    width: 400px;

    background-color: black;

    color: #333;

    text-align: center;

    border-radius: 6px;

    padding: 5px 0;

    font-size: 14px;

    font-family: 'Roboto';

    border: 1px solid #ccc;

    background: #fff;

    padding: 20px;

    position: absolute;

    z-index: 1;

    left: calc((100% - 400px)/2);

    top: 25px;

    text-align: left;

    font-size: 14px;

    font-family: 'Roboto';

}



.tooltip2:hover .tooltiptext2 {

    visibility: visible;

}



.check-step-button {

    margin-top: 20px;

}



.check-step-button span {

    text-transform: uppercase;

    padding: 6px 20px;

    margin: 0 3px;

    font-size: 15px;

    font-family: 'Roboto';

    cursor: pointer
}



.check-ok {

    background: #009343;

    color: #fff;

}



.check-no {

    background: #f00;

    color: #fff
}



.support-check {

    width: 100%;

    text-align: center;

    margin-top: 10px;

}



.img-news-index {

    position: relative;

    background: #E6E6E6;

    width: 55.445544554%;

    display: flex;

    justify-content: center;

    align-items: center;

    min-height: 365px;

}



.img-news-index:after {

    right: 100%;

    top: 30%;

    border: solid transparent;

    content: " ";

    height: 0;

    width: 0;

    position: absolute;

    pointer-events: none;

    border-color: rgba(136, 183, 213, 0);

    border-right-color: #E6E6E6;

    border-width: 15px;

    margin-top: -15px;

}



.using_discount {

    padding: 7px 20px;

    border: 1px solid #ccc;

    font-weight: normal;

    font-family: 'Roboto';

    font-size: 16px;

    color: #333;

    display: inline-block;

    cursor: pointer;

}



.using_discount:hover {

    background: #c33;

    color: #fff;

    border: 1px solid #c33;

}



/* Danh muc */

.left_main {

    width: 250px;

}



.khung_baiviet {

    display: flex;

    justify-content: space-between;

}



.danhmuc {

    width: 100%;

    margin-bottom: 20px;

}



.danhmuc h4 {

    width: 100%;

    height: 40px;

    line-height: 40px;

    text-transform: uppercase;

    color: #fff;

    font-weight: 500;

    background: url(../images/icon-list.png) no-repeat left;

    padding-left: 39px;

    background-color: #324b86;

    font-size: 18px;

}



.danhmuc ul {

    border: 1px solid #dedede;

    padding: 5px 0;

    list-style: none;

}



.danhmuc ul li a {

    display: block;

    padding: 10px 15px 10px 25px;

    color: #000;

    text-transform: uppercase;

    line-height: 22px;

    position: relative;

}



.danhmuc ul li a:after {

    content: '';

    width: 5px;

    height: 5px;

    background: #064394;

    border-radius: 50%;

    position: absolute;

    top: 50%;

    left: 10px;

    transform: translate(-50%);

}



.danhmuc ul li:last-child a {

    border: 0
}



.right_main {

    width: calc(100% - 270px);

}



/* post */

.post .item {

    overflow: hidden;

    margin-bottom: 10px;

    padding: 0 0;

    transition: all 0.25s cubic-bezier(.02, .01, .47, 1)
}



.post .item .img {

    position: relative;

    padding: 0;

    overflow: hidden;

    border-radius: 5px
}



.post .item .img img {

    width: 100%;

    height: 100%;

    object-fit: cover
}



.post .item .img .date-box {

    position: absolute;

    bottom: 15px;

    left: 15px;

    width: 65px;

    height: 65px;

    text-align: center;

    padding: 15px 0;

    font-size: 10px;

    line-height: 15px;

    color: #fff;

    background-color: var(--theme-color);

    border-radius: 5px
}



.post .item .img .date-box:before {

    content: '';

    position: absolute;

    top: 5px;

    left: 5px;

    right: 5px;

    bottom: 5px;

    border: 1px dotted #ce8f98;

    border-radius: 5px
}



.post .item .img .date-box span {

    font-size: 18px
}



.post .item .title {

    text-align: left;

    line-height: 25px;

    padding-left: 30px;

    padding-top: 10px;

    padding-bottom: 10px;

}



.post .item .title .post-info {

    margin: 10px 0;

    letter-spacing: 2px;

    font-size: 13px
}



.post .item .title h3.header {

    font-size: 20px;

    line-height: 24px;

    margin: 10px 0 10px 0;

    text-align: left;

    color: #212529
}



.post .item .title h3.header a {

    color: #212529
}



.post .item .title .description {

    margin-bottom: 18px;

    text-align: justify;

    color: #687385;

    overflow: hidden;

    text-overflow: ellipsis;

    line-height: 25px;

    -webkit-line-clamp: 3;

    display: -webkit-box;

    -webkit-box-orient: vertical
}



.post .item .title .description a {

    color: #687385
}



.post .item:hover {

    border-radius: 10px;

    transform: translateY(-5px);

    box-shadow: 0 4px 60px 0 rgba(0, 0, 0, .2), 0 0 0 transparent
}



.post .item:hover .img {

    border-radius: 5px 0 0 5px
}



.post .item.item-post-horizontal {

    border: 1px solid #f0f8ff;

    z-index: 12;

    transition: all 0.25s cubic-bezier(.02, .01, .47, 1);

    position: relative;

    background: #fff;

    padding: 0;

    margin-bottom: 10px;

    border-radius: 10px
}



.post .item.item-post-horizontal .img {

    margin-bottom: 10px;

    height: 300px;

    position: relative;

    border-radius: 0
}



.post .item.item-post-horizontal .img img {

    height: 100%;

    width: 100%;

    object-fit: cover;

    opacity: .9;

    transition: all 0.3s ease 0s;

    -webkit-transition: all 0.3s ease 0s;

    -moz-transition: all 0.3s ease 0s;

    -ms-transition: all 0.3s ease 0s;

    -o-transition: all 0.3s ease 0s
}



.post .item.item-post-horizontal .title {

    padding-right: 30px
}



.post .item.item-post-horizontal .title h3.header {

    margin-top: 10px;

    line-height: 25px;

    height: 50px;

    overflow: hidden
}



.post .item.item-post-horizontal .title .description {

    margin-bottom: 10px;

    height: 75px
}



.post .item.item-post-horizontal:hover {

    transform: translateY(-5px);

    box-shadow: 0 4px 60px 0 rgba(0, 0, 0, .2), 0 0 0 transparent
}



.post .item.item-post-horizontal:hover .img img {

    transform: scale(1.1);

    -webkit-transform: scale(1.1);

    -moz-transform: scale(1.1);

    -ms-transform: scale(1.1);

    -o-transform: scale(1.1);

    opacity: .5;

    transition: all 0.3s ease 0s;

    -webkit-transition: all 0.3s ease 0s;

    -moz-transition: all 0.3s ease 0s;

    -ms-transition: all 0.3s ease 0s;

    -o-transition: all 0.3s ease 0s
}



.name-news {}



@-moz-keyframes shake-anim {

    0% {

        transform: rotate(0) scale(1) skew(1deg)
    }



    10%,

    30% {

        -moz-transform: rotate(-25deg) scale(1) skew(1deg)
    }



    20%,

    40% {

        -moz-transform: rotate(25deg) scale(1) skew(1deg)
    }



    100%,

    50% {

        -moz-transform: rotate(0) scale(1) skew(1deg)
    }

}



@-webkit-keyframes shake-anim {



    0%,

    100%,

    50% {

        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }



    10%,

    30% {

        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
    }



    20%,

    40% {

        -webkit-transform: rotate(25deg) scale(1) skew(1deg)
    }

}



@-o-keyframes shake-anim {



    0%,

    100%,

    50% {

        -o-transform: rotate(0) scale(1) skew(1deg)
    }



    10%,

    30% {

        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }



    20%,

    40% {

        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }

}



#btn-call {

    display: block;

    width: 40px;

    height: 40px;

    position: fixed;

    right: 25px;

    bottom: 310px;

    z-index: 999;

}



#btn-call i {

    width: 40px;

    height: 40px;

    border-radius: 50%;

    background: #0f852b;

    color: #fff;

    font-size: 20px;

    text-align: center;

    line-height: 40px;

    position: relative;

    z-index: 9999;

}



.kenit-alo-circle-fill {

    width: 60px;

    height: 60px;

    top: -10px;

    position: absolute;

    -webkit-transition: all 0.2s ease-in-out;

    -moz-transition: all 0.2s ease-in-out;

    -ms-transition: all 0.2s ease-in-out;

    -o-transition: all 0.2s ease-in-out;

    transition: all 0.2s ease-in-out;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

    border: 2px solid transparent;

    -webkit-transition: all .5s;

    -moz-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

    background-color: rgba(15, 133, 43, 0.45);

    opacity: .75;

    right: -10px;

}



.kenit-alo-circle {

    width: 50px;

    height: 50px;

    top: -5px;

    right: -5px;

    position: absolute;

    background-color: transparent;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

    border: 2px solid rgba(64, 72, 204, .8);

    opacity: .1;

    border-color: #4048CC;

    opacity: .5;

}



#btn-zalo {

    display: block;

    width: 40px;

    height: 40px;

    position: fixed;

    right: 25px;

    bottom: 230px;

    z-index: 9999;

}



#btn-zalo i {

    display: flex;

    display: -ms-flex;

    align-items: center;

    -ms-flex-align: center;

    width: 40px;

    height: 40px;

    border-radius: 50%;

    background: #0ba4ca;

    position: relative;

    z-index: 999;

}



#btn-zalo i img {

    vertical-align: middle;

    max-width: 100%;

}



.kenit-alo-circle-fill {

    width: 60px;

    height: 60px;

    top: -10px;

    position: absolute;

    -webkit-transition: all 0.2s ease-in-out;

    -moz-transition: all 0.2s ease-in-out;

    -ms-transition: all 0.2s ease-in-out;

    -o-transition: all 0.2s ease-in-out;

    transition: all 0.2s ease-in-out;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

    border: 2px solid transparent;

    -webkit-transition: all .5s;

    -moz-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

    background-color: rgba(15, 133, 43, 0.45);

    opacity: .75;

    right: -10px;

}



.kenit-alo-circle {

    width: 50px;

    height: 50px;

    top: -5px;

    right: -5px;

    position: absolute;

    background-color: transparent;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

    border: 2px solid rgba(15, 133, 43, .8);

    opacity: .1;

    border-color: #0f852b;

    opacity: .5;

}



.product .pic-product:before {

    opacity: 0;

    position: absolute;

    top: 0;

    left: -75%;

    z-index: 22;

    display: block;

    content: '';

    width: 50%;

    height: 100%;

    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .5) 100%);

    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .5) 100%);

    -webkit-transform: skewX(-25deg);

    transform: skewX(-25deg);

}



.product:hover .pic-product:before {

    opacity: 1;

    -webkit-animation: shine .6s;

    animation: shine .6s;

}



.box-bg-top .bars {

    display: flex;

    justify-content: space-between;

    width: 180px;

    margin: 10px auto;

}



.box-bg-top .bars span {

    width: 40px;

    height: 4px;

    background-color: transparent;

    border: 1px solid var(--theme-color);

}



.box-bg-top {

    min-height: 250px;

    position: relative;

    text-align: center;

    margin-bottom: 10px;

    overflow: hidden;

}



.container>.box-bg-top>.container {

    width: 100%;

}



.box-bg-top .container .container {

    width: 100%;

    padding: 0;

}



.box-bg-top .box-bg-title {

    background-color: rgba(0, 0, 0, 0.5);

    text-align: center;

    height: 130%;

    width: 100%;

    position: absolute;

    left: 0;

    top: 0;

    color: #fff;

}



.box-bg-top .box-bg-title:after {

    content: '';

    /* background-color: rgba(0, 0, 0, 0.5); */

    text-align: center;

    height: 130%;

    width: 100%;

    position: absolute;

    left: 0;

    top: 0;

    color: #fff;

}



.box-bg-top .box-bg-title .title {

    position: relative;

    top: 30%;

    transform: translateY(-30%);

    z-index: 1;

}



.box-bg-top .box-bg-title .title h1.header {

    text-align: left;

    font-size: 20px;

    color: #fff;

    padding-bottom: 15px;
}



.box-bg-top .breadcrumb-box {

    background-color: transparent;

    text-align: left;

}



.box-bg-top .breadcrumb-box .btn-breadcrumb a.btn.btn-default {

    color: #fff;

}



.box-bg-top .breadcrumb-box .btn-breadcrumb span {

    font-size: 12px;

}



.box-bg-top.post_detail .title h1.header {

    text-align: left;

    font-size: 20px;

    color: #fff;

    padding-bottom: 15px;

}



.wrapper {

    padding-top: 0;

}



.box-bg-top.box-bg-center .title h1.header {

    text-align: center;

}



.box-bg-top.box-bg-center .breadcrumb-box {

    text-align: center;

}



@media (max-width: 600px) {

    .box-bg-top.box-bg-center .title h1.header {

        font-size: 22px !important;

    }
    img{height: auto !important;}

}



@-webkit-keyframes shine {

    100% {

        left: 125%;

    }

}



@keyframes shine {

    100% {

        left: 125%;

    }

}

:root {

    --pre-form-contact-padding: 10px;

    --pre-form-contact-bg_box: var(--theme-color);

    --pre-form-contact-bg_input: #fff;

    --pre-form-contact-bg_button: #fff;

    --pre-form-contact-bg_button_hover: #fff;

    --pre-form-contact-color_button: #000;

    --pre-form-contact-color_button_hover: #000;

}

.arrow_box button {
    width: 0px;
    height: 0px;
    border: 0;
}

.navigation .container {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
}


footer {
    position: relative
}

footer .widget_footer_style_1 .row-footer {
    display: grid;
    grid-template-columns: 1.5fr repeat(2, 1fr) 1.5fr;
    grid-gap: 30px
}

@media (max-width:991px) {
    footer .widget_footer_style_1 .row-footer {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width:600px) {
    footer .widget_footer_style_1 .row-footer {
        grid-template-columns: repeat(1, 1fr)
    }
}

footer .widget_footer_style_1 ul.footer-menu {
    padding: 0
}

footer .widget_footer_style_1 ul.footer-menu li a {
    display: block;
    padding: 0;
    transition: all 0.5s
}

footer .widget_footer_style_1 ul.footer-menu li a i {
    display: none
}

footer .widget_footer_style_1 iframe {
    width: 100%;
    height: 300px
}






/* Search Responsive */
.search-res {
    position: relative;
    display: block;
    width: fit-content;
}

.search-res .icon-search {
    width: 40px;
    height: 40px;
    cursor: pointer;
    text-align: center;
    line-height: 42px;
    color: #000;
    font-size: 17px;
    margin: 0px;
}

.search-res .icon-search.active {
    /* color: var(--color-red); */
    /* background: #ffffff; */
    border-radius: 100%;
}

.search-res .search-grid {
    position: absolute;
    top: 50px;
    right: 0px;
    width: 0px;
    height: 40px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid var(--color-red);
    z-index: 2;
    opacity: 0;
    border-radius: 25px;
    line-height: normal;
}

.search-res .search-grid p {
    float: left;
    width: 35px;
    height: 38px;
    cursor: pointer;
    outline: none;
    border: none;
    margin: 0px;
    font-size: 17px;
    display: block;
    color: var(--color-red);
    line-height: 40px;
    text-align: center;
}

.search-res .search-grid input {
    width: calc(100% - 35px);
    float: right;
    line-height: 38px;
    outline: none;
    border: none;
    color: var(--color-red);
}

.search-res .search-grid input::-webkit-input-placeholder {
    color: #ccc;
}

.search-res .search-grid input:-moz-placeholder {
    color: #ccc;
}

.search-res .search-grid input::-moz-placeholder {
    color: #ccc;
}

.search-res .search-grid input:-ms-input-placeholder {
    color: #ccc;
}

.fix_li {
    transform: none !important;
    background-color: #fff !important;
}
.fix_nnn{
    display: flex;
    justify-content: right;
    gap: 10px;
    align-items: center;
}
