.instantmenu {
    font-family: 'Josefin Sans', sans-serif;
    font-size: 25px;
}

:root{
    --main-font-family: 'Ubuntu', sans-serif;
    /* --title-font-family: 'DM Sans', sans-serif; */
    /* color-scheme: light; */
}

 /* Safari and Chrome */
.reviews::-webkit-scrollbar { 
  display: none; 
}

.text-green{
    color: #79D70F;
}

.text-gray{
    color: #a3a3a3;
}

 /* Small devices (landscape phones, 576px and up) */
 @media (max-width: 767px) { 
  .fs-14{
    font-size: 12px;
  }

  .fs-16{
    font-size: 14px;
  }

  .fs-18{
    font-size: 16px;
  }

  .fs-20{
    font-size: 18px;
  }

  .fs-22{
    font-size: 20px;
  }

  .fs-28 {
    font-size: 24px;
  }

  .fs-30{
    font-size: 28px;
  }

  .fs-32{
    font-size: 30px;
  }

  .fs-36{
    font-size: 34px;
  }

  .fs-40{
    font-size: 38px;
  }

  .fs-48{
    font-size: 46px;
  }

 }

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
  .fs-14{
    font-size: 14px;
  }

  .fs-16{
    font-size: 16px;
  }

  .fs-18{
    font-size: 18px;
  }

  .fs-20{
    font-size: 20px;
  }

  .fs-22{
    font-size: 22px;
  }

  .fs-28 {
    font-size: 28px;
  }

  .fs-30{
    font-size: 30px;
  }

  .fs-32{
    font-size: 32px;
  }

  .fs-36{
    font-size: 36px;
  }

  .fs-40{
    font-size: 40px;
  }

  .fs-48{
    font-size: 48px;
  }

 }

 th:not(:first-child){
  text-align: center;
 }

 td:not(:first-child) {
  text-align: center;
 }

 .fa-times{
  color: red;
 }

 .fa-check {
  color: #79D70F;
 }

a, a:hover{
  color: inherit;
  text-decoration: none;
}

html {
  scroll-behavior: smooth;
}

