Hi Guys,

Looking at previous posts here, I've tried overriding the @media print settings to get some custom CSS applied to tables but it still renders with transparent background.

My code:

   <?php
				 //Basic headers - choose what charts you want to include.
				 
                 use \koolreport\widgets\koolphp\Table;
				 use \koolreport\widgets\google\PieChart;
				 use \koolreport\widgets\google\BarChart;
                 use \koolreport\widgets\google\ColumnChart;  
                 use \koolreport\clients\Bootstrap; 



                 ?>
				 
				 <!-- Change page title, page styling here -->
                 <html>
                 <head>
                     <meta charset="utf-8" />
                     <meta http-equiv="X-UA-Compatible" content="IE=edge">
                     <title>Shift Report</title>
                     <meta name="viewport" content="width=device-width, initial-scale=1">
                 </head>
                 <body>
                 <h1 class ="title"> Shift Report </h1></br></br>
				 <img src = "http://dev.maxdev.co.uk/koolreport/menulogob@3x.png" class = "logo img-fluid" width = "200px" height = "200px">
                   <div class = "container-fluid">
                 <style> 
				 
				.cssHeader
				{
				background-color:#e9ffe8;
				}
				.cssItem
				{
				background-color:#fdffe8;
				}
                 
                 .body {       
                 
                    font-family: 'Raleway', sans-serif;
                 }
                 
                 @media print
				{
				
					
					background-color: #2392B4 !important;
					
				} 

                    .table-striped > tbody > tr:nth-of-type(odd) > td {
                        background-color: #2392B4 !important;
                }
				
                 .tablecustom td:nth-child(1) {
                    
                     background-color:#3A6BB4;
					 font-weight: bold;
					 color: white;
                    
                }
               
                 
                .title {
                text-align: center;
                font-weight: bold;
                }
          
            
                    @media screen and (max-width: 360px) {
                             h1{
                          font-size:14px;
                      }
                    }
                
                </style>
				
				<!-- This is where data charts should go below the php tag --> 
                   
                     <?php
					 
			Table::create(['dataSource' => resultset1, 'cssClass' => ["th" => "cssHeader", "td" => "cssItem", "tbody" => "tablecustom"], 'columns' => ['PayrollCode', 'Title', 'Forename', 'Surname', 'Jobrole', 'ActualCost', 'SiteCode', 'AssignmentDate', 'DayOfWeek', 'StartTime', 'EndTime']]);		
					 		
                     ?>       
                   </div>
            <div class="page-footer" style="text-align:center; font-size:0.5em;">{pageNum}/{numPages}</div>
                 </body>
                 </html>

Any help would be appreciated. Thanks.