@font-face {
 font-family:'NukeVietIcons'
}
[class^="icon-"],
[class*=" icon-"] {
 display:inline-block;
 font:normal normal normal 14px/1 NukeVietIcons;
 font-size:inherit;
 text-rendering:auto;
 -webkit-font-smoothing:antialiased;
 -moz-osx-font-smoothing:grayscale;
 transform:translate(0,0);
 vertical-align:-10%
}
.icon-lg {
 font-size:1.33333333em;
 line-height:.75em;
 vertical-align:-25%
}
.icon-horizon {
 width:14px
}
.icon-lg.icon-horizon {
 width:22px
}
.icon-nukeviet:before {
 content:"\e607"
}
.icon-nukeviet_sm:before {
 content:"\e608"
}
.icon-callcenter:before {
 content:"\e609"
}
.icon-today:before {
 content:"\e600"
}
.icon-qrcode:before {
 content:"\e601"
}
.icon-enter:before {
 content:"\e602"
}
.icon-exit:before {
 content:"\e603"
}
.icon-yahoo:before {
 content:"\e604"
}
.icon-old-phone:before {
 content:"\e606"
}
.icon-icq:before {
 content:"\e605"
}
.icon-viber:before {
 content:"\e60a"
}
.icon_new {
 background:url(../images/icons/new.gif) no-repeat;
 display:inline-block;
 width:33px;
 height:15px
}
.icon_new_small {
 background:url(../images/squared-blue.png) no-repeat 0 8px
}
.icon_list {
 background:url(../images/arrow_left_orange.png) no-repeat 0 8px
}
.text-black {
 color:#000
}
.text-white {
 color:#fff
}
.text-normal {
 font-weight:400
}
.text-bold {
 font-weight:800
}
.form-horizontal .control-label {
 margin-bottom:0;
 padding-top:7px;
 text-align:right
}
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-ss-block,
.visible-ss-inline,
.visible-ss-inline-block {
 display:none
}
.hidden-ss-block {
 display:block
}
.hidden-ss-inline {
 display:inline
}
.hidden-ss-inline-block {
 display:inline-block
}
.margin {
 margin:10px
}
.margin-right {
 margin-right:10px
}
.margin-left {
 margin-left:10px
}
.margin-top {
 margin-top:10px
}
.margin-bottom {
 margin-bottom:10px
}
.margin-sm {
 margin:4px
}
.margin-right-sm {
 margin-right:4px
}
.margin-left-sm {
 margin-left:4px
}
.margin-top-sm {
 margin-top:4px
}
.margin-bottom-sm {
 margin-bottom:4px
}
.margin-lg {
 margin:15px
}
.margin-right-lg {
 margin-right:15px
}
.margin-left-lg {
 margin-left:15px
}
.margin-top-lg {
 margin-top:15px
}
.margin-bottom-lg {
 margin-bottom:15px
}
.padding-top {
 padding-top:10px
}
.padding-left {
 padding-left:10px
}
.padding-right {
 padding-right:10px
}
.padding-bottom {
 padding-bottom:10px
}
.boder-top {
 border-top-width:1px;
 border-top-style:solid;
 border-top-color:#ccc
}
.boder-bottom {
 border-bottom-width:1px;
 border-bottom-style:solid;
 border-bottom-color:#ccc
}
.border-left {
 border-left-width:1px;
 border-left-style:solid;
 border-left-color:#ccc
}
.border-right {
 border-right-width:1px;
 border-right-style:solid;
 border-right-color:#ccc
}
.column-margin-left {
 margin-left:10px
}
.bg-gainsboro {
 background-color:#dcdcdc
}
.bg-lavender {
 background-color:#eee
}
.load-bar {
 display:inline-block;
 vertical-align:middle;
 width:33px;
 height:8px;
 background:transparent url(../../../assets/images/load_bar.gif);
 margin:auto 10px
}
.centered {
 text-align:center;
 font-size:0
}
.centered > div {
 float:none;
 display:inline-block;
 text-align:left;
 font-size:14px
}
.nv-info {
 border-width:1px;
 border-style:solid;
 border-color:#dcdcdc;
 border-radius:3px;
 -webkit-border-radius:3px;
 background-color:#f7f7f7;
 color:#333;
 padding:10px
}
.nv-info.error {
 background-color:#EFD7D7;
 border-color:#DCA8A6
}
.nv-info.success {
 background-color:#edf4;
 border-color:#82b2dc
}
.nv-info:before {
 display:inline-block;
 font-family:FontAwesome;
 font-size:20px;
 line-height:1;
 vertical-align:middle;
 margin-right:5px
}
.nv-info.error:before {
 content:"\f057";
 color:#de495b
}
.nv-info.success:before {
 content:"\f13a";
 color:#68D044
}
.clear {
 clear:both
}
.fl {
 float:left
}
.fr {
 float:right
}
.pointer {
 cursor:pointer
}
.middle {
 vertical-align:middle
}
.align-bottom {
 vertical-align:bottom
}
.align-top {
 vertical-align:top
}
ul,
ol {
 list-style:none
}
.input-group-btn {
 font-size:14px
}
.radius-top-left {
 -webkit-border-top-left-radius:5px;
 border-top-left-radius:5px
}
.radius-top-right {
 -webkit-border-top-right-radius:5px;
 border-top-right-radius:5px
}
.radius-bottom-left {
 -webkit-border-bottom-left-radius:5px;
 border-bottom-left-radius:5px
}
.radius-bottom-right {
 -webkit-border-bottom-right-radius:5px;
 border-bottom-right-radius:5px
}
.radius {
 -webkit-border-radius:5px;
 border-radius:5px
}
.box-shadow {
 box-shadow:0 0 4px rgba(0,0,0,0.15);
 -webkit-box-shadow:0 0 0 rgba(0,0,0,0.15)
}
.fix-box {
 position:inherit;
 margin-left:0
}
.well {
 padding:6px;
 line-height:18px
}
.well66 {
 padding:1px;
 line-height:28px
}
.well1 {
 min-height:20px;
 padding:3px;
 margin-bottom:1px;
 margin-top:12px;
 background-color:#fefcfae6;
 border:0;
 border-radius:3px
}
.well333 {
 padding:3px;
 margin-bottom:1px;
 background-color:#ffffffd9;
 border-radius:3px
}
.well p {
 margin:0
}
input[type=text].required,
input[type=password].required,
input[type=email].required,
input[type=number].required,
input[type=search].required,
input[type=tel].required,
input[type=time].required,
input[type=url].required,
input[type=url].required,
textarea.required,
select.required,
label.required {
 background-image:url(../images/icons/required.png);
 background-position:right center;
 background-repeat:no-repeat
}
textarea.required {
 background-position:right 10px
}
select.required {
 background-position:calc(100% - 15px) 10px
}
label.required {
 padding-right:20px
}
label.radio-box,
label.check-box {
 font-weight:400;
 margin-right:20px;
 cursor:pointer
}
div.radio-box,
div.check-box {
 background-color:#fff;
 border-width:1px;
 border-style:solid;
 border-color:#ccc;
 border-radius:4px;
 box-shadow:0 1px 1px rgba(0,0,0,0.075) inset;
 padding:10px
}
.has-error div.radio-box,
.has-error div.check-box {
 border-color:#de495b
}
.display-inline-block {
 display:inline-block
}
.display-table {
 display:table
}
.display-table > * {
 display:table-row
}
.display-table > * > * {
 display:table-cell;
 padding:5px
}
.tooltip-inner {
 max-width:250px;
 padding:10px;
 color:#fff;
 text-align:left;
 background-color:#255986;
 border-radius:4px;
 height:auto;
 overflow:auto
}
.tooltip.top .tooltip-arrow,
.tooltip.top-left .tooltip-arrow,
.tooltip.top-right .tooltip-arrow {
 border-top-color:#255986
}
.tooltip.right .tooltip-arrow {
 border-right-color:#255986
}
.tooltip.left .tooltip-arrow {
 border-left-color:#255986
}
.tooltip.bottom .tooltip-arrow,
.tooltip.bottom-left .tooltip-arrow,
.tooltip.bottom-right .tooltip-arrow {
 border-bottom-color:#255986
}
.tooltip-inner img.pull-left {
 margin:3px 5px 1px 0
}
.tooltip-inner img.pull-right {
 margin:3px 1px 0 5px
}
.ui-widget {
 font-size:12px;
 font-weight:400;
 line-height:18px
}
.ui-datepicker {
 width:18em
}
.ui-datepicker select.ui-datepicker-month {
 width:59%;
 font-weight:400
}
.ui-datepicker select.ui-datepicker-year {
 width:39%;
 font-weight:400
}
figure {
 position:relative;
 padding:3px;
 display:block;
 float:left;
 margin:5px 10px 10px 0;
 text-align:center
}
figure.article {
 background-color:#939393
}
figure.left {
 float:left;
 margin:5px 10px 10px 0
}
figure.right {
 float:right;
 margin:5px 0 10px 10px
}
figure.center {
 float:none;
 background:transparent;
 margin:0 auto 10px;
 padding-top:0;
 text-align:center
}
figure.noncaption {
 background:transparent;
 padding:0
}
figcaption {
 text-align:center;
 margin-top:5px;
 font-weight:700
}
figure figcaption {
 font-size:12px;
 font-weight:400
}
figure.article figcaption {
 color:#fff
}
figure.article.center figcaption {
 color:inherit
}
figure.avatar {
 margin-top:0
}
figure.avatar figcaption {
 position:absolute;
 bottom:12px;
 left:3px;
 width:calc(100% - 6px);
 background-color:#357ebd;
 color:#fff;
 font-size:11px
}
html,
body {
 width:100%;
 height:100%;
 margin:0;
 padding:0
}
body {
 color:#333;
 font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
 font-size:16px;
 line-height:1.42857;
 background-color:#fff
}
a,
a:link,
a:active,
a:visited {
 color:#555
}
a:hover,
a:focus {
 text-decoration:none;
 color:#0e2132
}
a.dimgray {
 color:#707070
}
a.dimgray:hover {
 color:#0e2132
}
a.black {
 color:#333
}
a.black:hover {
 color:#0e2132
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
 margin:0;
 padding:0;
 line-height:1.5
}
h1,
h2,
h3,
h4,
h5,
h6 {
 font-weight:700
}
.title {
 font-size:22px;
 
}
.titletuyet {
 font-size:24px;
margin-left: 36px; /* Sửa thành tùy chọn 15px ở đây */


}
.hometext {
 font-weight:700
}
.bodytext {
 word-break:keep-all;
 max-width:100%;
 overflow-x:hidden;
 overflow-y:visible;
 line-height:1.7em
 
}
.bodytexttuyet {
 word-break:keep-all;
 max-width:100%;
 overflow-x:hidden;
 overflow-y:visible;
 line-height:1.7em;
 margin-left: 16px; /* Sửa thành 15px ở đây */
 
 
}
.bodytext p {
 margin-bottom:15px
}
.bodytext ol {
 list-style-type:decimal
}
.bodytext ul {
 list-style-type:disc;
 padding-left:40px;
 margin-bottom:10px
}
.bodytext li {
 margin-bottom:0
}
.bodytext div.alert {
 margin-bottom:7px;
 margin-top:4px
}
iframe {
 border:0
}
.m-bottom {
 margin-bottom:10px
}
.wraper {
 position:relative;
 width:1080px;
 margin:0 auto
}
.container,
.rel {
 position:relative
}
.fa-fix {
 margin-right:-5px
}
.fa-pointer {
 cursor:pointer
}
.fa-horizon {
 width:14px
}
.fa-lg.fa-horizon {
 width:22px
}
h3.sm {
 font-size:16px
}
span.keyword {
 background-color:#ff0
}
.nv-fullbg {
 min-height:100%;
 background-color:#fff
}
a.btn {
 color:#fff
}
.body-bg {
 position:absolute;
 top:0;
 left:0;
 min-width:100%;
 max-height:40%;
 background-color:#f5404e;
 background: linear-gradient(rgba(110, 107, 107, 0.46), rgba(69, 85, 100, 0.74)), url('https://img.upanh.moe/nM9Fx175/blob.jpg') center/cover;
 
}
#header {
 position:relative;
 background:transparent;
 margin-top:166px;
 display:-webkit-flex;
 -webkit-align-items:center;
 display:flex;
 align-items:center
}
#header .logo {
 position:relative;
 margin:-150px 20px 20px 20px ;
 padding:1px 10px 2px 1px;
}
#header .logo h1,
#header .logo .site_name {
 display:none
}
#header .logo h2,
#header .logo .site_description {
 color:transparent;
 font-size:18px;
 font-weight:700;
 font-style:italic;
 font-family:"Times New Roman";
 line-height:0;
 margin:0;
 padding:0;
 display:block
}
.breadcrumbs-wrap {
 position:relative
}
.breadcrumbs-wrap .display {
 height:35px;
 overflow:hidden;
 margin-left:0
}
.breadcrumbs {
 display:inline-block
}
.breadcrumbs li {
 float:left;
 margin:0 .5em 0 1em
}
.breadcrumbs a,
.show-subs-breadcrumbs {
 background-color:#dcdcdc;
 padding:.6em 1em;
 float:left;
 text-decoration:none;
 color:#333;
 position:relative
}
.breadcrumbs a:hover,
.show-subs-breadcrumbs:hover {
 background-color:#a6c8e6
}
.breadcrumbs a:before {
 content:"";
 position:absolute;
 top:50%;
 margin-top:-1.5em;
 border-width:1.5em 0 1.5em 1em;
 border-style:solid;
 border-color:#dcdcdc #dcdcdc #dcdcdc transparent;
 left:-1em
}
.breadcrumbs a:hover:before {
 border-color:#a6c8e6 #a6c8e6 #a6c8e6 transparent
}
.breadcrumbs a:after,
.show-subs-breadcrumbs:after {
 content:"";
 position:absolute;
 top:50%;
 margin-top:-1.5em;
 border-top-width:1.5em;
 border-top-style:solid;
 border-top-color:transparent;
 border-bottom-width:1.5em;
 border-bottom-style:solid;
 border-bottom-color:transparent;
 border-left-width:1em;
 border-left-style:solid;
 border-left-color:#dcdcdc;
 right:-1em
}
.breadcrumbs a:hover:after,
.show-subs-breadcrumbs:hover:after {
 border-left-color:#a6c8e6
}
.subs-breadcrumbs {
 border-left:1px solid 0.1); border-right:1px solid 0; border-bottom:1px solid 0; margin:0; padding:0; background-color:#fff linear-gradient(to bottom,rgba(0,0,0,0) 0px,rgba(0,0,0,0.1) 100%);
 background-repeat:repeat;
 background-attachment:scroll;
 background-position: 0 0;
 position:absolute;
 left:0;
 top:40px;
 border-top:medium none;
 box-shadow:0 .063em .25em rgba(7,20,34,0.25);
 display:none;
 z-index:999999
}
.subs-breadcrumbs.open {
 display:block
}
.subs-breadcrumbs li:last-child,
.subs-breadcrumbs li:last-child a,
.subs-breadcrumbs {
 border-bottom-left-radius:4px;
 border-bottom-right-radius:4px
}
.subs-breadcrumbs li,
.subs-breadcrumbs a {
 display:block;
 float:none
}
.subs-breadcrumbs a {
 line-height:40px;
 height:40px;
 overflow:hidden;
 padding:0 5px;
 background-color:#fff;
 
}
.subs-breadcrumbs li:not(:last-child) a {
 border-bottom:1px solid rgba(0,0,0,0.1); 
}
.subs-breadcrumbs a:hover {
 background-color:rgba(0,0,0,0.1)
}
.subs-breadcrumbs a em {
 display:inline-block;
 margin-right:5px;
 color:#707070
}
.show-subs-breadcrumbs {
 padding-right:5px;
 margin-right:7px;
 width:30px;
 text-align:center
}
.fix_banner_left {
 width:111px;
 height:auto;
 position:fixed;
 margin-top:-190px;
 margin-left:-3px;
 display:none
}
.fix_banner_right {
 width:111px;
 height:5px;
 position:fixed;
 margin-top:-351px;
 right:2px;
 display:none
}
.second-nav {
 z-index:3
}
.second-nav .bg {
 background:#fff
}
.third-nav {
 position:relative;
 margin-bottom:6px
}
.third-nav .row {
 border-bottom-width:1px;
 border-bottom-style:solid;
 border-bottom-color:#fff
}
.third-nav .bg {
 background-color:#fff;
 padding:0
}
.third-nav .current-time {
 display:inline-block;
 vertical-align:middle;
 margin-right:10px;
 line-height:37px
}
.third-nav ul + .current-time {
 float:right;
 margin-top:-35px
}
.headerSearch {
 margin:.15em 0
}
.headerSearch input {
 border-color:#ccc;
 background-color:#fff;
 border:2px solid #dfe6e8;
 border-radius:4px;
 
 
}
.headerSearch input:hover,
.headerSearch input:focus {
 background-color:#fff
}
.headerSearch .btn-info {
 background-color:#10c961;
 border-color:#10c961;
 color:#fff
}
.headerSearch .btn-info:focus,
.headerSearch .btn-info.focus,
.headerSearch .btn-info:hover,
.headerSearch .btn-info:active,
.headerSearch .btn-info.active {
 background-color:#e6b902;
 border-color:#caa202;
 color:#333
}
#menusite .navbar-default {
 background-color:#333;
 border-bottom-color:#428BCA;
 border-bottom-width:1px;
 border-bottom-style:solid;
 -webkit-border-top-left-radius:5px;
 -webkit-border-top-right-radius:5px;
 border-top-left-radius:5px;
 border-top-right-radius:5px
 
}
#menusite .navbar-defaulttuyet {
 background-color:#ee06a9;
 border-bottom-color:#fff;
 border-bottom-width:1px;
 position:fixed;
 margin: 100px 1px 1px 11px;
 border-bottom-style:solid;
 -webkit-border-top-left-radius:5px;
 -webkit-border-top-right-radius:5px;
 border-top-left-radius:5px;
 border-top-right-radius:5px
 
 
}
#menusite .navbar-default .navbar-nav > li {
 margin-left:1px
}
#menusite .navbar-default .navbar-nav > li:first-child {
 margin-left:4px
}
#menusite .navbar-default .navbar-nav > li:last-child {
 margin-right:4px
}
#menusite .navbar-default .navbar-nav > li > a {
 color:#fff;
 font-size:16px
}
#menusite .navbar-nav > li > a {
 white-space:nowrap
}
#menusite .dropdown-menu {
 background-color:#FF5400;
 border-color:#aaa;
 border-width:1px;
 border-style:solid;
 -webkit-border-bottom-left-radius:5px;
 -webkit-border-bottom-right-radius:5px;
 border-bottom-left-radius:5px;
 border-bottom-right-radius:5px
 
}
#menusite .dropdown-menutuyet {
 background-color:#000;
 border-color:#aaa;
 border-width:1px;
 border-style:solid;
 -webkit-border-bottom-left-radius:5px;
 -webkit-border-bottom-right-radius:5px;
 border-bottom-left-radius:5px;
 border-bottom-right-radius:5px
 
 
}
#menusite .dropdown-menu > li {
 border-bottom:1px solid rgba(255,255,255,0.5); 
}
#menusite .dropdown-menu > li:last-child {
 border-bottom:none
}
#menusite .dropdown-menu > li > a {
 color:#fff;
 line-height:30px;
 padding:3px 15px
}
#menusite .navbar-default .navbar-nav > li > a:hover,
#menusite .navbar-default .navbar-nav > li > a:focus,
#menusite .navbar-default .navbar-nav > .active > a,
#menusite .navbar-default .navbar-nav > .active > a:hover,
#menusite .navbar-default .navbar-nav > .active > a:focus,
#menusite .navbar-default .navbar-nav > .open > a,
#menusite .navbar-default .navbar-nav > .open > a:hover,
#menusite .navbar-default .navbar-nav > .open > a:focus {
 background:linear-gradient(to bottom,#f52d15 0%,#f52d15 100%);
 color:#fff
}
#menusite .dropdown-menu > li > a:hover,
#menusite .dropdown-menu > li > a:focus,
#menusite .dropdown-menu > .active > a,
#menusite .dropdown-menu > .active > a:hover,
#menusite .dropdown-menu > .active > a:focus,
#menusite .navbar .navbar-nav .open .dropdown-menu > li > a:hover,
#menusite .navbar .navbar-nav .open .dropdown-menu > li > a:focus,
#menusite .navbar .navbar-nav .open .dropdown-menu > .active > a,
#menusite .navbar .navbar-nav .open .dropdown-menu > .active > a:hover,
#menusite .navbar .navbar-nav .open .dropdown-menu > .active > a:focus {
 background:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.1) 100%);
 color:#333
}
#menusite .dropdown-submenu {
 position:relative
}
#menusite .dropdown-submenu li a {
 color:#333;
 display:block
}
#menusite .dropdown-submenu>.dropdown-menu {
 top:0;
 left:100%;
 margin-top:-6px;
 margin-left:-1px;
 -webkit-border-radius:0 5px 5px 5px;
 border-radius:0 5px 5px 5px
}
#menusite .dropdown-submenu:hover>.dropdown-menu {
 display:block
}
#menusite .dropdown-submenu>a:after {
 display:block;
 content:" ";
 float:right;
 width:0;
 height:0;
 border-color:transparent;
 border-style:solid;
 border-width:5px 0 5px 5px;
 border-left-color:#333;
 margin-top:10px;
 margin-right:-5px
}
#menusite .dropdown-submenu.pull-left {
 float:none
}
#menusite .dropdown-submenu.pull-left>.dropdown-menu {
 left:-100%;
 margin-left:10px;
 -webkit-border-radius:5px 0 5px 5px;
 border-radius:5px 0 5px 5px
}
.header-nav {
 position:absolute;
 top:-9px;
 left:0;
 height:25px;
 width:100%;
 color:#dcdcdc;
 background-color:transparent
}
.header-nav a {
 color:#dcdcdc
}
.header-nav a:hover {
 color:#fff
}
.header-nav a.button {
 border:0 solid 0; display:inline-block;
 padding:8px;
 color:#fff;
 line-height:1;
 background-color:#FF5400;
 border-radius:5px;
 -webkit-border-radius:5px
}
.header-nav a.button:hover,
.header-nav a.active {
 background-color:#245682;
 color:#fff
}
#tip,
#ftip {
 position:absolute;
 color:#333;
 background-color:#eee;
 max-width:485px;
 box-shadow:0 2px 10px rgba(0,0,0,0.2);
 z-index:1000;
 display:none
}
#tip {
 top:51px;
 right:0;
 min-height:51px;
 margin-right:10px;
 -webkit-border-bottom-left-radius:5px;
 border-bottom-left-radius:5px;
 -webkit-border-bottom-right-radius:5px;
 border-bottom-right-radius:5px
}
#ftip {
 bottom:45px;
 left:0;
 min-height:51px;
 margin-left:10px;
 -webkit-border-top-left-radius:5px;
 border-top-left-radius:5px;
 -webkit-border-top-right-radius:5px;
 border-top-right-radius:5px
}
#tip .bg,
#ftip .bg {
 padding:15px;
 border-bottom-color:#aaa;
 border-bottom-width:1px;
 border-bottom-style:solid
}
#tip .bg {
 -webkit-border-bottom-left-radius:5px;
 border-bottom-left-radius:5px;
 -webkit-border-bottom-right-radius:5px;
 border-bottom-right-radius:5px
}
#ftip .bg {
 -webkit-border-top-left-radius:5px;
 border-top-left-radius:5px;
 -webkit-border-top-right-radius:5px;
 border-top-right-radius:5px
}
#tip .tip-footer,
#ftip .tip-footer {
 background-color:#e5e5e5;
 border-width:1px;
 border-style:solid;
 border-color:#ccc;
 padding:10px
}
#tip .tip-footer {
 -webkit-border-bottom-left-radius:5px;
 border-bottom-left-radius:5px;
 -webkit-border-bottom-right-radius:5px;
 border-bottom-right-radius:5px;
 margin:10px -15px -16px
}
#ftip .ftip-footer {
 margin:10px -15px -15px
}
#tip h3,
#ftip h3 {
 font-size:13px;
 font-weight:700;
 margin-bottom:15px
}
#tip ul {
 margin:0;
 padding:0
}
#tip a {
 color:#333
}
#tip .socialList a {
 color:#fff
}
.social-icons,
.personalArea {
 position:fixed;
 background-color:#fff;
 border-radius:31px;
 padding:2px;
 top:1px;
 right:400px;
 z-index:1000
}
.contactDefault {
 position:fixed;
 line-height:5px;
 margin:14px 20px;
 top:1px;
 z-index:1000
}
.personalArea {
 margin-left:50px
}
.personalArea a.button.user,
.personalArea a.button.user:hover {
 width:30px;
 height:30px;
 margin-top:11px;
 border-width:0;
 border-radius:15px;
 -webkit-border-radius:15px;
 background-color:transparent;
 background-size:contain
}
.qlist {
 position:absolute;
 left:0;
 bottom:35px;
 width:100%;
 background-color:#d9e8f4;
 border-width:1px;
 border-style:solid;
 border-color:#a6c8e6;
 padding:10px;
 z-index:1000;
 display:none
}
.counter.display-table {
 width:100%
}
.counter span + span {
 text-align:right
}
.guestBlock {
 width:350px
}
.guestBlock > h3 {
 border-bottom-width:1px;
 border-bottom-style:solid;
 border-bottom-color:#ccc
}
.guestBlock > h3 > a {
 display:inline-block;
 line-height:34px;
 padding:0 17px;
 background-color:#e5e5e5;
 -webkit-border-top-right-radius:5px;
 border-top-right-radius:5px;
 -webkit-border-top-left-radius:5px;
 border-top-left-radius:5px
}
.guestBlock > h3 > a:hover,
.guestBlock > h3 > a.current {
 background-color:#ccc
}
.socialList,
.contactList {
 list-style:none;
 padding:0;
 margin:0
}
.socialList li,
.contactList li {
 display:inline-block;
 margin-right:10px
}
.socialList li:last-child,
.contactList li:last-child {
 margin-right:0
}
.socialList li a {
 display:block;
 width:28px;
 height:28px;
 line-height:28px;
 background-color:#565D56;
 color:#dcdcdc;
 text-align:center;
 font-size:16px;
 -webkit-border-radius:3px;
 border-radius:3px;
 -webkit-transition:all .4s ease;
 transition:all .4s ease
}
.socialList li a[href*="facebook"]:hover {
 background-color:#3D5D8C
}
.socialList li a[href*="google"]:hover,
.socialList li a[href*="youtube"]:hover {
 background-color:#DD4B39
}
.socialList li a[href*="twitter"]:hover {
 background-color:#50A0D7
}
.socialList li a[href*="feeds"]:hover {
 background-color:#F90
}
.socialList li .fa {
 margin-right:-4px
}
#body {
 background-color:#fff;
 border-color:#fff;
 border-style:solid;
 border-width:0 0;
 box-shadow:0 0 0px rgba(0,0,0,0.15);
 -webkit-box-shadow:0 0 0px rgba(0,0,0,0.15)
}
.footerNav2 {
 position:relative;
 width:100%;
 background-color:#111;
 padding:5px 0;
 color:#dcdcdc
}
.footerNav2 .theme-change {
 float:left;
 margin-left:10px;
 margin-right:10px;
 height:40px
}
.footerNav2 .theme-change a,
.footerNav2 .theme-change span {
 display:inline-block;
 margin-top:5px;
 margin-right:10px;
 line-height:30px;
 width:30px;
 background-color:#245682;
 color:#428BCA;
 text-align:center;
 border-radius:15px;
 -webkit-border-radius:15px
}
.footerNav2 .theme-change span {
 color:#dcdcdc;
 background-color:#428BCA
}
.footerNav2 .theme-change a:hover,
.footerNav2 .theme-change span:hover {
 color:#fff;
 background-color:#428BCA
}
.footerNav2 .theme-change .fa-lg {
 font-size:14px
}
.footerNav2 .theme-change .fa-mobile {
 font-size:20px;
 margin-right:-2px
}
.footerNav2 .bttop {
 float:right;
 width:40px;
 height:40px;
 margin-right:10px
}
.footerNav2 .bttop a {
 display:block;
 line-height:40px;
 background-color:#245682;
 color:#428BCA;
 font-size:14px;
 text-align:center;
 border-radius:20px;
 -webkit-border-radius:20px
}
.footerNav2 .bttop a:hover {
 color:#fff;
 background-color:#428BCA
}
.footerNav2 .bttop em {
 margin-right:-2px
}
#footer {
 position:relative;
 min-height:300px;
 width:100%;
 border-top-width:1px;
 border-top-style:solid;
 border-top-color:#FF5400;
 border-bottom-width:0;
 border-bottom-style:solid;
 background:linear-gradient(280deg, #111827 0%, #111827 50%, #111827 100%);
 padding:6px;
 font-size:18px
}
#footer,
#footer a {
 color:#fff
}
#footer h3 {
 font-weight:700;
 font-size:22px;
 letter-spacing:.5px;
 text-transform:uppercase;
 margin-bottom:10px;
 color:#dcdcdc
}
#footer h3 a {
 color:inherit
}
#footer p {
 margin:0;
 padding:0
}
#footer .menu {
 list-style:none;
 padding:0;
 margin:0
}
#footer .menu li {
 position:relative;
 display:inline-block;
 width:49%;
 padding:0;
 margin:0
}
#footer .menu li:nth-child(2n+1) {
 padding-right:8px
}
#footer .menu li:nth-child(2n) {
 padding-left:7px
}
#footer .menu li a {
 display:block;
 white-space:nowrap;
 border-bottom-width:1px;
 border-bottom-color:#6aa3d5;
 border-bottom-style:dotted;
 padding:8px 0
}
#footer .menu li a:before {
 content:"\f111";
 color:#dcdcdc;
 font-family:FontAwesome;
 font-size:5px;
 padding-right:6px;
 vertical-align:middle
}
#footer .menu li a:hover {
 border-bottom-color:#fff;
 color:#fff
}
#footer .menu li a:hover:before {
 color:#fff
   
   
   
}
#footer888 {
 position:relative;
 min-height:100px;
 width:100%;
 border-top-width:1px;
 border-top-style:solid;
 border-top-color:#FF5400;
 border-bottom-width:0;
 border-bottom-style:solid;
 background:linear-gradient(280deg, #111 0%, #111 50%, #111 100%);
 padding:6px;
 font-size:18px
}
#footer888,
#footer888 a {
 color:#fff
}
#footer888 h3 {
 font-weight:700;
 font-size:22px;
 letter-spacing:.5px;
 text-transform:uppercase;
 margin-bottom:10px;
 color:#dcdcdc
}
#footer888 h3 a {
 color:inherit
}
#footer888 p {
 margin:0;
 padding:0
}
#footer888 .menu {
 list-style:none;
 padding:0;
 margin:0
}
#footer888 .menu li {
 position:relative;
 display:inline-block;
 width:49%;
 padding:0;
 margin:0
}
#footer888 .menu li:nth-child(2n+1) {
 padding-right:8px
}
#footer888 .menu li:nth-child(2n) {
 padding-left:7px
}
#footer888 .menu li a {
 display:block;
 white-space:nowrap;
 border-bottom-width:1px;
 border-bottom-color:#6aa3d5;
 border-bottom-style:dotted;
 padding:8px 0
}
#footer888 .menu li a:before {
 content:"\f111";
 color:#dcdcdc;
 font-family:FontAwesome;
 font-size:5px;
 padding-right:6px;
 vertical-align:middle
}
#footer888 .menu li a:hover {
 border-bottom-color:#fff;
 color:#fff
}
#footer888 .menu li a:hover:before {
 color:#fff   
    
   
   
}
.copyright {
 color:#dcdcdc
}
.copyright span a {
 color:#dcdcdc
}
.copyright span a:hover {
 color:#fff
}
.company_info li {
 display:table;
 clear:both
}
.company_info .company_name {
 text-transform:none
}
.company_info li > em,
.company_info li > span {
 display:table-cell;
 vertical-align:middle
}
.company_info li.company_name > span {
 display:inline
}
.company_info li em {
 font-size:1.4em;
 width:26px;
 text-align:center;
 padding-right:10px
}
.company-map {
 width:100%;
 height:300px
}
.nv-hr {
 clear:both;
 height:1px;
 border-bottom-width:1px;
 border-bottom-color:#dcdcdc;
 border-bottom-style:solid;
 margin:10px 0;
 -webkit-box-shadow:0 1px 1px rgba(0,0,0,0.1);
 -box-shadow:0 1px 1px rgba(0,0,0,0.1)
}
.nv-hr.nv-hr-lg {
 margin:20px 0
}
.nv-hr.nv-hr-sm {
 margin:5px 0
}
.nv-social-share {
 list-style:none;
 margin:0;
 padding:4px 5px 0
}
.nv-social-share li {
 display:inline-block;
 margin-bottom:0;
 height:20px
}
.nv-social-share li.facebook {
 position:relative;
 top:-4px;
 padding-right:40px
}
.nv-captcha {
 vertical-align:middle
}
.nv-list-item {
 list-style:none;
 margin:0;
 padding:0
}
.nv-list-item li {
 padding:4px;
 margin:0
}
.nv-list-item.sm li {
 padding:2px
}
.nv-list-item.xsm li {
 padding:1px
}
.nv-list-item.lg li {
 padding:10px
}
.sub-list-icon > li:first-child > :before,
.cat-icon:before {
 content:"\f114";
 font-family:FontAwesome;
 font-size:inherit;
 font-weight:400;
 text-decoration:none;
 display:inline-block;
 vertical-align:middle;
 margin-right:4px;
 margin-top:-3px
}
.sub-list-icon > li + li > :before {
 content:"\f10c";
 font-family:FontAwesome;
 font-size:8px;
 font-weight:400;
 text-decoration:none;
 display:inline-block;
 vertical-align:middle;
 margin-right:10px
}
.sub-list-icon > li:first-child + li > :before {
 content:"\f101";
 font-size:12px;
 margin-top:-2px
}
.list-none {
 list-style:none;
 margin:0;
 padding:0
}
.nv-block-banners {
 position:relative;
 margin-bottom:10px;
 text-align:center
}
.nv-block-banners .link {
 position:absolute;
 top:0;
 left:0
}
.nv-block-banners img {
 max-width:100%;
 height:auto
}
.nv-block-rss li {
 border-bottom-width:1px;
 border-bottom-color:#dcdcdc;
 border-bottom-style:solid
}
.nv-block-rss li:last-child {
 border:none;
 padding-bottom:0
}
.nv-block-rss li:first-child {
 padding-top:0
}
.nv-block-rss img {
 padding:4px;
 line-height:1.42857143;
 background-color:#fff;
 border-width:1px;
 border-style:solid;
 border-color:#dcdcdc;
 border-radius:4px;
 -webkit-transition:all .2s ease-in-out;
 transition:all .2s ease-in-out;
 display:inline-block;
 max-width:100%;
 height:auto;
 position:relative;
 top:4px;
 margin-right:10px;
 margin-bottom:5px
}
.nv-infodie {
 margin:0 auto;
 box-shadow:0 0 4px rgba(0,0,0,0.15);
 -webkit-box-shadow:0 0 4px rgba(0,0,0,0.15);
 border-width:1px;
 border-color:#dcdcdc;
 border-style:solid;
 background-color:#fff;
 position:absolute;
 min-height:300px;
 min-width:300px;
 display:table
}
.nv-infodie .panel-body {
 display:table-cell;
 vertical-align:middle
}
.panel-body p {
 margin:0
}
.panel-body ul {
 margin-left:3px;
 padding:0
}
.panel-body ul li {
 margin-bottom:10px
}
.panel-body img {
 margin-right:5px
}
.panel-body ul li:last-child {
 margin-bottom:0
}
.nv-infodie .logo {
 max-width:90%;
 margin-bottom:10px
}
input[type="checkbox"],
input[type="radio"] {
 border-width:1px;
 border-style:solid;
 border-color:#aaa;
 clear:none;
 cursor:pointer;
 display:inline-block;
 line-height:0;
 height:16px;
 margin:3px 4px 0 0;
 outline:0;
 padding:0;
 text-align:center;
 vertical-align:middle;
 width:16px;
 min-width:16px;
 -webkit-appearance:none;
 -webkit-box-sizing:border-box;
 box-sizing:border-box;
 color:#707070;
 -webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.1);
 -moz-box-shadow:inset 0 1px 2px rgba(0,0,0,.1);
 box-shadow:inset 0 1px 2px rgba(0,0,0,.1)
}
input[type=radio] {
 border-radius:50%;
 margin-right:4px;
 line-height:inherit
}
input[type=checkbox]:disabled,
input[type=radio]:disabled,
input[type=checkbox]:disabled:checked:before,
input[type=radio]:disabled:checked:before {
 opacity:.7
}
input[type=checkbox]:checked:before,
input[type=radio]:checked:before {
 float:left;
 display:inline-block;
 vertical-align:middle;
 width:14px;
 font:normal 14px/1 FontAwesome;
 speak:none;
 -webkit-font-smoothing:antialiased;
 -moz-osx-font-smoothing:grayscale
}
input[type=checkbox]:checked:before {
 content:'\f00c';
 margin:0;
 color:#333
}
input[type=radio]:checked:before {
 content:'\2022';
 text-indent:-9999px;
 border-radius:50px;
 font-size:24px;
 width:6px;
 height:6px;
 margin:4px;
 line-height:16px;
 background-color:#333
}
.img-thumbnail {
 background-color:#fff;
 border:0;
 border-radius:3px;
 max-width:100%;
 padding:1px
}
.navbar-inverse {
 background-color:#d9e8f4;
 border-color:#2a6496
}
.navbar-inverse .navbar-nav > li > a {
 color:#FFF
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
 color:#fff;
 background-color:#2a6496
}
.panel-heading {
 padding:10px
}
.panel-primary>.panel-heading>a {
 color:#fff
}
.panel-primary>.panel-heading>a:hover {
 color:#dcdcdc
}
table caption {
 color:#357ebd;
 text-align:left;
 font-size:13px;
 font-weight:700;
 line-height:22px;
 padding:0 0 5px 2px
}
blockquote {
 font-size:13px
}
.modal-header .close {
 margin-top:-2px
}
button.close {
 padding:0;
 cursor:pointer;
 background:0 0;
 border:0;
 -webkit-appearance:none
}
.close {
 float:right;
 font-size:21px;
 font-weight:700;
 line-height:1;
 color:#000;
 opacity:.2
}
.modal-body {
 padding:1px
}
#sitemodal .modal-dialog {
 position:relative;
 width:auto;
 max-width:600px;
 text-align:center;
 font-size:0
}
#sitemodal .modal-content {
 width:auto;
 display:inline-block;
 font-size:14px;
 text-align:left
}
#sitemodal .close,
#sitemodalTerm .close {
 position:absolute;
 right:-10px;
 bottom:-10px;
 width:24px;
 height:24px;
 background-color:#000;
 color:#fff;
 font-size:11px;
 opacity:.8;
 border-width:2px;
 border-style:solid;
 border-color:#ccc;
 border-radius:12px
}
#sitemodal .close:hover {
 opacity:1
}
@media (max-width: 619px) {
 #sitemodal .modal-dialog {
  margin-left:10px;
  margin-right:10px
 }
 #sitemodal .modal-content {
  display:block
 }
}
#sb-container {
 z-index:99999999
}
.chromeframe {
 position:fixed;
 top:0;
 right:0;
 left:0;
 width:100%;
 z-index:99999999999999;
 background-color:#ff0;
 color:#000;
 height:25px;
 line-height:25px;
 padding:.2em 0;
 text-align:center
}
#timeoutsess {
 display:none
}
#timeoutsess a {
 color:#2f70a7
}
.featured-products > .row {
 margin-bottom:35px
}
.featured-products > .row:last-child {
 margin-bottom:0
}
.featured-products .img-thumbnail {
 margin-top:3px;
 margin-bottom:10px;
 background-color:#fff;
 border-width:1px;
 padding:0
}
.featured-products ul {
 margin:0;
 padding:0
}
.featured-products ul > li {
 margin-bottom:5px
}
.featured-products ul > li:before {
 font-family:'FontAwesome';
 content:"\f105";
 margin-right:5px
}
[class^="lev-"],
[class*=" lev-"] {
 display:inline-block
}
[class^="lev-"]:before,
[class*=" lev-"]:before {
 font-family:FontAwesome;
 font-size:inherit;
 margin-right:5px
}
.lev-1:before {
 content:"\f005 \f005 \f005"
}
.lev-2:before {
 content:"\f005 \f005 \f006"
}
.lev-3:before {
 content:"\f005 \f006 \f006"
}
.lev-user:before {
 content:"\f007"
}
.contact-result {
 position:absolute;
 top:40px;
 left:5%;
 width:90%;
 float:left;
 z-index:2;
 padding:30px 20px;
 display:none
}
.module-menu {
 display:block;
 float:left;
 width:100%;
 background-color:#333
}
.module-menu ul {
 margin:0;
 padding:0
}
.module-menu a {
 border-bottom:1px solid rgba(0,0,0,0.1); display:block;
 background-color:#428BCA;
 background-image:url('linear-gradient(to%20right,#428BCA 4px,#428BCA 4px)');
 background-repeat:repeat-x;
 color:#fff;
 text-decoration:none;
 margin:0;
 cursor:pointer; padding-left:20px; padding-right:10px; padding-top:9px; padding-bottom:9px
}
.module-menu a:before {
 font-family:'FontAwesome';
 content:"\f105";
 margin-right:5px
}
.module-menu a.home:before {
 content:"\f07c"
}
.module-menu a.active {
 background-color:#a6c8e6
}
.module-menu a:hover,
.module-menu a.active,
.module-menu a:focus {
 color:#333;
 text-decoration:none;
 background-image:linear-gradient(to right,#42cac5 4px,rgba(0,0,0,0) 4px)
}
.calendar-icon {
 background-image:url(../../../assets/images/calendar.jpg);
 background-position:right 6px center;
 background-repeat:no-repeat;
 padding-right:26px
}
.nv-alert {
 position:fixed;
 top:25%;
 right:0;
 left:0;
 width:350px;
 margin:auto;
 z-index:99999999999999;
 text-align:center;
 padding-top:30px;
 padding-bottom:30px
}
.tms_cat_title {
 background:#eee;
 border-bottom:1px solid #eee;
 border-radius:2px
}
.tms_cat_title a {
 color:#f20b0b;
 font-size:26px;
 margin-left:10px;
 line-height:38px
}
.tms_primary1_title1 {
 margin-top:0;
 margin-bottom:0;
 float:center;
 font-size:26px;
 line-height:33px;
 color:#333;
 font-weight:600;
 text-shadow:1px 1px 1px rgba(73,74,79,0.4)
}




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

/* Container chính */
.nhs-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1px;
    font-family: Arial, sans-serif;
    color: #333;
}

