Show room price and info on touch / mobile

Sometimes you may want to display the rooms price and info for mobile or touch as these devices do not have a hover state. Here is some custom css to help you customize.

@media (max-width:767px){
.room-center{
    opacity: 1;
}
.room-overlay{
    opacity: 1;
    background-color:rgba(0, 0, 0, 0.3);
    }
}

or if you wanted the price / description on at all times you can leave out the @media query..

.room-center{
    opacity: 1;
}
.room-overlay{
    opacity: 1;
    background-color:rgba(0, 0, 0, 0.3);
    }

Try adjusting the background-color to whatever you wish, we made black for this example.

or this example to have text on at all times, with no background tint

.room-center{
    opacity: 1;
}
.room-overlay{
    opacity: 1;
    background-color:rgba(0, 0, 0, 0);
    }

Cheers!