/*
  website Name: Fruscribe
  Code By: B.K.P;
*/

@import url('https://fonts.googleapis.com/css?family=Baloo|Lato:400,400i,700,700i,900i,900&display=swap');

.baloo{
  font-family: 'Baloo', cursive;
}

/* @font-face{
  src:url(css/font/Merriweather-Bold.ttf);
  font-family: Merriweather-Bold !important;
} */
body,html{
  width: 100%;
  height: 100%;
}

body {
  color: #999999 !important;
  line-height: 20px;
  background:#ffffff !important;
  font-family: 'Lato', sans-serif !important;
  overflow-x:hidden; 
  margin: 0 !important;
}

p{
  font-size: 13px;
}

 h1,h2,h3,h4,h5{
  font-family: 'Baloo', cursive !important;
} 


/* links */
ul li a,ul li {
  font-size: 13px;
  font-weight: 400;
  line-height: 21px;  
}

a,button {
    text-decoration: none;
    font-size: inherit;
    color: #000000;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
a:hover{
    text-decoration: none;
    color: #da1d39;
}
.mail:hover {
    text-decoration: none;
    color: #da193d !important;
}
a:focus,a:active,button:focus,button:active,input:focus,input:active  {
    outline:0 !important;
    box-shadow: none !important;
    text-decoration: none;
}
.trans,.trans:after,.trans:hover .head:after,.trans:before{
  -webkit-transition: all .3s ease-in;
  -moz-transition: all .3s ease-in;
  -ms-transition: all .3s ease-in;
  transition: all .3s ease-in;  
}

.underline{
  text-decoration: underline;
}
.text-lowercase{
  text-transform: lowercase !important;
}
.text-capital{
  text-transform: capitalize !important;
}

.disebled{
  pointer-events: none;
  color: #999999;
}


.op0{
  opacity: 0;
}

@media (min-width: 1250px) {
  .container {
    width: 1200px;
  }
}
.flex{
  display: -ms-flexbox;
  display: inline-flex;
  -ms-flex-wrap: wrap;
  /*width: 100%;*/
  /* flex-wrap: wrap; */
}
.txt_upper{
  text-transform: uppercase !important;
}
.txt_lower{
  text-transform: lowercase !important;
}

/* ========================================= */
/* =============FONT SIZE CLASSES============== */
/* ========================================= */
.fsize8{
  font-size: 8px;
}
.fsize10{
  font-size: 10px !important;
}
.fsize12{
  font-size: 12px !important;
}
.fsize13{
  font-size: 13px;
}
.fsize14{
  font-size: 14px !important;
}
.fsize16{
  font-size: 16px !important;
}
.fsize18{
  font-size: 18px !important; 
}
.fsize20
{
  font-size: 20px !important;
  line-height: 25px !important;
}
.fsize22{
  font-size: 22px !important;
}
.fsize24{
  font-size: 24px !important;
  line-height:30px !important;
}
.fsize26{
  font-size: 26px;
}
.fsize28{
  font-size: 28px;
}
.fsize30{
  font-size: 30px !important;
  line-height: 30px !important;
}
.fsize36{
  font-size: 36px !important;
  line-height: 36px !important;
}
.fsize40{
  font-size: 40px !important;
}
.fsize50{
  font-size: 50px !important;
}
.fsize60{
  font-size: 60px !important;
}
.fsize70{
  font-size: 70px !important;
}
.fsize80{
  font-size: 80px;
}
.fsize90{
  font-size: 90px;
}
.fsize100{
  font-size: 100px !important;
}

/*-----------------------------------------------------------------------------------*/
/*  FONT-WEIGHT
/*-----------------------------------------------------------------------------------*/
.font100  {  font-weight: 100;}
.font300  {  font-weight: 300;}
.font400  {  font-weight: 400;}
.font500  {  font-weight: 500;}
.font600  {  font-weight: 600 !important;}
.font700  {  font-weight: 700;}
.font900  {  font-weight: 900;}
.italic   { font-style: italic;}
.bold     { font-weight: bold;}


/*-----------------------------------------------------------------------------------*/
/*  SPACING
/*-----------------------------------------------------------------------------------*/
.space0   {    margin-top: 0px  !important;   }
.space5   {    margin-top: 5px  !important;   }
.space10  {    margin-top: 10px  !important;  }
.space15  {    margin-top: 15px  !important;  }
.space20  {    margin-top: 20px  !important;  }
.space25  {    margin-top: 25px  !important;  }
.space25  {    margin-top: 25px  !important;  }
.space30  {    margin-top: 30px  !important;  }
.space40  {    margin-top: 40px  !important;  }
.space50  {    margin-top: 50px  !important;  }
.space60  {    margin-top: 60px  !important;  }
.space70  {    margin-top: 70px  !important;  }
.space80  {    margin-top: 80px  !important;  }
.space90  {    margin-top: 90px  !important;  }
.space100 {    margin-top: 100px !important;  }
.space170 {    margin-top: 170px !important;  }
.no-space {    margin: 0 !important;
               padding: 0 !important;}
.padding-left-0  {  padding-left: 0 !important;  }
.padding-right-0 {  padding-right: 0 !important; }
.m-auto          {  margin: 0 auto;              }  
.mbtm0         {  margin-bottom: 0 !important; }              
.mtop0           {margin-top: 0 !important; }

.pt-10{padding-top: 10px;}
.pt-30{padding-top: 30px;}
.pt-40{padding-top: 40px;}
.pt-50{padding-top: 50px;}
.pt-60{padding-top: 60px;}
.pt-80{padding-top: 150px;}
.pt-100{padding-top: 150px;}

.pb-40{padding-bottom: 40px;}
.pb-50{padding-bottom: 50px;}
.pb-60{padding-bottom: 60px;}
.pb-80{padding-bottom: 150px;}
.pb-100{padding-bottom: 150px;}


/*-----------------------------------------------------------------------------------*/
/*  TETX-COLOR
/*-----------------------------------------------------------------------------------*/
.text-white {   color: #ffffff !important;  }
.text-black {   color: #000000 !important;   }
.txt-grey{  color: #666 !important;}
.txt-dgrey{  color: #4f4f4f !important;}
.txt-green{  color: #cbd028 !important;}
.bg_white{background: #fff !important;}
.list-unstyled {
  margin: 0;
  padding: 0;
}
.list-inline li {
    display: inline-block;
}
.ov_y_hidden{
  overflow-y: hidden;
}
.block{
  display: block;
}
.hide{
  display: none !important;
}
.flex{
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.u_line{
  text-decoration: underline;
}
.disabled,.disabled a{
  cursor: not-allowed;
}
.visible-xs{
    display: none;
  }

input::placeholder{
  color: #b6b6b6;
  font-size: 12px;
  font-weight: 700;
}


/*CSS FOR HEADER*/ 
#home #header-outer,#about_us #header-outer{
  position: absolute;
  z-index: 999;
  width: 100%;
  top:0;
}
  header .menu{
  position: relative;
  }
  header>.flex{
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .logo{
    padding: 0 50px;
  }
  .user{
    background: transparent;
    border:none;
    box-shadow: none;
    position: relative; 
    right: -25px;
  }
  .hamburger {
  padding: 15px 15px 15px 0;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  display: none;
  margin: 0;
  overflow: visible; }
  .hamburger:hover {
    opacity: 1; }
  .hamburger.is-active:hover {
    opacity: 1; }
  .hamburger.is-active .hamburger-inner,
  .hamburger.is-active .hamburger-inner::before,
  .hamburger.is-active .hamburger-inner::after {
    background-color: #000; }

.hamburger-box {
  width: 28px;
  height: 24px;
  display: inline-block;
  position: relative; 
    top: 5px;}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 28px;
    height: 1px;
    background-color: #000;
    border-radius: 0px;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -10px; }
  .hamburger-inner::after {
    bottom: -10px; }
/*
   * Vortex
   */
.hamburger--vortex .hamburger-inner {
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
  .hamburger--vortex .hamburger-inner::before, .hamburger--vortex .hamburger-inner::after {
    transition-duration: 0s;
    transition-delay: 0.1s;
    transition-timing-function: linear; }
  .hamburger--vortex .hamburger-inner::before {
    transition-property: top, opacity; }
  .hamburger--vortex .hamburger-inner::after {
    transition-property: bottom, transform; }

.hamburger--vortex.is-active .hamburger-inner {
  transform: rotate(765deg);
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
  .hamburger--vortex.is-active .hamburger-inner::before, .hamburger--vortex.is-active .hamburger-inner::after {
    transition-delay: 0s; }
  .hamburger--vortex.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0; }
  .hamburger--vortex.is-active .hamburger-inner::after {
    bottom: 0;
    transform: rotate(90deg); }
  #about{
        margin-bottom: 0 !important;
  }
/* #home .menu .project_menu{
  background: #fff !important;
}
 */
.menu .project_menu{
 background: #f1f1f1;
 padding: 0 0 0 30px;
}
.menu ul li a{
  color: #666666;
  font-weight: 700;
  line-height: 150px;
  padding: 0 20px;
  font-size: 12px;
  display: inline-block;
  text-transform: uppercase;
  text-decoration: none !important;
}
.menu ul li a:hover{
  color: #000;
}
.menu .quick_btn{
  width: 150px;
  background: #c5cb28;
  text-align: center;
  color: #000;
  margin-left: 30px;
}
.menu .quick_btn:hover{
  background: #d3d842;
}
.info_bx.pt-30{
  padding-top: 10px;
}
.log_bx,.mb-dropbx{
  display: none;
}
.dropbx{
  position: absolute;
  width: 100%;
  min-height: 391px;
  z-index: 99;
  left: 0;
  background: #000; 
  padding: 70px 100px;
  display: none;
}
.dropmenu:hover .dropbx{
  display: block;
}
.menu .dropbx  a{
  line-height: 20px !important;
  padding: 0 1px;
  text-transform: lowercase;
}
.menu .dropbx .head_cntinfo p,.menu .dropbx .head_cntinfo a{
  color: #fff;
}
.menu .dropbx .head_socia ul li {
    display: block;
}

.menu .dropbx .head_socia ul li a{
   font-size: 14px;
   color: #fff;
   text-transform: capitalize;
   font-weight: 400;
}
.menu .dropbx  a:hover{
  color:#c5cb28 !important;
}
.login_form {
  width: 350px;
  margin: 0 auto;
}
.login_form .form-group,.login_form .form-group .form-control{
  margin-bottom: 5px !important;
  height: 50px;
}
.login_form .round_btn button{
  background: #fff;
  display: flex;
  text-transform: capitalize;
  color: #000;
}
.create_acnt{
  color: #fff !important;
  text-transform: uppercase !important;
}

/* CSS FOR HEAT DESTORATION EFFECT */
#live_banner,.wrap{
  position: relative;
  height: 100%;
}
.hand{
     position: absolute;
    right: 23em;
    bottom: 0;
    width: 22%;
    z-index:  9;
}
.value_content p {
    font-size: 13px !important;
    line-height: 18px !important;
}
/* .Background {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
}

.Background::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.5), transparent 50%, rgba(0, 0, 0, 0.5));
} */
canvas {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-50%, -50%) scale(1) !important;
}
.slide-wrapper {
  display: none;
}
#live_banner .content {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    margin: 0 auto;
}
.background {
  position: absolute;
  width: 100%;
  height: 100%;
}

.background__canvas {
  position: absolute;
  z-index: 10;
}

.background__title {
  font-size: 3em;
  position: absolute;
  z-index: 1;
  top: calc(40% + 0.25em);
  margin: 0 auto;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.intro__content {
  position: relative;
  max-width: 25em;
  padding: 1em 11vw;
}

.intro__content:first-child {
  margin-bottom: 1em;
  color: #787c81;
}

.intro__text {
  margin: 0;
}

.intro__content--pater::before {
  content: 'Our Sponsor:';
  font-size: 0.65em;
  font-weight: bold;
  position: absolute;
  bottom: 100%;
  margin-bottom: -1em;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #7a828c;
}

.dummynav {
  position: absolute;
  z-index: 10;
  top: 40%;
  padding: 0 0 0 4.75em;
  pointer-events: none;
  -webkit-transform: translateY(-50%) translateY(calc(100%/7*2));
  transform: translateY(-50%) translateY(calc(100%/7*2));
}

.dummynav__item {
  font-size: 3em;
  font-weight: bold;
  line-height: 1.2;
  display: block;
  color: rgba(255, 255, 255, 0.3);
}

.dummynav__item--active {
  padding: 0.5em 0;
  opacity: 0;
}
.scroll_down{
     width: 58px;
    height: 58px;
    border-radius: 100%;
    line-height: 10px;
    position: relative;
    top: 20px;
    cursor: pointer;
}

.scroll_down a{
         display: flex;
    height: 100%;
    align-items: center;
    color: #b2b54b !important;
    font-size: 12px;
    line-height: 12px;
    position: relative;
    /* display: block; */
    transform: rotate(90deg);
    text-align: center;
        box-shadow: 0 1px 43px 0px #c5cb27;
    font-style: italic;
    z-index: 99;
     width: 58px;
    height:58px;
    border-radius: 100%;
    text-decoration: none !important;
    font-family: 'Baloo', cursive;
}
.scroll_down a:after{
  content: "";
     z-index: -9;
    width: 58px;
    position: absolute;
    display: block;
    height: 58px;
    display: block;
    border-radius: 100%;
       box-shadow: 0 0 0 rgba(171, 171, 171, 0.4);
    background: #fff;
    -webkit-animation: breath 2s infinite;
    animation: breath 2s infinite;
}
/* 
.scroll_down span{
        z-index: -9;
    width: 60px;
    position: absolute;
    display: block;
    height: 60px;
    display: block;
    border-radius: 100%;
   box-shadow: 0 1px 30px 0px #fff;
    background: #fff;
    -webkit-animation: breath 1.2s infinite;
    animation: breath 1.2s infinite;
} *//*
.scroll_down:after{
    content: "";
    width: 60px;
   height: 60px;
   display: block;
    border-radius: 100%;
    box-shadow: 0 1px 43px -2px #c5cb27;
    position: absolute;
    top: 0;
    transform-origin: 50% 50%;
    background: #fff;
    -webkit-animation:breath 1s infinite;
    animation:breath 1s infinite;
}
*/

@-webkit-keyframes breath {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
    -ms-transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
  }
}

@keyframes breath {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
    -ms-transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
  }
}

.scroll_down:before{
    content: "";
    position: absolute;
    top: 53px;
    left: 50%;
    width: 1px;
    height: 0;
    background: #b2b54b;
    z-index: 999;
    animation:stick 1s forwards;
    -webkit-animation:stick 1s forwards;
}
@keyframes stick{
  0%{
    height: 0;
  }
  100%{
    height: 100px;
  }
}



@media screen and (max-width: 1000px) {
  .background__title,
  .dummynav__item {
    font-size: 2em;
  }
}

@media screen and (min-width: 600px) {

  .intro {
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 0 0 0 2em;
    background: transparent;
  }
  .intro__content {
    padding: 3em 3em 0 3em;
  }
  .intro__content--pater::before {
    margin-bottom: -3.75em;
  }
  .intro__content:first-child {
    margin: 0;
    border-right: 2px solid #fff;
  }
}

@media screen and (max-width: 600px) {
  .background__title,
  .dummynav__item {
    font-size: 1.5em;
  }
  .wrap {
    position: relative;
    /* height: 80vh; */
  }
  .demo-1 .codrops-header {
    top: 0;
    right: auto;
    bottom: auto;
    left: 0;
    text-align: left;
  }
  .demo-1 .codrops-header h1 {
    font-size: 1em;
    display: inline-block;
    margin: 0;
    vertical-align: middle;
  }
  .demo-1 .codrops-demos {
    font-size: 0.75em;
    display: block;
    background: transparent;
    margin-top: 1em;
  }
  .demo-1 .codrops-demos span {
    display: none;
  }
}

#why_coco{
  padding-top: 8em;
}
#why_coco .key_feature .key_list{
  padding-right: 20px;
}
#why_coco .key_feature .key_list li{
    text-transform: capitalize !important;
    font-style: normal;
}
.intro {
    position: absolute;
    bottom: 5em;
    left: 1em;
    padding: 5em;
    z-index: 99;
}
.intro__title {
  color: #000;
  font-size: 4em;
  line-height: 0.9;
  margin: 0;
  font-weight: normal;
  margin-left: -0.1em;
  letter-spacing: -0.025em;
}

.intro .para {
      font-size: 14px;
  font-weight: 700;
    margin: 0.5em 0;
    color: #000;
    width: 340px;
}

.intro__button {
  font-weight: 600;
  margin: 2em 0 0 0;
  padding: 1em 2.5em;
  letter-spacing: 0.05em;
  color: #adc53b;
  border: 2px solid #adc53b;
  border-radius: 2em;
  background: none;
  -webkit-transition: color 0.2s, background 0.2s;
  transition: color 0.2s, background 0.2s;
}

.intro__button:hover,
.intro__button:focus {
  color: #fff;
  outline: none;
  background: #adc53b;
}

.codrops-demos {
  padding: 0 0 1.5em;
}


/* START CSS FOR WHY COCO SECTION */
.tiny_tit{
  color: #b6b6b6;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .8px;
  text-transform: uppercase;
   font-family: 'Lato', sans-serif !important;
}
.big_tit{
  color:#cbd028;
  font-size:60px;
  line-height: 60px;
  font-weight: normal;
  text-transform: capitalize;
  font-family: 'Baloo', cursive;
}
.para{
      font-size: 14px;
    color: #666666;
    line-height: 19px;
}

.product_bx{
  position: relative;
  margin-bottom:100px;
}
.product_bx .order_btn{
      position: absolute;
      bottom: -3em;
      left: -2em;
}
.product_img img{
      width: 100%;
}
.upcoming,.upcoming .round_btn a{
  opacity: .8;
  color: #666666;
  cursor: not-allowed !important;
}
.item__img-wrap {
  --aspect-ratio: 1/1.5;
  overflow: hidden;
  width: 500px;
  margin: 0 auto;
  padding-bottom: calc(100% / (var(--aspect-ratio)));
  max-width: calc(100% - 2rem);
  will-change: transform;
}

.item:first-child .item__img-wrap {
  --aspect-ratio: 8/10;
  --image: url(../img/1.jpg);
}
.why_banner.img-wrap {
  width: calc(90% + 0px);
    height: calc(89% + 0px);
}
/* 
.why_banner{
       display: flex;
    align-items: center;
    height: 88.5%;
    background-size: cover;
} */
.round_btn{
  width: 120px;
  height: 120px;
  border-radius: 100%;
  background: #000;
  text-align: center;
  display: flex;
  align-items: center;
}
.round_btn a,.round_btn button{
  color: #fff;
  width: 120px;
  height: 120px;
  border-radius: 100%;
  background: #000;
  font-family: 'Baloo', cursive;
  font-size: 17px;
  text-align: center;
  border:none !important;
  margin: 0 auto;
  line-height: 17px;
  display: flex;
  align-items: center;
}
.round_btn:hover,.round_btn a:hover,.round_btn button:hover,.round_btn.selected,.round_btn.selected a{
  background:#fff;
  color: #000;
      box-shadow: 0 1px 47px rgba(203, 208, 40, .3);
    text-decoration: none;
}
.round_btn:hover a{
  color: #000;
}
.round_btn:hover .btn_desc,.round_btn:hover .btn_desc span,.round_btn.selected  .btn_desc span{
  color: #000 !important;
}
.round_btn a span,.round_btn button span{
  width: 100px;
  margin: 0 auto;
}

.round_btn .btn_desc{
    font-family: 'Lato', sans-serif !important;
    font-style: italic;
        font-size: 9px;
    line-height: 10px;
    font-weight:700;
    padding-top: 5px;
}
#blend_banner{
      /*background: url(../img/Layer-38.jpg);*/
    background-size: cover;
    background-repeat: no-repeat;
    height: 100%;
    margin: 150px 0;
    /* background-attachment: fixed; */
     display: -ms-flexbox;
    display: flex;
  -ms-flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
#blend_banner .title {
   display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  height: 100%;
  align-items: center;
  justify-content: center;
    margin: 0;
    padding: 0;
    text-align: center;
    line-height: 1em;
    font-size: 10em;
    color: #84ad03;
    font-weight: 400;
    opacity: 1;
    /*  text-shadow: 0 5px 10px rgba(0,0,0,1); */
    mix-blend-mode: screen;
}
.key_feature .key_list{
  padding-right: 40px;
}
.key_feature .key_list li{
     font-style: italic;
    color: #999999;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 20px;
    margin-bottom: 10px;
}