/* Thanh cam kết (Benefits Bar) */
.nhs-benefits-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 30px;
    font-size: 14px;
    font-weight: 600;
}
.nhs-benefit-item {
    margin: 5px 10px;
}
.nhs-check {
    color: #cc0000;
    font-weight: bold;
    margin-right: 5px;
}

/* Tiêu đề mục */
.nhs-section-header {
    text-align: center;
    margin-bottom: 20px;
}
.nhs-section-header h2 {
    font-size: 38px;
    color: #1a3b5c; /* Màu xanh đen đậm */
    font-weight: 700;
    margin: 0;
    position: relative;
    display: inline-block;
    padding-bottom: 15px;
}
.nhs-section-header h2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background-color: #e31837; /* Đỏ */
}

/* Lưới hiển thị danh mục */
.nhs-grid-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    /* Giữ khoảng cách khi zoom */
    padding: 10px; 
}

/* Thẻ Card */
.nhs-card {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    /* Cập nhật transition cho transform và box-shadow */
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

/* --- HIỆU ỨNG HOVER KHI DI CHUỘT VÀO Ô --- */
.nhs-card:hover {
    /* Hiệu ứng Zoom lên (phóng to 5%) và di chuyển nhẹ lên trên */
    transform: scale(1.05) translateY(-5px);
    /* Tăng bóng mờ để tạo cảm giác nổi */
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

/* Phần trên của Card (Chứa icon) */
.nhs-card-top {
    height: 160px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* Đảm bảo nền phần icon không bị zoom quá lố */
    background-size: cover;
    background-position: center;
}
.nhs-bg-blue { background-color: #f4f7f9; }
.nhs-bg-pink { background-color: #fff5f5; }
.nhs-bg-green { background-color: #f2f9f6; }
.nhs-bg-yellow { background-color: #fffcf0; }

.nhs-icon {
    width: 220px;
    height: 220px;
    object-fit: contain;
}

/* Phần nội dung Card */
.nhs-card-body {
    padding: 25px 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.nhs-card-title {
    font-size: 18px;
    color: #1a3b5c;
    margin: 0 0 15px 0;
    font-weight: 700;
}

.nhs-card-desc {
    font-size: 18px;
    color: #666;
    line-height: 1.5;
    margin-bottom: 15px;
}
.nhs-small-text {
    font-size: 18px;
}

/* Danh sách tính năng (Card 1) */
.nhs-feature-list {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
    text-align: center;
}
.nhs-feature-list li {
    font-size: 18px;
    color: #555;
    margin-bottom: 8px;
}

/* Nút bấm */
.nhs-btn {
    display: block;
    padding: 12px 15px;
    text-decoration: none;
    border-radius: 6px;
    font-weight: 600;
    font-size: 14px;
    margin-top: auto; /* Đẩy nút xuống dưới cùng */
    transition: background-color 0.3s ease;
}
.nhs-btn-blue {
    background-color: #1f3b5e;
    color: #fff !important;
}
.nhs-btn-red {
    background-color: #e31837;
    color: #fff !important;
}

/* --- HIỆU ỨNG ĐỔI MÀU NÚT KHI DI CHUỘT VÀO Ô --- */
.nhs-card:hover .nhs-btn-blue {
    /* Nút xanh đổi sang màu xanh đậm hơn khi hover vào ô */
    background-color: #152942;
}

.nhs-card:hover .nhs-btn-red {
    /* Nút đỏ đổi sang màu đỏ đậm hơn (màu rượu) khi hover vào ô */
    background-color: #b7152b;
}

/* Giữ hiệu ứng hover riêng của nút nếu cần (tùy chọn) */
/*
.nhs-btn-blue:hover {
    background-color: #1a304e;
}
.nhs-btn-red:hover {
    background-color: #a00e23;
}
*/

/* Responsive (Thiết kế cho Mobile & Tablet) */
@media (max-width: 1024px) {
    .nhs-grid-cards {
        grid-template-columns: repeat(2, 1fr);
    }
    .nhs-benefits-bar {
        justify-content: center;
    }
}

@media (max-width: 600px) {
    .nhs-grid-cards {
        grid-template-columns: 1fr;
    }
    .nhs-section-header h2 {
        font-size: 24px;
    }
    .nhs-benefit-item {
        width: 100%;
        text-align: center;
    }
}


/* --- MỤC Ô XEM GIÁ SỈ --- */

.btn-nhaphangsi {
  position: relative;
  display: inline-block;
  padding: 12px 46px;
  background-color: #152942;
  color: #ffffff !important; /* Giữ chữ luôn màu trắng */
  font-family: Arial, sans-serif;
  font-size: 19px;
  font-weight: bold;
  text-decoration: none;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  cursor: pointer;
}

/* Tạo vệt sáng ẩn bên trái nút */
.btn-nhaphangsi::before {
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.4),
    transparent
  );
  transform: skewX(-25deg);
  transition: all 0.6s ease;
}

/* Hiệu ứng di chuột (Hover) */
.btn-nhaphangsi:hover {
  background-color: #1c3658;
  color: #ff9001 !important;  /* Đảm bảo giữ màu trắng khi hover */
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.25);
}

/* Cho vệt sáng quét qua khi hover */
.btn-nhaphangsi:hover::before {
  left: 125%;
}

/* Hiệu ứng khi nhấp (Active) */
.btn-nhaphangsi:active {
  transform: translateY(-1px) scale(0.99);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}



/* --- MỤC Ô TẢI BÁO GIÁ--- */

.btn-nhaphangsibaogia {
  position: relative;
  display: inline-block;
  padding: 12px 36px;
  background-color: #e31837;
  color: #fff !important; /* Giữ chữ luôn màu trắng */
  font-family: Arial, sans-serif;
  font-size: 19px;
  font-weight: bold;
  text-decoration: none;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  cursor: pointer;
}

/* Tạo vệt sáng ẩn bên trái nút */
.btn-nhaphangsibaogia::before {
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.4),
    transparent
  );
  transform: skewX(-25deg);
  transition: all 0.6s ease;
}

/* Hiệu ứng di chuột (Hover) */
.btn-nhaphangsibaogia:hover {
  background-color: #1c3658;
  color: #ff9001 !important;  /* Đảm bảo giữ màu trắng khi hover */
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.25);
}

/* Cho vệt sáng quét qua khi hover */
.btn-nhaphangsibaogia:hover::before {
  left: 125%;
}

/* Hiệu ứng khi nhấp (Active) */
.btn-nhaphangsibaogia:active {
  transform: translateY(-1px) scale(0.99);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}





/* --- Phần 3 ảnh chạy Mục phân phối sỉ --- */

/* Container chính của Slider */
.nhaphangsi-slider-container {
  position: relative;
  width: 100%;
  max-width: 360px; /* Điều chỉnh chiều rộng tối đa tùy giao diện */
  margin: 0 auto;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

/* Khung chuyển động: 3 slide = 300% */
.slider-track {
  display: flex;
  width: 300%; 
  animation: smoothSlide 12s ease-in-out infinite;
}

/* Khi rê chuột vào Slider thì tạm dừng chuyển động */
.nhaphangsi-slider-container:hover .slider-track {
  animation-play-state: paused;
}

/* Định dạng từng slide (chiếm 1/3 của slider-track) */
.slide-item {
  width: 33.333%;
  padding: 0 5px;
  box-sizing: border-box;
}

/* Hình ảnh và hiệu ứng Hover */
.slide-item img {
  width: 100%;
  height: 230px;
  display: block;
  border-radius: 8px;
  object-fit: cover;
  transition: transform 0.4s ease, filter 0.4s ease;
}

.slide-item:hover img {
  transform: scale(1.03);
  filter: brightness(1.05);
  cursor: pointer;
}

/* Nút điều hướng (Nếu có dùng HTML nút bấm) */
.slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  transition: background 0.3s ease, transform 0.3s ease;
}

.slider-arrow:hover {
  background: #e65100; /* Màu cam chủ đạo */
  transform: translateY(-50%) scale(1.15);
}

/* Keyframes trượt qua 3 vị trí */
@keyframes smoothSlide {
  0%, 25% {
    transform: translateX(0);
  }
  35%, 60% {
    transform: translateX(-33.333%);
  }
  70%, 95% {
    transform: translateX(-66.666%);
  }
  100% {
    transform: translateX(0);
  }
}





/* ======================================================
   CẤU HÌNH MENU MOBILE
   ====================================================== */
:root {
  --nhs-bottom-space: 15px; /* Khoảng cách từ đáy màn hình */
  --nhs-left-space: 15px;   /* Khoảng cách từ lề trái màn hình */
  --nhs-menu-width: 200px;   /* Chiều rộng của khung Menu */
  --nhs-z-index: 999999;    /* Tăng tối đa để luôn nổi trên cùng */
}

/* ======================================================
   CÔ LẬP CÁC QUY TẮC ĐỂ TRÁNH XUNG ĐỘT TRÊN NHAPHANGSI.VN
   ====================================================== */

/* Reset cứng cho Wrapper */
div.nhs-mobile-menu-wrapper {
  position: fixed !important;
  bottom: var(--nhs-bottom-space) !important;
  left: var(--nhs-left-space) !important;
  width: var(--nhs-menu-width) !important;
  z-index: var(--nhs-z-index) !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  background-color: #ffffff !important;
  border: 2px solid #f2494d !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18) !important;
  user-select: none !important;
  display: flex !important;
  flex-direction: column-reverse !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.4 !important;
}

/* Ép tất cả thẻ con dùng border-box */
div.nhs-mobile-menu-wrapper * {
  box-sizing: border-box !important;
}

/* Ẩn Checkbox Hack */
div.nhs-mobile-menu-wrapper input#nhs-menu-checkbox {
  display: none !important;
  position: absolute !important;
  opacity: 0 !important;
}

