:root{
    --mikey-red:#EA3B2D;
    --dark-red:#db3f44;
    --bg-dark-black:#333;
    --bg-blue-light:#83c3cd
}

.font-lato{font-family:'Lato',sans-serif}
.font-roboto{font-family:'Roboto',sans-serif}
.font-roboto-bold{font-family:'Roboto',sans-serif;font-weight:bold}
.font-roboto-italic{font-family:'Roboto',sans-serif;font-style:italic;font-weight:300}
.font-roboto-light{font-family:'Roboto',sans-serif;font-weight:300}
.font-roboto-light-italic{font-family:'Roboto',sans-serif;font-weight:300;font-style:italic}
.font-roboto-medium{font-family:'Roboto',sans-serif;font-weight:500}
.font-roboto-medium-italic{font-family:'Roboto',sans-serif;font-weight:500;font-style:italic}
.font-roboto-regular{font-family:'Roboto',sans-serif;font-weight:400}
.font-roboto-regular-italic{font-family:'Roboto',sans-serif;font-weight:400;font-style:italic}
.font-roboto-semibold{font-family:'Roboto',sans-serif;font-weight:600}
.font-roboto-semibold-italic{font-family:'Roboto',sans-serif;font-weight:600;font-style:italic}
.font-roboto-bold{font-family:'Roboto',sans-serif;font-weight:700}
.font-roboto-bold-italic{font-family:'Roboto',sans-serif;font-weight:700;font-style:italic}

.font-lato-bold{font-family:'Lato',sans-serif;font-weight:bold}
.font-lato-italic{font-family:'Lato',sans-serif;font-style:italic}
.font-lato-light{font-family:'Lato',sans-serif;font-weight:300}
.font-lato-light-italic{font-family:'Lato',sans-serif;font-weight:300;font-style:italic}

.ubuntu-sans-400 {font-family: 'Ubuntu Sans';font-optical-sizing: auto;font-weight: 400;font-style: normal;font-variation-settings: "wdth" 100;}
.ubuntu-sans-700 {font-family: "Ubuntu Sans", sans-serif;font-optical-sizing: auto;font-weight: 700;font-style: normal;}
.ubuntu-sans-600 {font-family: "Ubuntu Sans", sans-serif;font-optical-sizing: auto;font-weight: 600;font-style: normal;}
.ubuntu-sans-800 {font-family: "Ubuntu Sans", sans-serif;font-optical-sizing: auto;font-weight: 800;font-style: normal;}
.rubik-400 {font-family: "Rubik", sans-serif;font-optical-sizing: auto;font-weight: 400;font-style: normal;}



.font-9{font-size:9px}
.font-10{font-size:10px}
.font-11{font-size:11px}
.font-12{font-size:12px;line-height:normal}
.font-13{font-size:13px;line-height:normal}
.font-14{font-size:14px;line-height:normal}
.le_font-14{font-size:14px;line-height:normal}
.font-16{font-size:16px;line-height:normal}
.font-18{font-size:18px;line-height:normal}
.font-20{font-size:20px}
.font-22{font-size:22px}
.font-24{font-size:24px}
.font-28{font-size:28px}
.font-32{font-size:32px}
.font-35{font-size:35px}
.font-36{font-size:36px}
.font-38{font-size:38px}
.font-40{font-size:40px}
.font-46{font-size:46px}
.font-48{font-size:48px}
.font-52{font-size:52px}
.font-64{font-size:64px}

.letter-space-0-5{letter-spacing:0.5px}
.letter-space-0-75{letter-spacing:0.75px}
.letter-space-01{letter-spacing:1px}
.letter-space-02{letter-spacing:2px}
.letter-space-03{letter-spacing:3px}
.letter-space-05{letter-spacing:5px}
.letter-space-1{letter-spacing:10px}
.letter-space-1-5{letter-spacing:15px}
.letter-space-2{letter-spacing:20px}
.letter-space-2-5{letter-spacing:25px}
.letter-space-3{letter-spacing:30px}
.letter-space-4{letter-spacing:40px}

