OLQOS Home page

dabblet.css

/**
 * OLQOS Home page
 */

* {
	box-sizing: border-box
}

body, html, #container {
	height: 100%;
}

#container {
	display: flex;
	align-items: center;
  	justify-content: center;
}

#notice {
	width: 60%;
	margin: .5em;
	background-color: hsl(192, 71%, 74%);
	font-size: 150%;
	padding: 1em;
	border-radius: 1em;
	text-align: center;
	max-width: 550px;
}
ul {
	font-size: .75em;
}
img {
	width: 235px;
	height: 386px;
}
h1 {
	font-size: 1.25em;
}
@media only screen and (max-device-width: 1000px) {
	img { display: none; }
}
@media only screen and (max-device-width: 750px) {
	#container { display: block; }
	#notice { width: 100%; margin: 0;}
}

dabblet.html

<div id="container">
<img src="http://ourladyqueenofsaints.org/images/teachthechildren.jpg">
<main id="notice">
	<h1>OLQOS will become inactive on <time datetime="2014-07-31">July 31st</time></h1>
	<p>Thanks to everyone who have been part of and supported our group in it's 25 year history!</p>
	<p>For the new South Shore Catholic homeschool group, see the following links to learn about Little Way Home Educators:</p>
	<ul>
		<li><a href="http://littlewayhomeeducators.blogspot.com/">Blog</a>
		<li><a href="https://www.facebook.com/groups/240998166098568/">Facebook Group</a>
		<li><a href="https://www.bigtent.com/invitation/86098830/179dc156ed2ff8ec081da9e3b7c5041e?md=Nzk5NTgxMDU=">Bigtent page</a>
	</ul>
</main>
<img src="http://ourladyqueenofsaints.org/images/crowningmary.jpg">
</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}