/* FOR WHY FRUSCRIBE */
#why_fruscribe{
  position: relative;
}
.fru_banner{
  position: absolute;
  right: 0;
  width: 55%;
  top: 17em
}
.fru_banner img{
width: 100%;
}
.c_width{
  width: 15em;
}
/* CSS FOR FOOTER */
footer{
  background: url(../img/Footer-Background.jpg) no-repeat;
  background-size:cover;
  height: 100%; 
  margin-top: 14em;
}
.inner_footer .round_btn{
  position: relative;
  top: -6em;
}
.inner_footer .round_btn, .inner_footer .round_btn a{
  width: 200px;
  height:200px;
  line-height: 30px;
  margin: 0 auto;
}
.inner_footer  .round_btn a span {
    width: 136px;
}
.inner_footer {
  position: relative;
  height: 100%;
}
.ft_whitebx{
       background: rgba(255, 255, 255, 0.96);
    padding: 40px 40px 15px 40px;
    width: 80%;
    margin: 0 0 0 auto;
    position: absolute;
    bottom: 3em;
    right: 0;
}
footer .para,footer a{
  font-size: 16px;
  line-height: 21px;
  color: #333;
}
footer a:hover{
  color: #cbd028 !important;
  text-decoration: none !important;
}
.ft_about .para{
  width: 78%;
}
.ft_cntinfo address,.ft_cntinfo p{
  margin-bottom: 10px;
}
.btm_ft{
  padding-top: 20px;
}
.social a {
      background: #b6b6b6;
    width: 35px;
    height: 35px;
    font-size: 16px;
    margin-right:12px;
    line-height: 34px;
        text-align: center;
    display: inline-block;
    color: #fff !important;
    border-radius: 100%;
}
.social a:hover{
  background: #fff;
  color: #000 !important;
  box-shadow: 0 0px 20px 1px #cdd234;
}
footer .quick_link,.payment_meth {
  display: flex;
  align-items: flex-end;
  height: 100%;
}
footer .quick_link  li a{
  text-transform: uppercase;
  color: #999;
  font-weight: 700;
  padding-right: 12px;
  font-size: 12px;
}
.scroll-top{
      position: absolute;
    bottom: 3em;
    left: 4em;
}
.scroll-top,.scroll-top a{
      width: 90px;
    height: 90px;
    font-family: 'Baloo', cursive;
    border-radius: 100%;
    background: #000;
    text-align: center;
}
.scroll-top a{
       color: #fff;
       display: flex;
    align-items: center;
    justify-content: center;
       text-align: center;
       font-style: italic;
       line-height: 20px !important;
}

