/*
	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)*/ 
    all and (max-width: 528px)
     {
        
		/* Force table to not be like tables anymore */
		table, thead, tbody, th, td, tr {
			display:  block;            
            font-size:12px;
            width:100%;            
            word-wrap:break-word;
            empty-cells:hide;
            border-collapse: separate;            
            
		}
        

		
	}
    @media all and (max-width:750px){
        body{
            font-size:11px;            
        }
        td {             
            word-wrap:break-word;
			overflow-wrap:break-word;
            
		}		 
		table{
			table-layout: fixed; 
		}
    }
    @media only screen (max-width: 760px), (min-device-width: 768px){
        body{
            font-size:12px
        }
    }