Tell me and I'll forget, show me and I may remember, involve me and I'll understand

dabblet.css

/**
 * Tell me and I'll forget, show me and I may remember, involve me and I'll understand
 *
 * Slide from "Learning to teach" presentation by Bartek Szopka
 * Front-Trends 2012
 */

@import url(http://fonts.googleapis.com/css?family=The+Girl+Next+Door);

html, body {
	height: 100%;
	box-sizing: border-box;
}

html {
	/* fallback non-gradient background */
	background-color: #FEFEFE;
	background: url("http://dabblet.com/img/noise.png");
	
	/* multiple backgrounds: colour, texture and gradient for red margin line */
	background: linear-gradient(left, rgba(230,100,100,0.7) 1px, transparent 1px) no-repeat 100px 0,
				url("http://dabblet.com/img/noise.png"), 
				#FEFEFE;
}

body {
	font-family: 'The Girl Next Door', cursive;
	font-size: 3.5em;
	line-height: 1.5em;
	color: #333;
	text-shadow: .05em .05em .1em rgba(0,0,0,0.2);
	
	margin: 0;
	padding: 1.5em 1em 0 150px;
	
	/* paper lines background, 
	   based on http://dabblet.com/gist/1560755 by @LeaVerou
	   look there for more details ;) */
	background: linear-gradient(rgba(50, 100, 200, .7) 1px, transparent 1px);
	background-size: 100% 1.5em;
	background-origin: content-box;	
	background-position: 0 1em;
}

blockquote {
	margin: 0 0 0 0;
}

p {
	margin: 0;
}

.note {
	font-size: 0.55em;
	color: #555;
}

.author {
	text-align: right;
}

dabblet.html

<blockquote>
<p>Tell me and I'll <b>forget</b>,<br/> show me and I may <b>remember</b>,<br/> involve me and I'll <b>understand</b>.</p>
</blockquote>
<p class="author note">* Confucius</p>

settings.json

{"view":"separate","fontsize":"100","seethrough":"1","prefixfree":"1","page":"result"}