@import url("https://fonts.googleapis.com/css2?family=popping:wght@300;400;500;600;700;800;900&display=swap");


*{

  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "poppins", sans-serif;

}
body{
  min-height: 100vh;
  background: url("background.png");

}
 .header{
   background: #0082e6;
   height: 80px;
   width: 100%;
   border-radius: 3px;
   justify-content: space-between;
   z-index: 100;
   align-items: center;
   display: flex;

 /* position: fixed;
  border-radius: 10px;
   border-bottom-color: #0082e6;
   border-style: wave;
   box-shadow: 0 2px 4px 0 rgb(0, 130, 230);
   top: 0;
   left: 0;
   width: 100%;
   padding: 1.3rem 10%;
   background: #0082e6;
   background: rgba(0,0,0, 0.1);
   backdrop-filter: blur(90%);
   display: flex;
   justify-content: space-between;
   align-items: center;
   z-index: 100;
    height: 15vh;
*/

 }


.navbar a{
  font-size: 1.15rem;
  color: white;
  font-weight: 500;
  border-style: ridge;
  backdrop-filter: blur(90%);
  border-radius: 9px;
  text-decoration: none;
  border-collapse: separate;
  border-color: deepskyblue;


}
.icons{
  font-size: 2.8rem;
  color: #0082e6;
  cursor: pointer;
  right: 5%;


}
@media (max-width: 992px) {
  .header{
    padding: 1.3rem 5%;

  }

}

.toplogo img{

  width: 100px;
  float:left;
  margin-top:1px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;

}
.HeaderText{
  font-size: 2rem;
  color: white;
  text-decoration: none;
  font-weight: 700;
  float:left;
  position: absolute;
  align-items: baseline;
  left: 10%;


}
.div1{
  background-color: #0082e6;
  width: 100%;
  height: 19vh;
  border-bottom-color: #0082e6;
  border-style: wave;
  box-shadow: 0 2px 4px 0 rgb(134, 25, 215);
margin-bottom: 5%;

}
.marquee h1{
  color: white;
}
.marquee {
  width: 100%;
  margin: 0 auto;
  white-space: nowrap;
  overflow-x: hidden;
}
.marquee h1{
text-align: center;
  animation: marquee 10s linear infinite;
  animation-direction: reverse;
}
@keyframes marquee{
  0%{
    transform: translateX(0);
  }
  100%{
    transform: translateX(100%);

  }

}
.div2{
  float:right;
  position: center;
  align-items: center;
  justify-content: right;

}
.div2 h1{
  position: center;
  align-items: flex-start;
  justify-content: right;


}


 .content1 img{
   align-items: flex-start;
   justify-content: right;
   margin-bottom: 23px;
   shape-outside: circle();
 }

.footer1{

  background-color: #0082e6;
  width: 100%;
 color: white;
  border-bottom-color: #0082e6;
  border-style: wave;
  box-shadow: 0 2px 4px 0 rgb(134, 25, 215);


  bottom: 8px;
}
.footer1 p{
  margin-top: 10px;
}

.socialIcons{
  color: #0082e6;
  display: flex;
  justify-content: right;
align-items: center;
  margin-left: 1100px;

}
.socialIcons a{
  background-color: white;
  border-radius: 50px;
  margin: 10px;
  padding: 10px;
  color: #0082e6;
  justify-content: right;


}
.socialIcons p{
  justify-content: left;

}
.container {
  display: flex; /* make the container a flexbox */
  /* vertically center the image and text */

}

img {
  margin-right: 10px; /* add space between the image and text */
align-content: center;
}

.marquee h1{
  margin-top: 40px;
}
.contain {
 align-content: center;
  display: grid;
  grid-template-columns: 1fr auto; /* 1fr for content, auto for right-sided div */
right: 50%;
  float: right;
}
.contain img{
  float: right;
  right:10px;

}
.mission img{
  align-content: end;
  align-items: center;
  position: absolute;
 border-color: red;
  margin-left: 860px;

}
.paragraph{
font-size: large;
  position: center;
  margin-left: 400px;

}
.bio{
height: 80px;
  background-color: #0082e6;
  width: 100%;
  color: white;
  border-bottom-color: #0082e6;
  border-style: wave;
  margin-top: 100px;

}
.values{
font-size: large;


}