/* Developed by https://github.com/tunitx (Tanish) */

html {
  scroll-behavior: smooth;
}
#cards-wrapper{
    height: auto;
    width: 100%;
}
html, body {
    max-width: 100%;
    overflow-x: hidden;
}
#cards-wrapper-header{
    text-align: center;
    width: 100%;
}
#cards-wrapper-header h1{
    margin-top: 3%;
    font-size: 2rem;
    margin-bottom: 1%;
}
#cards-container{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding-top: 3%;
    justify-content: space-around;
    height: auto;
    width: 100%;
    padding-bottom: 5%;
}
.card{
    height: 23rem;
    width: 28rem;
    margin-top: 1%;
    margin-bottom: 5%;
    border-radius: 50px;
  
}
#card-1{
    background-image: url(../img/laterEdits/homeView.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-2{
    background-image: url(../img/laterEdits/lake.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-2{
    background-image: url(../img/laterEdits/lakept2.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-3{
    background-image: url(../img/laterEdits/lakept3.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-4{
    background-image: url(../img/laterEdits/deer.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-5{
    background-image: url(../img/laterEdits/lakept5.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-6{
    background-image: url(../img/laterEdits/lakept4.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-7{
    background-image: url(../img/laterEdits/trees.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#card-8{
    background-image: url(../img/laterEdits/rainbow.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-9{
    background-image: url(../img/laterEdits/shutter.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-10{
    background-image: url(../img/laterEdits/heavenly.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-11{
    background-image: url(../img/laterEdits/mountain.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-12{
    background-image: url(../img/laterEdits/spikes.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-13{
    background-image: url(../img/laterEdits/snow.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-14{
    background-image: url(../img/laterEdits/kidssnow.jpeg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-15{
    background-image: url(../img/laterEdits/snowrabbit.jpeg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-16{
    background-image: url(../img/laterEdits/anotherdumbasskid.jpeg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-17{
    background-image: url(../img/laterEdits/skeeing.jpeg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-18{
    background-image: url(../img/laterEdits/deer.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-19{
    background-image: url(../img/laterEdits/snowyalps-1.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-20{
    background-image: url(../img/laterEdits/snowyalps-2.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-21{
    background-image: url(../img/laterEdits/snowyalps-3.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-22{
    background-image: url(../img/laterEdits/snowyalps-4.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-23{
    background-image: url(../img/laterEdits/snowyalpswepp.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-24{
    background-image: url(../img/laterEdits/snowykangaroo.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 129%;
}
#card-25{
    background-image: url(../img/laterEdits/snowywindsheild.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-26{
    background-image: url(../img/laterEdits/snowyroad-1.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-27{
    background-image: url(../img/laterEdits/snowyalps-1.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-28{
    background-image: url(../img/laterEdits/skeeingbs.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-29{
    background-image: url(../img/laterEdits/skeeingbs2.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 210%;
}
#card-30{
    background-image: url(../img/laterEdits/skeeingbs3.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#card-31{
    background-image: url(../img/laterEdits/skeeingbs4.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-32{
    background-image: url(../img/laterEdits/skeeingbs5.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-33{
    background-image: url(../img/laterEdits/skeeingbs6.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#card-34{
    background-image: url(../img/laterEdits/skeeingbs7.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}






.card{
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.card::after{
     content: "";
    border-radius: 50px;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
   
}
.card:hover{
    -webkit-transform: scale(1.20, 1.20);
    transform: scale(1.20, 1.20);
}