@font-face {
    font-family: 'gabriela';
    src: url('https://uploads.igem.org/teams/4998/wiki/wiki-photos/fonts/thessaloniki-fontsfree-net-gabriela3.woff');
  }


  h1,
 h2,
  h3,
   h4,
   h5,
  h6,
  p {
    font-family: 'gabriela';
  }

#main-home p{
    font-size:1.5rem;
    color:#0e4c2e;
}

body {
    background-color: #c3dfd1;
  }
  
      

.container-home {
    background-color: #c3dfd1;
  }
  
  

.drone-hydro{
    border: 1px solid #A8D3C7;
    border-radius: 50%;
    background-color: #A8D3C7;
}


.top-right-svg {
    position: absolute;
    top: -30px; /* Position at the top of the parent div */
    right: 10px; /* Position at the right of the parent div */
}

.w-md-60{
    width:60%;
} 

/* Adjust arrow size for smaller screens */
@media (max-width: 767px) {
    .w-md-60{
        width:100%;
    } 
}

.caption-shrimp{
    font-size: 3rem;
    font-style: oblique;
    color:#E27158;
    margin-top: 1rem;
}

.caption-orange{
    font-size: 3rem;
    font-style: oblique;
    color:#FEA22D;
    margin-top:1rem;
}

.hydro-heading{
    font-size: 3.5rem;
    font-style: oblique;
    color:#0B3D25;
    margin-top:1rem;
}

.alg-pec p{
    font-size: 4rem;
    font-style: oblique;
    color:#0B3D25;
    margin-top:1rem;
}

.micro-heading{
    font-size: 2rem;
    font-style: oblique;
    color:#0B3D25;
    margin-top:1rem;
}


@media (max-width: 960px) {
  
.caption-shrimp{
    font-size: 2rem;
    font-style: oblique;
    color:#E27158;
    margin-top: 1rem;
}

.caption-orange{
    font-size:2rem;
    font-style: oblique;
    color:#FFBD59;
    margin-top:1rem;
}

.hydro-heading{
    font-size: 2rem;
    font-style: oblique;
    color:#0B3D25;
    margin-top:1rem;
}

.alg-pec{
    font-size: 2rem;
    font-style: oblique;
    color:#0B3D25;
    margin-bottom:1rem;
}

}

.vertical-animation {
    transition: transform 0.5s ease-in-out;
}

.vertical-animation:hover {
    transform: translateY(50px) scale(1.4);
}


.container-future{
    padding-left:30px;
    padding-right:30px;
    margin-left:20px;
    margin-right:20px;

}

.box-home{
    border: 3px solid #0B3D25;
    background-color: #85ae9a;
    box-shadow: 5px 5px 10px #0B3D25;
    margin-bottom: 10px;
}

.image-container {
    position: relative;
  }
  
  .image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black background */
    color: #fff; /* Text color */
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
  }
  
  .home-header {
    width: 100vw;
    height: 100vh;
    margin: 0;
    padding: 0;
    overflow: hidden;
  }

  .team-pic {
    width: 100%;
    height: 100%;
  }

  iframe {
    width: 100%;
    height: 100%;
  }


  .award-caption {
    font-family: 'gabriela';
    font-size: 1.5rem;
    text-align: center;
    color: #0B3D25;
  }
  
  @media (max-width: 768px) {
    .award-caption {
      font-size: 1rem; /* Adjust the font size for smaller screens */
    }
  }

  .engin-box {
    border: 2px solid #547648;
    border-radius: 0px;
    box-shadow: 5px 5px 10px #547648; 
    padding: 15px;
    margin-bottom: 20px;
    color: #33472B;
    background-color: #d2e3b2;
  }