.jssora051 {display:block;position:absolute;cursor:pointer;}
            .jssora051 .a {fill:none;stroke:#fff;stroke-width:360;stroke-miterlimit:10;}
            .jssora051:hover {opacity:.8;}
            .jssora051.jssora051dn {opacity:.5;}
            .jssora051.jssora051ds {opacity:.3;pointer-events:none;}
.menuquick-2 img { max-width: 100%;
    width: 90px !important;
    height: 90px;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 90px;
    padding: 3px;
    border: 3px solid rgba(2, 145, 62, 0.2); }
.menuquick-2 h5 {  }
.menuquick-2 h5 span { color: #B31F1F; }
.menuquick-2 {  background: #EAE9E4  }
.menuquick-2 .sub {   }
.bspmoi h5 span {
    color: #B31F1F;
}

.banner {    }
.banner img {max-width:100%; }
.banner .l img{ max-width: 100% }  
main { position: relative; } 

/*main::after {
    content: "";
    -webkit-mask-image: radial-gradient(circle at 20% 2%, transparent , #fff 50%);
    mask: radial-gradient(circle at 20% 20%, transparent , #fff 50%);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: url('https://fiorello.qodeinteractive.com/wp-content/uploads/2018/05/landing-img-13.png') no-repeat;
    background-size: auto;
    z-index: -1;
}

main::before {
    content: "";
    -webkit-mask-image: radial-gradient(circle at 20% 2%, transparent , #fff 50%);
    mask: radial-gradient(circle at 10% 50%, transparent , #fff 90%);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: url('https://fiorello.qodeinteractive.com/wp-content/uploads/2018/05/landing-middle-img.jpg') no-repeat center right ;
    background-size: auto;
    z-index: -1;  
}*/
.bspmoi .rate { line-height: 16px; }
.bspmoi h3 { line-height: 15px; }
.bspmoi h3 a { font-size: 15px; text-decoration: none; color: #000; font-weight: normal;  }
.bspmoi img { max-width: 100% }
.bspmoi span.g{ color: #fcb428;   font-size: 14px; }
.bspmoi span.b{ color: #cdcdcd;   font-size: 14px; }
.bspmoi .giaban { color: red; }
.bspmoi .giacu {   text-decoration: line-through;  color: #888;  font-size: 14px;  }
.bspmoi .gia { line-height: 16px;  font-size: 14px; }
.spkm .sub { min-height: 284px; }
.spkm .rate { line-height: 16px; }
.spkm h3 { line-height: 17px;min-height: 46px; }
.spkm h3 a { font-size: 14px; text-decoration: none; color: #000; font-weight: normal;  }
.spkm img { max-width: 100% }
.spkm span.g{ color: #fcb428;   font-size: 14px; }
.spkm span.b{ color: #cdcdcd;   font-size: 14px; }
.spkm .giaban { color: red; }
.spkm .giacu {   text-decoration: line-through;  color: #888;  font-size: 14px;  }
.spkm .gia { line-height: 16px;  font-size: 14px; }
.spkm  .angle-right {
    clip-path: polygon(15% 0%, 100% 0%, 100% 100%, 15% 100%, 0% 50%);
}
.spkm .sokm { line-height: 20px;  }
.spkm .rtsb-tag-fill {
    color: #fff;
    position: relative;
    margin: 0;
    border-radius: 4px;
    top: 0;
    right: auto;
    height: 18px;
    line-height: 1;
    font-size: 12px;
    font-weight: 500;
    padding: 1px 10px;
    background-color: #e00000;
}

.gioithieu .phone .boxp i { font-size: 34px;
    background: var(--colormain);
    color: #fff;
    padding: 12px;
    border-radius: 90px;
    border: 10px solid rgba(255, 255, 255, 0.7);  }
.gioithieu h5.story {
    color: var(--colorsub );
    font-size: 40px;
    font-weight: 400;
    line-height: 54px;
    letter-spacing: -1px;
}

.gioithieu .more {
    color: #fff;
    text-decoration: none;
    background: var(--colormain);
    padding: 20px 44px;
    margin: 20px 30px;
    border-radius: 90px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 4px;
}


.nl-h2, h2 {
    font-size: 3rem;
    line-height: 1.25;
}
.nl-line-left::before {
    left: -32px;
    top: 9px;
    bottom: 8px;
    border-left: 2px solid #b9060e;
}
.nl-line-left::before {
    content: '';
    position: absolute;
}
.nl-bullet {
    position: absolute;border-color: #f3cfa7;
    top: -1.4rem;
    left: 0;
    border-width: 1px;
    border-style: solid;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: -webkit-transform .3s ease;
    transition: -webkit-transform .3s ease;
    -o-transition: transform .3s ease;
    transition: transform .3s ease;
    transition: transform .3s ease, -webkit-transform .3s ease;
}
.nl-bullet::before {
    display: block;
    content: '';    background: #f3cfa7;
    width: 6px;
    height: 6px;
    /*background-color: #03a9f4;*/
    background: -webkit-gradient(linear, right top, left top, from(#03a9f4), to(#1678b8));
    background: -webkit-linear-gradient(right, #03a9f4 0, #1678b8 100%);
    background: -o-linear-gradient(right, #03a9f4 0, #1678b8 100%);
    background: #f3cfa7;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin: 2px;
}
.themanh .sub span { font-size: 40px ; color:var(--text-color) }
.themanh .sub:hover .nl-bullet { 
webkit-transform: scale(2);
    -ms-transform: scale(2);
    transform: scale(2);
    -webkit-transition: -webkit-transform .3s ease;
    transition: -webkit-transform .3s ease;
    -o-transition: transform .3s ease;
    transition: transform .3s ease;
    transition: transform .3s ease, -webkit-transform .3s ease;
}
.gioithieu h5:hover .pxl-bd-anm:after{transform:scale(1)}
 
  .pxl-bd-anm {
    margin-top: 15px;
    width: 190px;    margin: 16px auto;
    height: 1px;
    background-color: #121212;
    position: relative;
    border-width: 0;
    transform-origin: 0 100%;
}
.pxl-bd-anm.pxl-animated { transform: scale(1); }
.pxl-bd-anm {
    border-width: 0 0 1px;
    border-style: solid;
    border-color: #e4e4e4;
    transform: scale(0);
    transition: transform 2s cubic-bezier(.77,0,.175,1);
}
  .pxl-bd-anm:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: var(--bg-color);
    transform: scaleX(0);
    transform-origin: 0 100%;
    transition: transform 1s ease;
}
.gioithieu .image img { width: 100%; } 
 
.gioithieu.cty::after {  
    content: "";
    width: 21%;
    background: #b1a18f;
    position: absolute;
    right: 0px;
    top: 0px;
    height: 70%;
    opacity: 0.4;
    z-index: -1;
}


.dichvu h5 {     text-align: center; font-size: 40px; color:var( --colorsub ); font-weight: 550; }
.dichvu .sub {  box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.07); padding-bottom: 20px;background: #fff }
.dichvu .sub::before {
    position: absolute;
    content: "";
    width: 105px;
    height: 105px;
    transform: rotate(-42deg);
    top: 40%;
    left: -65px;
    background: #ffff;
    border-radius: 25px;
    z-index: 1;
}
.dichvu .sub::after {
    position: absolute;
    content: "";
    width: 105px ;
    height: 105px;
    transform: rotate(-42deg);
    top: 41%;
    right: -61px;
    background: #fff;
    border-radius: 25px;
    z-index: 1;
}
.dichvu .sub:hover .dichvu .sub::before {   background: #21346B !important  }
.dichvu { /*background: url('http://html.commonsupport.xyz/2019/Aculia/images/resource/shape-1.png') no-repeat;*/ overflow: hidden; }
.dichvu img {max-width: 100%; transition: .5s all; }
.dichvu .img { overflow: hidden;
    height: 156px;
    padding: 10px;
    /*border-radius: 0 0 25% 25%;*/ }
.dichvu .img:hover img {  transform: scale(1.2) }
.dichvu .info {      padding-top: 49px;
    border-top: 1px solid #cdcdcd;
    margin-top: 51px;
    text-align: center; }
.dichvu h2 {     
        text-align: center;
    color: var(--text-color);
    text-transform: none;min-height: 42px;
    font-weight: normal;
    font-size: 19px;
    font-weight: 550; }
.dichvu a.more { color: var(--colormain);
    text-align: center;
    display: inline-block;
    text-decoration: none;
    font-weight: normal;
    border: 1px solid var(--colormain);
    margin: 15px auto;
    padding: 7px 20px;
    border-radius: 90px;
    background: #fff; }

.dichvu a.link { color: var(--bs-black);
    text-align: center;
    display: inline-block;
    text-decoration: none;
    font-weight: 550;
    margin: 0px auto;
    padding: 0px 10px;
    border-radius: 10px;
    font-size: 16px; }

.dichvu .baiviet .link {     color: var(--text-white);
    text-transform: uppercase;
    font-weight: normal;
    font-size: 13px;
    border: 1px solid #639424;
    display: inline-block;
    padding: 10px 20px; }
/*//////////////////////////////////////*/
.top-title {
    border-bottom: 1px solid #d7d7d7;
    height: 30px;padding-left: 0;
    position: relative;
    margin-bottom: 15px;
}
.top-title > .title, .top-title > .title > a {
   color: var(--colormain);
    font-size: 21px;
    text-transform: uppercase;
    /* font-weight: 550; */
    font-family: Arial;
    line-height: 31px;
    position: relative;
    display: initial;
    text-decoration: none;
}
.top-title  .title:after {
        content: '';
    position: absolute;
    bottom: -6px;
    left: 0;
    height: 4px;
    background: var(--colorsub);
    width: 100%;
}
/*////////////////////*/

.primary-link{font:700 12px futura-pt,sans-serif;letter-spacing:.2em;cursor:pointer;color:#1d4934;border:1px solid #75a13e;padding:12px 25px;text-align:center;display:inline-block;text-transform:uppercase;position:relative;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition:color 1000ms;transition:color 1000ms;outline:none}.primary-link:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#75a13e;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:0 50%;transform-origin:0 50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition:300ms ease-out;transition:300ms ease-out}.primary-link:hover:before{-webkit-transform:scaleX(1);transform:scaleX(1)}.primary-link:hover{color:#fff} 
 
.nl-background-2 {
     top: -4rem;
    left: -6vw;
    content: "";
    width: 100%;
    height: 100%;
    z-index: -1;
}
.nl-background-1, .nl-background-2, .nl-background-3 {
    opacity: .4;
}
.nl-background-color-5 {
    background-color: #b1a18f;
}
.linhvuc .baiviet .link {
    color: var(--text-white);
    text-transform: uppercase;
    font-weight: normal;
    font-size: 13px;
    border: 1px solid #639424;
    display: inline-block;
    padding: 10px 20px;
}
.linhvuc  .info {
    position: absolute;
    top: 35px;
    left: 0;
    right: 0;
}
.linhvuc  h2 {
    text-align: center;
    color: var(--text-color);
    text-transform: uppercase;
    font-weight: normal;
    font-size: 19px;
}
.linhvuc  a.mpre {
    color: var(--text-color);
    text-align: center;
    display: block;
    text-decoration: none;
    font-weight: 550;
}
.linhvuc img {max-width: 100%; transition: .5s all; }
.linhvuc .img { overflow: hidden}
.linhvuc .img:hover img {  transform: scale(1.2) }
.themanh h5 {  color: var(--text-white) }
.themanh i {  color: var(--text-color) ; font-size:40px; transition: .5s all; }
.themanh div.box:hover i {    transform: rotate(360deg);   }
.gioithieu h5 i {   }
.gioithieu img { max-width:100%; }
.gioithieu span { display: inline-block; } 
.gioithieu .phone .lp {  color: var(--colormain) ; font-size: 25px; line-height: 26px;  font-weight: 700; text-decoration: none; }
.gioithieu .phone .boxp i { font-size: 34px;
    background: #F7707F;
    color: #fff;
    padding: 12px;
    border-radius: 90px;
    border: 10px solid rgba(255, 255, 255, 0.7);  }
 

.duan h5 {  color: var(--text-color) }
.duan img {  width:100%; }
.duan  .caption {
    position: absolute;
    left: calc(7% + 1.5rem);
    top: calc(20% + 1.5rem);
    font-size: 60px;
    color: #fff;
    transition: 1s all;
    opacity: 0;
}
.duan .carousel {
  width: 100%; 
}
.duan .slide {
  width: 45%;
  background-size: cover !important;
  background-position: center !important; counter-increment: carousel-cell;margin-right: 10px;border-radius: 5px;
}
.duan .slide > div.a {
  padding-top: 57%; background:  rgba(0, 0, 0, .6)
}
.duan .slide.is-selected > div.a {
   background: rgba(0, 0, 0, 0)
}
/*.duan .carousel { background: #FAFAFA;  width:100%; }
.duan .slide > div {
    padding-top: 130%;
}
.duan .carousel-cell {
  width: 25%;
  background-size: cover;
  background-position: center;
}
.duan .carousel-cell {
  width: 66%;
  height: 100%;
  margin-right: 10px;
  background: #8C8;
  border-radius: 5px;
  counter-increment: carousel-cell;
}*/

 

.lienhe { margin: 90px 0px; }
.lienhe h5 {  color: var(--text-color) }
.lienhe .l { line-height:30px;  }
.lienhe .l .box {   }
.lienhe::before {  
    content: "";
    width: 7%;
    background: #b1a18f;
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
    opacity: 0.4;
}
.lienhe::after {  
    content: "";
    width: 21%;
    background: #b1a18f;
    position: absolute;
    right: 0px;
    top: 0px;
    height: 100%;
    opacity: 0.4;
    z-index: -1;
}
.lienhe label {     display: block;
    text-transform: uppercase;
    font-weight: 550; }
.lienhe i { color: var(--text-color); }
h5.story {
color: #fff; 
    font-size: 50px;
    font-weight: 800;
    line-height: 104px;
    letter-spacing: -1px;
}
.tutruyen img {max-width: 100%; transition: .5s all; }
.p-min{ padding: 0.05rem!important; }

.spnoibat   .item .giaban {
        text-align: center;
    color: red;
    font-weight: 500;
    font-size: 16px;
}
.giacu { text-align: center  }
.spnoibat   .item .giacu span {
    text-decoration: line-through;
    color: #888;
    font-size: 14px;
}
.sanpham img {max-width: 100%; transition: .5s all; }
.sanpham .img { overflow: hidden}
.sanpham .img:hover img {  transform: scale(1.2) }
.sanpham .info { position: absolute; top: 35px; left: 0; right: 0; }
.sanpham h2 {     
    
    text-align: center;
    color: var(--text-color);
    text-transform: uppercase;
    font-weight: normal;
    font-size: 19px; }
.sanpham a.link { color: var(--text-color);
    text-align: center;
    display: block;
    text-decoration: none;
    font-weight: 550; }
.sanpham .baiviet .link {     color: var(--text-white);
    text-transform: uppercase;
    font-weight: normal;
    font-size: 13px;
    border: 1px solid #639424;
    display: inline-block;
    padding: 10px 20px; }
.spnoibat a
{
color: var(--bs-black);
    text-decoration: none;
    font-size: 16px;  
}
.spnoibat .rate { text-align: center;  }
.spnoibat .rate .g
{
 color: #feb406;   
}
.spnoibat .rate .b
{
 color: #eee;   
}

.callfirst {    color:#fff ;position: relative}
.callfirst img { width: 100%; box-shadow: rgba(17, 17, 26, 0.2) 0px 0px 42px  } 

.tintuc h5 {
   color: var(--colormain );
    text-align: center;
    font-size: 35px;
}
.tintuc .sub {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
.tintuc  h3 a { color: var(--bs-black) !important;
    font-weight: 550;
    text-decoration: none;
    text-transform: none;  } 
.tintuc img {max-width: 100%;  transition: .5s all; }
.tintuc .img { overflow: hidden}
.tintuc .img:hover img {  transform: scale(1.2) }
.tintuc .img { height: 171px; overflow: hidden; }
.tintuc a.link {
    color: var(--text-color);
    text-decoration: none;
    font-weight: 550;
}


@media only screen and (max-width: 768px) {
     .dichvu .img {
    overflow: hidden;
    height: 149px !important
}
 .duan .slide { width: 66%;  }   
.nl-big {  font-size: 2rem !important;  }    
    
}