/* STYLE SECTIONING TAGS */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


body {
   font-family: "Belleza", sans-serif; 
   background-color:#264428;
   display: flex;
   flex-direction: column;
   /* display: flex;
   flex-direction: column; /*Ensure content flows from top to bottom*/ 
   /* align-items: center; 
   width: 100%;  */ 
   }

html {
   scroll-behavior: smooth; 
}

.belleza-regular {
  font-family: "Belleza", sans-serif;
  font-weight: 100;
  font-style: normal;
}


.image-container {
     position: relative;
     width: 100%; /*full viewport width*/
     height: 100vh;

   }
   .base-image {
      flex: 1;
      position: absolute;
      top:0;
      left:0;
      height: auto;
     width: 100%;
      object-fit:cover; 
     z-index: 1;
   }

   .overlay-image{
      position: absolute;
      top:0;
      left:0;
      height: 100%;
      width: auto; 
      object-fit:cover; 
     opacity: .50;
     z-index: 2; 
   }

.logo{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); 
   width: 60%;
   height: auto;
   z-index: 4;
}

   .overlay-text {
      position: fixed;
position: absolute;
      left: 20px;
      right:20px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      z-index: 3; 
   }

.tabs {
   font-size: 30px;
   display: flex;
   font-family: 'Belleza', sans-serif;
   /*align items to the right*/
   justify-content: flex-end; 
   gap:40px;
   padding-top: 20px;

}

.ourImpact{ /* Reset the space of the webpage */
   margin: 0px;
   padding: 0px;
}
co
.books{

}
.Title {
   font-size: 35;
      flex: 1;
      margin-top: 40px;
      padding: 10px;
   padding-top: 20px;
   padding-bottom: 20px;
      text-align: center;
      background-color:#f5f1ed;
      color: #264428

   }

.Title {
   font-size: 100px; 
}

.impactContent{
   font-size: 80px;
   color: #f5f1ed;
   background-color: #264428;
   position: relative;
   left: 50px;

   overflow: hidden;
   display: flex;
   text-align: center;
   margin-top: 100px;
}

.missionContent {
   text-align: center;
    display: flex;                       /* Use Flexbox for layout */
    align-items: center;                 /* Align items vertically centered */
    background-color:#274529;           /* Set background color */
    font-size: 35px;                     /* Apply font size to .missionContent */
    color: #fbeaed;                      /* Apply text color to .missionContent */
}
/* Specific styles for child elements */
.missionContent p {
    margin-left: 80px;                           /* Remove default margin */
   display: inline-block;
   
}


.rightText {
    text-align: center;

   padding-right: 0px;
}

.imageRight {
    float: right; 
    max-width: 100%;
   height: auto;
   padding-right: 0px;
   padding-left: 0px;
}

/* STYLE TEXT */

h1 {
  color: #fbeaed;
  font-size: 60px;
  font-family: "Belleza", sans-serif;
   padding-top: 20px;
}

/* STYLE IMAGES */


#logoTwo {
  max-width: 40%;
/*  border-radius: 50%; */
  margin: 2cm;
 
}
/* Cook*/
.cooks{
   background-color: #f5f1ed;
 /*  background-color: #fbeaed;*/
   padding-left: 0%;
}

.cooks p{
   color: #264428;
   padding-top: 30px;
}

.cooks img{
    width: 35%;
    height: auto;
}

#cook1{
   padding-bottom: 40px;
}

.impactContent p {
   padding-right: 20px;
}
/* cook end*/

/*contact*/
.Contact {
   background-color: #f5f1ed;
   margin-top: 50px;
   color: #264428;           /* Set background color */
   font-size: 60px;    
   
   padding: 50px;/* Apply font size to .missionContent */

}

.wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 2 columns */
  gap: 1em; /* Space between items */
  padding: 0 35px; /* Horizontal padding */
}

.wrapper img{
   width: 100%; /* Full width */
}
/*contact end*/

.base-image {
   max-width:100%;
   max-height:100%;
}

.overlay-image {
   max-width:100%;
   max-height: 100%;
}

/* STYLE NAV BAR */
.tabs a {
    color: #fbeaed;
    text-decoration: none;
   padding: 10px;
   border-radius: 20px;
}
.tabs a:hover {
    background-color: #f5f1ed;
    color: #264428;
}
/* Image container and images */


/* STYLE BUTTONS */

/* ADD MORE! */

.wrapper {
  display: flex; /* Use Flexbox for horizontal alignment */
  justify-content: space-around; /* Distribute space around items */
  align-items: center; /* Center items vertically */
  padding: 30px; /* Optional: add some padding around the wrapper */
}

/* Flexbox settings for each section inside .wrapper */
.section {
  display: flex;
  align-items: center; /* Center items vertically within each section */
  gap: 10px; /* Space between icon and text */
  color: #264428; /* Icon and text color */
   font-size: 50px;
}

/* Adjust size of icons and text if needed */
.section i {
  font-size: 50px; /* Icon size */
}

.section span {
  font-size: 10px; /* Text size */
}