/* CSS FOR ABOUT US */
#about .para{
  width: 380px;
}


#about .lhs_content{
 padding-top: 7.5em; 
 position: relative;  
 z-index: 99;
 left:-28px;
}
.negative{
  padding-left: 7em;
}
/* #about{
   background: url(../img/about_banner.jpg) 100% 0 no-repeat;
    display: flex;
    align-items: center;
    height: 100vh;
    width: 100%;
    right: -1em;
    position: relative;
   
    top: -7em;
} */
#about{
    position: relative;
    display: flex;
    align-items: flex-start;
        margin-bottom: 80px;
}
.rhs_content{
      position: absolute;
    top: 0;
    right: 0;
    z-index: 9;
    width: 100%;
    height: 100%;
}
.rhs_content .row{
  height: 100%;
}
 .about_banner {
      background: url(../img/about_banner.jpg) 100% 70% no-repeat;
    /* display: flex; */
    /* align-items: center; */
    height: 100%;
    width: 100%;
    right: 0;
    /* position: relative; */
    background-size: cover;
    top: 0;
}

.value_bx{
  padding-top: 50px;
  padding-left: 1em;
  min-height:275px;
}
.value_bx .round_btn,.value_bx .round_btn a{
  position: absolute;
  color: #fff !important;
  background: #000 !important;
  cursor: default !important;
  font-size: 16px;
}
.value_bx .round_btn:hover .btn_desc{
  color: #ccc !important;
}
.value_bx
.value_content{
        padding-left: 9em;
    padding-top: 5em;
    width: 90%;
}
.value_bx .btn_desc{
  color: #ccc;
}
.value_content p{
  font-size: 16px;
  line-height: 21px;
}

