body{
	margin: auto;	
	font-family: 'Montserrat', sans-serif;
	max-width: 1920px;
    color: #222;
    background: #fffcf5;
}
a{color: #fff !important}
p{
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
}
ul{padding: 0;}
ul li{
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
    list-style: none;
    margin-bottom: 10px;
}
img.fancybox-image {
    background: #fff;
}
.w100{width: 100% !important;}
.w95{max-width: 95% !important;}
.w90{max-width: 90% !important;}
.w80{max-width: 80% !important;}
.w75{max-width: 75% !important;}
.section{padding: 35px 0}
.white{color: #fff !important}
.xanh{color: #005897!important;}
.delay-12000 {
    -webkit-animation-delay:12s;
    -moz-animation-delay:12s;
    -o-animation-delay:12s;
    animation-delay:12s;
}
.btn-thesong{
    color: #243760 !important;
    border-radius: unset;
    font-size: 1rem;
    font-weight: 700;
    min-width: 180px;
}
.btn-thesong.btn1{
    background: #CBEBFB;
    border: 0.7259px solid #1A3360;
}
.btn-thesong.btn2{
    background: #FFF098;
    border: 0.7259px solid #1A3360;
    margin-left: 10px;
}
.title-green{
    background: url(./images/bg-title-green.svg) no-repeat;
    background-size: contain;
    background-position: center;
    padding: 10px;
    color: #fff;
}
.title-white{
    background: url(./images/bg-title-white.svg) no-repeat;
    background-size: contain;
    background-position: center;
    padding: 10px;
    color: #F58963;
}
.title-hong{
    background: url(./images/bg-title-hong.svg) no-repeat;
    background-size: contain;
    background-position: center;
    padding: 10px;
    color: #fff;
}
.img-title{
    margin-bottom: 15px;
    margin-top: 25px;
}
.tgold{
    /* background: -webkit-radial-gradient(circle, #FEC97B 0%, #FEC97B 60%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; */
    color: #FEC97B;
    text-shadow: 2px 1px 1px rgb(0 0 0 / 50%);
}
.tblue{
    color: #1A3360;
}
.iciel{
    font-family: 'iCiel Bon Vivant Serif' !important;
    font-weight: bold;
}
.montserrat{
    font-family: 'Montserrat', sans-serif !important;
    
    font-weight: 700;
    position:relative;
    z-index: 1;
}
/* .montserrat:after {
    content: attr(data-text);
    left: 0;
    position: absolute;
    text-shadow: 0px 0px 0px rgb(0 0 0 / 30%);
    top: -2px;
    z-index: -1;
} */
.azvd-title{
    font-size: 36px;
    /* text-shadow: 1px 2px 2px rgb(0 0 0 / 80%); */
}
.logo-thanhlongbay{
    transition: 1s all ease-in-out;
    opacity: 0;
    position: fixed;
    top: -150px;
    left: 15px;
    width: 80px;
}
.logo-thanhlongbay.fixlogo{
    opacity: 1;
    z-index: 999;
    margin: 0;
    top: 0;
    background: radial-gradient(rgb(255 255 255 / 27%) 10%, transparent 75%);
    padding: 0px;
}
@-webkit-keyframes lantoa{
    0%{
        box-shadow: 0px 0px 0 0px #1A3360;
    }
    /*50%{
        box-shadow: 0px 0px 0 10px rgb(255 255 255 / 50%);
    }*/
    100%{
        box-shadow: 0px 0px 0 20px rgb(206 173 81 / 0%);
    }
}
.btn-thanhlong{
    background: linear-gradient(179.97deg, rgba(0, 127, 167, 0.85662) 13.1%, rgba(0, 88, 151, 0.88641) 197%);
    border-radius: 5rem;
    border: 2px solid #fff;
    color: #fff !important;
    font-size: 1.2rem;
    font-weight: 600;
    white-space: pre-wrap;
    /* transition: 0.5s all ease-in-out; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    -webkit-animation: lantoa 1.5s ease-in-out infinite both;
    animation: lantoa 1.5s ease-in-out infinite both;
}
.btn-thanhlong:hover {
    border-color: #FEEB82;
    box-shadow: 0px 5px 15px rgb(254 235 130 / 50%);
}
.nopad{padding: 0 !important;}

#banner{
    position: relative;
    padding: 0;
    background: url(./images/banner.jpg) no-repeat;
    background-position: center;
    background-size: cover;
}
#banner .float-content {
    position: absolute;
     top: 0; 
     left: 50%; 
    z-index: 9;
    transform: translate(-50%, 0);
}
#banner .float-content img{margin: 0;}
#nha-vuon,
#nha-vuon2,
#tien-ich-xanh{
    position: relative;
}
#nha-vuon .float-content .box-content{
    position: absolute;
    bottom: 3%;
    right: 2%;
}
#nha-vuon .float-content img {
    margin-bottom: 25px;
}
#nha-vuon p,
#nha-vuon2 p{
    color: #fff;
}
#nha-vuon2 .float-content .box-content,
#tien-ich-xanh .float-content .box-content{
    position: absolute;
    top: 3%;
}
#dau-tu-nha-vuon{
    background: url(./images/bg-dautunhavuonkieumoi.jpg) no-repeat;
    background-position: center;
    background-size: cover;
    padding: 75px 0 ;
}
#dau-tu-nha-vuon h2 img.the-song{
    position: relative;
    bottom: 15px;
    width: 240px;
}
#dau-tu-nha-vuon p {
    text-align: center;
    padding-top: 20px;
    font-size: 24px;
    text-transform: capitalize;
}
#ly-do-chon-the-song{
    position: relative;
    
    /* padding: 0; */
}
#ly-do-chon-the-song h2 img.the-song {
    position: relative;
    width: 15vw;
    bottom: 20px;
}
#ly-do-chon-the-song .box-img img{
    min-width: 150px;    
    margin: 20px 0;
}
#ly-do-chon-the-song:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
180deg
, #0c6897, transparent);
}
#ly-do-chon-the-song .float-content{
    position: absolute;
    top: 3%;
    left: 50%;
    transform: translate(-50%, 0);
    max-width: 80%;
    width: 100%;
}
#mat-bang-tong-the{
    position: relative;
    background: url(./images/bg-song.png) no-repeat;
    background-position: bottom;
    background-size: contain;
}
#mat-bang-tong-the h2 img.the-song {
    width: 60%;
    position: relative;
    left: 40%;
}
#mat-bang-tong-the ul {
    margin-bottom: 30px;
    margin-top: 50px;
}
#mat-bang-nha{
    position: relative;
    background: url(./images/bg-song2.png) no-repeat;
    background-position: top;
    background-size: contain;
}
#mat-bang-nha h2 img.the-song {
    width: 15vw;
    position: relative;
    bottom: 20px;
}

