.main-content {
	height: 800px;
	width: 1000px;
	margin: 0 auto;
}

 .overlay-bg {
	/*display: none;*/
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width: 100%;
	cursor: pointer;
	z-index: 99999; /* high z-index */
	background: #000; /* fallback */
	background:  (0,0,0,0.75);
}
.overlay-content {
	background: #fff;
 	width: 40%;
	position: relative;
	top: 2%;
	left: 50%;
	margin: 0 0 0 -20%; /* add negative left margin for half the width to center the div */
	cursor: default;
	border-radius: 4px;
	box-shadow: 0 0 5px rgba(0,0,0,0.9);
	background: -webkit-linear-gradient(left,#FFF,#DDD,#FFF);
	background: -moz-linear-gradient(left,#FFF,#DDD,#FFF);
	padding:20px;
}


.overlay-content h3 {
	color:#00D;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight:600;
	text-align:center;
	font-size:25px;
	
	
	
}



.overlay-content img{
	padding: 0 15px 15px 0;
	width:100%;
	height:420px;	
}



.overlay-content p{
	font-family:Arial, Helvetica, sans-serif;
	color:#222;
	
	
}




.close-btn {
	cursor: pointer;
	border: 1px solid #fff;
	padding: 1% 2%;
	background:#D00; /* fallback */
	box-shadow: 0 0 4px rgba(0,0,0,0.3);
	position: absolute;
	top: -10px;
	right: -10px;
	border-radius:  ; 
 	color: #FFF;
	width:45px;
	height:35px;
	
}
.close-btn:hover {
	background: #E00 ;
}

/* media query for most mobile devices */
@media only screen and (min-width: 0px) and (max-width: 480px){

	.overlay-content {
		width: 96%;
		margin: 0 2%;
		left: 0;
	}
}