.xoverlay {
 	position: relative;
 	overflow: hidden;
 	perspective: 300px;
 	-webkit-perspective: 300px;
 	-ms-perspective: 300px;
 	-o-perspective: 300px;
	 margin-left: -5px;
	 margin-right: -5px;
	 margin-top: -5px;
	 margin-bottom: -5px;
	 height: 100%;
 }
 .xoverlay .x-img-main {
 	width: 100%;
 }
 .xoverlay-data {
 	width: 90%;
 	height: 100%;
 	text-align:justify;
	 margin: auto;
	 margin-top: 20px;
 }
 .xoverlay-data p {
 	color: #fff;
 	text-align:center;
 	padding: 10px;
 	margin: 0; 	
 	font-size: 15px;
 }
 .xoverlay h2 {
 	font-size: 20px;
 	text-align:center;
 	display: block;
 	padding: 10px 10px 0 10px;
 	color:#FFFFFF;
	 text-transform: uppercase;
 }

.close
{display: block;
float: right;}

.close:hover
{cursor: pointer;}


 .xoverlay span {
 	display: inline-block;
 	position: relative;
 	top: 38%;
 	
 }
 .xoverlay span i {
 	text-align: center;
 	font-size: 40px;
 	width: 50px;
 	height: 50px;
 	padding: 5%;
 }

 .mygallery 
 {width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;}

 /*===== Zoom =====*/

 .x-zoom .xoverlay-box {
 	width: 100%;
 	height: 100%;
 	position: absolute;
 	left: 0;
 	right: 0;
 	bottom: 0;
 	top: 0;
 	overflow: hidden; 	
 	transform: scale(0.8);
	opacity: 0; 		
 	transition: all .3s;	
 }
 .x-zoom:hover .xoverlay-box {
 	width: 100%;
 	height: 100%;
 	position: absolute;
 	left: 0;
 	right: 0;
 	bottom: 0;
 	top: 0;
 	overflow: hidden;
 	background: #1f196dba;
 	transform: scale(1);
	opacity: 1;
	z-index: 99;
 }