.baz-pills{
    margin: auto;
    width: fit-content;
}
.baz-pills li.nav-item a{
    color: #007FA7 !important;
    border: 2px solid #007FA7;
    border-radius: 0 !important;
    font-size: 14px !important;
}
.baz-pills li.nav-item .nav-link.active {
    color: #fff !important;
    background: linear-gradient(179.97deg, rgba(0, 127, 167, 0.85662) 13.1%, rgba(0, 88, 151, 0.88641) 197%);
    box-shadow: 0 5px 20px 0 rgb(0 0 0 / 20%), 0 13px 24px -11px rgb(0 88 151 / 50%);
}
#vi-tri{
    position: relative;
    background: url(./images/bg-mat-bang-tong-the-min.png) no-repeat;
    background-position: center right;
    background-size: cover;
    background-color: #fff;
}
#vi-tri ul {
    margin-bottom: 30px;
    margin-top: 50px;
}
#vi-tri ul li{
    font-size: 10px;
}
#vi-tri ul li span{
    background: url(./images/icon-dot.svg) no-repeat;
    background-size: contain;
    font-family: 'Roboto';
    padding: 8px;
}
#vi-tri .scroll-content {
    position: relative;
    overflow-y: scroll;
    height: 200px;
    background: #f6f8f4;
    padding: 10px 20px 10px 10px;
    border-radius: 5px;
    box-shadow: 1px 1px 5px 0px rgb(51 51 51 / 10%);
}
#vi-tri .col-12.col-xl-5 {
    padding-left: 5%;
}
#vi-tri2{position: relative;}
#vi-tri2 .float-content .box-title{
    position: absolute;
     top: 3%; 
    left: 15%;
    transform: translate(-50%, 0);
}
#vi-tri2 .float-content .box-content{
    position: absolute;
    top: 25%;
    right: 3%;
    transform: translate(0, -50%);
}
#chinh-sach{
    background: url(./images/bg-chinhsach.jpg) no-repeat;
    background-size: cover;
    position: relative;
    padding: 75px 0;
}
#chinh-sach:before {
    content: '';
    position: absolute;
    top: -1px;
    right: 0;
    left: 0;
    bottom: 0;
    background: linear-gradient(
0deg
, rgba(0, 127, 167, 0) 19.76%, rgba(0, 127, 167, 0.8) 75.91%, rgba(0, 88, 151, 0.78792) 146.08%);
}
#chinh-sach .azvd-box{
    background: linear-gradient(179.97deg, rgba(0, 127, 167, 0.85662) 13.1%, rgba(0, 88, 151, 0.88641) 197%);
    padding: 50px 15px;
    border-radius: 2rem;
}
#chinh-sach .azvd-box p{
    border: 1px solid #fff;
    border-radius: 5rem;
    color: #fff;
    padding: 5px 25px;
    width: fit-content;
    margin: auto;
    margin-bottom: 25px;
    font-style: italic;
}
#chinh-sach .azvd-box img {
    margin: 10px 0;
}
#chinh-sach .azvd-box div:nth-child(2){
    border-right: 2px solid #fed292;
}
#tam-diem-vang{
    padding: 0;
    position: relative;
}
#tam-diem-vang:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: linear-gradient(
180deg
, #005897 0%, transparent 80%);
}
#tam-diem-vang .float-content {
    position: absolute;
    left: 15%;
    top: 3%;
    transform: translate(-50%, 0);
    z-index: 1;
}
#tien-ich{
    background: url(./images/bg-tienich.jpg) no-repeat;
    background-position: center;
    background-size: cover;
}
#tien-ich .slide-center img{
    opacity: 0.5;
    transition: all 0.5s ease;
}
#tien-ich .slide-center img {
    padding: 1%;
    margin-bottom: 10%;
    margin-top: 10%;
    position: relative;
    text-align: center;
}
#tien-ich .slick-slide{opacity: 0;transition: all 1s ease;}
#tien-ich .slick-slide.slick-active{opacity: 1}
#tien-ich .slide-center .slick-current img {
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -o-transform: scale(1.3);
    -webkit-transform: scale(1.3);
    opacity: 1;
    transform: scale(1.3);
    z-index: 5;
    border-radius: 30px;
}
#tien-ich .slick-slide.slick-active p {
    opacity: 0;
    display: none;
    /* transition: 0.5s all ease-in-out; */
}
#tien-ich .slick-slide.slick-current.slick-active p {
    background: radial-gradient(96.02% 116.95% at 68.98% 32.76%, #FFEFD6 0%, #FEC97B 100%);
    text-align: center;
    position: relative;
    top: -44px;
    z-index: 10;
    border-radius: 3rem;
    width: auto;
    color: rgb(6, 79, 114);
    font-weight: 700;
    text-transform: capitalize;
    margin: 0px 10%;
    padding: 8px 0px;
    opacity: 1;
    display: block;
}
.slick-next{
    right: 0 !important; 
    z-index: 9
}
.slick-next:before{
    content: '' !important;
    background: url(images/nw.svg) no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    width: 50px;
    height: 80px;
    right: 55px;
}
.slick-prev {
    left: 0 !important;
    z-index: 9
}
.slick-prev:before{
    content: '' !important;
    background: url(images/bw.svg) no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    width: 50px;
    height: 80px;
    left: 55px;
}

