/* 
    acme.css
    ian at etsyhacks dot com
    An illustration of the sort of effects you can achieve with CSS and the "printable receipt enhancer"
    Greasemonkey script at <http://www.etsyhacks.com/greasemonkey/printable_receipt_enhancer/>.
*/

/* First, hide a bunch of stuff we don't want to send to the customer */

#viewOriginalCell, #sellerBuyerRow, #orderSectionHeaderRow, #paymentSectionHeaderRow, #paymentDetailsRow, #crossReferenceWarning, #notesSectionHeaderRow, #notesDetailsRow {
    display: none;
}

.spacerRow, .itemImageCell {
    display: none;
}

/* Then, do some trickery with background images to replace the Etsy logo with our own */

#bannerRow a {
    display: block;
    padding-top: 150px; /* height of the image */
    overflow: hidden !important;
    height: 0px !important;
    background: url( 'http://www.etsyhacks.com/greasemonkey/printable_receipt_enhancer/images/acme.png' );
    background-repeat: no-repeat;
}

#bannerRow td {
    height: auto !important;
}

/* Change the grey bar with the Etsy order details into a white bar with a black border top and bottom */

#titleRow {
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
}

#titleRow td {
    background: none;
}

/* Get rid of the grey borders */

.greyBorder {
    border: none !important;
}

/* Indent the table of items a bit */
.itemTable {
    margin-left: 10px;
}

/* Reduce some of the wasted vertical space in the table of items */.

.itemSpacerCell2 {
    height: 30px !important;
}

/* And change the coloured text and links to black */

.green_text, .orange_text, a {
    color: #000000 !important;
}