/*----Responsive table custom css----*/

#prices table.cart th, #prices table.cart td, #prices table.cart tr, #prices table tr, #prices table td, #prices table th { max-width: 100%; }


/* Zebra striping */
#prices .tallinn tr:nth-of-type(odd) { 
  background: #F6DFE8 !important; 
}

#prices .tartu tr:nth-of-type(odd) { 
  background: #F2F7FD !important; 
}

#prices td, #prices th { 
  padding: 6px !important; 

  text-align: left ; 
}

/* 
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 */
	#prices table, #prices thead, #prices tbody, #prices th, #prices td, #prices tr { 
		display: block !important; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	#prices thead tr { 
		position: absolute !important;
		top: -9999px !important;
		left: -9999px !important;
	}
	
#prices tr { border: 1px solid #ccc !important; }
#prices td, #prices th { 
  border: none !important; 
  text-align: center !important; 
}

		
	#prices td:before { 
		/* Now like a table header */
		position: absolute !important;
		/* Top/left values mimic padding */
		top: 6px !important;
		left: 6px !important;
		width: 45% !important; 
		padding-right: 10px !important; 
		white-space: nowrap !important;
	}
}