/* Thanh Header chứa Home + Nút Menu */
div.nhs-mobile-menu-wrapper .nhs-menu-header {
  display: flex !important;
  align-items: center !important;
  background-color: #ffffff !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

/* Reset cho thẻ a Icon Home */
div.nhs-mobile-menu-wrapper a.nhs-home-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 14px !important;
  color: #1e293b !important;
  text-decoration: none !important;
  border-right: 1px solid #f1f5f9 !important;
  background-color: #f8fafc !important;
  transition: background-color 0.2s, color 0.2s !important;
  margin: 0 !important;
  height: auto !important;
  line-height: 1 !important;
}
div.nhs-mobile-menu-wrapper a.nhs-home-btn:hover {
  background-color: #f1f5f9 !important;
  color: #2563eb !important;
}

/* Reset cho Label Toggle Menu */
div.nhs-mobile-menu-wrapper label.nhs-menu-toggle {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  cursor: pointer !important;
  background-color: #ffffff !important;
  transition: background-color 0.2s !important;
  margin: 0 !important;
  height: auto !important;
  line-height: 1.2 !important;
}
div.nhs-mobile-menu-wrapper label.nhs-menu-toggle:hover {
  background-color: #f8fafc !important;
}

/* Mũi tên xoay */
div.nhs-mobile-menu-wrapper svg.nhs-arrow-icon {
  width: 16px !important;
  height: 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.5 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  display: block !important;
}

