tkbremnes/dabblet.css

## dabblet.css
/**
 * Organic design. I think.
 *
 * Loosely based on color palette: http://www.colourlovers.com/palette/520700/Environment-Friendly
 */

@import url(http://fonts.googleapis.com/css?family=PT+Sans|PT+Serif|Montserrat);

body {
/*	background: #eaeaea;
*/
	background: url(http://i.imgur.com/J0wit.png);
	background: #D5F6B8;
	background: linear-gradient(left, green 0%, light-green 15%, light-green 85%, green100%);
	background: linear-gradient(left top,#00CD00 0%, green 40%);
	min-height:100%;
	background: url(data:image/png;base64,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)

	margin: 0; padding: 0;
}

h2, h3, h4, h5, h6 {
	font-family: PT Sans, Helvetica, Arial, sans-serif;

	margin-bottom: 0.2em;

	color: #eaeaea;	text-stroke: 1px #3E6617;
}

h1 {
	font-family: Montserrat;
	font-size: 4em;
	text-transform: uppercase;
	font-weight: 900;
	letter-spacing: -0.06em;
	margin: 0;

	color: #eaeaea;
	text-stroke: 1px #3E6617;

}

h2 {
	font-size: 2em;
}

p {
	font-family: PT Serif, serif;
	font-size: 1.1em;
	margin-top: 0.2em;
	color: #eaeaea;

}

a {
	color: #6666FF;
	color: #63D1F4;
	transition: all linear 0;
}

figcaption {
	font-family: PT Sans, sans-serif;
	font-size: 1.1em;
	text-shadow: #ccc 0 1px 0, 0 0 .2em rgba(255, 102, 0, .5);
}

a:hover, a:focus {
	text-decoration: none;
	color: #121212;
	color: white;
}

article {
	width: 85%;
	max-width: 780px;
	margin: auto;
	padding: 2em;
/*	border: 1px solid #3E6617;
	border-radius: 0 0 7px 7px; */
}


.subtle_shadow {
	box-shadow: #444 0 1px 5px;
}

#media_wrapper {
	background: white;
	border: 1px solid #3E6617;
	border-radius: 5px;
	padding: 1em;
	position: relative;
}

.media_image {
	border: 1px solid #ccc;
	max-width: 100%;
	padding: 0; margin: 0;
}

.media {
	padding: 0; margin: 0;
}

figcaption {
	text-align: center;
}

.media::hover #meta {
	height: 417px;
	transition-delay: 0.4s;
}

.media::hover #meta ul {
	opacity: 1;
	transition: opacity ease-out 0.1s;
}

#meta {
	width:740px;
	height: 0;
	position: absolute;
	top: 1em;
	left: 1em;
	background: #000;
	opacity: 0.7;
	transition: height ease 0.4s;
	transition-delay: 0;
	overflow: hidden;
}

#meta ul {
	decoration: none;
	color: white;
	opacity: 0;
	transition: opacity ease-in 0.2s;
	transition-delay: 0.2s;
}

#meta2 {
	position: absolute;
	top: 1em;
	left: 1em;
	background: #000;
	height: 90%%;
	width: 20%;
	opacity: 0;
	transition: opacity ease-out 0.3s;
	transition-delay: 0;
	overflow: hidden;
	cursor: pointer;
}

.media::hover #meta2 {
	opacity: 0.7;
}

.media::hover #meta2:after {
	opacity: 1;
}

#meta2::after {
	content:"";
	height: 50px;
	width: 50px;
	background: #000;
	position: absolute;
	top: 180px;
	left: 60px;
	border-style: solid;
	border-color: white;
	border-width: 0 0 15px 15px;
	transform: rotate(45deg);
	opacity: 1;
	transition: opacity linear 1s;
}

#meta2:after:hover {
	background: yellow;
}

#meta2 ul{
	visibility: hidden;
}

*::selection {
	background: #3E6617;
	color: #D5F6B8;
	text-shadow: none;
}

/*
a::selection {
	background: #494949;
	color: white;
	text-shadow: none;
}
*/
@media screen and (max-width: 480px){
	article {
		padding: 0;
		width: 100%;
	}

	body {
		padding:0.6em;
		margin: 0;
	}


	h1 {
		font-size: 2.4em;
	}

	h2 {
		font-size: 1.8em
	}

	figcaption {
		font-size: 0.9em;
	}
}

## dabblet.html
<!-- content to be placed inside <body>…</body> -->

