@import url("reset.css");

/* SECTIONS */
html{
	min-height: 100%;
	text-align: center;
	
	background: #ccc;
	background: -moz-linear-gradient(top,  #eee,  #aaa);
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#aaa));
}
body {
	padding: 40px;
}
#box {
	width: 960px;
	margin: 0 auto;
	
	background: #333;
	background: -moz-linear-gradient(top,  #555,  #000);
	background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#000));
	
	border: 1px solid #000;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	
	box-shadow: 0 0 20px rgba(0,0,0,.5);
	-moz-box-shadow: 0 0 20px rgba(0,0,0,.5);
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,.5);
}
#header,#footer{
	padding: 20px;
	text-align: center;
}
#header {
	position: relative;
	margin-bottom: 20px;
	border-bottom: 1px dashed #777;
}
#old,#new{
	width: 50%;
}
#old {
	float: left;
}
#new {
	float: right;
}
#old .pad {
	padding: 0 10px 0 20px;
}
#new .pad {
	padding: 0 20px 0 10px;
}
#out .pad {
	padding: 0 20px;
}
#error {
	position: absolute;
	top: 20px;
	width: 920px;
	
	color: #f00;
	font-weight: bold;
	line-height: 32px;
	
	background: #000;
	
	border: 1px solid #000;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	
	box-shadow: 0 0 20px rgba(0,0,0,.5);
	-moz-box-shadow: 0 0 20px rgba(0,0,0,.5);
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,.5);
}

/* ELEMENTS */
h1{
	text-shadow: 2px 2px 2px #000;
	font-size: 2em;
}
h2 {
	text-shadow: 2px 2px 2px #000;
	font-size: 1.2em;
	margin-bottom: 5px;
}
.textarea {
	display: block;
	min-height: 500px;
	padding: 10px;
	background: #eee;
	
	border: 1px solid black;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
textarea {
	width: 100%;
	min-height: 500px;
	font-family: monospace;
	text-shadow: 1px 1px 0px #ddd;
}
button {
	display: inline-block;
	padding: 5px 15px;
	
	color: #000;
	line-height: 1;
	font-weight: bold;
	text-decoration: none;
	
	background: #ccc;
	background: -moz-linear-gradient(top,  #eee,  #aaa);
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#aaa));
	
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
button:hover {
	background: #ddd;
	background: -moz-linear-gradient(top,  #fff,  #bbb);
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#bbb));
}