@-webkit-keyframes heartbeat{from{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(.91);transform:scale(.91);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}17%{-webkit-transform:scale(.98);transform:scale(.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(.87);transform:scale(.87);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes heartbeat{from{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(.91);transform:scale(.91);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}17%{-webkit-transform:scale(.98);transform:scale(.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(.87);transform:scale(.87);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}
.heartbeat{-webkit-animation:heartbeat 2.5s ease-in-out infinite both;animation:heartbeat 1.5s ease-in-out infinite both}

.azvd-grid > a {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2em;
    overflow: hidden;
    
}
.azvd-grid > a:hover img {
    transform: scale(1.1);
}
.azvd-grid > a > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    box-shadow: 0 2px 16px var(--shadow);
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
  
.azvd-grid {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(14%, 1fr));
    /*grid-auto-rows: 120px;*/
    grid-auto-rows: auto;
    grid-auto-flow: dense;
    width: 100%;
    padding: 10px;
    background: linear-gradient(
        179deg
        , #ffead5, #fad0a8);
}
  
.horizontal {
    grid-column: span 3;
}
.horizontal2 {
    grid-column: span 2;
}

.vertical {
    grid-row: span 2;
}

.big {
    grid-column: span 2;
    grid-row: span 2;
}
#lien-he{
    background: url(./images/bg-footer.jpg) no-repeat;
    background-position: center;
    background-size: 100% 100%;
    position: relative;
    padding: 75px 0;
}
#lien-he:before {
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    backdrop-filter: blur(1px);
    position: absolute;
}
#lien-he .azvd-box{
    /* background: rgb(255 255 255 / 60%); */
    padding: 20px 30px;
    /* border-radius: 1rem; */
    /* backdrop-filter: blur(5px); */
}
#lien-he ul{padding: 0; margin-top: 50px;}
#lien-he ul li a{color: #333 !important}
#lien-he ul li {
    list-style: none;
    margin-bottom: 10px;
    font-size: 14px;
}
#lien-he .azvd-form input{
    border: 1px solid #c2ded8 !important;
    border-radius: 8px;
    margin-bottom: 20px !important;
    padding: 20px 10px !important;
    background: #e6f5f2 !important;
    color: #333 !important;
    height: 50px;
}
#lien-he .azvd-title{font-size: 24px;}
/* #lien-he img.hoathanhlong {
    position: absolute;
    bottom: 0;
    right: 0;
    transform: translate(43%, 20%);
    z-index: -1;
    opacity: 0.8;
} */
.azvd-form{text-align: center;}
.azvd-form input{
    border: 1px solid #488b87 !important;
    border-radius: 8px !important;
    margin-bottom: 15px !important;
    padding: 20px 10px !important;
    background: rgb(255 255 255 / 50%) !important;
    color: #333 !important;
}
::-webkit-input-placeholder { /* Edge */
    color: #333 !important;
  }
  
  :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #333 !important;
  }
  
  ::placeholder {
    color: #333 !important;
  }
