/* 
	Generic Styling, for Desktops/Laptops 
	*/
	
	/* 
	Hide the logo on the orders page but show it in the print.css file
	*/
	.hidelogo {
		display:none;
	}
	table.cart { 
		width: 100%; 
		border-collapse: collapse; 
	}
	table.cart th { 
		background: #333; 
		color: white; 
		font-weight: bold; 
	}
	table.cart td, table.cart th { 
		padding: 6px; 
		border: 1px solid #ccc; 
		text-align: left; 
	}
	table.cart table p{ 
		margin:0px;
		padding:0px;
		font-size:14px;
	}
	table.cart h4{ 
		margin:0px;
		padding:0px;
		font-size:16px;
		margin-bottom:5px;
	}
	table.cart .product-img{ 
		width: 120px;
	}
	table.cart .prices{ 
		width: 120px;
		text-align:center
	}
	table.cart .qty{ 
		text-align:right;
		width:140px;
		padding-top:7px !important;
		padding-bottom:10px !important;
	}
	
	table.cart .qty .input-group input{
		text-align:center;
		margin:0px;
		height:30px;
		width:60px !important;
		padding:0px;
		float:right;
		border:1px solid #ddd
	}

	table.cart .qty .input-group-btn .btn-group-actions{ 
		margin-top:0px;
		border-bottom:none;
		padding:0px;
		padding-left:10px;
		padding-right:10px;
		height:30px;
	}

	table.cart #clear{ 
		padding-top:1px;
	}
	
	table.cart .no-top-border{ 
		border-top:none;
	}
	
	table.cart .table-footer { 
		text-align:right;
	}
	
	table.cart .table-footer-total { 
		width: 110px;
		display:inline-block;
		text-align:center;
		font-weight:bold;
	}
	
	table.cart .discount { 
		padding-right:5px;
	}
	
	table.cart .subtotal {
		background:#f1f1f1;
	}
	table.cart .subtotal:hover {
		background:#f1f1f1 !important;
	}
	
	.popover-content {
		max-width:280px;
		padding:10px 10px 0px 10px;
	}
	.popover-content button{
		width:80px;
	}
	
	#order-summary p {
		margin:0px;
		line-height:30px;
		float:left;
		margin-left:20px;
		font-size:14px;
		border-bottom:1px dashed #ddd;
		width:100%;
		padding:0px 10px
	}
	
	#order-summary p:last-of-type {
		border-bottom:none;
	}
	
	#order-summary p span.summary-item {
		float:left;
		overflow:hidden;
	}
		
	#order-summary p span.summary-right {
		float:right;
		font-weight:bold;
	}
	
	.ordertotal p{
		font-weight:bold;
		font-size:20px !important;
		padding-top:10px !important;
	}
	
	.checkoutfooter {
		height:80px; 
		position:relative;
		font-weight:bold;
	}
	
	p#secure{
		color:#999;
		line-height:16px;
		margin-left:0px !important;
		font-size:13px;
		position:absolute;
		left:0px;
		top:10px
	}
		
	.checkoutfooter img{
		position:absolute;
		bottom:10px;
		right:15px;
	}
	
	.invoice-info h4{
		border-bottom: 1px dashed #ccc;
		padding-bottom:4px;
	}
	.invoice-info p{
		font-size:14px;
	}
	.invoice-info p span{
		font-weight:bold;
		display:inline-block;
		width:90px;
	}

	/*
	Max width before this PARTICULAR table gets nasty
	This query will take effect for any screen smaller than 760px
	and also iPads specifically.
	*/
	@media
	only screen and (max-width: 760px),
	(min-device-width: 768px) and (max-device-width: 1024px)  {

		/* Force table to not be like tables anymore */
		table, thead, tbody, tfoot, th, td, tr {
			display: block;
		}

		/* Hide table headers (but not display: none;, for accessibility) */
		thead tr {
			position: absolute;
			top: -9999px;
			left: -9999px;
		}

		tr { 
			border: 1px solid #ccc; 
			margin-bottom:10px;
			}
			
		tfoot tr { 
			border: 1px solid #ccc; 
			margin-bottom:0px;
			}

		td {
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #eee;
			position: relative;
			padding-left: 30%;
		}
		
		table.cart .product-img{ 
			width: 100%;
			padding-left: 6px;
			border-bottom:none;
		}
		
		table.cart .product-item{ 
			width: 100%;
			padding-left: 6px;
		}
		
		table.cart .prices{ 
			width: 100%;
			text-align:right;
			padding-right:20px;
		}
		
		table.cart .qty{ 
			text-align:right;
			width:auto;
			vertical-align:middle;
			padding:12px 20px 0px 0px;
		}

		table td:before {
		  content: attr(data-label);
		  /* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%;
			padding-right: 10px;
			white-space: nowrap;
			font-weight:bold;
			text-align:left;
		}
		
		table.cart .product td:before{ 
			content: "";
			width:0px !important;
		}
		
		table.cart td.qty:before{ 
			top: 16px;
		}
		
		table.cart .table-footer-total { 
			width: 110px;
			text-align:right;
			padding-right:14px;
		}
		
		table.cart .discount { 
			padding-right:14px;
		}
		
		table.cart .hd{ 
			display:none;
		}
		
		#order-summary {
			margin-top:30px;
		}

	}
	
	@media
	only screen and (max-width: 410px),
	{
	#order-summary p span.summary-item {
		float:left;
		max-width:155px;
		height:30px;
		overflow:hidden;
		}
	}