WordPress Gallery mobile responsive CSS code not working with theme

I am using “Mountain” Theme by linethemes and am trying to edit the default Gallery to be mobile responsive from 5 columns to 3 on tablet and 1 on mobile. The Shortcode i am using is:

[gallery columns="5" link="none" size="full" lightbox="false" ids="1232,1229,1231,658,662,668,661,659,1233,665"]

I plugged the following code into my custom css panel and nothing happens.

/* For displaying 3 columns on tablet */
@media only screen and (max-width: 800px) {
.gallery-columns-5 .gallery-item {
width: 33%; !important;
}
}

/* For displaying single column on mobile */
@media only screen and (max-width: 480px) {
.gallery-columns-5 .gallery-item {
width: 100%; !important;
}
}

.gallery-columns-5 .gallery-item:nth-child(5n+1) {
clear: none; !important;
}

Any thoughts?