/*CSS FOR ACCOUNT*/
.form-group {
  position: relative;
  margin-bottom: 1.5rem;
}

.form-control-placeholder {
  position: absolute;
  top: 0;
  padding: 7px 0 0 7px;
  transition: all 200ms;
  opacity: 0.5;
}

.form-control:focus + .form-control-placeholder,
.form-control:valid + .form-control-placeholder {
  font-size: 75%;
  transform: translate3d(0, -90%, 0);
  opacity: 1;
 
}
.form-control{
  border:none !important;
  border-bottom:1px solid #000 !important;
  border-radius: 0 !important;
  padding-left: 0.40rem;
  margin-bottom: 25px;
  padding: 0.375rem 0.55rem !important;
}
.form-group label{
  color:#cccccc;
  font-weight: 700;
  text-transform: uppercase;
  font-style: italic;
}

.order_list ul li{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  font-weight: 700;
  color: #000;
  font-style: italic;
  border-bottom: 1px solid #000;
  padding:0 5px 4px;
  margin-bottom: 25px;
}
.order_list .duration{
  color: #b6b6b6;
}
.order_list .cancel{
  font-weight: 700;
  color: #cbd028;
}
.acnt_topic ol{
  list-style:decimal;
  padding-left: 16px;
  padding-bottom: 25px;
  border-bottom: 1px solid #ccc;
  width: 80%;
}
.acnt_topic ol li,.acnt_topic ol li a{
  color: #000;
  text-transform: uppercase;
  font-size: 14px;
  line-height: 30px;
  letter-spacing: .5px;
   transition: all .3s linear;
  text-decoration: none;
}
.acnt_topic ol li:hover,.acnt_topic ol li:hover a,.acnt_topic ol li a:hover,.acnt_topic ol li.active a,.acnt_topic ol li.active{
  color: #cbd028;
  transition: all .3s linear;
}
.cnt_us{
  padding-top: 30px;
}
.cnt_us p{
  line-height: 25px;
}
.cnt_us p a{
  color: #666;
  text-decoration: none;
}