.sticky {
    position: fixed;
    top: 0;
    width: 100%;
    right: 0;
    background-color: white;
    z-index: 999;
    /* background: linear-gradient(to bottom, #ffffff 80%, #ffffffc8 80%,  #ffffff00 100%); */
    background: linear-gradient(180deg, #FFF 0%, #FFF 78%, rgba(255, 255, 255, 0.00) 100%);
  }

  .navbar-collapse.show {
    background-color: #ffffff; /* set background color to desired color */
  }

  .navbar-toggler {
    color: #fff !important; /* set color of the button text */
    background-color: white !important; /* set background color of the button */
    border-color: white !important; /* set color of the button border */
  }
  
  .dropbtn {
    background-color: white;
    color: #7f7f7f;
    padding: 8px;
    font-size: 16px;
    border: none;
    margin-bottom: 0;
  }
  
  .dropdown {
    position: relative;
    display: inline-block;
  }
  
  .dropdown-content {
    display: none;
    position: absolute;
    /* background-color: #f1f1f1; */
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  .dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
  }
  
  .dropdown-content a:hover {background-color: #ddd;}
  
  .dropdown:hover .dropdown-content {display: block;}

  .request-demo{
    background-color: #79D70F;
    border-radius: 25px;
    padding: 8px 15px;
    color: white;
    border: none;
    width: auto;
  }

  .btn-demo{
    border-radius: 5px;
    border: 2px solid black;
    cursor: pointer;
  }

  .txt-demo{
    padding: 10px 25px;
    font-family: var(--main-font-family);
    font-size: 18px;
    margin-bottom: 0;
    color: black;
    text-align: center;
  }

  .txt-demo:hover{
    background-color: black;
    color: white;
  }

  .sticky + .content-main {
    padding-top: 80px;
  }

  .sticky-top{
    background: white !important;
  }

  .main-fonts{
    font-family: var(--main-font-family);
  }

  .main-background{
    background-color: rgba(121,215,15,0.05);
    height: 100%;
  }

  .title-txt{
    font-family: var(--main-font-family);
    color: black;
    font-weight: 500;
  }

  .tagline-txt{
    font-family: var(--main-font-family);
    color: gray;
  }

  .content-txt{
    font-family: var(--main-font-family);
    color: black;
    text-align: center;
    /* display: flex;
  justify-content: space-evenly; */
  }

  .title-for-options{
    font-family: var(--main-font-family);
    color: black;
    font-weight: 500;
    border-left: 5px solid #79D70F;
    padding-left: 10px;
  }

  .content-for-options{
    font-family: var(--main-font-family);
    color: gray;
  }

  .tags-title{
    display: flex;
    flex-direction: row;
  }

  .tags-title span{
    padding:0 10px; 
    font-family: var(--main-font-family);
    font-size: 22px;
    
  }

  .tags-title:before,
  .tags-title:after {
      content: "";
      flex: 1 1;
      border-bottom: 1px solid #79D70F; 
      margin: auto;
  }

  .pleasewait{
    font-family: var(--main-font-family);
    font-size: 20px;
    margin-bottom: 0;
    color: #79D70F;
  }

  .steps-background-main{
    background-image: url(./../img/steps_background.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: auto;
    background-color: rgb(126.44, 126.44, 126.44, 0.78);
    background-blend-mode: soft-light;
  }

  .step-main{
    position: relative;
    margin-top: 73px;
  }

  .steps-sq{
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(21, 21, 21, 0.20) 0%, rgba(21, 21, 21, 0.00) 100%);
    backdrop-filter: blur(21px);
    /* position: absolute; */
  }

  .step-im{
    z-index: 9;
    top: -73px;
    position: absolute;
    left: 50%;
    /* right: 50%; */
    transform: translateX(-50%);
    /* bottom: -60px; */
  }

  .steps-ct{
    color: #FFF;
    text-align: center;
    font-size: 18px;
    font-family: var(--main-font-family);
  }

  .kf-title{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
  }

  .kf-content{
    font-family: var(--main-font-family);
    font-size: 16px;
    color: gray;
    margin-bottom: 0;
  }

  .key-feature-icon:hover circle{
    fill: #79D70F;
  }

  .key-feature-icon:hover path{
    fill: #ffffff;
  }


  .im-web{
    background-image: url(./../img/background.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-color: rgb(126.44, 126.44, 126.44, 0.78);
    background-blend-mode: multiply;
  }

  .im-web-title{
    font-family: 'Josefin Sans', sans-serif;
    font-size: 30px;
    text-align: center;
    color: white;
    margin-top: 10px;
  }

  .im-web-title span{
    font-family: 'Josefin Sans', sans-serif;
    font-size: 30px;
    color: #79D70F;
  }

  .im-content{
    font-family: var(--main-font-family);
    text-align: center;
    color: white;
  }

  .lm-btn{
    background-color: #79D70F;
    border-radius: 15px;
    margin-top: 10px;
    width: 150px;
  }

  .lm-txt{
    font-family: var(--main-font-family);
    font-size: 16px;
    color: white;
    margin-bottom: 0;
    padding: 3px 1px;
    text-align: center;
  }

  .rt-tagline{
    font-family: var(--main-font-family);
    color: gray;
    margin-bottom: 0;
    margin-top: 10px;
    text-align: center;
  }

  .rd-value{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
  }

  .rd-value-2{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
    text-align: center;
  }

  .rd-divider{
    background-color: black;
    height: 2px;
  }

  .rd-vt-divider{
    background-color: black;
    width: 2px;
    height: 130px;
  }

  .reviews{
    /* width: 460px; */
    /* height: 300px; */
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
  }

  .rt-reviewer-name{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
  }

  .rt-review{
    font-family: var(--main-font-family);
    color: gray;
    margin-bottom: 0;
    margin-top: 10px;
  }

  .wt-span{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
    font-weight: 500;
  }

  .wt-title{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
    font-weight: 500;
  }

  .wt-content{
    font-family: var(--main-font-family); 
    color: gray;
    margin-bottom: 0;
  }


@media screen and (min-width: 1201px)  {
	.video {
		height: 600px !important ;
	}
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
	.video {
		height: 450px !important ;
	}
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
	.video {
		height: 450px !important ;
	}
}
 
  @media screen and (min-width: 481px) and (max-width: 768px) {
	.video {
		height: 400px !important ;
	}
}

  @media screen and (max-width: 480px) {
	.video {
		height: 220px !important ;
	}
}

  .bubble{
    position: relative;
  }
  
  .centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-family: var(--main-font-family);
    margin-bottom: 0;
    text-align: center;
  }

  .ac-name{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    text-align: center;
    font-size: 20px;
    color: black;
    margin-top: 10px;
  }

  .cs-msg{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    color: black;
    margin-top: 10px;
  }

  .cs-input {
    border: 1px solid black;
    border-radius: 8px;
    font-size: 16px;
    padding: 8px;
    background-color: transparent;
    font-family: var(--main-font-family);
  }
  
  .cs-input:focus {
    outline: none;
  }

  ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #79D70F;
    opacity: 1; /* Firefox */
  }
  
  :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: 79D70F;
  }
  
  ::-ms-input-placeholder { /* Microsoft Edge */
    color: 79D70F;
  }

  .cs-company-details{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    color: black;
  }

  .cs-company-details2{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    color: gray;
  }

  .err-contact{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    font-size: 16px;
    color: rgb(249, 31, 31);
    margin-top: 5px;
  }

  .submit-btn{
    background-color: #79D70F;
    border-radius: 8px;
    width: max-content;
    cursor: pointer;
    transition: background 0.9s;
  }

  .submit-btn :active{
    background-color: #bad997;
    background-size: 100%;
    transition: background 0s;
    border-radius: 8px;
  }

  .submit-txt{
    padding: 8px 50px;
    color: white;
    margin-bottom: 0;
    font-size: 18px;
    font-family: var(--main-font-family);
  }

  .pw-tag{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    font-size: 18px;
    color: black;
    margin-top: 10px;
  }

  .green-border{
    border: 1px solid #79D70F;
    margin-top: 0;
    margin-bottom: 0;
  }

  .try-layout{
    background-color: #79D70F;
    border-top: 2px solid black;
    border-bottom: 2px solid black;
    box-sizing: border-box;
  }

  .try-header{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    color: white;
  }

  .try-content{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    color: white;
    margin-top: 5px;
    display: block;
  }

  .layout{
    display: flex;
    align-content: center;
    height: 150px;
  }

  .im-name {
    font-family: 'Josefin Sans', sans-serif;
    margin-bottom: 0;
    font-size: 50px;
    color: white; 
  }

  .im-name span{
    font-family: 'Josefin Sans', sans-serif;
    color: #000000;
  }

  .ft-main{
    font-family: 'Josefin Sans', sans-serif;
    margin-bottom: 0;
    font-size: 30px;
    color: black; 
  }

  .ft-main span{
    font-family: 'Josefin Sans', sans-serif;
    color: #79D70F;
  }

  .ft-tagline{
    font-family: var(--main-font-family);
    font-size: 16px;
    color: gray;
    text-align: center;
  }

  .ft-text{
    font-family: var(--main-font-family);
    margin-bottom: 0;
    color: black;
    margin-top: 5px;
    cursor: pointer;
  }

  .ft-header{
    font-family: var(--main-font-family);
    color: black;
    border-left: 2px solid #79D70F;
    padding-left: 5px;
    font-weight: 500;
  }

  .cp-txt{
    font-family: var(--main-font-family);
    color: black;
  }


  @media (min-width: 768px) {
    .vhm-100{
      min-height: 100vh;
    }
   }

   /* Contact Us Page */
   .main-background-contact{
      background-image: url(./../img/contact_main_bg.png);
      background-repeat: no-repeat;
      background-size: cover;
      background-color: rgba(190, 190, 190, 0.78);
      background-blend-mode: soft-light;
      background-position-x: 80%;
      background-position-y: 25%;
   }


   /* Blog */
   .main-background-blog{
    background-image: url(./../img/blog_main_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-color: rgba(190, 190, 190, 0.78);
    background-blend-mode: soft-light;
    background-position-x: 80%;
    background-position-y: 25%;
   }

   .bs-box-title{
    font-family: var(--main-font-family);
    font-size: 18px;
    color: black;
    border-left: 2px solid #79D70F;
    padding-left: 5px;
   }

   .bs-box-text{
    font-family: var(--main-font-family);
    font-size: 14px;
    color: gray;
   }

   .rd-more{
    font-family: var(--main-font-family);
    font-size: 14px;
    color: #79D70F;
    border-bottom: 2px solid #79D70F;
    padding-bottom: 3px;
    margin-bottom: 0;
   }

   .bg-title{
    font-family: var(--main-font-family);
    color: black;
    font-weight: 500;
   }

   .bg-content{
    font-family: var(--main-font-family);
    color: black;
   }

   .bg-step{
    font-family: var(--main-font-family);
    color: black;
    font-weight: 500;
    margin-bottom: 0;
   }

   .bg-tags{
    font-family: var(--main-font-family);
    font-size: 20px;
    color: #79D70F;
    margin-bottom: 0;
    border-bottom: 2px solid black;
    padding-bottom: 3px;
    font-weight: 500;
   }

  .bg-tags-content p {
    line-height: 1.5;
    font-family: var(--main-font-family);
  }
  
  .bg-tags-content span {
    display: inline-block;
    padding: 4px 15px;
    color: black;
    background-color: #E4FBCA;
    border-radius: 5px;
    font-weight: 500;
    margin-left: 3px;
    margin-bottom: 5px;
  }

  .bg-rt{
    font-family: var(--main-font-family);
    color: #79D70F;
    margin-bottom: 0;
    border-bottom: 2px solid black;
    padding-bottom: 3px;
    font-weight: 500;
    display: inline-block;
  }

  /* Supplier */
  .main-background-supplier{
    background-image: url(./../img/supplier.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-color: rgba(190, 190, 190, 0.78);
    background-blend-mode: soft-light;
    background-position-x: 80%;
    background-position-y: 25%;
   }

  .sh-cat{
    font-family: var(--main-font-family);
    font-size: 25px;
    color: black;
    font-weight: 500;
    margin-bottom: 0;
  }

  .sh-pname{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
  }

  .sh-ptext{
    font-family: var(--main-font-family);
    color: gray;
    margin-bottom: 0;
  }

  .sh-details{
    background-color: #79D70F;
    border-radius: 5px;
    width: fit-content;
    margin-top: 10px;
  }

  .sh-details-text{
    font-family: var(--main-font-family);
    font-size: 14px;
    color: white;
    margin-bottom: 0;
    padding: 5px 8px;
  }

  .sh-out-of-stock {
    font-family: var(--main-font-family);
    font-size: 14px;
    color: #d41616;
    margin-bottom: 0;
    margin-top: 3px;
  }

  .sh-tags{
    font-family: var(--main-font-family);
    font-size: 16px;
    color: gray;
    margin-bottom: 0;
  }

  .sh-title{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
    margin-top: 30px;
    display: inline-block;
  }

  .sh-wt{
    /* border: 1px solid black; */
    background-color: #79D70F;
    border-radius: 5px;
    cursor: pointer;
  }

  .sh-wt-text{
    font-family: var(--main-font-family);
    font-size: 16px;
    color: white;
    margin-bottom: 0;
    padding: 10px 15px;
    text-align: center;
  }

  .sh-carousel-indicators li {
    margin: 0.25rem;
    border-radius: 3px;
    border-width: 0px;
    background-color: rgba(112, 229, 70, 0.3);
    padding: 5px;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }

  .sh-carousel-indicators .active{
    margin: 0.25rem;
    border-radius: 3px;
    border-width: 0px;
    background-color: rgba(112, 229, 70);
    padding: 5px;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }

  .sh-features-title{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
    font-weight: 500;
  }

  .sh-features-content{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
  }

  /* About us */
  .ab-title{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 5px;
    margin-top: 5px;
  }

  .ab-content{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 5px;
    margin-top: 5px;
  }

  /* Plus */
  .bg-mgreen{
    background-color: #c2f78585;
    color: black;
  }

  td{
    font-family: var(--main-font-family);
  }

  th{
    font-family: var(--main-font-family);
    font-weight: 500;
  }

  .ip-content{
    font-family: var(--main-font-family);
    color: black;
    margin-bottom: 0;
    text-align: center;
  }

  .ip-title{
    font-family: var(--main-font-family);
    color: #79D70F;
    margin-bottom: 0;
    text-align: center;
  }