@charset "utf-8";

/* hide the close button on the checkout-window dialog */
.no-close .ui-dialog-titlebar-close {
  display: none;
}

/* cart styling */
.cart {
	border-collapse: collapse;
	width: 100%;
	font-size: 12px;
}

.cart .qty {
	text-align: center;
}

.cart .price {
	width: auto;
	text-align: right;
	display: none;
}

.cart .itotal {
	width: 60px;
	text-align: right;
}

.cart .total {
	width: 60px;
	text-align: right;
	border-top: black double;
	font-size: 110%;
}

.cart .srow td {
	padding-top: 3px;
	padding-bottom: 2px;
	text-align: right;
}

.cart .srow .shead {
	font-weight: bold;
	text-align: right;
	padding-right: 5px;
}

.cart thead {
	background-color: #DDD;
}

.cart th {
	text-align: center !important;
}

.cart td {
	padding: 3px 3px;
	text-align: left;
}

.cart .ui-button-text {
	padding: .2em .5em;
}

.cart .ui-spinner-input {
	width: 22px;
}

.cart input {
	text-align: right;
}

@media (min-width: 450px) {
	.cart .price {
		display: table-cell;
	}
	
	.cart .srow .shl {
		visibility: hidden;
	}
	
	.ui-widget {
		font-size: 1.2em;
	}
}

@media (min-width: 630px) {
	.cart {
		font-size: 14px;
	}
	
	.cart .qty {
		width: 100px;
	}
	
	.cart .total, .cart .itotal {
		width: 80px;
	}
	
	.ui-widget {
		font-size: 1.3em;
	}
}

.address th {
	text-align: right;
	vertical-align: top;
	padding-right: 10px;
	padding-top: 10px;
}

.address td {
	padding-top: 10px;
}

/* ajax loading modal - prevent user clicking a button while we're doing something... */
#ajaxloading {
    display:    none;
    position:   absolute;
    z-index:    1000;
    background: rgba(255, 255, 255, .8)
                url('https://www.topnote.com.au/images/new-ajax-loader.gif')
                no-repeat;
}

/* When the body has the loading class, we turn the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our modal element will be visible */
body.loading #ajaxloading {
    display: block;
}