@media screen and (max-width: 1920px) {
  .hed h1{
    position: absolute;
    top: 15%;
    left: 38%;
  }
  body::-webkit-scrollbar{
    display:none;
}
  .img{
      width:400px;
      height:300px;
  }
.container .content{
  position: absolute;
  bottom: 0;
  background: rgb(0, 0, 0);
  background: rgba(0, 0, 0, 0.5);
  color: #f1f1f1;
  width: 100%;
  padding: 15px;
  border-radius: 0 0 15px 15px;
}

  .flip-card1 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 7%;
    top: 30%
  }

  .flip-card-inner1 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card1:hover .flip-card-inner1 {
    transform: rotateY(180deg);
  }

  .flip-card-front1, .flip-card-back1 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front1 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back1 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card1 .flip-card-inner1 .flip-card-front1 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Second Flip Card*/
  .flip-card2 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 38%;
    top: 30%
  }

  .flip-card-inner2 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card2:hover .flip-card-inner2 {
    transform: rotateY(180deg);
  }

  .flip-card-front2, .flip-card-back2 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front2 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back2 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card2 .flip-card-inner2 .flip-card-front2 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Third flip card*/
  .flip-card3 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 68%;
    top: 30%
  }

  .flip-card-inner3 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card3:hover .flip-card-inner3 {
    transform: rotateY(180deg);
  }

  .flip-card-front3, .flip-card-back3 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front3 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back3 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card3 .flip-card-inner3 .flip-card-front3 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Fourth flip acrd*/
  .flip-card4 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 7%;
    top: 80%
  }

  .flip-card-inner4 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card4:hover .flip-card-inner4 {
    transform: rotateY(180deg);
  }

  .flip-card-front4, .flip-card-back4 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front4 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back4 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card4 .flip-card-inner4 .flip-card-front4 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Fifth Flip Card*/
  .flip-card5 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 38%;
    top: 80%
  }

  .flip-card-inner5 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card5:hover .flip-card-inner5 {
    transform: rotateY(180deg);
  }

  .flip-card-front5, .flip-card-back5 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front5 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back5 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card5 .flip-card-inner5 .flip-card-front5 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Six flip card*/
  .flip-card6 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 68%;
    top: 80%
  }

  .flip-card-inner6 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card6:hover .flip-card-inner6 {
    transform: rotateY(180deg);
  }

  .flip-card-front6, .flip-card-back6 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front6 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back6 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card6 .flip-card-inner6 .flip-card-front6 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card7 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 7%;
    top: 130%
  }

  .flip-card-inner7 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card7:hover .flip-card-inner7 {
    transform: rotateY(180deg);
  }

  .flip-card-front7, .flip-card-back7 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front7 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back7 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card7 .flip-card-inner7 .flip-card-front7 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card8 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 38%;
    top: 130%
  }

  .flip-card-inner8 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card8:hover .flip-card-inner8 {
    transform: rotateY(180deg);
  }

  .flip-card-front8, .flip-card-back8 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front8 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back8 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card8 .flip-card-inner8 .flip-card-front8 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card9 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 65%;
    top: 130%
  }

  .flip-card-inner9 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card9:hover .flip-card-inner9 {
    transform: rotateY(180deg);
  }

  .flip-card-front9, .flip-card-back9 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front9 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back9 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card9 .flip-card-inner9 .flip-card-front9 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
