view release on metacpan or  search on metacpan

share/revealjs/css/reveal.scss  view on Meta::CPAN

.reveal > .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background: rgba( 0, 0, 0, 0.9 );
	transition: all 0.3s ease;
}

	.reveal > .overlay .spinner {
		position: absolute;
		display: block;
		top: 50%;
		left: 50%;
		width: 32px;
		height: 32px;
		margin: -16px 0 0 -16px;
		z-index: 10;
		background-image: url(data:image/gif;base64,R0lGODlhIAAgAPMAAJmZmf%2F%2F%2F6%2Bvr8nJybW1tcDAwOjo6Nvb26ioqKOjo7Ozs%2FLy8vz8%2FAAAAAAAAAAAACH%2FC05FVFNDQVBFMi4wAwEAAAAh%2FhpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh%2BQQJCgAAACwAAAAAIAAgAAAE5xDISWlhperN52...

		visibility: visible;
		opacity: 0.6;
		transition: all 0.3s ease;
	}

	.reveal > .overlay header {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		padding: $overlayHeaderPadding;
		z-index: 2;
		box-sizing: border-box;
	}
		.reveal > .overlay header a {
			display: inline-block;
			width: $overlayHeaderHeight;
			height: $overlayHeaderHeight;
			line-height: 36px;
			padding: 0 10px;
			float: right;
			opacity: 0.6;

			box-sizing: border-box;
		}
			.reveal > .overlay header a:hover {
				opacity: 1;
			}
			.reveal > .overlay header a .icon {
				display: inline-block;
				width: 20px;
				height: 20px;

				background-position: 50% 50%;
				background-size: 100%;
				background-repeat: no-repeat;
			}
			.reveal > .overlay header a.close .icon {
				background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABkklEQVRYR8WX4VHDMAxG6wnoJrABZQPYBCaBTWAD2g1gE5gg6OOsXuxIlr40d81dfrSJ9V4c2VLK7spHuTJ/5wpM07QXuXc5X0opX2tEJcadjHuV80li/FgxTIEK/5QBCICBD6xEhSMGHgQPgBgLiYVAB1...
			}
			.reveal > .overlay header a.external .icon {
				background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAcElEQVRYR+2WSQoAIQwEzf8f7XiOMkUQxUPlGkM3hVmiQfQR9GYnH1SsAQlI4DiBqkCMoNb9y2e90IAEJPAcgdznU9+engMaeJ7Azh5Y1U67gAho4DqBqmB1buAf0MB1AlVBek83ZPkmJMGc1wAR+AAqod...
			}

	.reveal > .overlay .viewport {
		position: absolute;
		display: flex;
		top: $overlayHeaderHeight + $overlayHeaderPadding*2;
		right: 0;
		bottom: 0;
		left: 0;
	}

	.reveal > .overlay.overlay-preview .viewport iframe {
		width: 100%;
		height: 100%;
		max-width: 100%;
		max-height: 100%;
		border: 0;

		opacity: 0;
		visibility: hidden;
		transition: all 0.3s ease;
	}

	.reveal > .overlay.overlay-preview.loaded .viewport iframe {
		opacity: 1;
		visibility: visible;
	}

	.reveal > .overlay.overlay-preview.loaded .viewport-inner  {
		position: absolute;
		z-index: -1;
		left: 0;
		top: 45%;
		width: 100%;
		text-align: center;
		letter-spacing: normal;
	}
	.reveal > .overlay.overlay-preview .x-frame-error  {
		opacity: 0;
		transition: opacity 0.3s ease 0.3s;
	}
	.reveal > .overlay.overlay-preview.loaded .x-frame-error  {
		opacity: 1;
	}

	.reveal > .overlay.overlay-preview.loaded .spinner {
		opacity: 0;
		visibility: hidden;
		transform: scale(0.2);
	}

	.reveal > .overlay.overlay-help .viewport {
		overflow: auto;
		color: #fff;
	}

	.reveal > .overlay.overlay-help .viewport .viewport-inner {
		width: 600px;
		margin: auto;
		padding: 20px 20px 80px 20px;