.modal.confirm{
  max-width: 340px;
  overflow: visible;
}
.modal .round_btn{
  margin: 0 5px;
}
.modal .round_btn,.modal .round_btn a{
  width: 80px !important;
  height: 80px;
}
/* START CSS FOR GETSTARTED */
/*#get_started .quick_btn{
  display: none;
}*/
.select_plan{
  position: relative;
}
#select_plan strong span{
  display: block;
  color: #cccccc;
}
.subscription_list{
  display: flex;
  align-items: flex-end;
}
.subscription_list  .round_btn{
  margin:15px 20px 0 0;
}
.apply_coupon .round_btn{
  margin-left: 30px;
}
.apply_coupon .form-control{
      width: 308px;
}
input[type="checkbox"] {
    opacity: 0;
}
.add_acce{
  width: 308px;
}
.add_acce .checkbox{
  border-bottom: 1px solid #000;
  margin-bottom: 20px;
}

.ch_label:before {
    content: "";
    background: #cccccc;
    color: #fff;
    width: 15px;
    height: 15px;
    border-radius: 100%;
    border: 1px solid #ccc;
    display: inline-block;
    position: relative;
    top: 2px;
    line-height: 13px;
    /* font-weight: 300; */
    left: -10px;
    text-align: center;
}
.checkbox label{
  text-transform: uppercase;
  color: #000;
  font-style: italic;
  font-weight: 900;
  font-size: 14px;
}
.sideinner .checkbox label{
   padding-left: 10px;
}
.checkbox input:checked  ~ .ch_label:before,.radiobox input:checked  ~ .ch_label:before{
      background: #cad028;
    opacity: 1;
    border-color: #cad028;
}
.pr_checkout{
  position: absolute;
  right: 2em;
  bottom: 0;
}
.get_banner{
  background: url(../img/Image.jpg) no-repeat 100% 50%; 
  
    align-items: baseline;
    height:100%;
    position: relative;
    background-size: cover;
    top:0;
}
.payment_process{
  padding:20px !important;
}