.form-control:invalid {
    background-image: unset;
}
.is-focused .form-control{
    background-image: unset;
    border-color: teal;
    background-color: rgb(255 195 148 / 20%);
}
#btn-map .modal-dialog {
    max-width: 1200px;
    margin: auto;
    padding: 20px;
}
.slick-dots li button:before {
    color: #fec97b !important; 
    /* background: #f15b34 !important; */
    border-radius: 5rem;
    opacity: 1 !important;
    font-size: 10px !important;
}
.slick-dots li.slick-active button:before{
    color: #fec97b !important;
}
.slick-dots{
    left: 0;
}
.slick-dots li.slick-active button:before{
    color: #fec97b  !important;
    font-size: 20px !important;
}


@media (min-width: 1921px){
    #vitri .bando {
        max-height: 30vw;
        height: 30vw;
        max-width: 30vw;
    }
}
@media (max-width: 1600px){
    .azvd-title{font-size: 28px;}
    #tien-ich-xanh ul li{font-size: 12px;}
    .btn-thesong.btn2{margin-left: 0;}
}
@media (min-width: 992px){
    .mobi-show{display: none;}
    .desk-show{display: block;}
    
    .slide-matbang {
        margin-top: 50px;
    }
    .azvd-title{margin-bottom: 20px;}
    .mile {
        margin-top: 50px;
    }
    #daclocdautu .float-content{
        padding-right: 10%;
    }
    .firstline{
        border-right: 2px solid #f15c35;
    }
}
@media (max-width: 991px){
    p, ul li{font-size: 14px !important;}
    .float-content{
        position: relative !important;
        top: 0 !important;
        left: 0!important;
        right: 0 !important;
        bottom: 0 !important;
        transform: translate(0px, 0px) !important;
    }
    .mobi-show{display: block;}
    .desk-show{display: none;}
    
    .w80,.w90,.w95{max-width: 100% !important;}
    .azvd-title{font-size: 22px !important;}
    
    .call-now-button div p{font-size: 14px !important;}
    .section {padding: 15px 0;}
    .btn-thesong{min-width: 100px}
    #nha-vuon .float-content img {
        max-width: 70%;
        margin-top: 20px;
    }
    #nha-vuon2 .float-content .box-content,
    #tien-ich-xanh .float-content .box-content,
    #nha-vuon .float-content .box-content,
   
    #vi-tri2 .float-content .box-title,
    #vi-tri2 .float-content .box-content {
        position: relative;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        transform: translate(0, 0);
    }
    #vi-tri{
            background-position: top center;
        background-size: 150%;
    }
    #vi-tri2 .float-content .box-content {
        margin: 15px 0;
    }
    .tab-space{padding: 20px 0 20px;}
    #nha-vuon, #nha-vuon2, #tien-ich-xanh{
        background: linear-gradient(45deg, #238cac, #63c8cd);
    }
    #dau-tu-nha-vuon{padding: 15px 0;}
    #dau-tu-nha-vuon p {
        font-size: 18px !important;
    }
    #ly-do-chon-the-song .box-img{
        text-align: center !important;
    }
    #ly-do-chon-the-song .box-img img {
        min-width: 150px;
        margin: 10px 0;
    }
    #ly-do-chon-the-song h2 img.the-song {
        width: 30vw;
        bottom: 1vh;
    }
    #ly-do-chon-the-song:before{
        background: linear-gradient( 
        179deg
        , #0c6897 50%, transparent);
    }
    #ly-do-chon-the-song .float-content{max-width: 100%;}
    #mat-bang-tong-the h2 img.the-song {
        width: 30vw;
        left: 0;
        bottom: 1vh;
    }
    #mat-bang-nha h2 img.the-song {
        width: 30vw;
        bottom: 1vh;
    }
    #mat-bang-tong-the ul {
        margin-bottom: 0;
        margin-top: 0;
    }
    .nav-pills .nav-item .nav-link{
        font-size: 11px !important;
        padding: 10px !important;
    }
    #chinh-sach .azvd-box div:nth-child(2){
        border-right: 0px;
    }
    #tam-diem-vang:before{
        background: linear-gradient( 
            180deg
             , #005897 40%, transparent 100%);
    }
    #vi-tri ul {
        margin: auto;
    }
    #vi-tri .col-12.col-xl-5{
        padding-top: 5%;
        padding-left: 15px;
    }
    #vi-tri .btn-thesong{
        min-width: 100px;
    }
    #chinh-sach{padding: 0;}
    #chinh-sach .azvd-box{
        border-radius: 0;
    }
    #tien-ich .slick-slide.slick-current.slick-active p{
        top: -25px;
        padding: 5px;
        font-size: 10px !important;
    }
    .slick-dots{
        bottom: 0 !important;
    }
    #lien-he ul {
        padding: 0;
        font-size: 12px;
    }
    #lien-he .azvd-title{text-align: center;}
    
    /* #lien-he img.hoathanhlong{transform: translate(0%,0%);} */

}
.float-register {
    position: fixed;
    bottom: 100px;
    right: 10px;
    z-index: 9;
}
.float-register ul {
    list-style: none;
    padding: 0px;
    background: radial-gradient(119.81% 316.42% at -12.17% -153.73%, #FFEFD6 0%, #FEC97B 100%);
    border-radius: 2rem;
}
.scrollTop {
    padding: 5px;
    color: #fff;
    cursor: pointer;
}
.call-now-button {
    display: block !important;
    bottom: 3%;    
    box-shadow: 0px 0px 0px 4px rgb(255 255 255 / 0.4);
    transition: 0.5s all;
}
.call-now-button {  
      background: radial-gradient(119.81% 316.42% at -12.17% -153.73%, #FFEFD6 0%, #FEC97B 100%); ;
}
#btn-hotline{left: 3%;}
#btn-nhanbaogia{right: 3%}
#btn-hotline .quick-alo-ph-img-circle.shake{
	background: url(./images/icon-hotline.svg) no-repeat center center !important;
}
#btn-nhanbaogia .quick-alo-ph-img-circle.shake{
	background: url(./images/icon-form.svg) no-repeat center center !important;
}
.call-now-button {
    z-index: 9999;
    clear: both;
    margin: 0 auto;
    position: fixed;
    border-radius: 50px
}
.call-now-button div p {
    color: #005897;
    display: table;
    padding: 10px;
    border-radius: 21px;
    height: 34px;
    line-height: 14px;
    font-size: 20px;
    margin: 8px 5px 8px 50px;
    text-transform: uppercase;
    font-weight: 600;
    text-align: center;
    box-sizing: content-box;
    text-decoration: none!important;
    box-sizing: border-box
}
.quick-alo-ph-circle.active {
    width: 130px;
    height: 130px;
    top: -40px;
    left: -40px;
    position: absolute;
    background-color: transparent;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid rgba(30, 30, 30, .4);
    opacity: 1;
    -webkit-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    -moz-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    -ms-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    -o-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}
