* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  max-width: 100vw;
  height: 100vh;
  overflow: hidden;
}

.container{
    height: 100%;
    width: 100%;
    position: relative;
}

.smallDivs{
    height: 10%;
    width: 100%;
    position: absolute;
    bottom: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.center{
    height: 100%;
    width: 90%;
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: 1fr;
    gap: 20px;
}

.clickImg{
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.717);
    border-radius: 5px;
    background-color: rgb(152, 152, 152);
    background-blend-mode: multiply;
    transition: all ease 1s;
}

.clickImg:hover{
    background-blend-mode: hard-light;
    transform: scale(1.1);
}

#img1{
    background-image: url('./images/cat.jpeg');
}
#img2{
    background-image: url('./images/mountains.jpg');
}
#img3{
    background-image: url('./images/turtle.jpeg');
}
#img4{
    background-image: url('./images/waterfalls.jpeg');
}
#img5{
    background-image: url('./images/bird.jpeg');
}
#img6{
    background-image: url('./images/rose.jpg');
}
#img7{
    background-image: url('./images/parrot.jpg');
}
#img8{
    background-image: url('./images/sky.jpg');
}
#img9{
    background-image: url('./images/butterfly.jpg');
}
#img10{
    background-image: url('./images/rabbit.jpg');
}