:root{
    --maincolor:#032B0D;
    --subcolor:#95FA04;
    --abtcolor:#e0e8c4;
  }
  *{
      font-family: poppins;
      text-transform: capitalize;
  }
/* Navbar */
@media screen and (max-width: 740px) {
    .reglog{
        display: none;
    }
    .navbar-brand{
      height: 50px;
      width: 100px;
    }
}
/*login form*/
@media screen and (max-width: 740px) {
  #loginform{
    padding: 0 0 !important;
  }
}
/* Home banner */
@media screen and (max-width: 740px){
    .banner{
        height: 300px;
    }
    h1{
        position: absolute;
        top: 70px;
        left: 50px;
        color: hsl(135, 87%, 9%);
    }
    #headpara{
        position: absolute;
        font-size: small;
        font-weight: 500;
        top: 40px;
        left: 50px;
        color: white;
    }
    .banbtn{
        position: absolute;
        top: 210px;
        left: 50px;
      }
      .hbanlog{
        height: 150px;
        width: 200px;
        top: 150px;
        right: 0px;
        animation: hbanlogani 2s linear infinite;
      }
      @keyframes hbanlogani{
        0%{
          top: 150px;
        }
        50%{
          top: 140px;
        }
        100%{
          top: 150px;
        }
      }
      #heading2{
        font-size: medium;
        font-weight: 500;
        top: 70px;
        left: 200px;
      }
      #headpara2{ 
        top: 40px;
        left: 200px;
        font-size: small;
        font-weight: bold;
      }
      .banbtn2{
        display: none;
      }
       
}

/* home about */
@media screen and (max-width: 740px) {
    .abcon{
        margin-top: 20px;
        width: 100%;
    }
    #habimg{
       display: none;
    }
    #abt-banner{
        width: 100%;
        height: 300px;
    }
    #abt-head{
        position: absolute;
        top: 120px;
        left: 150px; 
        font-weight: 700; 
    }
    #abt-breadcrumb{
        position: absolute;
        top: 170px;
        left: 150px; 
    }
    .vm-box{
        padding: 0 !important;
    }
    #abt-head::before{
        height: 25px;
        background: linear-gradient(90deg, #e0e8c4 0%, #e0e8c4 5%, #e0e8c4 40%);
      }
    @keyframes headani{
        0%{
          top: 1%;
        }
        50%{
          top: 20%;
        }
        100%{
          top: 100%;
        }
      } 

}
/*Counter*/
@media screen and (max-width: 768px){
  .counter-wrapper{
    grid-template-columns: repeat(2, 1fr);
    grid-row-gap: 20px;
    padding: 50px;
  }
  .counter::before{
    bottom: -.1rem;
  }
  .counter .countz{
    font-size: large;
    margin-bottom: 2px;
  }
  .counter p{
    font-size: small;
    font-weight: 300;
  }
}

/*Services*/
@media screen and (max-width: 768px) {
    .cards {
        display: flex !important;
        flex-direction: column !important; 
    }
    .cards .card {
      margin: 40px;
    }  
}
/*Marquee*/
@media screen and (max-width: 740px) {
    .marquee{
        display: none;
    }
}

