How to change room gallery

The room gallery is located in app > rooms.html
<ul id="easyPaginate" class="rooms hg-catalog-4-column">
This is the code that starts the room gallery.
The id "#easyPaginate" triggers the script to paginate the images. The script is located at the bottom of the rooms.html page
<script type="text/javascript">
$(function() {
$('#easyPaginate').easyPaginate({
paginateElement: 'li',
elementsPerPage: 8,
effect: 'default',
firstButton: 'false',
firstButtonText: '',
lastButton: 'false',
lastButtonText: '',
prevButtonText: 'PREVIOUS',
nextButtonText: 'NEXT',
});
});
</script>
Here you can modify the text for buttons and elements for the page.
The style of the page is found in app/style/scss/_grid-catalogue.scss
The class hg-catalog-4-column is added so that on the desktop and laptop the layout would be 4 columns.
.rooms.hg-catalog-4-column {
.rooms__item {
width:25%;
margin:0 auto;
margin-bottom: 50px;
@include max_mobile {
width: 100%;
}
@include mobile_tablet {
width: 50%;
}
}
}
If you would like an other number of columns then add additional classes width different percentage for .room__item width.