<!DOCTYPE html>
<html>
	<head>
		<title>NexGenDisinfecting -- Off-Line</title>

		<style type="text/css">
			/* Body Settings, change background colors and images here. */
			body {
				font-size:16px;
				font-family: 'Kameron', Georgia,serif;
				text-align: center;
				color: white;
				background-color: black;
				background-image: url('wp-content/uploads/maintenance-mode-images/site-offline-background-black.jpg');
				background-size: 100% 100%;
				background-repeat: no-repeat;
				background-position: absolute;
				background-attachment: fixed;
				background-width: 100%;
				background-top: 0;
				background-left: 0;
			}

			/* Login Button */
			.login_button {
				text-decoration:none;
				font-weight:bold;
				color: #000;
				background: #fdfdfd;
				padding: 5px;
				border: solid 1px #666;
				-moz-border-radius-topleft: 10px;
				-moz-border-radius-topright: 10px;
				-moz-border-radius-bottomleft: 10px;
				-moz-border-radius-bottomright: 10px;
				-webkit-border-top-left-radius: 10px;
				-webkit-border-top-right-radius: 10px;
				-webkit-border-bottom-left-radius: 10px;
				-webkit-border-bottom-right-radius: 10px;
				border-top-left-radius: 10px;
				border-top-right-radius: 10px;
				border-bottom-left-radius: 10px;
				border-bottom-right-radius: 10px;
				-moz-box-shadow: 2px 2px 20px #666;
				-webkit-box-shadow: 2px 2px 20px #666;
				box-shadow: 2px 2px 20px #666;
				position:absolute;
				bottom: 20px;
				right:20px;
			}
			
			/* Login Button Hover */
			.login_button:hover {
				border: solid 1px #f7d7d7;
				background: #f7d7d7;
				background: -moz-linear-gradient(top, #f7d7d7 0%, #ff9e9e 100%);
				background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7d7d7), color-stop(100%,#ff9e9e));
				background: -webkit-linear-gradient(top, #f7d7d7 0%,#ff9e9e 100%);
				background: -o-linear-gradient(top, #f7d7d7 0%,#ff9e9e 100%);
				background: -ms-linear-gradient(top, #f7d7d7 0%,#ff9e9e 100%);
				background: linear-gradient(to bottom, #f7d7d7 0%,#ff9e9e 100%);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7d7d7', endColorstr='#ff9e9e',GradientType=0 );
			}
			
			/* center the content relative to the screen size */
			.outer {
				display: table;
				position: absolute;
				top: 0;
				left: 0;
				height: 100%;
				width: 100%;
			}

			.middle {
				display: table-cell;
				vertical-align: middle;
			}

			.inner {
				margin-left: auto;
				margin-right: auto;
				width: 800px;
				/*whatever width you want*/
			}
			.content {
				text-align: center;
			}
		</style>

		<script type="text/javascript">
			WebFontConfig = {
				google: {families: ['Kameron:400,700']}
			};
			(function() {
				var wf = document.createElement('script');
				wf.src = ('https:' == document.location.protocol ? 'https' : 'http') + '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
				wf.type = 'text/javascript';
				wf.async = 'true';
				var s = document.getElementsByTagName('script')[0];
				s.parentNode.insertBefore(wf, s);
			})();
		</script>
	</head>

	<body>
		<div class="outer">
			<div class="middle">
				<div class="inner">
					<span class="content">
						<img class="site-logo" src="logo.png" alt="logo">
						<!-- <h1 class="align-center" style="text-shadow: 5px 5px 5px rgba(46, 46, 46, 0.45">Site Name</h1> -->
						<h2 class="align-center" style="text-shadow: 5px 5px 5px rgba(46, 46, 46, 0.45);">Coming Soon!</h2>
						<h4 class="align-center" style="text-shadow: 5px 5px 5px rgba(46, 46, 46, 0.45);">Cool text for your site</h4>
						<h4 class="align-center" style="text-shadow: 5px 5px 5px rgba(46, 46, 46, 0.45);">Catch Phrase for your site</h4>
						<br />
						<h1 class="align-center" style="text-shadow: 5px 5px 5px rgba(46, 46, 46, 0.45);">For More Info Call: (415) 555-1212</h1>
					</span>
				</div>
			</div>
		</div>
		<a href="/wp-login.php" class="login_button">Login</a>
	</body>
</html>