.gallery {width: 100%; position: relative;}
.gallery img {width: 100%;}

/* GRID STYLING */
.gallerygrid {width: 102%; margin-left: -2%;}
.gallerygrid .thumb {float: left; width: 31.3%; margin: 0 0 2% 2%;}

/* SLIDER STYLING */
.galleryslider .thumb {margin: 0 5px 0 0;}
.galleryslider .slick-prev {position: absolute; top: 50%; left: -20px; width: 40px; height: 40px; background: #000d3d; color: #fff; cursor: pointer; padding: 0; margin: 0; outline: none; border: none; z-index: 20; transform: translate(0,-50%);}
.galleryslider .slick-prev:after {content: "\f104"; display: block; position: absolute; top: 50%; left: 50%; color: #fff; font-family: "Font Awesome 5 Free"; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-weight: 900;  transform: translate(-50%,-50%); font-size: 160%; padding: 0 3px 0 0;}
.galleryslider .slick-next {position: absolute; top: 50%; right: -15px; width: 40px; height: 40px; background: #000d3d; color: #fff; cursor: pointer; padding: 0; margin: 0; outline: none; border: none; z-index: 20; transform: translate(0,-50%);}
.galleryslider .slick-next:after {content: "\f105"; display: block; position: absolute; top: 50%; left: 50%; color: #fff; font-family: "Font Awesome 5 Free"; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-weight: 900;  transform: translate(-50%,-50%); font-size: 160%; padding: 0 0 0 3px;}

/* POPUP STYLING */
.gallerypopup .name {padding: 20px; background: #e8e8e8;}
.gallerypopup .name h4 {padding: 0 0 10px 0;}
.gallerypopup .name p {padding: 0; font-size: 90%; max-width: 200px;}