/* Danh mục con (Xổ lên trên) - Reset ul */
div.nhs-mobile-menu-wrapper ul.nhs-submenu {
  max-height: 0 !important;
  overflow: hidden !important;
  transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
  background-color: #ffffff !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
  width: 100% !important;
}

/* Khi Checkbox active -> Mở danh mục & Xoay mũi tên */
div.nhs-mobile-menu-wrapper input#nhs-menu-checkbox:checked ~ ul.nhs-submenu {
  max-height: 350px !important;
}
div.nhs-mobile-menu-wrapper input#nhs-menu-checkbox:checked ~ div.nhs-menu-header svg.nhs-arrow-icon {
  transform: rotate(180deg) !important;
}

/* Reset thẻ li */
div.nhs-mobile-menu-wrapper li.nhs-submenu-item {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid #f8fafc !important;
  display: block !important;
}
div.nhs-mobile-menu-wrapper li.nhs-submenu-item:last-child {
  border-bottom: none !important;
}

/* Reset thẻ a liên kết con */
div.nhs-mobile-menu-wrapper a.nhs-submenu-link {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 6px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #334155 !important;
  text-decoration: none !important;
  transition: background-color 0.2s, color 0.2s !important;
  background: transparent !important;
  line-height: 1.3 !important;
}
div.nhs-mobile-menu-wrapper a.nhs-submenu-link:hover {
  background-color: #f8fafc !important;
  color: #2563eb !important;
}

