<script>
/**
	An overlay container.

		// Can be created dynamically
		var overlay = new OreeshOverlay();
	
	
		<!-- Or via HTML -->
		<!-- A default overlay, which is visible by default -->
		<oreesh-overlay>
			<div>
				stuff stuff stuff
			</div>
		</oreesh-overlay>

		<!-- There are attirbutes to control opacity color/intesity and shadow -->
		<oreesh-overlay opacity="high">
			<div class="oreesh-overlay-shadow-target">
				stuff stuff stuff
			</div>
		</oreesh-overlay>
	
	@class oreesh-overlay
**/
/**
	Removes shadow styling to the overlay.  To have styling one div inside the oreesh-overlay must have the class `oreesh-overlay-shadow-target`; the shadow will be applied to that div.

	@attribute no-shadow
	@type Boolean
**/
/**
	Enables fade-in and fade-out animations for the overlay.

	@attribute no-animate
	@type Boolean
**/
/**
	Sets the opacity value.  Options are `low`, `high`, or `none`.

	@attribute opacity
	@default `low`
	@type Boolean
**/
/**
	Change the position style to `absolute` in content element.

	@attribute absolute
	@type Boolean
**/
/**
	Opens the overlay, making it appear on the screen.

	@method open
**/
/**
	Closes the overlay, removing it from the screen.

	@method close
**/
/**
	Custom z-index style for content area.

	@attribute z-index-content
	@type Number
**/
/**
	Custom z-index style for backdrop area.

	@attribute z-index-backdrop
	@type Number
**/
</script>
<dom-module id="oreesh-overlay">
	<template>
		<link rel="stylesheet" is="custom-style" href="./oreesh-overlay.css">
		<div class="backdrop cover" on-tap="_backdropTapAction"></div>

		<div class="content">
			<content></content>
		</div>
	</template>

</dom-module>

<script src="./oreesh-overlay.js"></script>