/* index meal card */
@media screen and (max-width: 740px) {

    #mp-banner{
        height: 300px;
    }
    #mp-head{
        position: absolute;
        top: 120px;
        left: 150px; 
        font-weight: 700; 
    }
    #mp-breadcrumb{
        position: absolute;
        top: 190px;
        left: 150px; 
    }
    .diet .controls .buttons h3{
        display: none;
    }
    .diet .image-container{
        display: flex;
        flex-direction: column;
    }
    #mp-head::before{
        height: 70px;
        background: linear-gradient(90deg, #e0e8c4 0%, #e0e8c4 5%, #e0e8c4 40%);
      }
    @keyframes mpheadani{
        0%{
          top: 1%;
        }
        50%{
          top: 20%;
        }
        100%{
          top: 100%;
        }
      } 

  }
 


  /* pricing page */
  @media screen and (max-width: 740px) {
	.box-container{
        flex-direction: column;
        justify-content: center;
    }
    .box{
        margin: 0 10px;
    }
    #pri-head{
        position: absolute;
        top: 100px;
        left: 150px; 
        font-weight: 700; 
    }
    #pri-breadcrumb{
        position: absolute;
        top: 170px;
        left: 150px; 
    }
    #pri-head::before{
        height: 70px;
        background: linear-gradient(90deg, #e0e8c4 0%, #e0e8c4 5%, #e0e8c4 40%);
      }
    @keyframes priheadani{
        0%{
          top: 1%;
        }
        50%{
          top: 20%;
        }
        100%{
          top: 100%;
        }
      } 

	

}
/*Testimonials*/
@media (max-width: 740px) {
    .testi{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .testimonial-container {
      padding: 30px;
    }
    .testimonial-grid{
        display: flex;
        flex-direction: column;
        padding: 0;
        gap: 10px;
        align-items: center;
    }
    .testimage-container{
        margin: 50px;
        width: 50%;
        height: 200px;
        perspective: 100px;
    }
    .testimonial-image {
      width: 100%;
      align-items: center
    }
    .quote {
      text-align: justify;
    }
    .px-5 {
      padding-right: 0px !important;
      padding-left: 0px !important;
  }
    
}
/*Contact*/
@media (max-width: 740px) {
    .contact-form{
        margin: 5px;
    }
    #con-head{
        position: absolute;
        top: 100px;
        left: 150px; 
        font-weight: 700; 
    }
    #con-breadcrumb{
        position: absolute;
        top: 250px;
        left: 160px; 
    }
    .hcon{
      gap: 60px;
      align-items: center;
    }
    
    
    
	

}
@media (max-width: 740px) {
	/* Tweak the card price font size */
	#pricing-container .price-card--price-text {
		font-size: 32px;
	}
	#pricing-container .price-card--price-number:before {
		top: -10px;
		font-size: 18px;
	}
}

@media (min-width: 740px) {
	#pricing-container .price-card--features {
		display: block !important;
	}
}

@media (max-width: 740px) {
	#pricing-cards {
		display: block;
		padding: 0 24px;
	}
	#pricing-container .price-card {
		max-width: 360px;
		margin: 0 auto 48px;
	}
	#pricing-container .price-card:hover {
		transform: none;
	}
	#pricing-container .price-card-full-width {
		display: block;
	}
	#pricing-container .price-card-full-width .price-card--features--list {
		columns: 1;
	}
	#pricing-container .price-card--price {
		padding: 28px 0 0;
	}
	#pricing-container .price-card--features {
		display: none;
		margin: 26px 0 0 0;
		padding-bottom:0;
	}
	#pricing-container ul.price-card--features--list {
		max-width: 250px;
		margin: 0 auto;
	}
	#pricing-container li.price-card--features--item.features-disabled {
		display: none;
	}
	#pricing-container .price-card--mobile-features-toggle {
		display: block;
	}

	/* Pricing Switch */
	#pricing-switch {
		margin: 26px 0 52px;
	}
	#pricing-switch .switch-label {
		display: inline-block;
		width: auto;
		font-size:15px;
	}
	#pricing-switch .switch-label.active{
		font-size:16px;
	}
	#pricing-switch .switch-label .save-money {
		display: none;
	}
	#pricing-switch .save-money--mobile {
		display: block;
	}
}	

@media (max-width: 480px) {
	#pricing-container .price-card {
		max-width: 360px;
		margin: 0 auto 36px;
	}

	#pricing-switch {
		margin: 26px 0 36px;
	}
}
/*testimonials*/
@media (min-width: 768px) {
    .testimonial-grid {
      grid-template-columns: 1fr 1fr;
    }
    .arrow-buttons {
      padding-top: 0;
    }
  }
  /*Contact form*/

  @media (max-width: 768px) {
    .contact-section {
      flex-direction: column;
    }
    
    .company-info, .contact-form {
      flex: none;
      width: 100%;
    }
    #con-breadcrumb{
      top: 150px; 
    }
    #con-head::before{
      height: 70px;
      background: linear-gradient(90deg, #e0e8c4 0%, #e0e8c4 5%, #e0e8c4 40%);
    }
  @keyframes conheadani{
      0%{
        top: 1%;
      }
      50%{
        top: 20%;
      }
      100%{
        top: 100%;
      }
    } 

  }