@import url('https://fonts.googleapis.com/css?family=Quicksand:300,400,500,700&subset=vietnamese');





@font-face {
    font-family: 'Roboto';
    src:url(../fonts/Roboto/Roboto-Regular.ttf) format("truetype");
}
@font-face {
    font-family: 'Roboto-bold';
    src:url(../fonts/Roboto/Roboto-Bold.ttf) format("truetype");
}
body {
    font-family: 'Roboto';
    font-size: 14px;
    color: #161615;
    overflow-x: hidden;
}
.inter-ui-medium {
   font-family: 'Roboto'; 
}
.inter-ui-bold {
   font-family: 'Roboto-bold'; 
}

.content-video-slide img {
    width: 150px;
    height: 150px;
}

.content-video-slide {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    border-radius: 15px;
}

.img-fluid {
    object-fit: cover;
    object-position: center;
}
.hidden {
    display: none!important;
}
a {
    text-decoration: none
}
.error {
    color: red
}
.btn:focus {
    outline: 0;
    box-shadow: unset;
}
.header .head-logo img {
    padding-right: 10px;
    max-width: 165px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 15px;
}
.header {
    position: relative;
    /*height: 76px;*/
    transition: 1s all ease;
    z-index: 10000;
    box-shadow: 0 1px 3px 0 rgba(43, 43, 43, 0.2);
    background: #fff
}
.header .info-header{
    display: block;
    padding: 10px 0px;
}

.fix-banner {
    position: fixed;
    background: #fff;
}
.fix-banner .info-header{
    display: none
}
/* CHINH SUA */

.header .cart {
    display: flex;
    align-items: center;
    max-width: 100%;
    height: 100%;
    float: right;
    padding-right: 10px;
}

.header .cart a:first-child{
    margin-left: 0px;
    margin-right: 10px;
}

.header .cart a:last-child{
    margin-left: 0px;
}


.header .cart a {
    text-decoration: none;
    margin-left: 10px;
    color: #000;
}

.header .cart a:hover {
    color: #1E54A5;
}

.header .cart .scroll_acc {
    margin: 0px 20px;
}

.header .cart a span {
    position: relative;
    top: 2px;
    font-weight: 600;
}

.header .cart a img {
    margin-right: 5px;
}

.header .cart .infoCart {
    position: relative;
}

.header .cart .infoCart .backgroundCart {
    background: #FB5156;
    width: 22px;
    height: 22px;
    position: absolute;
    top: -10px;
    border-radius: 50%;
    right: -5px;
}

.header .cart .infoCart .backgroundCart .number {
    position: relative;
    top: 0px;
    right: -8px;
}

.header .cart .infoCart .backgroundCart span {
    color: #fff;
    text-align: center;
    font-size: 10px;
}

.header .cart .img-cart img{
    height: 32px
}