<article>
<h1>Hello world</h1>

<div id="media_wrapper" class="subtle_shadow rounded_corners">
	<figure class="media">
		<img class="media_image" src="http://i.imgur.com/0J0cp.jpg" />
		<figcaption>This is a piece of media. Wonder what happens when the text exedes one line. Will it break? Nope, it got handled fine, just fine<figcaption>

		<div id="meta2" onclick="alert('nav')">

		</div>
	</figure>
</div>


<!-- start slipsum code -->

<h2>I'm serious as a heart attack</h2>
<p>You think <a href="#">water</a> moves fast? You should see ice. It moves like it has a mind. Like it knows it killed the world once and got a taste for murder. After the avalanche, it took us a week to climb out. Now, I don't know exactly when we turned on each other, but I know that seven of us survived the slide... and only five made it out. Now we took an oath, that I'm breaking now. We said we'd say it was the snow that killed the other two, but it wasn't. Nature is lethal but it doesn't hold a candle to man. </p>

<h2>Hold on to your butts</h2>
<p>Your bones don't break, mine do. That's clear. Your cells react to bacteria and viruses differently than mine. You don't get sick, I do. That's also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke. We get some in our lungs, we drown. However unreal it may seem, we are connected, you and I. We're on the same curve, just on opposite ends. </p>

<h2>We happy?</h2>
<p>Look, just because I don't be givin' no man a foot massage don't make it right for Marsellus to throw Antwone into a glass motherfuckin' house, fuckin' up the way the nigger talks. Motherfucker do that shit to me, he better paralyze my ass, 'cause I'll kill the motherfucker, know what I'm sayin'? </p>
<p>Look, just because I don't be givin' no man a foot massage don't make it right for Marsellus to throw Antwone into a glass motherfuckin' house, fuckin' up the way the nigger talks. Motherfucker do that shit to me, he better paralyze my ass, 'cause I'll kill the motherfucker, know what I'm sayin'? </p>


<!-- please do not remove this line -->

<div style="display:none;">
<a href="http://slipsum.com">lorem ipsum</a></div>

<!-- end slipsum code -->

</article>


