.notepad{
border:1px solid gray;
background:#D3E9FF;
/*box-shadow: 0 0 12px #818181;
-webkit-box-shadow: 0 0 12px #818181;
-moz-box-shadow: 0 0 12px #818181;*/
width:300px;
padding:7px 10px;
position:absolute;
cursor:pointer;
color:#069;
}

.notepad  h3{
margin:5px 0;
}

.notepad .close{
float:right;
font-weight:bold;
text-align:center;
display:block;
}

.notepad form{
margin:0;
padding:0;
}

.notepad  form fieldset{
margin-top:1em;
}

.notepad  form legend{
font-weight:bold;
}

.notepad  form input[type=text]{
width:98%;
}

.notepad  form textarea{
width:98%;
height:150px;
}

.notepad  form a.control{
/*text-decoration: none;
padding: 5px 20px;
text-align:center;
margin:5px 0;
display:block;
margin-top:5px;
font:bold 13px Verdana;
border: 1px solid #green;
color: white;
border:1px solid gray;
background: green;
border-radius: 5px; /*w3c border radius*/
/*box-shadow: 3px 3px 4px rgba(0,0,0,.5); w3c box shadow */
/*-moz-border-radius: 0px; /* mozilla border radius */
/*-moz-box-shadow: 3px 3px 4px rgba(0,0,0,.5);  mozilla box shadow */
/*background:#000;
-webkit-border-radius: 0px; /* webkit border radius */
/*-webkit-box-shadow: 3px 3px 4px rgba(0,0,0,.5);  webkit box shadow */
/*background:#000;*/


	margin:5px 0;
	background: #e3e3e3;
	border: 1px solid #999;
	color: #777;
	font-family:Tahoma, Geneva, sans-serif;
	font-weight: bold;
	text-align: center;
	cursor:pointer;
	float:left;
	text-shadow: 0px 1px 0px #fff;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	width:273px;
	height:40px;
	padding:10px 20px;
	-moz-box-shadow: 0px 0px 2px #fff inset;
	-webkit-box-shadow: 0px 0px 2px #fff inset;
	box-shadow: 0px 0px 2px #fff inset;

}
.notepad  form a.control:hover {
	background: #d9d9d9;
	-moz-box-shadow: 0px 0px 2px #eaeaea inset;
	-webkit-box-shadow: 0px 0px 2px #eaeaea inset;
	box-shadow: 0px 0px 2px #eaeaea inset;
	color: #222;
}

.notepad form a.delete{
background: darkred;
background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d);
background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d));
}

.notepad:before{ /*top left tape effect*/
content: '';
position:absolute;
width: 120px;
height: 25px;
border-left: 1px dashed rgba(0, 0, 0, 0.1);
border-right: 1px dashed rgba(0, 0, 0, 0.1);
background: rgba(0, 0, 0, 0.1);
background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
background: -moz-linear-gradient(555% 0 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
-webkit-transform:translate(-70px,0)
skew(10deg,10deg)
rotate(-50deg);
-moz-transform:translate(-70px,0)
skew(10deg,10deg)
rotate(-50deg);
-o-transform:translate(-70px,0)
skew(10deg,10deg)
rotate(-50deg);
-ms-transform:translate(-70px,0)
skew(10deg,10deg)
rotate(-50deg);
transform:translate(-70px,0)
skew(10deg,10deg)
rotate(-50deg);
}