.payment_process li{
  width: 125px;
  margin-right: 10px;
  border-bottom: 4px solid #fff;
  padding-bottom: 3px;
}
.payment_process li,.payment_process li a{
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  font-size: 12px;
  line-height:16px;
  text-transform: uppercase;
}
.payment_process li.active a{
  color: #000;
}
.payment_process li.active {
  border-color: #000;
}
.get_banner .my_order{
  padding: 25px;
}
.get_banner .my_order .price{
  padding-right: 15px;
}
.total_pay li{
  border: none !important;
  margin-bottom: 6px !important;
}
.goodness_chart{
  width: 100%;
    position: absolute;
    display: flex;
    align-items: center;
}
.outer_circle{
    width: 600px;
    height: 600px;
    background: #fff;
    border-radius: 100%;
    margin: 20px auto;
  }
.goodness_chart .content{
    width: 370px;
    padding: 12% 0;
    margin: 0 auto;
  }
.goodness_chart .big_tit{
  line-height: 48px;
}
  .goodness_chart .content table tr th,  .goodness_chart .content table tr td{
    border-top:none;
    border-bottom: 1px solid #cccccc;
   font-style: italic;
   
   padding: 1px 2px;
  }
.goodness_chart .content table tr td{
  color:#999999;
  font-size: 13px;
}

.goodness_chart .content table tr th{
 color:#666666;
 text-transform: uppercase;
 line-height: 16px;
 font-weight: 700;
 font-size: 14px;
}
.goodness_chart .para{
  color: #999999;
      width: 304px;
    margin: -8px auto 20px;
    line-height: 17px;
}
/* CSS FOR SUPPORT */
.que_list li{
  color: #333333;
  padding: 30px 0;
  border-bottom: 1px solid #cccccc;
}
.que_list li .que{
  margin-bottom: 15px;
}

.ans a{
  color: #333;
  text-decoration: underline;
}

.img-wrap {
       position: relative;
    right: 0;
    top: 3px;
    width: calc(100% + 0px);
    height: calc(100% + 0px);
    display: flex;
    align-items: center;
    margin: 0 0 0 auto;
}
.back-img {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.parallax-inner:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
   /*  background: rgba(0, 0, 0, 0.15); */
    z-index: 1;
}




.Background {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.Background::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.5), transparent 50%, rgba(0, 0, 0, 0.5));
}