.header .cart .info-cart p.text-cart{
    font-weight: bold;
    margin-bottom: 8px;
    font-size: 18px;
    color: #000;
}
.header .navbar-nav {
    flex-direction: row;
    justify-content: space-between;
    /*line-height: 62px;*/
    height: 100%;
    padding-left: 10px;
}
.header .navbar-nav .nav-item {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 6px 0;
}
.header .navbar-nav .nav-link {
    font-family: 'InterUI-Medium';
    color: #161615;
    font-size: 14px;
    text-transform: uppercase;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.header .navbar-nav .nav-link i{
    font-size: 12px;
    margin-left: 5px;
}
.header .navbar-nav li.active {
    border-bottom: 3px solid #ef8c29;
    padding: 3px 0 0;
}
.header .navbar-nav .menu-parent {
    display: none;
    height: auto;
    list-style: none;
    padding: 0;
    float: left;
    position: absolute;
    top: 70px;
    z-index: 2000;
    background: #fff;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    border: solid 1px #d1d1d1;
}
.header .navbar-nav .menu-parent ul{
    padding-left: 0;
    list-style: none;
}
.header .navbar-nav li:last-child .menu-parent ul{
    width: 200px
}
.header .navbar-nav .menu-parent ul li{
    padding: 10px 25px 10px 15px;
}
.header .navbar-nav .menu-parent ul li:hover{
    background: #ffe3c7;
    font-family: 'InterUI-Medium'
}
.header .navbar-nav .menu-parent ul li a{
    text-decoration: none;
    color: #161615;
}

.header .navbar-nav .nav-item:hover .menu-parent {
    display: block
}
.header .short-url {
    list-style: none;
    margin: 0
}

.header .short-url .btn {
    font-size: 14px;
    padding: 8px 20px;
    border: 1px solid #fff;
    font-weight: bold
}
.header .short-url li a:hover {
    text-decoration: none;
}
.header form {
    display: flex;
    align-items: center;
    height: 100%;
}
.header form .form-control{
    padding-right: 30px;
}
.header form .search {
    padding-right: 5px;
    display: inline-flex;
    width: 100%
}
.header form .search input{
    font-size: 16px;
    padding: 10px 15px;
    border-radius: 0;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
}
.header form .search button{
    background: #1E54A5;
    padding: 0 20px;
    border-radius: 0;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
}

.header form .search i {
    color: #fff;
    font-size: 20px;
    font-weight: 100;
}

.header .cart i{
    font-size: 22px;
    color: #ef8c29
}
.header .cart .cnt {
    border-radius: 2em;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    height: 20px;
    right: -15px;
    line-height: 18px;
    position: absolute;
    text-align: center;
    top: 20px;
    width: 20px;
    background-color: #ff854c;
}

.header .menu-header{
    background: #F4F9FF;
    color: #000
}



.mobile-menu {
    width: 320px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    -webkit-transform: translateX(-320px);-moz-transform: translateX(-320px);-ms-transform: translateX(-320px);-o-transform: translateX(-320px);transform: translateX(-320px);-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;
    background-color: #fff;
    background-size: 80% auto;
    padding: 24px;
    box-shadow: 0 3px 18px 0 rgba(0, 0, 0, 0.12);
    z-index: 999999999;
}
.mobile-menu .fa {
    color: #363636;
    font-size: 22px;
}
.banner .mobile-bars-menu .fa {
    color: #fff;
    font-size: 22px;
}
.header .mobile-bars-menu .fa {
    color: #132833;
    font-size: 22px;
}
.header .mobile-bars-menu {
    margin-top: 20px;
    float: right;
}
.mobile-menu ul {
    list-style-type: none;
    padding-left: 0;
}
.mobile-menu ul.m-nav li {
    margin-bottom: 15px;
    font-size: 13px;
    vertical-align: text-bottom;
}
.mobile-menu ul.m-nav li a {
    color: rgba(20, 33, 61, 0.7);
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
}
.mobile-menu ul.m-nav li a img{
    margin-right: 8px;
    width: 15px
}
.mobile-menu .search {
    display: inline-flex;
    margin-bottom: 10px
}
.mobile-menu .search i{
    font-size: 14px
}

.home-page {
    margin-top: 35px
}
.home-page h1 {
    font-size: 36px;
    color: #161615;
    line-height: 1.2;
    margin-bottom: 12px;
    text-transform: capitalize;
    font-family: 'InterUI-Medium';
    /*width: 100%*/
}
.home-page h2 {
    font-size: 36px;
    text-transform: capitalize;
}
.home-page h3 {
    font-size: 24px;
    text-transform: capitalize;
}

.home-page a.more {
    text-decoration: none;
    text-transform: capitalize;
    color: #ef8c29 !important;
    font-size: 14px;
}
.home-page .img-fluid {
    width: 100%
}
/*.home-project .tab-content, .list-info .tab-content {
    margin-bottom: 60px;
}*/
.list-info .tab-content {
    margin-bottom: 60px;
}
.more {
    margin-top: 45px;
}
.more .more-btn {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    padding: 12px 32px;
    border: 0;
    border-radius: 2px;
    background-color: #ef8c29;
}

.fb-link {
    display: inline-flex
}
.fb-link .fb-share {
    display: flex;
}
.fb-link .fb-share a.share{
    border-radius: 3.2px;
    background-color: #5bb4a5;
    margin-left: 20px;
    padding: 3px 10px;
    color: #fff;
}

.paddingTop {
    padding-top: 80px
}

footer {
    background: #fff;
    color: #000;
    padding: 50px 0 0px;
}

footer .footerInfo .titleFooter {
    margin: 30px 0px;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    color: #1E54A5;
}

footer .footerInfo .location,.phone {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

footer .footerInfo .location .icon {
    margin-right: 10px;
}

footer .footerInfo .location .icon img {
    width: 40px;
    height: 40px;
}

footer .footerInfo .location .address {
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    color: #1E54A5;
}

footer .footerInfo .phone .icon {
    margin-right: 10px;
}

footer .footerInfo .phone .icon img {
    width: 40px;
    height: 40px;
}

footer .footerInfo .phone .tell a {
    font-style: normal;
    font-weight: 900;
    font-size: 24px;
    color: #1E54A5;
    text-decoration: none;
}

footer .footerInfo .phone .tell a:hover {
    color: #8b1a1d;
}

footer .titlePage {
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    color: #000000;
    margin-top: 40px;
    margin-bottom: 15px;
}

footer .pagePolicy {
    margin-bottom: 10px;
}

footer .pagePolicy a {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    color: #1E54A5;
    text-decoration: none;
}

footer .pagePolicy a:hover {
    color: #8b1a1d;
}

footer .fanpageFB img {
    width: 100%
}

footer .link_mxh {
    margin-top: 20px;
}

footer .link_mxh .link img {
    margin-right: 15px;
}

footer .link_mxh .link img:hover {
    transform: scale(1.2);
}

footer .link_map iframe {
    width: 100%
}

#btntop {
    width: 45px;
    height: 45px;
    position: fixed;
    bottom: 45px;
    right: 40px;
    cursor: pointer;
    z-index: 9999;
    background: #1E54A5;
    border-radius: 50%;
    transition: all .4s;
}

#btntop i {
    position: absolute;
    color: #fff;
    top: 14px;
    left: 17px;
    font-size: 16px;
}