.flip-card10 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 7%;
    top: 180%
  }

  .flip-card-inner10 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card10:hover .flip-card-inner10 {
    transform: rotateY(180deg);
  }

  .flip-card-front10, .flip-card-back10 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front10 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back10 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card10 .flip-card-inner10 .flip-card-front10 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card11 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 38%;
    top: 180%
  }

  .flip-card-inner11 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card11:hover .flip-card-inner11 {
    transform: rotateY(180deg);
  }

  .flip-card-front11, .flip-card-back11 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front11 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back11 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card11 .flip-card-inner11 .flip-card-front11 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card12 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 65%;
    top: 180%
  }

  .flip-card-inner12 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card12:hover .flip-card-inner12 {
    transform: rotateY(180deg);
  }

  .flip-card-front12, .flip-card-back12 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front12 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back12 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card12 .flip-card-inner12 .flip-card-front12 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card13 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 7%;
    top: 230%
  }

  .flip-card-inner13 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card13:hover .flip-card-inner13 {
    transform: rotateY(180deg);
  }

  .flip-card-front13, .flip-card-back13 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front13 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back13 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card13 .flip-card-inner13 .flip-card-front13 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card14 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 38%;
    top: 230%
  }

  .flip-card-inner14 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card14:hover .flip-card-inner14 {
    transform: rotateY(180deg);
  }

  .flip-card-front14, .flip-card-back14 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front14 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back14 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card14 .flip-card-inner14 .flip-card-front14 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card15 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 65%;
    top: 230%
  }

  .flip-card-inner15 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card15:hover .flip-card-inner15 {
    transform: rotateY(180deg);
  }

  .flip-card-front15, .flip-card-back15 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front15 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back15 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card15 .flip-card-inner15 .flip-card-front15 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
}
/*--------------- New media Rule -----------------------------------*/
@media screen and (max-width: 1600px) {
  .hed h1{
    position: absolute;
    top: 15%;
    left: 35%;
  }
  body::-webkit-scrollbar{
    display:none;
}

.container .content{
  position: absolute;
  bottom: 0;
  background: rgb(0, 0, 0);
  background: rgba(0, 0, 0, 0.5);
  color: #f1f1f1;
  width: 100%;
  padding: 15px;
  border-radius: 0 0 15px 15px;
}

  .flip-card1 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 3%;
    top: 30%
  }

  .flip-card-inner1 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card1:hover .flip-card-inner1 {
    transform: rotateY(180deg);
  }

  .flip-card-front1, .flip-card-back1 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front1 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back1 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card1 .flip-card-inner1 .flip-card-front1 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Second Flip Card*/
  .flip-card2 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 35%;
    top: 30%
  }

  .flip-card-inner2 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card2:hover .flip-card-inner2 {
    transform: rotateY(180deg);
  }

  .flip-card-front2, .flip-card-back2 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front2 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back2 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card2 .flip-card-inner2 .flip-card-front2 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Third flip card*/
  .flip-card3 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 65%;
    top: 30%
  }

  .flip-card-inner3 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card3:hover .flip-card-inner3 {
    transform: rotateY(180deg);
  }

  .flip-card-front3, .flip-card-back3 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front3 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back3 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card3 .flip-card-inner3 .flip-card-front3 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Fourth flip acrd*/
  .flip-card4 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 3%;
    top: 80%
  }

  .flip-card-inner4 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card4:hover .flip-card-inner4 {
    transform: rotateY(180deg);
  }

  .flip-card-front4, .flip-card-back4 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front4 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back4 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card4 .flip-card-inner4 .flip-card-front4 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Fifth Flip Card*/
  .flip-card5 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 35%;
    top: 80%
  }

  .flip-card-inner5 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card5:hover .flip-card-inner5 {
    transform: rotateY(180deg);
  }

  .flip-card-front5, .flip-card-back5 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front5 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back5 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card5 .flip-card-inner5 .flip-card-front5 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  /*Six flip card*/
  .flip-card6 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 65%;
    top: 80%
  }

  .flip-card-inner6 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card6:hover .flip-card-inner6 {
    transform: rotateY(180deg);
  }

  .flip-card-front6, .flip-card-back6 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front6 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back6 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card6 .flip-card-inner6 .flip-card-front6 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card7 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 3%;
    top: 130%
  }

  .flip-card-inner7 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card7:hover .flip-card-inner7 {
    transform: rotateY(180deg);
  }

  .flip-card-front7, .flip-card-back7 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front7 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back7 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card7 .flip-card-inner7 .flip-card-front7 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card8 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 35%;
    top: 130%
  }

  .flip-card-inner8 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card8:hover .flip-card-inner8 {
    transform: rotateY(180deg);
  }

  .flip-card-front8, .flip-card-back8 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front8 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back8 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card8 .flip-card-inner8 .flip-card-front8 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card9 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 65%;
    top: 130%
  }

  .flip-card-inner9 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card9:hover .flip-card-inner9 {
    transform: rotateY(180deg);
  }

  .flip-card-front9, .flip-card-back9 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front9 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back9 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card9 .flip-card-inner9 .flip-card-front9 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card10 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 3%;
    top: 180%
  }

  .flip-card-inner10 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card10:hover .flip-card-inner10 {
    transform: rotateY(180deg);
  }

  .flip-card-front10, .flip-card-back10 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front10 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back10 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card10 .flip-card-inner10 .flip-card-front10 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card11 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 35%;
    top: 180%
  }

  .flip-card-inner11 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card11:hover .flip-card-inner11 {
    transform: rotateY(180deg);
  }

  .flip-card-front11, .flip-card-back11 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front11 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back11 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card11 .flip-card-inner11 .flip-card-front11 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card12 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 65%;
    top: 180%
  }

  .flip-card-inner12 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card12:hover .flip-card-inner12 {
    transform: rotateY(180deg);
  }

  .flip-card-front12, .flip-card-back12 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front12 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back12 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card12 .flip-card-inner12 .flip-card-front12 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card13 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 3%;
    top: 230%
  }

  .flip-card-inner13 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card13:hover .flip-card-inner13 {
    transform: rotateY(180deg);
  }

  .flip-card-front13, .flip-card-back13 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front13 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back13 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card13 .flip-card-inner13 .flip-card-front13 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card14 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 35%;
    top: 230%
  }

  .flip-card-inner14 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card14:hover .flip-card-inner14 {
    transform: rotateY(180deg);
  }

  .flip-card-front14, .flip-card-back14 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front14 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back14 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card14 .flip-card-inner14 .flip-card-front14 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
  .flip-card15 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 65%;
    top: 230%
  }

  .flip-card-inner15 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card15:hover .flip-card-inner15 {
    transform: rotateY(180deg);
  }

  .flip-card-front15, .flip-card-back15 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front15 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back15 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card15 .flip-card-inner15 .flip-card-front15 img{
    border-radius: 15px;
    width:400px;
    height:300px;
  }
}
@media screen and (max-width: 1080px) {
  .hed h1{
    position: absolute;
    top: 15%;
    left: 15%;
    font-size: 24px;
  }
  body::-webkit-scrollbar{
    display:none;
}

.container .content{
  position: absolute;
  bottom: 0;
  background: rgb(0, 0, 0);
  background: rgba(0, 0, 0, 0.5);
  color: #f1f1f1;
  width: 100%;
  padding: 15px;
  border-radius: 0 0 15px 15px;
}

  .flip-card1 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 30%
  }

  .flip-card-inner1 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card1:hover .flip-card-inner1 {
    transform: rotateY(180deg);
  }

  .flip-card-front1, .flip-card-back1 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front1 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back1 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card1 .flip-card-inner1 .flip-card-front1 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  /*Second Flip Card*/
  .flip-card2 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 85%
  }

  .flip-card-inner2 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card2:hover .flip-card-inner2 {
    transform: rotateY(180deg);
  }

  .flip-card-front2, .flip-card-back2 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front2 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back2 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card2 .flip-card-inner2 .flip-card-front2 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  /*Third flip card*/
  .flip-card3 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 140%
  }

  .flip-card-inner3 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card3:hover .flip-card-inner3 {
    transform: rotateY(180deg);
  }

  .flip-card-front3, .flip-card-back3 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front3 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back3 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card3 .flip-card-inner3 .flip-card-front3 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  /*Fourth flip acrd*/
  .flip-card4 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 195%
  }

  .flip-card-inner4 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card4:hover .flip-card-inner4 {
    transform: rotateY(180deg);
  }

  .flip-card-front4, .flip-card-back4 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front4 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back4 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card4 .flip-card-inner4 .flip-card-front4 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  /*Fifth Flip Card*/
  .flip-card5 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 250%;
  }

  .flip-card-inner5 {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 15px;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card5:hover .flip-card-inner5 {
    transform: rotateY(180deg);
  }

  .flip-card-front5, .flip-card-back5 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front5 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back5 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card5 .flip-card-inner5 .flip-card-front5 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  /*Six flip card*/
  .flip-card6 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 305%;
  }

  .flip-card-inner6 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card6:hover .flip-card-inner6 {
    transform: rotateY(180deg);
  }

  .flip-card-front6, .flip-card-back6 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front6 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back6 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card6 .flip-card-inner6 .flip-card-front6 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card7 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 355%
  }

  .flip-card-inner7 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card7:hover .flip-card-inner7 {
    transform: rotateY(180deg);
  }

  .flip-card-front7, .flip-card-back7 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front7 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back7 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card7 .flip-card-inner7 .flip-card-front7 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card8 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 405%
  }

  .flip-card-inner8 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card8:hover .flip-card-inner8 {
    transform: rotateY(180deg);
  }

  .flip-card-front8, .flip-card-back8 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front8 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back8 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card8 .flip-card-inner8 .flip-card-front8 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card9 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 455%;
  }

  .flip-card-inner9 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card9:hover .flip-card-inner9 {
    transform: rotateY(180deg);
  }

  .flip-card-front9, .flip-card-back9 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front9 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back9 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card9 .flip-card-inner9 .flip-card-front9 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card10 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 505%;
  }

  .flip-card-inner10 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card10:hover .flip-card-inner10 {
    transform: rotateY(180deg);
  }

  .flip-card-front10, .flip-card-back10 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front10 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back10 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card10 .flip-card-inner10 .flip-card-front10 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card11 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 555%
  }

  .flip-card-inner11 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card11:hover .flip-card-inner11 {
    transform: rotateY(180deg);
  }

  .flip-card-front11, .flip-card-back11 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front11 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back11 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card11 .flip-card-inner11 .flip-card-front11 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card12 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 605%
  }

  .flip-card-inner12 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card12:hover .flip-card-inner12 {
    transform: rotateY(180deg);
  }

  .flip-card-front12, .flip-card-back12 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front12 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back12 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card12 .flip-card-inner12 .flip-card-front12 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card13 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 655%;
  }

  .flip-card-inner13 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card13:hover .flip-card-inner13 {
    transform: rotateY(180deg);
  }

  .flip-card-front13, .flip-card-back13 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front13 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back13 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card13 .flip-card-inner13 .flip-card-front13 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card14 {
    background-color: transparent;
    width: 350px;
    height: 250px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 705%;
  }

  .flip-card-inner14 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card14:hover .flip-card-inner14 {
    transform: rotateY(180deg);
  }

  .flip-card-front14, .flip-card-back14 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front14 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back14 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card14 .flip-card-inner14 .flip-card-front14 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
  .flip-card15 {
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    position: absolute;
    left: 5%;
    top: 755%
  }

  .flip-card-inner15 {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    text-align: center;
    transition: transform 1s;
    transform-style: preserve-3d;
    box-shadow: 0 20px 20px 0 rgba(0,0,0,0.2);
  }

  .flip-card15:hover .flip-card-inner15 {
    transform: rotateY(180deg);
  }

  .flip-card-front15, .flip-card-back15 {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    backface-visibility: hidden;
  }

  .flip-card-front15 {
    background-color: #bbb;
    color: black;
  }

  .flip-card-back15 {
    background-color: #2980b9;
    border-radius: 15px;
    color: white;
    transform: rotateY(180deg);
  }
  .flip-card15 .flip-card-inner15 .flip-card-front15 img{
    border-radius: 15px;
    width:350px;
    height:250px;
  }
}
