@import url('https://fonts.googleapis.com/css?family=Allura|Josefin+Sans'); 

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body{
  margin:0;
}
body{
  animation: IN 1.4s;
}
@keyframes IN{
  0%{
      opacity: 0;
      transform: translateY(-100%) ;
  }
  100%{
      opacity:1;
      transform: translateY(0);
  }

}

.navbar{
      display: flex;
      justify-content:space-between;
      background-color:rgb(44, 43, 43);
      color: aliceblue;
      align-items: center;
      animation: nav-load 1.3ms ease-in-out;
  
  }
  @keyframes nav-load{
      0%{
          opacity: 0;
          transform: translateY(-100%) ;
      }
      100%{
          opacity:1;
          transform: translateY(0);
      }
  

  }
  
  .sitename{
      font-size: 40px;
      margin-left: 20px;
      font-family: 'Julee', cursive;
      
  }
  
  .navbarlinks ul{
      margin: 0px;
      padding: 0px;
      display:flex;
  
  
  
  }
  .navbarlinks li{
      list-style: none;
  }
  .navbarlinks li a{
      text-decoration: none;
      color: aliceblue;
      padding:1rem;
      display: block;
  }
  .image img{
      height:400px;
      width:100%;
      margin-top: .2px;
     animation: img-load 1.8s;    
 }
 @keyframes img-load{
  0%{
      opacity: 0;
      transform: translateY(-100%) ;
  }
  100%{
      opacity:1;
      transform: translateY(0);
  }
}
body{
  background: rgb(248, 250, 250);
  
}

.wrapper{
  margin-top: 10%;
}

.wrapper h1{
  font-family: 'Allura', cursive;
  font-size: 52px;
  margin-bottom: 60px;
  text-align: center;
}

.team{
  display: flex;
  justify-content: center;
  width: auto;
  text-align: center;
  flex-wrap: wrap;
}

.team .team_member{
  background: rgb(181, 235, 245);
  margin: 5px;
  margin-bottom: 50px;
  width: 300px;
  padding: 20px;
  line-height: 20px;
  color: #0b00ab;  
  position: relative;
}

.team .team_member h3{
  color: #f00a0a;
  font-size: 26px;
  margin-top: 50px;
}

.team .team_member p.role{
  color: rgba(8, 0, 0, 0.989);
  margin: 12px 0;
  font-size: 12px;
  text-transform: uppercase;
}

.team .team_member .team_img{
  position: absolute;
  top: -50px;
  left: 50%;
  transform: translateX(-50%);
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: rgb(247, 243, 2);
}

.team .team_member .team_img img{
  width: 100px;
  height: 100px;
  padding: 5px;
}