/* Styling Icon SVG */
div.nhs-mobile-menu-wrapper svg.nhs-icon {
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
  fill: none !important;
  stroke: #64748b !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transition: stroke 0.2s !important;
  display: block !important;
}
div.nhs-mobile-menu-wrapper a.nhs-submenu-link:hover svg.nhs-icon {
  stroke: #2563eb !important;
}

/* Nổi bật cho Báo giá & Nhóm Zalo */
div.nhs-mobile-menu-wrapper a.nhs-highlight {
  background-color: #f0fdf4 !important;
  color: #15803d !important;
}
div.nhs-mobile-menu-wrapper a.nhs-highlight svg.nhs-icon {
  stroke: #16a34a !important;
}
div.nhs-mobile-menu-wrapper a.nhs-highlight:hover {
  background-color: #dcfce7 !important;
  color: #166534 !important;
}




/* ======================================================
   CẤU HÌNH ảnh sản phẩm dưới ảnh chính (TỐI ƯU ĐA THIẾT BỊ)
   ====================================================== */

.custom-slider-container {
    width: 100%;
    margin-bottom: 10px;
}

.slider-wrapper {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory; 
    /* Bật hiệu ứng trượt quán tính siêu mượt trên các máy iPhone/iPad */
    -webkit-overflow-scrolling: touch; 
    gap: 1px; /* Tăng khoảng cách nhẹ để dễ thao tác chạm trên điện thoại */
    padding-bottom: 2px; 
    width: 100%;
    
    /* === Tuỳ chỉnh thanh cuộn cho trình duyệt FIREFOX === */
    scrollbar-width: thin; 
    scrollbar-color: #ccc #f1f1f1; 
}

