.Data_List { 
  width: 100%; 
  max-width:100%;
  border-collapse: collapse;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; 
  font-size:12px;
  margin-top:10px;
}
/* Zebra striping */
.Data_List tr:nth-of-type(odd) { 
}
.Data_List th { 
}
.Data_List td {
}
.Data_List th { 
}
/* 
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: 940px),(min-device-width: 508px) and (max-device-width: 1024px)  {
	/* Force table to not be like tables anymore */
	.Data_List table, .Data_List thead, .Data_List tbody, .Data_List th, .Data_List td, .Data_List tr { 
		display: block;
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	.Data_List thead tr { 
		position: absolute !important;
		top: -9999px;
		left: -9999px;
	}
	
	.Data_List { 
	  width: 98%; 
	}
	
	.Data_List2 { 
	  width: 98%; 
	}
	
	.Data_List tr { border: 1px solid #DDDDDD !important; float:left; width:100%; }
	
	.Data_List td { 
		/* Behave  like a "row" */
		border: none !important;
		border-bottom: 1px solid #DDDDDD !important; 
		position: relative !important;
		padding-left: 38% !important;
		width:100% !important;
		max-width:100% !important;
		float:left;
		text-align:left !important;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	.Data_List td:before { 
		/* Now like a table header */
		position: absolute !important;
		/* Top/left values mimic padding */
		top: 8px !important;
		left: 6px !important;
		width: 30% !important; 
		padding-right: 10px !important;
		white-space: nowrap !important;
		height:25px !important;
		text-align:left;
	}
	.right
	{
		text-align:left !important;
	}

	/* Force table to not be like tables anymore */
	.Data_List1 table, .Data_List1 thead, .Data_List1 tbody, .Data_List1 th, .Data_List1 td, .Data_List1 tr { 
		display: block;
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	.Data_List1 thead tr { 
		position: absolute !important;
		top: -9999px;
		left: -9999px;
	}
	
	.Data_List1 { 
	  width: 100%; 
	}
	
	.Data_List1 tr { border: 1px solid #DDDDDD !important; float:left; width:100%; }
	
	.Data_List1 td { 
		/* Behave  like a "row" */
		border: none !important;
		border-bottom: 1px solid #DDDDDD !important; 
		position: relative !important;
		/*padding-left: 38% !important;*/
		width:100% !important;
		max-width:100% !important;
		float:left;
		text-align:left !important;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	.Data_List1 td:before { 
		/* Now like a table header */
		position: absolute !important;
		/* Top/left values mimic padding */
		top: 8px !important;
		left: 6px !important;
		width: 30% !important; 
		padding-right: 10px !important;
		white-space: nowrap !important;
		height:25px !important;
		text-align:left;
	}
}
@media only screen and (max-width: 500px),(min-device-width: 508px) and (max-device-width: 1024px)  {
}