
.cbp-fbscroller{ 
   height: 100%; 
   margin-top:64px
}

/* The nav is fixed on the right side  and we center it by translating it 50% 
(we don't know it's height so we can't use the negative margin trick) */
.cbp-fbscroller > nav {
   position: fixed;
   z-index: 9999;
   right: 100px;
   top: 50%;
   -webkit-transform: translateY(-50%);
   -moz-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   transform: translateY(-50%);
}

.cbp-fbscroller > nav a {
   display: block;
   position: relative;
   color: transparent;
   height: 50px;
}

.cbp-fbscroller > nav a::after {
   content: '';
   position: absolute;
   width: 12px;
   height: 12px;
   border-radius: 50%;
   border: 2px solid #fff;
}

.cbp-fbscroller > nav a:hover:after {
   background: rgba(255,255,255,0.6);
}

.cbp-fbscroller > nav a.cbp-fbcurrent:after {
   background: #fff;
}

/* background-attachment does the trick */
.cbp-fbscroller section {
   position: relative;
   background-position: top center;
   background-repeat: no-repeat;
   background-size: cover;
   background-attachment: fixed;
}

#fbsection1 {
   background-image: url(../images/1.jpg);
   height: 900px;
}

#fbsection2 {
   background-image: url(../images/2.jpg);
   height: 900px;
}

#fbsection3 {
   background-image: url(../images/3.jpg);
   height: 900px;
}

#fbsection4 {
   background-image: url(../images/4.jpg);
   height: 900px;
}

#fbsection5 {
   background-image: url(../images/5.jpg);
   height: 900px;
}
#fbsection6 {
   background-image: url(../images/6.jpg);
   height: 900px;
}
#fbsection7 {
   background-image: url(../images/7.jpg);
   height: 900px;
}
#fbsection8 {
   background-image: url(../images/8.jpg);
   height: 900px;
}
#fbsection9 {
   background-image: url(../images/9.jpg);
   height: 900px;
}
#fbsection10 {
   background-image: url(../images/10.jpg);
   height: 900px;
}
#fbsection11 {
   background-image: url(../images/11.jpg);
   height: 900px;
}
#fbsection12 {
   background-image: url(../images/12.jpg);
   height: 900px;
}
#fbsection13 {
   background-image: url(../images/13.jpg);
   height: 900px;
}
#fbsection14 {
   background-image: url(../images/14.jpg);
   height: 900px;
}


/*homepage*/
/*menu*/
.nav-item::after{
   content:'';
   display:block;
   width:0px;
   height:2px;
   background:#8ac543;
   transition: 0.2s;
}
.nav-item:hover::after{
   width:100%;
}
.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,.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover{color:#fec400;}
.nav-link{
   padding:15px 5px;
   transition:0.2s;
}
/*menu*/
/*dot*/
.pinkBg {
   background-color: #ed184f!important;
   background-image: linear-gradient(90deg, #fd5581, #fd8b55);
}
.intro-banner-vdo-play-btn{
   height:60px;
   width:60px;
   position: fixed;
   bottom: 54px;
   right: 5%;
   text-align:center;
   margin:-30px 0 0 -30px;
   border-radius:100px;
   z-index:99;
}
.intro-banner-vdo-play-btn i{
   line-height:56px;
   font-size:30px
}
.intro-banner-vdo-play-btn .ripple{
   position:absolute;
   width:160px;
   height:160px;
   z-index:-1;
   left:50%;
   top:50%;
   opacity:0;
   margin:-80px 0 0 -80px;
   border-radius:100px;
   -webkit-animation:ripple 1.8s infinite;
   animation:ripple 1.8s infinite
}

@-webkit-keyframes ripple{
   0%{
      opacity:1;
      -webkit-transform:scale(0);
      transform:scale(0)
   }
   100%{
      opacity:0;
      -webkit-transform:scale(1);
      transform:scale(1)
   }
}
@keyframes ripple{
   0%{
      opacity:1;
      -webkit-transform:scale(0);
      transform:scale(0)
   }
   100%{
      opacity:0;
      -webkit-transform:scale(1);
      transform:scale(1)
   }
}
.intro-banner-vdo-play-btn .ripple:nth-child(2){
   animation-delay:.3s;
   -webkit-animation-delay:.3s
}
.intro-banner-vdo-play-btn .ripple:nth-child(3){
   animation-delay:.6s;
   -webkit-animation-delay:.6s
}
.phone-icon{
   color:#fff;
   padding: 4px 0;
}
.bg-grey-new{
   background-color: #F8F9FA;
}
/*dot*/
@media only screen and (max-width:767px) and (min-width:320px){
   #fbsection1, #fbsection2,#fbsection3,#fbsection4,#fbsection5,#fbsection6,#fbsection7,#fbsection8,#fbsection9,#fbsection10,#fbsection11,#fbsection12,#fbsection13,#fbsection14   {
      background-size:cover;
      height: 176px;
   }
   .cbp-fbscroller section {
      position: inherit; 
      background-position: top center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: inherit; 
   }

}