body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  text-align: center;
/*   background-image: url("https://lh3.googleusercontent.com/pw/AP1GczPwPRkptJiZ0U1bFkph5vhCr9R036AlWLnAfdKrRt7ijmaxQt_jlgf2JOJtH5QBZIFb2sNC-FwCHXU6lHLeSJHIoe9frbGVwNNxnfClY_8FoHjqMlg=w2400"); /* general background flipped 180 */ */
}

.cyclic_image_gallery {
  position: relative;
  background-size: cover; /* Ensures the image covers the entire header */
  background-position: center; /* Centers the image */
  height: 1068px; /* Adjust the height as needed */
}



/*  welcome to Chenpic inspirational on top of gallery*/

h1 {
  font-size: 43px;
  font-family: "Frank Ruehl", serif;
  color: AntiqueWhite; /* Text color */
  text-align: center;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Adds a shadow to make the text stand out */
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.cyclic_image_gallery img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 2s ease-in-out;
}




.cyclic_image_gallery img.active {
  opacity: 1;
}

.bio-section {
  opacity: 0; /* Initially hidden */
  margin: 0;
  padding: 0;
  margin-top: 40px; /*Add space*/
      
  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;
  transform: translateY(50px); /* Start position slightly further back */
  transition: opacity 1.1s ease-out, transform 2s ease-out; /* Increased duration */
}

.bio-section.visible {
  opacity: 1; /* Fully visible */
  transform: translateY(0); /* Move to final position */
}

/*   About me     */
.bio-section h2 {
    font-size: 28px;
  font-weight: bold;
  color: #333;
  margin-top: 20px;
  text-align: right; /* Align text to the right */
  font-family: "Frank Ruehl", serif;
  
}

/*    Bio texts + photo container   */
.bio-content {
  max-width: 1100px;
  display: flex;
  align-items: center;
  justify-content: center; /* Center the photo and text container horizontally */
  direction: rtl; /* Set direction for Hebrew text */
  transition: opacity 0.5s ease-out, transform 0.5s ease-out; /* Animation effects */

}



.bio-description {
  flex-direction: row;
  
/*   justify-content: center; */
}


.bio-photo img {
  width: 350px; /* Adjust size according to preference */
  height: auto;
  border-radius: 50%; /* This makes the photo circular */
/*   margin-right: 70px; */
  margin-left: 0 70px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
}


.bio-description {
/*   display: flex; */
    flex-grow: 1; /* Allow the description to take up remaining space */
  margin: 0 13px; /* Add space on both sides of the description */
/*   justify-content: center; */
}

/*  Bio text */
.bio-description p {
  font-size: 27px;
  font-family: Garamond, serif;
  color: SaddleBrown; /* Light background to make it stand out */
  direction: rtl; /* Set direction for Hebrew text */
  line-height: 1.6;
/*   flex-basis: calc(85% - 10px);  */
    margin: 0; /* Ensure no additional margins between paragraphs */

}

/* Responsive adjustments */
@media (max-width: 768px) {
  h1 {
  font-size: 29px;
    
    
  }
  .bio-content {
    flex-direction: column;
  }
  
    .bio-photo img {
    margin: 0 auto 20px; /* Center the photo and add space below */
  }
  .bio-description p {
  font-size: 21px;
  flex-basis: calc(85% - 15px);
  }
  
}