## settings.json
{"view":"split-vertical","prefixfree":"1","page":"css"}
	/**
	* Organic design. I think.
	*
	* Loosely based on color palette: http://www.colourlovers.com/palette/520700/Environment-Friendly
	*/

	@import url(http://fonts.googleapis.com/css?family=PT+Sans\|PT+Serif\|Montserrat);

	body {
	/* background: #eaeaea;
	*/
	background: url(http://i.imgur.com/J0wit.png);
	background: #D5F6B8;
	background: linear-gradient(left, green 0%, light-green 15%, light-green 85%, green100%);
	background: linear-gradient(left top,#00CD00 0%, green 40%);
	min-height:100%;
	background: url(data:image/png;base64,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)

	margin: 0; padding: 0;
	}

	h2, h3, h4, h5, h6 {
	font-family: PT Sans, Helvetica, Arial, sans-serif;

	margin-bottom: 0.2em;

	color: #eaeaea; text-stroke: 1px #3E6617;
	}

	h1 {
	font-family: Montserrat;
	font-size: 4em;
	text-transform: uppercase;
	font-weight: 900;
	letter-spacing: -0.06em;
	margin: 0;

	color: #eaeaea;
	text-stroke: 1px #3E6617;

	}

	h2 {
	font-size: 2em;
	}

	p {
	font-family: PT Serif, serif;
	font-size: 1.1em;
	margin-top: 0.2em;
	color: #eaeaea;

	}

	a {
	color: #6666FF;
	color: #63D1F4;
	transition: all linear 0;
	}

	figcaption {
	font-family: PT Sans, sans-serif;
	font-size: 1.1em;
	text-shadow: #ccc 0 1px 0, 0 0 .2em rgba(255, 102, 0, .5);
	}

	a:hover, a:focus {
	text-decoration: none;
	color: #121212;
	color: white;
	}

	article {
	width: 85%;
	max-width: 780px;
	margin: auto;
	padding: 2em;
	/* border: 1px solid #3E6617;
	border-radius: 0 0 7px 7px; */
	}


	.subtle_shadow {
	box-shadow: #444 0 1px 5px;
	}

	#media_wrapper {
	background: white;
	border: 1px solid #3E6617;
	border-radius: 5px;
	padding: 1em;
	position: relative;
	}

	.media_image {
	border: 1px solid #ccc;
	max-width: 100%;
	padding: 0; margin: 0;
	}

	.media {
	padding: 0; margin: 0;
	}

	figcaption {
	text-align: center;
	}

	.media::hover #meta {
	height: 417px;
	transition-delay: 0.4s;
	}

	.media::hover #meta ul {
	opacity: 1;
	transition: opacity ease-out 0.1s;
	}

	#meta {
	width:740px;
	height: 0;
	position: absolute;
	top: 1em;
	left: 1em;
	background: #000;
	opacity: 0.7;
	transition: height ease 0.4s;
	transition-delay: 0;
	overflow: hidden;
	}

	#meta ul {
	decoration: none;
	color: white;
	opacity: 0;
	transition: opacity ease-in 0.2s;
	transition-delay: 0.2s;
	}

	#meta2 {
	position: absolute;
	top: 1em;
	left: 1em;
	background: #000;
	height: 90%%;
	width: 20%;
	opacity: 0;
	transition: opacity ease-out 0.3s;
	transition-delay: 0;
	overflow: hidden;
	cursor: pointer;
	}

	.media::hover #meta2 {
	opacity: 0.7;
	}

	.media::hover #meta2:after {
	opacity: 1;
	}

	#meta2::after {
	content:"";
	height: 50px;
	width: 50px;
	background: #000;
	position: absolute;
	top: 180px;
	left: 60px;
	border-style: solid;
	border-color: white;
	border-width: 0 0 15px 15px;
	transform: rotate(45deg);
	opacity: 1;
	transition: opacity linear 1s;
	}

	#meta2:after:hover {
	background: yellow;
	}

	#meta2 ul{
	visibility: hidden;
	}

	*::selection {
	background: #3E6617;
	color: #D5F6B8;
	text-shadow: none;
	}

	/*
	a::selection {
	background: #494949;
	color: white;
	text-shadow: none;
	}
	*/
	@media screen and (max-width: 480px){
	article {
	padding: 0;
	width: 100%;
	}

	body {
	padding:0.6em;
	margin: 0;
	}


	h1 {
	font-size: 2.4em;
	}

	h2 {
	font-size: 1.8em
	}

	figcaption {
	font-size: 0.9em;
	}
	}
	<!-- content to be placed inside <body>…</body> -->

	<article>
	<h1>Hello world</h1>

	<div id="media_wrapper" class="subtle_shadow rounded_corners">
	<figure class="media">
	<img class="media_image" src="http://i.imgur.com/0J0cp.jpg" />
	<figcaption>This is a piece of media. Wonder what happens when the text exedes one line. Will it break? Nope, it got handled fine, just fine<figcaption>

	<div id="meta2" onclick="alert('nav')">

	</div>
	</figure>
	</div>


	<!-- start slipsum code -->

	<h2>I'm serious as a heart attack</h2>
	<p>You think <a href="#">water</a> moves fast? You should see ice. It moves like it has a mind. Like it knows it killed the world once and got a taste for murder. After the avalanche, it took us a week to climb out. Now, I don't know exactly when we turned on each other, but I know that seven of us survived the slide... and only five made it out. Now we took an oath, that I'm breaking now. We said we'd say it was the snow that killed the other two, but it wasn't. Nature is lethal but it doesn't hold a candle to man. </p>

	<h2>Hold on to your butts</h2>
	<p>Your bones don't break, mine do. That's clear. Your cells react to bacteria and viruses differently than mine. You don't get sick, I do. That's also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke. We get some in our lungs, we drown. However unreal it may seem, we are connected, you and I. We're on the same curve, just on opposite ends. </p>

	<h2>We happy?</h2>
	<p>Look, just because I don't be givin' no man a foot massage don't make it right for Marsellus to throw Antwone into a glass motherfuckin' house, fuckin' up the way the nigger talks. Motherfucker do that shit to me, he better paralyze my ass, 'cause I'll kill the motherfucker, know what I'm sayin'? </p>
	<p>Look, just because I don't be givin' no man a foot massage don't make it right for Marsellus to throw Antwone into a glass motherfuckin' house, fuckin' up the way the nigger talks. Motherfucker do that shit to me, he better paralyze my ass, 'cause I'll kill the motherfucker, know what I'm sayin'? </p>



	<!-- please do not remove this line -->

	<div style="display:none;">
	<a href="http://slipsum.com">lorem ipsum</a></div>

	<!-- end slipsum code -->

	</article>