.quick-alo-ph-circle-fill.active {
    width: 80px;
    height: 80px;
    top: -15px;
    left: -15px;
    position: absolute;
    background-color: #000;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: 1;
    -webkit-animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
    -moz-animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
    -ms-animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
    -o-animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
    animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

.quick-alo-ph-img-circle.shake {
    width: 50px;
    height: 50px;
    top: 0;
    left: 0;
    position: absolute;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: 1;
    background: url(../../assets/images/quick-call-button-phone.png) no-repeat center center;
    -webkit-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -moz-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -ms-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -o-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    animation: quick-alo-circle-img-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%
}

.quick-alo-phone-img-circle.shake {
    width: 50px;
    height: 50px;
    top: 0;
    left: 0;
    position: absolute;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: 1;
    background: url(../../assets/images/quick-call-button-phone.png) no-repeat center center;
    -webkit-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -moz-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -ms-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -o-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    animation: quick-alo-circle-img-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%
}

.quick-alo-ph-img-circle.notshake {
    width: 50px;
    height: 50px;
    top: 0;
    left: 0;
    position: absolute;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: 1;
    background: url(../../assets/images/quick-call-button-phone.png) no-repeat center center;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

.quick-alo-phone-img-circle.notshake {
    width: 50px;
    height: 50px;
    top: 0;
    left: 0;
    position: absolute;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: 1;
    background: url(../../assets/images/quick-call-button-phone.png) no-repeat center center;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

@-moz-keyframes quick-alo-circle-anim {
    0% {
        -moz-transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1;
        -moz-opacity: .1;
        -webkit-opacity: .1;
        -o-opacity: .1
    }
    30% {
        -moz-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5;
        -moz-opacity: .5;
        -webkit-opacity: .5;
        -o-opacity: .5
    }
    100% {
        -moz-transform: rotate(0) scale(1) skew(1deg);
        opacity: .6;
        -moz-opacity: .6;
        -webkit-opacity: .6;
        -o-opacity: .1
    }
}

@-webkit-keyframes quick-alo-circle-anim {
    0% {
        -webkit-transform: rotate(0) scale(.5) skew(1deg);
        -webkit-opacity: .1
    }
    30% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        -webkit-opacity: .5
    }
    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        -webkit-opacity: .1
    }
}

@-o-keyframes quick-alo-circle-anim {
    0% {
        -o-transform: rotate(0) kscale(.5) skew(1deg);
        -o-opacity: .1
    }
    30% {
        -o-transform: rotate(0) scale(.7) skew(1deg);
        -o-opacity: .5
    }
    100% {
        -o-transform: rotate(0) scale(1) skew(1deg);
        -o-opacity: .1
    }
}

@-moz-keyframes quick-alo-circle-fill-anim {
    0% {
        -moz-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        -moz-transform: rotate(0) -moz-scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        -moz-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-webkit-keyframes quick-alo-circle-fill-anim {
    0% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        -webkit-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-o-keyframes quick-alo-circle-fill-anim {
    0% {
        -o-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        -o-transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        -o-transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-moz-keyframes quick-alo-circle-img-anim {
    10% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        -moz-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -moz-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -moz-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -moz-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -moz-transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        -moz-transform: rotate(0) scale(1) skew(1deg)
    }
}

@-webkit-keyframes quick-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)
    }
}

@-o-keyframes quick-alo-circle-img-anim {
    0% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
}
.modal.fade.show {
    background: rgb(0 0 0 / 0.6);
    /* background: rgb(255 255 255 / 0.8); */
}
.modal-dialog .modal-content{
	border-radius: 1rem;
	background: url(./images/bg-footer.jpg) no-repeat;
    background-size: cover;
}
#btn-dkform h4.azvd-title {
    font-size: 20px;
    font-weight: 700;
    /*color: #024349;*/
    color: #fff;
}
input.form-control {
    /*color: #fff !important;*/
}
@keyframes btn-boxshadow-change{
    0% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        -o-transform: rotate(0) scale(1) skew(1deg)
    }
}
.row.iconText ul li {
    line-height: 33px;
}
.tixIcon1 {
    background: url(./images/icon-tien-ich.png);
    background-position: 0 0px;
    width: 32px;
    height: 32px;
    float: left;
}
.tixIcon2 {
    background: url(./images/icon-tien-ich.png);
    background-position: 0 -45px;
    width: 32px;
    height: 32px;
    float: left;
}
.tixIcon3 {
    background: url(./images/icon-tien-ich.png);
    background-position: 0 -90px;
    width: 32px;
    height: 32px;
    float: left;
}
.tixIcon4 {
    background: url(./images/icon-tien-ich.png);
    background-position: 0 -135px;
    width: 32px;
    height: 32px;
    float: left;
}
.tixIcon5 {
    background: url(./images/icon-tien-ich.png);
    background-position: 32px 0px;
    width: 32px;
    height: 32px;
    float: left;
}
.tixIcon6 {
    background: url(./images/icon-tien-ich.png);
    background-position: 32px -45px;
    width: 32px;
    height: 32px;
    float: left;
}
.tixIcon7 {
    background: url(./images/icon-tien-ich.png);
    background-position: 32px -90px;
    width: 32px;
    height: 32px;
    float: left;
}
.tixIcon8 {
    background: url(./images/icon-tien-ich.png);
    background-position: 32px -135px;
    width: 32px;
    height: 32px;
    float: left;
}
div#tien-ich-xanh {
    background: url(./images/bg-tien-ich-min.png);
    background-repeat: no-repeat;
    background-size: cover;
}
.titleTIX{
    color:#007FA7;
}
.khoanTrang {
    margin: 280px 0px;
}

