/**
 * This file should contain admin styles that 
 * will be applied to the module settings forms.
 */
 
 .image-col {
	display: inline-block;
	/*border: 4px solid #fff;*/
    /*box-shadow: 0 0 10px rgba(0, 0, 0, .59);*/
	margin: 9px;
	background-size: cover !important;
    background: center center;
    background-color: #000;
    opacity: 0.9;
 }
 
 .image-gallery {
	margin: 11px 0 auto;
	text-align: center;
}
	.image-gallery a{
		position: relative;
		display: inline-block;
	}
	.image-gallery a::before {
	height: 245px;
    width: 245px;
    background: url('/wp-content/uploads/2018/01/gallery-after.png')rgba(0,0,0, .78) center center no-repeat;
    content: '';
    bottom: 10%;
    position: absolute;
    left: 50%;
    margin-bottom: 0;
    margin-left: -124.5px;
	transition: all 0.3s ease;
	opacity: 0;
 }
 .image-gallery a:hover::before {
 	/*opacity: 1;*/
 	opacity: 0;
 }
@media only screen and (max-width: 1200px) {} 
@media only screen and (max-width: 1024px) {
	.image-col {
		height: 250px !important;
		width: 250px !important;
	}
}
@media only screen and (max-width: 960px) {}
@media only screen and (max-width: 860px) {
	.image-col {
		height: 200px !important;
		width: 200px !important;
	}
}
@media only screen and (max-width: 768px) {}
@media only screen and (max-width: 736px) {}
@media only screen and (max-width: 667px) {
	.image-col {
	height: 150px !important;
	width: 150px !important;
}
}
@media only screen and (max-width: 640px) {}
@media only screen and (max-width: 600px) {}
@media only screen and (max-width: 568px) {}
@media only screen and (max-width: 480px) {
	.image-col {
		height: 100px !important;
		width: 100px !important;
	}
	.image-gallery a::before {
	height: 75px;
	width: 75px;
	bottom: 23%;
	left: 17%;
	margin-bottom: 0;
	margin-left: 0;
}
}
@media only screen and (max-width: 414px) {}
@media only screen and (max-width: 384px) {}
@media only screen and (max-width: 375px) {}
@media only screen and (max-width: 320px) {}