potench/dabblet.css

## dabblet.css
/**
 * "Confidentiality Notices are completely unenforceable - you can't send someone an email that legally binds them to not speaking without their consent"
 */
body {
	background: #fff;
	min-height:100%;
}
span.action {
	position:absolute;
	-moz-transform: rotate(25deg);
	-o-transform: rotate(25deg);
	-webkit-transform: rotate(25deg);
	transform: rotate(25deg);
	-ms-transform: rotate(25deg);
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.906, M12=-0.423, M21=0.423, M22=0.906,sizingMethod='auto expand');
	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.906, M12=-0.423, M21=0.423, M22=0.906,sizingMethod='auto expand')";
	zoom: 1;
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	position: absolute;
	border:2px solid black;
	padding:10px;
	background: rgba(0, 0, 0, 0.5);
	border-radius:20px;
	color:#fff;
	-moz-box-shadow: 5px 5px 10px -3px black;
	-webkit-box-shadow: 5px 5px 10px -3px black;
	box-shadow: 5px 5px 10px 3px black;
}
span.step1 {
	left:-20px;
	top:-60px;
}
span.step2 {
	left:-20px;
	top:-60px;
}
div.notice {
	margin:80px auto 120px;
	width:50%; padding:20px; border:2px solid #CCC; border-left:0; border-right:0;
	position:relative;
}
div.example {
	margin:auto;
	width:742px;
	position:relative;
}

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

<h1>Improved Confidentiality Notice</h1>
<p><a href="http://twitter.com/meatbody">@meatbody</a> says that Confidentiality notices aren't enforcable - "you can't send someone a bunch of data and demand they not share it without first getting their consent. It's bullshit".
</p>
<p>Read more at: <a href="" target="_blank">Why Email Confidentiality Notices are Useless</a></p>
<p>So.... as a middle ground - here's the smallest Confidentiality Notice we could make without it pixelating... copy-paste the <b>rendered</b> output into your gmail signature</p>

<div class="notice">
	<span class="action step1">Copy Paste this -></span>
	<p style="line-height:5px;">
		<span style="font-family:Verdana, sans-serif; font-size:5px !important; color:#999; line-height:5px;">CONFIDENTIALITY NOTICE: This e-mail, including any previous messages and/or files attached to it, is private, confidential, and solely for the use of the intended recipient(s).  Any review, retransmission, dissemination, reproduction or other use of, or taking of any action in reliance upon, this information by persons or entities other than the intended recipient(s), or by a person responsible for delivering it to the intended recipient(s), is unauthorized and strictly prohibited. If you have received this transmission in error, please immediately notify the sender and destroy the original transmission and its attachments without reading or saving in any manner. Thank you. RED Interactive Agency, LLC</span>
	</p>
</div>
<div class="example">
	<span class="action step2">Into gmail settings -></span>
	<img src="http://f.cl.ly/items/3Q1D16461m000D1Y1u2t/Screen%20Shot%202012-01-26%20at%2010.06.41%20AM.png"/>
</div>

## settings.json
{"view":"split","prefixfree":"1","page":"css"}
	/**
	* "Confidentiality Notices are completely unenforceable - you can't send someone an email that legally binds them to not speaking without their consent"
	*/
	body {
	background: #fff;
	min-height:100%;
	}
	span.action {
	position:absolute;
	-moz-transform: rotate(25deg);
	-o-transform: rotate(25deg);
	-webkit-transform: rotate(25deg);
	transform: rotate(25deg);
	-ms-transform: rotate(25deg);
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.906, M12=-0.423, M21=0.423, M22=0.906,sizingMethod='auto expand');
	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.906, M12=-0.423, M21=0.423, M22=0.906,sizingMethod='auto expand')";
	zoom: 1;
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	position: absolute;
	border:2px solid black;
	padding:10px;
	background: rgba(0, 0, 0, 0.5);
	border-radius:20px;
	color:#fff;
	-moz-box-shadow: 5px 5px 10px -3px black;
	-webkit-box-shadow: 5px 5px 10px -3px black;
	box-shadow: 5px 5px 10px 3px black;
	}
	span.step1 {
	left:-20px;
	top:-60px;
	}
	span.step2 {
	left:-20px;
	top:-60px;
	}
	div.notice {
	margin:80px auto 120px;
	width:50%; padding:20px; border:2px solid #CCC; border-left:0; border-right:0;
	position:relative;
	}
	div.example {
	margin:auto;
	width:742px;
	position:relative;
	}
	<!-- content to be placed inside <body>…</body> -->

	<h1>Improved Confidentiality Notice</h1>
	<p><a href="http://twitter.com/meatbody">@meatbody</a> says that Confidentiality notices aren't enforcable - "you can't send someone a bunch of data and demand they not share it without first getting their consent. It's bullshit".
	</p>
	<p>Read more at: <a href="" target="_blank">Why Email Confidentiality Notices are Useless</a></p>
	<p>So.... as a middle ground - here's the smallest Confidentiality Notice we could make without it pixelating... copy-paste the <b>rendered</b> output into your gmail signature</p>

	<div class="notice">
	<span class="action step1">Copy Paste this -></span>
	<p style="line-height:5px;">
	<span style="font-family:Verdana, sans-serif; font-size:5px !important; color:#999; line-height:5px;">CONFIDENTIALITY NOTICE: This e-mail, including any previous messages and/or files attached to it, is private, confidential, and solely for the use of the intended recipient(s). Any review, retransmission, dissemination, reproduction or other use of, or taking of any action in reliance upon, this information by persons or entities other than the intended recipient(s), or by a person responsible for delivering it to the intended recipient(s), is unauthorized and strictly prohibited. If you have received this transmission in error, please immediately notify the sender and destroy the original transmission and its attachments without reading or saving in any manner. Thank you. RED Interactive Agency, LLC</span>
	</p>
	</div>
	<div class="example">
	<span class="action step2">Into gmail settings -></span>
	<img src="http://f.cl.ly/items/3Q1D16461m000D1Y1u2t/Screen%20Shot%202012-01-26%20at%2010.06.41%20AM.png"/>
	</div>