.menu, .menu-burger, .menu-bg {
    position: fixed;
    width: 50px;
    height: 50px;
    font-size: 30px;
    text-align: center;
    border-radius: 100%;
    right: 25px;
    top: 25px;
  }
  
  .menu-bg {
    background: linear-gradient(179.97deg, rgba(0, 127, 167, 0.85662) 13.1%, rgba(0, 88, 151, 0.88641) 197%);
    z-index: 999;
    pointer-events: none;
    transition: 0.8s;
    right: 50px;
    top: 50px;
    transform: translate3d(50%, -50%, 0);
    transform-origin: center center;
  }
  .menu-bg.fs {
    transform: translate3d(50%, -50%, 0);
    width: 300vw;
    height: 300vw;
  }
  
  .menu-burger {
    color: white;
    z-index: 9999;
    padding-top: 13px;
    -webkit-user-select: none;
    cursor: pointer;
    transition: 0.8s;
    transform-origin: center;
  }
  .menu-burger.fs {
    transform: rotate(-180deg) translateY(10px);
  }
  
  .menu-items {
    position: fixed;
    z-index: 9999;
    top:5%;
    right: 5%;
    font-weight: bold;
    font-size: 40px;
    color: white;
    width: 100%;
    text-align: right;
    opacity: 0;
    transition: 0.7s;
    margin-top: 100px;
    transform: translateY(-200%);
    pointer-events: none;
  }
  ul#menu-tlb li a {
        font-family: 'iCiel Bon Vivant Serif' !important;
    }
    ul#menu-tlb li{
        font-size: 20px;
        margin-bottom: 15px;
    }
  .menu-items div {
    transition: 1s;
    opacity: 0;
    margin-top: 0px;
  }
  .menu-items.fs {
    transform: translateY(0);
    pointer-events: auto;
    opacity: 1;
  }
  .menu-items.fs div {
    opacity: 1;
    margin-top: 75px;
  }