
/* CSS Document */


.gallery-title{
padding: 40px 120px 0px 120px;
text-align: center;
}

.grid-gallery {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: 1fr;
grid-column-gap: 30px;
grid-row-gap: 30px;
padding: 0px 120px 30px 120px;
}


.image-gallery-thumb{
position: relative;
padding-top: 100%;
overflow: hidden;
background-color: rgba(0,0,0,0.10)
}

.image-gallery-inner{
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
cursor: pointer;
display: flex;
align-items: center;
}

.image-gallery-inner img{
width: 100%;
height: auto;
transition: all 0.3s ease-in-out 0s;
}

.image-gallery-inner img:hover{
width: 105%;
height: auto
}

@media only screen and (max-width: 1100px) {
.gallery-title{
padding: 30px 10px 10px 10px;
}

.grid-gallery {
grid-template-columns: repeat(4, 1fr);
grid-column-gap: 10px;
grid-row-gap: 10px;
padding: 0px 10px 30px 10px;
}

@media only screen and (max-width: 600px) {
.gallery-title{
padding: 30px 10px 10px 10px;
}


.grid-gallery {
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 10px;
grid-row-gap: 10px;
padding: 0px 10px 30px 10px;
}

}