/**
 * the overlayed element
 */

div.overlay {
	width: 640px;
	height: 360px;
	display: none;
	padding: 50px; /* top right bottom left */
	color: #0a0a0a;
	background-image: url(../images/overlay-background.png);
}

/**
 * default close button positioned on upper right corner
 */

div.overlay div.close {
	position: absolute;
	right: 20px;
	top: 20px;
	cursor: pointer;
	height: 35px;
	width: 35px;
	background-image: url(../images/overlay-close.png);
}

div.overlay div.close:hover {
	background-image: url(../images/overlay-close-hover.png);
}


/**
 * black overlay
 */

div.overlay.black {
	color: #fff;
	background: url(../images/layover-background-transparent.png) no-repeat !important;
}


/**
 * petrol overlay
 */

div.overlay.petrol {
	color:#fff;
	background:url(../images/layover-background-petrol.png) no-repeat !important;
}

div.black h2,
div.petrol h2 {
	color:#ddd;
}


/**
 * the content area of overlay
 */

div.overlay_content {
	overflow: hidden;
	overflow-y: scroll;
	margin: 10px 0px 10px 10px; /* top right bottom left */
	height: 340px;
	padding-right: 10px;
}


/*****************************************************************************************************************pagebeam**/