.slider-item {
    flex: 0 0 auto;
    width: 100px; /* Chiều rộng ảnh ngang trên Máy tính / Máy tính bảng */
    scroll-snap-align: start;
}

.slider-item img {
    width: 100%;
    height: 100px; 
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #eaeaea; 
    /* Ngăn chặn lỗi hiển thị bóng mờ (ghost image) khi giữ và vuốt ảnh trên mobile */
    -webkit-user-drag: none; 
}

/* === Tuỳ chỉnh thanh cuộn ngang (CHROME, SAFARI, EDGE, CỐC CỐC) === */
.slider-wrapper::-webkit-scrollbar {
    height: 6px; 
}

.slider-wrapper::-webkit-scrollbar-track {
    background: #f1f1f1; 
    border-radius: 4px;
}

.slider-wrapper::-webkit-scrollbar-thumb {
    background: #ccc; 
    border-radius: 4px;
}

.slider-wrapper::-webkit-scrollbar-thumb:hover {
    background: #999; 
}

/* ======================================================
   TỐI ƯU RIÊNG CHO ĐIỆN THOẠI (Màn hình < 768px)
   ====================================================== */
@media (max-width: 768px) {
    .slider-item {
        /* Thu nhỏ chiều rộng khung ảnh trên mobile để người dùng thấy được nhiều ảnh hơn cùng lúc */
        width: 120px; 
    }
    
    .slider-item img {
        /* Giảm chiều cao tương ứng để giữ tỉ lệ khung hình chữ nhật đẹp mắt */
        height: 80px; 
    }
    
    .slider-wrapper::-webkit-scrollbar {
        /* Làm thanh cuộn mỏng lại trên điện thoại để tiết kiệm diện tích */
        height: 3px; 
    }
}