#image_icon_message {
    position: fixed;
    right: 40px;
    bottom: 155px;
    vertical-align: text-bottom;
    text-align: center;
    z-index: 999999;
}

#image_icon_message img {
    width: 45px !important;
    height: 45px !important;
}

#image_icon_zalo {
    position: fixed;
    right: 40px;
    bottom: 205px;
    vertical-align: text-bottom;
    text-align: center;
    z-index: 999999;
}

#image_icon_zalo img {
    width: 50px !important;
    height: 50px !important;
}

#icon_phone_number {
    position: fixed;
    right: 40px;
    bottom: 100px;
    width: 45px;
    height: 45px;
    background: #1E54A5;
    line-height: 45px;
    vertical-align: text-bottom;
    text-align: center;
    z-index: 999999;
    border-radius: 50%;
    box-shadow: 1px 1px 1px #222;
}

#icon_phone_number i {
    font-size: 16px;
    -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
    position: absolute;
    color: #fff;
    top: 15px;
    left: 15px;
}

@-webkit-keyframes phonering-alo-circle-anim {
  0% {
    -webkit-transform: rotate(0) scale(0.5) skew(1deg);
    -webkit-opacity: 0.1;
  }
  30% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    -webkit-opacity: 0.5;
  }
  100% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
    -webkit-opacity: 0.1;
  }
}
@-webkit-keyframes phonering-alo-circle-fill-anim {
  0% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    opacity: 0.6;
  }
  50% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
    opacity: 0.6;
  }
  100% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    opacity: 0.6;
  }
}
@-webkit-keyframes phonering-alo-circle-img-anim {
  0% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
  }
  10% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
  }
  20% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg);
  }
  30% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
  }
  40% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg);
  }
  50% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
  }
  100% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
  }
}

.designer {
    background: #F3F8FF;
    padding: 10px 0px;
    text-align: center;
    margin: 0px auto;
    color: #1e54a5;
}

.designer .tringhia {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    color: #1e54a5;
}

.designer .tringhia a {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    color: #1e54a5;
    text-decoration: none;
}

.designer .tringhia a:hover {
    color: #BA0001;
}



