/*
@font-face {
    font-family: 'MontserratBold';
    src: url('/static/fonts/MontserratBold.ttf') format('truetype');
}
*/
.body-home {
    font-family: 'LuloCleanOne', sans-serif;
}

.container-main-home {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center; /* Center the items horizontally */
  align-items: center; /* Center the items vertically */
  gap: 0; /* Set the gap between items */
  height: 900px; /* Your existing fixed height for the containers */
  margin: 0; /* Your existing margin settings */
}

.image-container-main-home {
  width: 40%; /* Your existing width settings */
  box-sizing: border-box; /* Your existing box-sizing */
  display: flex;
  justify-content: center; /* Center the image horizontally within its container */
  align-items: center; /* Center the image vertically within its container */
  margin-right: 50px; /* Your existing margin-right settings */
  margin-left: 50px; /* Your existing margin-left settings */
}

.image-container-main-home img, .image-container-main-home video {
  max-height: 400px; /* Your existing max-height settings */
  max-width: 100%; /* Your existing max-width settings */
  object-fit: contain; /* Your existing object-fit settings */
}

.container-main-home .right-content-home {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    padding-left: 10px; /* Add some left padding */
    margin-right: 100px; /* Your existing margin-right settings */
    margin-left: 100px; /* Your existing margin-left settings */
  }

.right-content-home h2 {
  justify-content: center;
  text-align: center;
    font-family: 'MontserratBold', sans-serif;
    font-weight: bold;   /* Make the font bold */
    font-size: 40px;     /* Set a larger font size */
    margin: 0; /* Remove margin to prevent extra space */
    white-space: normal; /* Allow text to wrap into multiple lines */
    color: rgb(0, 0, 0);
}

.right-content-home .header11-home {
  justify-content: center;
  text-align: center;
  color: rgb(0, 0, 0);
    margin-top: 5px; /* Add margin-top to create space */
    margin-bottom: 5px; /* Add margin-bottom to create space */
}

.right-content-home .header12-home {
  justify-content: center;
  text-align: center;
  margin-top: 5px; /* Add margin-top to create space */
  margin-bottom: 5px; /* Add margin-bottom to create space */
    color: rgb(0, 0, 0);
}


#home-a1 {
    font-size: 20px;
  }

#home-img1 {
  max-height: 1000px; 
  max-width: 1000px;
  margin-left: 100px; /* Your existing margin-right settings */

    }

#home-img2 {
max-height: 500px; 
max-width: 500px;
margin-right: 100px; /* Your existing margin-right settings */

}

#home-img3 {
max-height: 1000px; 
max-width: 1000px;
margin-left: 100px; /* Your existing margin-right settings */

  }

#home-img5 {
max-height: 500px; 
max-width: 500px;
margin-right: 100px; /* Your existing margin-right settings */

}

#home-img6 {
max-height: 1000px; 
max-width: 1000px;
margin-left: 100px; /* Your existing margin-right settings */

}

#home-img4 {
max-height: 700px; 
max-width: 700px;
margin-right: 100px; /* Your existing margin-right settings */

}


.right-content-home .header21-home {
  justify-content: center;
  text-align: center;
  color: rgb(255, 255, 255);
    margin-top: 5px; /* Add margin-top to create space */
    margin-bottom: 5px; /* Add margin-bottom to create space */
}

.right-content-home .header22-home {
  justify-content: center;
  text-align: center;
  margin-top: 5px; /* Add margin-top to create space */
  margin-bottom: 5px; /* Add margin-bottom to create space */
    color: rgb(255, 255, 255);
}

.right-content-home .header1-home {
  justify-content: center;
  text-align: center;
  color: rgb(0, 0, 0);
    margin-top: 5px; /* Add margin-top to create space */
    margin-bottom: 5px; /* Add margin-bottom to create space */
}

.right-content-home .header2-home {
  justify-content: center;
  text-align: center;
  margin-top: 5px; /* Add margin-top to create space */
  margin-bottom: 5px; /* Add margin-bottom to create space */
    color: rgb(255, 255, 255);
}


@media screen and (max-width: 1050px) {
  .right-content-home h2 {
    font-size: 24px;
  }

}


@media screen and (max-width: 768px) {

  .container-main-home {
    flex-wrap: wrap; /* Allow items to wrap to the next line */
    flex-direction: column;
    height: 300px; /* Your existing fixed height for the containers */
    width: 100%;
    display: flex;
    justify-content: center; /* Center the items horizontally */
    align-items: center; /* Center the items vertically */
    margin: 0; /* Your existing margin settings */
    margin-bottom: 0; /* Remove the bottom margin to eliminate the gap */
    margin-top: 0; /* Remove the bottom margin to eliminate the gap */


  }

  .image-container-main-home,
  .container-main-home .right-content-home {
    flex-basis: 100%; /* Make both elements take up the full width */
    margin: 0; /* Remove margin to eliminate the gap */
    height: 200px; /* Your existing fixed height for the containers */
    margin-bottom: 0; /* Remove the bottom margin to eliminate the gap */
    margin-top: 0; /* Remove the bottom margin to eliminate the gap */

  }
  

  
  .image-container-main-home img, .image-container-main-home video {
    max-height: flex; /* Your existing max-height settings */
    max-width: 60%; /* Your existing max-width settings */
    object-fit: contain; /* Your existing object-fit settings */
    margin-bottom: 0; /* Remove the bottom margin to eliminate the gap */
    margin-top: 0; /* Remove the bottom margin to eliminate the gap */

  }
  
  
  .right-content-home h2 {

      font-family: 'MontserratBold', sans-serif;
      font-weight: bold;   /* Make the font bold */
      font-size: 16px;     /* Set a larger font size */
      margin: 0; /* Remove margin to prevent extra space */
      white-space: normal; /* Allow text to wrap into multiple lines */
      color: rgb(0, 0, 0);
  }
  
  .right-content-home .header11-home {

    color: rgb(0, 0, 0);
      margin-top: 5px; /* Add margin-top to create space */
      margin-bottom: 5px; /* Add margin-bottom to create space */
  }
  
  .right-content-home .header12-home {

    margin-top: 5px; /* Add margin-top to create space */
    margin-bottom: 5px; /* Add margin-bottom to create space */
      color: rgb(0, 0, 0);
  }
  

  
  #home-a1 {
      font-size: 22px;
      padding: 20px;
    }
  
  #home-img1 {
    max-height: 150px; 
    max-width: 80%;
    margin-left: 5px; /* Your existing margin-right settings */
  
      }
  
  #home-img2 {
    max-height: 150px; 
    max-width: 80%;
  margin-right: 5px; /* Your existing margin-right settings */
  
  }
  
  #home-img3 {
    max-height: 150px; 
    max-width: 80%;
  margin-left: 5px; /* Your existing margin-right settings */
  
    }
  
  #home-img5 {
    max-height: 150px; 
    max-width: 80%;
    margin-right: 5px; /* Your existing margin-right settings */
  
  }
  
  #home-img6 {
    max-height: 150px; 
    max-width: 80%;
  margin-left: 5px; /* Your existing margin-right settings */
  
  }
  
  #home-img4 {
    max-height: 150px; 
    max-width: 80%;
    margin-right: 5px; /* Your existing margin-right settings */
  
  }
  
  
  .right-content-home .header21-home {

    color: rgb(255, 255, 255);

  }
  
  .right-content-home .header22-home {
      color: rgb(255, 255, 255);
  }
  
  .right-content-home .header1-home {
    color: rgb(0, 0, 0);

  }
  
  .right-content-home .header2-home {
      color: rgb(255, 255, 255);
  }
  
}