/* ==========================================
   1. VIDEO CUOI TRANG
   ========================================== */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background-color: #f4f4f9;
  padding: 20px;
  color: #333;
}

/* Tiêu đề chính của khối video */
.section-title {
  text-align: center;
  font-size: 1.8rem;
  margin-bottom: 24px;
  color: #1a1a1a;
  font-weight: 700;
}

/* ==========================================
   2. LƯỚI GRID HÀNG 3 VIDEO (RESPONSIVE)
   ========================================== */
.video-grid {
  display: grid;
  /* Mặc định co giãn thông minh cho màn hình nhỏ/vừa */
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px; /* Khoảng cách giữa các ô video */
  max-width: 1200px;
  margin: 0 auto;
}

/* ==========================================
   3. CẤU TRÚC THẺ CHỨA VIDEO (VIDEO CARD)
   ========================================== */
.video-card {
  background-color: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Hiệu ứng nổi nhẹ khi di chuột vào card */
.video-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

/* ==========================================
   4. TỶ LỆ CHUẨN 16:9 CHO IFRAME YOUTUBE
   ========================================== */
.video-wrapper {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* Tỷ lệ khung hình 16:9 (9 / 16 * 100) */
  background-color: #000;
}

.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* ==========================================
   5. THÔNG TIN CHỮ BÊN DƯỚI (NẾU CÓ)
   ========================================== */
.video-info {
  padding: 16px;
  flex-grow: 1;
}

.video-info h3 {
  font-size: 1.05rem;
  margin-bottom: 8px;
  color: #2c3e50;
  line-height: 1.4;
  font-weight: 600;
}

.video-info p {
  font-size: 0.875rem;
  color: #666;
  line-height: 1.5;
}

/* ==========================================
   6. CẤU HÌNH CỐ ĐỊNH 3 CỘT CHO DESKTOP
   ========================================== */
@media (min-width: 900px) {
  .video-grid {
    grid-template-columns: repeat(3, 1fr); /* Cố định đúng 3 cột trên màn hình > 900px */
  }
}