﻿@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Montserrat:wght@300..700&display=swap');
body{font-family: 'Montserrat', sans-serif; font-size:16px;color:#333333;}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {font-weight:700 !important}
a:hover {color:unset}
::-webkit-scrollbar {width: 8px; height:8px; }
::-webkit-scrollbar-track {background: #FFFFFF;-webkit-box-shadow: inset 1px 1px 2px #fff;border: 1px solid #fff;}
::-webkit-scrollbar-thumb {background: #c7c7c7;-webkit-box-shadow: inset 1px 1px 2px rgba(155, 155, 155, 0.4);}
::-webkit-scrollbar-thumb:hover {-webkit-box-shadow: inset 1px 1px 10px rgba(0,0,0,0.3);}
::-webkit-scrollbar-thumb:active {background: #fff;-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.3);}

::-webkit-input-placeholder {   color: #999999; font-size:14px}
:-ms-input-placeholder {  color: #999999; font-size:14px}
::placeholder { color: #999999; font-size:14px}

img{padding:0px; margin:0px; border:0px;}
a {font-size: 16px; font-family: 'Roboto', sans-serif;  color: #222; text-decoration: none}

button:focus { outline: none !important;}
.form-control:focus {  color: #495057;    border-color: #ced4da;    outline: 0;    box-shadow: none;}
.navbar-toggler {  font-size: 1.1rem;    line-height: 1;    background-color: transparent;    border: none;}
.navbar {background:#ffffffa8}
@media screen and (max-width: 1200px) {
    .container {  width: 100% !important;  max-width:unset !important   }
}
 
@media screen and (max-width: 992px) {
    .container {padding-right: 8px;padding-left: 8px;}
    .container .row{margin-right: -8px !important;margin-left: -8px !important;}
    .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto { padding-right: 8px;    padding-left: 8px;}
}

@media screen and (max-width: 767px) {
    .container {padding-right: 5px;padding-left: 5px;}
    .container .row{margin-right: -5px !important;margin-left: -5px !important;}
    .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto { padding-right: 10px;    padding-left: 10px;}
}

/*--header--*/
.navbar .navbar-collapse.collapse.show .nav-link {color: #fff !important}
.navbar .navbar-collapse.collapse.show .mntop .dropdown-menu {background: #ffffffe0 !important}

.navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link {color: #c23030;}
.dropdown-menu {right:0; left:unset; min-width: 14rem;}
header { width: 100%; z-index: 999;}
.stick {background:#f3f3f3cc; position: fixed !important;}
.navbar-tool-icon-box {    position: relative;    width: 2.875rem;    height: 2.875rem;    transition: color 0.25s ease-in-out;    border-radius: 50%;    line-height: 2.625rem;    text-align: center;}
.navbar-tool .navbar-tool-label {    position: absolute;    top: -1.3125rem;    right: -0.6rem;    width: 1.25rem;    height: 1.25rem;    border-radius: 50%;    background-color: #c23030;    color: #fff;    font-size: .75rem;    font-weight: 500;    text-align: center;    line-height: 1.25rem;}
.navbar-tool-icon {    font-size: 1.25rem;    line-height: 2.875rem;}
.navbar-tool-icon-box.bg-secondary {  background-color: transparent !important;}
.iptsearch{border-radius: 1.25rem !important; background:url('/images/home/ico_search.png') no-repeat right center #ffffffb0 !important; height: calc(1.2em + .75rem + 2px) !important}
.icomn {color: #333;text-shadow: #6d6b62 1px 1px 2px;}
.icocontrol {color:#f1f1f1; font-size:30px;}

.wrapBanner {  position: relative;width:100%; display:block;}
.capbanner{padding:80px 0 0; vertical-align: middle; text-align:center; color:#fff}
.capbanner .tip{    font-size: 35px; padding:5px 0;    text-align: center;    font-weight: 400 !important;}
@media screen and (max-width: 1900px) {
    body{background-size: 100% !important}
}
@media screen and (max-width: 1200px) {
    .logotop img{width:auto}
    .capbanner{padding:30px 0 0;}
}
@media screen and (max-width: 1100px) {
    .logotop img{width:80%; margin:0; padding:0}
    .logotop {padding:0px; margin:auto}
    .capbanner{display:none;}
}

@media screen and (max-width: 992px) {
    .logotop img{width:100%}
    .iptsearch{width: 160px !important;}
    .logotop{width:120px}
    .fixed-top {padding-left: 12px;  padding-right: 0;   /* background: #00000061;*/}
}
@media screen and (max-width: 767px) {
    .logotop img{width:170px}
    .iptsearch{border-radius: 1.25rem !important; width: 150px !important; background:transparent !important; height: calc(1em + .75rem + 2px) !important; max-width:155px}
    header{/*background:#c23030;*/}
     .fixed-top {background: #00000098;}
}
@media screen and (max-width: 600px) {
    .logotop img{width:150px}
    .formsearch{display:none}
}
@media (min-width: 992px) {
    .dropdown-menu .dropdown-toggle:after{border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid}
    .dropdown-menu .dropdown-menu{margin-left:0;margin-right:0}
    .dropdown-menu li{position:relative}
    .nav-item .submenu{display:none;position:absolute;left:100%;top:-7px}
    .nav-item .submenu-left{right:100%;left:auto}
    .dropdown-menu > li:hover{background-color:#f1f1f1}
    .dropdown-menu > li:hover > .submenu{display:block}
}

.bg-light {background:#f3f5ed78 !important}
.mntop {}
.navbar-dark .navbar-nav .nav-link {color: #333;text-shadow: #c1bfb5 1px 1px 2px;}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { color: #333}
.mntop .nav-link{cursor:pointer; font-size:16px; font-weight:400; color: #000;}
.mntop .dropdown-menu {background:#ffffffe3; border:none}
.mntop .dropdown-item.active, .dropdown-item:active {  color: #c23030;    text-decoration: none;    background-color: transparent;}
.mntop  .dropdown-item:focus, .dropdown-item:hover {  color: #c23030;    text-decoration: none;    background-color: transparent;}

.toast-container {   z-index: 9999 !important;    position: fixed;    left: 0;    right: 0;    width: 100%;    padding-right: 1.5rem;    padding-left: 1.5rem;    z-index: 1040;}
.toast-top-left, .toast-top-center, .toast-top-right {    top: 1.5rem;}


/*--body--*/

.btn-outline-primary{    color: #72bf46 !important; font-size:16px; border-radius: 1.5rem; padding: 6px 25px;  background-color: #fff;    background-image: none;    border-color: #d38629;}
.btn-outline-primary:hover { background-color: #fff !important;    border-color: #d38629 !important;}
.btn-outline-primary.focus, .btn-outline-primary:focus {    box-shadow: none !important;}
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show>.btn-primary.dropdown-toggle {  color: #fff;    background-color: #d38629;    border-color: #d38629;}
.btn-primary {    color: #fff;    background-color: #a01f05;    border-color: #a01f05;    box-shadow: none;}
.btn-primary:hover {  color: #fff;    background-color: #d38629;    border-color: #f0ae4e;}
.bg-secondary, .breadcrumb {
    background-color: #f6f9fc !important;
}
.wrapbd{}
.wrapcapx {color: #d38629;}
.colordf{color:#d38629}
.colordf2{color:#c23030}
.contentcomm {line-height:150%; font-size:16px;}
.img, .img img{max-width:100%}
/* Form login */
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: #a01f05;
    background-color: rgba(0,0,0,0);
    border-color: #a01f05;
}
.nav-tabs .nav-link.active::before {
    background-color: #a01f05;
}
.nav-tabs .nav-link {
    position: relative;
    border: 0;
    color: #4b566b;
    font-weight: normal;
}
.nav-tabs .nav-link::before {
    position: absolute;
    display: block;
    bottom: 0;
    left: 1.25rem;
    width: calc(100% - (1.25rem * 2));
    height: 1px;
    transition: color 0.25s ease-in-out,background-color 0.25s ease-in-out,box-shadow 0.25s ease-in-out,border-color 0.25s ease-in-out;
    background-color: transparent;
    content: '';
}

/*logined*/

.logined{position:relative;float:right}
.logined .togglelogin{cursor:pointer}
.logined .togglelogin .avatartop{width:28px;border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%;padding:0 5px; color:#d7d1d1}
.logined .togglelogin .fa{font-size:20px;color:#d7d1d1}
.logined .dropdown-login{position:absolute;background:#1da249;min-width:210px;right:-18px;list-style:none;padding:5px 15px;display:none;margin:0;top:35px}
.logined .dropdown-login li{color:#fff;cursor:pointer;font-size:14px;padding:3px 0}
.logined .dropdown-login li a{color:#fff;font-size:14px}
.logined .dropdown-login li.divider{width:100%;height:1px;margin:3px 0!important;overflow:hidden;padding:0;background-color:#e5e5e5;border-bottom:1px solid #fff}



/*pagging*/
.pagination {overflow: hidden; margin-bottom:25px; clear:both; padding: 20px 0 10px; font-size:14px; display:inline-block}
.pagination td{}
.pagination a,.pagination span.extend,.pagination span.current {font-size:18px; font-weight:bold; float:left;text-shadow: 0 1px 0 #FFF;margin-right : 3px;color: #333;padding: 6px 10px 3px;}
.pagination a:hover {color:#000;}
.pagination .pgfocus {background: #a01f05;	}
.pagination .pgChar{}
.pagination .pgnum{}
@media only screen and ( max-width: 576px ) {
    .pagination .pgtxt{display:none}
    .pagination .pgtxt{display:none}
    .pagination a, .pagination span.extend, .pagination span.current {  font-size: 16px;    font-weight: bold;    float: left;    text-shadow: 0 1px 0 #FFF;    margin-right: 3px;    color: #333;    padding: 6px 6px 3px;}
}


.paging {padding:5px 25px; text-align:right; font-size:18px;}
.paging a {text-decoration:none; color:#333; }
.paging a:hover,.paging a.activea {color:#c60000;}

.clbold{font-weight:bold; font-size:16px;}
.csspaging{	padding:5px;font-size:16px;}
.csspagingx{padding:5px;font-size:16px;}
.csspagingx a{color:black;display:block;font-size:16px;font-weight:bold;text-align:center;font-family: Roboto;font-style: italic;}
.gpchar{font-size:30px !important; width:30px !important; height:45px !important; border:none !important; background:none !important}
.csspaging a{ color:#333; border:1px solid #ddd; background:#f5f5f5; display:block;font-size:16px;font-weight:bold;height:26px;padding:0;text-align:center; width:28px;-moz-border-radius: 3px;-webkit-border-radius: 3px; border-radius: 3px;}
.pagefocus{color:#fff !important; background:#b81226  !important;  }

/*search*/
.overlay{height:100%;width:100%;display:none;position:fixed;z-index:9;top:0;left:0;background-color:#000;background-color:rgba(0,0,0,0.9)}
.overlay-content{position:relative;top:25%;width:80%;text-align:center;margin:auto}
.overlay .closebtn{position:absolute;top:60px;right:45px;font-size:60px;cursor:pointer;color:#fff}
.overlay .closebtn:hover{color:#ccc}
.overlay input[type=text]{padding:11px;font-size:17px;border:none;float:left;width:80%;background:#fff}
.overlay input[type=text]:hover{background:#f1f1f1}
.overlay button{float:left;width:20%;padding:15px;background:#ddd;font-size:17px;border:none;cursor:pointer}
.overlay button:hover{background:#bbb}

/*-----footer--------*/
/*-----------footer-----------*/
footer{background-color:#333;padding:40px 0 0; color:#fff}
.media{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}
.media .ico{font-size:1.5rem;color:#FFF}
.media span{color:#fff;text-align:center;font-size:20px;font-weight:lighter;border:1px solid #fff;border-radius:50%;width:40px;height:40px;display:inline-block;margin:0 5px;padding:8px 0 0}
.hr-light{border-color:#ccc}
.divlogof {display:flex; color:#fff}
.foshare a{ color: #fff; text-align:center;  font-size: 20px;  font-weight: lighter;  border: 1px solid #fff;  border-radius: 50%;  width: 40px; height: 40px;  display: inline-block;  margin: 0 5px;  padding: 8px 0 0 0;}
.foshare a:hover, .fomenu li a:hover{color:#f17c00}

.divsabio{background:#f1f1f1;padding:10px 0;text-align:center;font-size:16px; color:#333}
.divsabio a{font-size:16px;color:#333!important}
.widget-title{margin-bottom:1.125rem;font-size:20px;text-transform:uppercase;font-weight:500!important}
.widget-list{margin:0;padding:0;list-style:none}
.widget-list-item{margin-bottom:.375rem}
.widget-light .widget-list-link{color:#fff}
.widget-list-link{display:block;transition:color .25s ease-in-out;color:#fff;font-size:.875rem;font-weight:400}


.ft-contact{position:fixed;bottom:170px;left:auto;right:10px;margin:0;z-index:200001!important}
.ft-contact .item{margin-bottom:10px;margin-left:0}
.ft-contact .item span.ab{margin-right:6px;height:30px;line-height:30px;background:#00aff2;border-radius:5px;position:relative;margin-left:7px;padding:0 13px;cursor:pointer;transition:all .5s}
.ft-contact .item a{color:#fff;display:flex;-webkit-flex-direction:row-reverse;flex-direction:row-reverse;align-items:center;text-decoration:none;transition:all .5s}
.ft-contact .item span.ab label{font-size:13px;margin:0;color:#fff;line-height:30px;display:block}
.ft-contact .icon-zalo .icon{background:#fff url(/images/landing/zalo.png);background-position:center;background-size:70%;background-repeat:no-repeat!important;border:1px solid #00afee}
.ft-contact .item .icon{width:40px;height:40px;line-height:40px;text-align:center;display:inline-block;border-radius:31px;font-size:20px;list-style:none}
.ft-contact .item span.ab i{left:auto;right:-5px;transform:translateY(-50%) rotate(179deg);position:absolute;left:-5px;top:50%;transform:translateY(-50%);color:#00aff2}
.ft-contact .icon-phone .icon{background:#6db703}
.ft-contact .icon-phone .icon i{padding-top:10px}