* { margin: 0; padding: 0; }
body { font: 12px/1.4 Verdana, serif; }
a {
    color: #0060B6;
    text-decoration: none;
}

a:hover 
{
     color:#00A0C6; 
     text-decoration:none; 
}
#page-wrap { width: 800px; margin: 0 auto; }

textarea { border: 0; font: 12px Verdana, Serif; overflow: hidden; resize: none; background-color:transparent;}
table { border-collapse: collapse; }
table td, table th { border: 1px solid black; padding: 5px; }

#address { width: 250px; height: 125px; float: left; }
#customer { overflow: hidden; }

#logo { text-align: right; float: right; position: relative; border: 1px solid #fff; max-width: 540px; max-height: 120px; overflow: hidden; }

#customer-title { font-size: 14px; font-weight: ; float: left; }

#meta { margin-top: 1px; width: 300px; float: right; }
#meta td { text-align: right;  }
#meta td.meta-head { text-align: left; background: #eee; }
#meta td textarea { width: 100%; height: 20px; text-align: right; }

#items { clear: both; width: 100%; margin: 20px 0 0 0; border: 1px solid black; }
#items th { background: #eee; }
#items textarea { width: 80px; height: 40px; }
#items tr.item-row td { border: 0; vertical-align: top; }
#items td.description { width: 375px; }
#items td.item-name { width: 100px; }
#items td.description textarea, #items td.item-name textarea { width: 100%; }
#items td.total-line { border-right: 0; text-align: right; }
#items td.total-value { border-left: 0; padding: 5px; }
#items td.total-value textarea { height: 20px; background: none; }
#items td.balance { background: #eee; }
#items td.blank { border: 0; }

#terms { text-align: center; margin: 20px 0 0 0; }
#terms h5 { text-transform: uppercase; font: 13px Verdana, Sans-Serif; letter-spacing: 10px; border-bottom: 1px solid black; padding: 0 0 8px 0; margin: 0 0 8px 0; }
#terms textarea { width: 100%; text-align: center;}

textarea:hover, textarea:focus, #items td.total-value textarea:hover, #items td.total-value textarea:focus, .delete:hover, .insert:hover { background-color:#EEFF88; }

.delete-wpr { position: relative; }
.delete { display: block; color: #000; text-decoration: none; position: absolute; background: #EEEEEE; font-weight: bold; padding: 0px 3px; border: 1px solid; top: 0px; left: -33px; font-family: Verdana; font-size: 12px; width: 23px; text-align: center;}

.insert-wpr { position: relative; }
.insert { display: block; color: #000; text-decoration: none; position: absolute; background: #EEEEEE; font-weight: bold; padding: 0px 3px; border: 1px solid; top: -17px; left: -60px; font-family: Verdana; font-size: 12px; width: 23px; text-align: center;}

	
 tr.item-row:nth-child(odd) td{
  background-color:#eee;
}
.btn {
  background-color: #f4511e;
  border: none;
  color: white;
  padding: 10px 20px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.6;
  transition: 0.3s;
  border-radius: 4px;
}

.btn:hover {opacity: 1; cursor:pointer;  }


	#wrapper {
		width: 1000px;
		max-width: 1000px;
		margin: 20px auto;
	}

	.pin {
		display: inline-block;
		background: #FEFEFE;
		border: 1px solid #CCC;
		box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
		margin: 0 0 15px;
		-webkit-column-break-inside: avoid;
		-moz-column-break-inside: avoid;
		padding: 0.5cm;
	}

	.pin div.pageA4 {
		width: 900px;
	min-height: 25cm;
	max-height: 100%;
	}