.line-0-5{line-height:0.5}
.line-0-75{line-height:0.75}
.line-1{line-height:1}
.line-1-2{line-height:1.2}
.line-1-5{line-height:1.5}
.line-2{line-height:2}
.line-2-5{line-height:2.5}

.text-grey{color: #808080;}
.text-red{color: var(--mikey-red);}
.bg-beige{background-color: #F6F4F0;}
.bg-grey{background-color: #818180;}
.bg-softblue{background-color: #E9F1F4;}
.bg-soft-blue-gradient{background: #E9F1F4;background: linear-gradient(270deg, rgba(233, 241, 244, 1) 80%, rgba(255, 255, 255, 1) 80%);}
.bg-soft-warm-gradient{background: #F6F4F0;background: linear-gradient(90deg, rgba(246, 244, 240, 1) 70%, rgba(255, 255, 255, 1) 70%);}
.bg-red{background-color: var(--mikey-red);}
.text-underline{text-decoration: underline;}
/* Navigation */

.fw-regular{font-weight: 400;}

.sub-logo{max-width: 140px; background-color: #fff; padding: 20px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.38);top:-80px;left: 52%; }

.mh-30{max-height: 30%;}
.mh-40{max-height: 40%;}
.mh-50{max-height: 50%;}
.mh-60{max-height: 60%;}
.mh-70{max-height: 70%;}
.mh-80{max-height: 80%;}
.mh-90{max-height: 90%;}
.mh-100{max-height: 100%;}

/* Make dropdown full width and position under nav */
.position-static .dropdown-menu {
  left: 0 !important;
  right: 0 !important;
  width: 50vw !important;
  top: 108% !important;
  border-radius: 0;
  min-width: 600px;
}
.menu-links a {padding: 22px 0; }

/* Optional: Make sure image covers the right side */
.object-fit-cover {
  object-fit: cover;
  height: 100%;
  width: 100%;
}

/* Navigation Ends */
/* .banner-container img { height: 1080px;} */
.top-header{position:absolute;right:0;top:0}
.difference-section .squer-box button{width:10px;height:10px;border:1px solid #fff;background-color:transparent}
.add-arrow .carousel-control-next,.add-arrow .carousel-control-prev{width:20px}
.add-arrow .carousel-control-next span,.add-arrow .carousel-control-prev span{color:#000;position:relative}
.add-arrow .carousel-control-next svg,.add-arrow .carousel-control-prev svg{fill:#fff}
.difference-section .squer-box button.active{background-color:#fff}
.text-mikey-red{color:var(--mikey-red)}
.bg-dark-black{background-color:var(--bg-dark-black)}
/* .btn-mikey{background-color:var(--mikey-red);color:#fff;text-transform:uppercase;padding:.5rem 2rem;border:none}
.btn-mikey:hover{background-color:var(--mikey-red);color:#fff} */

.btn-mikey{
  position: relative;
}

.btn-mikey::before {
	content: '';
	position: absolute;
	top: -20px;
	left: -20px;
	bottom: -20px;
	right: -20px;
	background: inherit;
	border-radius: 50px;
	z-index: -1;
	opacity: 0.4;
	-webkit-transform: scale3d(0.8, 0.5, 1);
	transform: scale3d(0.8, 0.5, 1);
}

.btn-mikey:hover {
	-webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
	transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
	color: #fff;
	background-color: var(--mikey-red);
	-webkit-animation: anim-moema-1 0.3s forwards;
	animation: anim-moema-1 0.3s forwards;
}

.btn-mikey:hover::before {
	-webkit-animation: anim-moema-2 0.3s 0.3s forwards;
	animation: anim-moema-2 0.3s 0.3s forwards;
}

@-webkit-keyframes anim-moema-1 {
	60% {
		-webkit-transform: scale3d(0.8, 0.8, 1);
		transform: scale3d(0.8, 0.8, 1);
	}
	85% {
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
@keyframes anim-moema-1 {
	60% {
		-webkit-transform: scale3d(0.8, 0.8, 1);
		transform: scale3d(0.8, 0.8, 1);
	}
	85% {
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
@-webkit-keyframes anim-moema-2 {
	to {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
@keyframes anim-moema-2 {
	to {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}


.btn-mikey-white { background-color: #fff; color: var(--mikey-red); text-transform: uppercase; padding: .5rem 2rem; border: none; transition: background-color 0.3s ease, color 0.3s ease;}
.btn-mikey-white:hover {background-color: #fff; color: var(--mikey-red); animation: pulse 0.6s infinite;}

@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}


.section-title{position:relative;font-family: "Ubuntu Sans", sans-serif;font-weight: 800;font-size: 48px;letter-spacing: 0.48px;}
/* .section-title::after{content:'';position:absolute;left:0;bottom:-10px;width:50px;height:3px;background-color:var(--mikey-red)} */
.carousel-item{height:600px;background-size:cover;background-position:center;position:relative}
.carousel-overlay{background:#0006;height:100%;width:100%;position:absolute;top:0;left:0}
.carousel-content{position:relative;z-index:2}
.carousel-indicators{z-index:3}
.bg-invalved{background:url(../images/get-invalved-bg.jpg) no-repeat center center/cover;height:65vh;display:flex;align-items:center}
.bg-safety-everyone{background:url(../images/bg-safety-everyone.png) no-repeat center center/cover;height:94vh;display:flex;align-items:center}
.bg-blue-light{background-color:var(--bg-blue-light);color:#fff}
.red-dark{background-color:var(--dark-red);color:#fff}
.testimonial-card{border-left:4px solid var(--mikey-red);padding:2rem;margin:2rem 0}

.counter-section{background-color:#333;color:#fff;padding:4rem 0}
.content-carousel{height:100%;display:flex;align-items:center}
.content-carousel .carousel-item{min-height:300px;height:auto;background:transparent}
.content-slide{padding:2rem;text-align:center}
.content-slide .icon{font-size:48px;margin-bottom:1rem}
.content-slide .number{font-size:38px;font-family: "Ubuntu Sans";font-weight:700;margin-bottom:1rem}
.content-slide .title{font-size:46px;margin-bottom:1rem;text-transform:capitalize;font-family: "Ubuntu Sans", sans-serif;font-weight: 800;letter-spacing: 2.3px;}
.content-slide .description{font-size:24px;margin-bottom:1.5rem;letter-spacing: 1.2px;font-family: "Rubik", sans-serif;font-weight: 400;}
.content-slide .description1{font-size:18px;margin-bottom:1.5rem;letter-spacing: 0.9px;font-family:'Roboto',sans-serif;font-weight:300}
.dark-section{background-color:#333;color:#fff}

.footer{background-color:#444;color:#fff;padding:3rem 0}
.footer h5{font-size:1rem;text-transform:uppercase;margin-bottom:1.5rem;letter-spacing:.5px}
/* .footer p{font-size:.9rem;margin-bottom:.5rem;opacity:.9} */
.footer a{color:#fff;text-decoration:none}
.footer a:hover{color:var(--mikey-red)}
.footer-social{display:flex;gap:1rem;margin-top:1rem}
.footer-social a{font-size:1.5rem}
.footer-divider{border-top:1px solid #ffffff1a;margin:2rem 0}
.footer-logos{display:flex;align-items:center;justify-content:flex-start;gap:2rem;}
.footer-logos img{height:30px;filter:brightness(0) invert(1);opacity:.9}
.footer-bottom{font-size:.8rem;opacity:.8}
.footer-bottom p{margin-bottom:.25rem}

.max-80{max-width:80px}
.divider-bar{border:2px solid #fff}

.menu-links a{ text-transform:uppercase;}

.navbar{background-color:#fff!important;padding:1rem 0;box-shadow:0 2px 4px #0000001a}
.navbar-nav .nav-link{text-transform:uppercase;font-size:14px;font-weight:500;padding:.5rem 1rem!important;color:#333!important}
.heart-icons img{width:20px}

.top-header a{background-color:#333;padding:.5rem 1rem;display:inline-block;margin-right:10px}
.top-header-btn{color:#fff;text-transform:uppercase;font-size:12px;padding:.25rem 1rem;text-decoration:none;display:inline-block;border-right:1px solid #fff3}
.top-header-btn:last-child{border-right:none}
.top-header-btn.donate{color:var(--mikey-red)}
.top-header-btn:hover{color:var(--mikey-red);background-color: #fff; border: 1px solid black;}

.section-carousel{border-radius:8px;overflow:hidden}
.section-carousel .carousel-item img{width:100%;height:400px;object-fit:cover}
.section-carousel .carousel-indicators{margin-bottom:1rem}
.section-carousel .carousel-indicators button{width:10px;height:10px;border-radius:50%;margin:0 4px}
.section-carousel .carousel-control-prev,.section-carousel .carousel-control-next{width:40px;height:40px;background:#00000080;border-radius:50%;top:50%;transform:translateY(-50%)}
.section-carousel .carousel-control-prev{left:10px}
.section-carousel .carousel-control-next{right:10px}

.hero-carousel{position:relative;height:100vh;max-height:800px}
.hero-carousel .carousel-item{height:100vh;max-height:800px}
.hero-carousel .carousel-indicators{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);z-index:15;display:flex;justify-content:center;padding:0;margin:0}
.hero-carousel .carousel-indicators button{width:10px;height:10px;border-radius:50%;background-color:#fff;opacity:.5;margin:0 5px;border:none}
.hero-carousel .carousel-indicators button.active{opacity:1}
.hero-content{position:absolute;top:50%;transform:translateY(-50%);color:#fff;z-index:2}
.hero-content h1{font-size:1.5rem;font-weight:400;margin-bottom:.5rem}
.hero-content h2{font-size:3.5rem;font-weight:700;margin-bottom:2rem}
.hero-card{background:#ffffffe6;padding:2rem;border-radius:4px;max-width:400px;margin-left:auto}
.hero-card h3{font-size:1.5rem;color:#333;margin-bottom:1rem;text-transform:uppercase}
.hero-card p{color:#666;margin-bottom:1.5rem;font-size:1.1rem}
/* .banner-container img{height:28vh; object-fit: cover;} */
.go-icon{max-height: 20px;}


@media (max-width: 768px) {
    .footer-section{margin-bottom:2rem}
    .footer-logos{flex-wrap:wrap;justify-content:center}
    .hero-content h2{font-size:2.5rem}
    .hero-card{margin:1rem auto}
    .banner-container img{height:28vh; object-fit: cover;}
    .sub-logo {
      max-width: 110px;
      background-color: #fff;
      padding: 20px;
      box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.38);
      top: -100px;
      left: 10%;
  }
  #imageCarousel2 .carousel-item{height: 400px;}
}

.partner-block {
    padding: 2rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    gap: 2rem;
    width: 100%;
    background-color: #fff;
    margin-bottom: 2rem;
  }
  
  .partner-block.bg-light {
    background-color: #f8f9fa;
  }
  
  .partner-logo {
    max-height: 60px;
    width: auto;
    object-fit: contain;
    display: block;
    margin-bottom: 2.5rem;
  }
  
  .partner-text {
    flex: 1;
    font-size: 1rem;
    line-height: 1.6;
    color: #333;
  }
  
  .partner-text h5 {
    margin: 0 0 0.7rem 0;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  .partner-text p {
    margin-bottom: 0.7rem;
  }
  
  /* Mobile stacking */
  @media (max-width: 767.98px) {
    .partner-block {
      flex-direction: column;
      align-items: flex-start;
    }
  
    .partner-logo {
      margin-bottom: 1rem;
    }
  }
  
  .media-partners-section {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  
  .media-thankyou {
    font-size: 1.8rem;
    letter-spacing: 1px;
    line-height: 1.5;
  }
  
  .fpo-label {
    font-weight: bold;
    color: red;
    font-size: 3rem;
    margin-top: 1rem;
  }
  .recipe-name{
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: 11%; /* 1.98px */
    text-underline-offset: 25%; /* 4.5px */
    text-underline-position: from-font;}

    @media (max-width: 1200px) {
    .content-slide .title{font-size: 40px; }
    
    }

    @media (max-width: 992px) {
      .font-64{font-size: 50px;}
      .font-40 {font-size: 30px;}
      .font-38 {font-size: 30px;}
      .font-28 {font-size: 15px;}

      .content-slide .title{font-size: 32px;}
      .section-title{font-size: 32px;}
      .content-slide .description{font-size: 17px;}
      .content-slide .icon img{width: 90px;}
      .go-icon{max-height: 10px;}
      .sub-logo {top: -100px;left: 10%;}
      
    }

    @media (max-width: 767px) {
      .font-64{font-size: 40px;}
      .font-52{font-size: 30px;}
      .font-48{font-size: 28px;}
      .font-46{font-size: 19px;}
      .font-40{font-size:25px}
      .font-38 {font-size: 20px;}
      .font-35 {font-size: 18px;}
      .font-32{font-size:20px}
      .font-28 {font-size: 10px; }
      .font-24{font-size:18px}
      .font-22{font-size:14px}
      .font-18{font-size:13px;}
      .sub-logo{max-width: 100px; background-color: #fff; padding: 20px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.38);top: -100px;}
      .bg-soft-warm-gradient{background: #F6F4F0;}
      .bg-soft-blue-gradient{background: #E9F1F4;}
    }

    @media (max-width: 576px) {
    #imageCarousel2 .carousel-item{height: 300px;}
    .section-title {
      font-size: 28px;
  }
    }

    @media (min-width: 992px) {
      .border-right-red{border-right:1px solid #EE2924}
      .border-right-black{border-right:1px solid #000}
      .border-left-black{border-left:1px solid #000}
      .border-bottom-black{border-bottom:1px solid #000}
    }

  @media (min-width: 768px) and (max-width: 1024px) {
    .font-64 { font-size: 50px; }
    .font-52 { font-size: 40px; }
    .font-48 { font-size: 36px; }
    .font-40 { font-size: 30px; }
    .font-38 { font-size: 28px; }
    .font-35 { font-size: 26px; }
    .font-32 { font-size: 24px; }
    .font-28 { font-size: 22px; }
    .font-24 { font-size: 20px; }
    .font-22 { font-size: 18px; }
    .font-18 { font-size: 16px; }
    .sub-logo {top: -100px;left: 10%;}
  }

  @media (min-width: 1024px) and (max-width: 1200px) {
      .sub-logo {top: -100px;left: 10%;max-width: 125px;}
  }

  @media (min-width: 2300px) {
    .sub-logo{left: 52%;}
  }
  
  
  
  
.avatar {
    width: 135px; /* Adjust size as needed */
    height: 135px; /* Adjust size as needed */
    border-radius: 50%; /* Makes the image circular */
    object-fit: cover; /* Ensures the image fits within the circle */
}


.blog-image {
    width: 100%; /* Adjust size as needed */
    height: 100%; /* Adjust size as needed */
    object-fit: cover; /* Ensures the image fits within the circle */
}



.btn-learn-more {
    background-color: #e30613;
    color: white;
    padding: 0.6rem 1.7rem;
    border: none;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 2px;
    font-size: 14px;
    font-family:'Roboto',sans-serif;font-weight:700
}

.btn-learn-more:hover {
    background-color: #c30512;
    color: white;
}


/* Custom pagination styles */
.pagination .page-link {
  border-radius: 50% !important;      /* Make circular */
  background-color: #fff !important; /* Light grey background */
  border: 1px solid #000 !important;    /* Black border */
  width: 40px;
  height: 40px;
  padding: 0;
  line-height: 38px;
  text-align: center;
  color: #000;                         /* Black text */
}

.pagination .page-item .page-link {

  margin: 0 7px 0 7px;
}

.pagination .page-item.active .page-link {
  background-color: #d3d3d3 !important; /* Slightly darker grey for active */
  color: #000;
  border-color: #000;

}

.pagination .page-link:hover {
  background-color: #e0e0e0 !important; /* Hover effect */
  color: #000;
}

