/* chef  */
/* 
#chef{
    padding: 25px 0 25px 0;
}
#section{
    padding: 25px 0 25px 0;
    text-align: center;
    font-size: 2rem;
    font-family: Verdana;
}
#chef_row{
    display: flex;
    justify-content: center;
}
.chef_col{
    text-align:center;
    padding:10px;
    margin:5px;
}
#header{
    position: absolute;
} */
/* chef */
body{
    height:100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    background: #fff;
  }
  .wrapper,
  .single-card{
     height: 450px;
     max-width: 300px;
     margin: auto;
     position: relative;
  }
  .wrapper{
     perspective: 900px;
  }
  .single-card{
     text-align: center;
     transition: all 1.5s cubic-bezier(0.7, -.5,0.3,1.8);
     transform-style: preserve-3d;
  }
  .wrapper:hover .single-card{
     transform: rotateY(180deg);
  }
  .front,
  .back{
     width:300px;
     position: relative;
     top:0;
     left:0;
     backface-visibility: hidden;
  }
  .front{
     cursor: pointer;
     height: 100%;
     background-image: url(sanjeev.jpeg);
     backface-visibility: hidden;
     border-radius:  50px;
     background-size: cover;
     background-position: center center;
  }
  .back{
     transform: rotateY(180deg);
     position: absolute;
     border-radius: 50px;
     height: 450px;
     background: #fff;
  }
  .content{
     padding-top: 25%;

  }
  .content h1{
     font-size: 35px;
     margin: 0;
     font-weight: 300;

  }
  .content h2{
     margin: 0;

  }
  .socials{
     margin-top: 20%;
  }
  .socials i{
     font-size: 30px;
     margin: 0 10px;
  }
  /* first card ends */


  /* seconod card begins */
  .wrapper1,
  .single-card1{
     height: 450px;
     max-width: 300px;
     margin: auto;
     position: relative;
  }
  .wrapper1{
     perspective: 900px;
  }
  .single-card1{
     text-align: center;
     transition: all 1.5s cubic-bezier(0.7, -.5,0.3,1.8);
     transform-style: preserve-3d;
  }
  .wrapper1:hover .single-card1{
     transform: rotateY(180deg);
  }
  .front1,
  .back1{
     width:300px;
     position: relative;
     top:0;
     left:0;
     backface-visibility: hidden;
  }
  .front1{
     cursor: pointer;
     height: 100%;
     background-image: url(ranveer.jpg);
     backface-visibility: hidden;
     border-radius:  50px;
     background-size: cover;
     background-position: center center;
  }
  .back1{
     transform: rotateY(180deg);
     position: absolute;
     border-radius: 50px;
     height: 450px;
     background: #fff;
  }
  .content1{
     padding-top: 25%;

  }
  .content1 h1{
     font-size: 35px;
     margin: 0;
     font-weight: 300;

  }
  .content1 h2{
     margin: 0;

  }
  .socials1{
     margin-top: 20%;
  }
  .socials1 i{
     font-size: 30px;
     margin: 0 10px;
  }
  /* second card ends */



  /* third card begin */
  .wrapper2,
  .single-card2{
     height: 450px;
     max-width: 300px;
     margin: auto;
     position: relative;
  }
  .wrapper2{
     perspective: 900px;
  }
  .single-card2{
     text-align: center;
     transition: all 1.5s cubic-bezier(0.7, -.5,0.3,1.8);
     transform-style: preserve-3d;
  }
  .wrapper2:hover .single-card2{
     transform: rotateY(180deg);
  }
  .front2,
  .back2{
     width:300px;
     position: relative;
     top:0;
     left:0;
     backface-visibility: hidden;
  }
  .front2{
     cursor: pointer;
     height: 100%;
     background-image: url(kunal.jpg);
     backface-visibility: hidden;
     border-radius:  50px;
     background-size: cover;
     background-position: center center;
  }
  .back2{
     transform: rotateY(180deg);
     position: absolute;
     border-radius: 50px;
     height: 450px;
     background: #fff;
  }
  .content2{
     padding-top: 25%;

  }
  .content2 h1{
     font-size: 35px;
     margin: 0;
     font-weight: 300;

  }
  .content2 h2{
     margin: 0;

  }
  .socials2{
     margin-top: 20%;
  }
  .socials2 i{
     font-size: 30px;
     margin: 0 10px;
  }
 @media screen {
   body{
      display: flex;
      justify-content: space-evenly;
      flex-wrap: wrap;
   }
 }