/* 
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: 700px) {
    /* Force table to not be like tables anymore */
    table,
    thead,
    tbody,
    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 #dadada;
    }
    td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        
        font-size: 14px;
    }
    td::before {
        /* 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-size: 12px;
        font-weight: 600;
    }
	
	.account-align {
		text-align: left;
	}
    
    /* Case History Screen*/
    td.casehist-id:before {
        content: "Reference";
    }
    td.casehist-created:before {
        content: "Raised";
    }
    td.casehist-description:before {
        content: "Description";
    }
    td.casehist-state:before {
        
        content: "Status";
    }
    td.casehist-modified:before {
        content: "Last Updated";
    }
	/* Case History Screen - END*/
	
	/*Transaction History Screen*/
    td.transHistory-Date:before {
        content: "Date";
    }
	td.transHistory-Type:before {
        content: "Type";
    }
	td.transHistory-Payments:before {
        content: "Payments";
    }
	td.transHistory-Charges:before {
        content: "Charges";
    }
	td.transHistory-Balance:before {
        content: "Balance";
    }
    /*Transaction History Screen-End*/
	
	/*Repairs History Screen*/
    td.repairHistory-Reference:before {
        content: "Reference";
    }
	td.repairHistory-Type:before {
        content: "Type";
    }
	td.repairHistory-Description:before {
        content: "Description";
    }
	td.repairHistory-Status:before {
        content: "Status";
    }
	td.repairHistory-Completed:before {
        content: "Date Completed";
    }
    /*Repairs History Screen-End*/
	
	/*My Details Screen*/
	td.custDetails-name:before {
		content: "Name";
	}
	td.custDetails-type:before {
		content: "Type";
	}
	td.custDetails-expiry:before {
		content: "Expiry Date";
	}
	/*My Details Screen-End*/
	
	/*Pre Payment Summary Screen*/
	td.prepay-account:before {
		content: "Account";
	}
	td.prepay-reference:before {
		content: "Reference";
	}
	td.prepay-amount:before {
		content: "Amount";
	}
	/*Pre Payment Summary Screen-End*/
	
	/*Repairs - Open Repairs*/
	td.openrepair-reference:before {
		content: "Reference";
	}
	td.openrepair-description:before {
		content: "Description";
	}
	td.openrepair-status:before {
		content: "Status";
	}
	td.openrepair-datereq:before {
		content: "Date Requested";
	}
	/*End of Repairs - Open Repairs*/
	
	/* GoMobile - State History*/
	td.gm-statehistory-state:before {
		content: "State";
	}
	td.gm-statehistory-entered:before {
		content: "Entered";
	}
	td.gm-statehistory-duration:before {
		content: "Duration";
	}
	/* End of GoMobile - State History*/
	
	/* GoMobile - Action History*/
	td.gm-actionhistory-name:before {
		content: "Action";
	}
	td.gm-actionhistory-user:before {
		content: "Completed by";
	}
	td.gm-actionhistory-date:before {
		content: "Date";
	}
    /* End of GoMobile - Action History*/
    
    /* GoMobile - Attachments */
	td.gm-attachment-filename:before {
		content: "Filename";
	}
	td.gm-attachment-user:before {
		content: "Attached by";
	}
	td.gm-attachment-date:before {
		content: "Date attached";
    }
	/* End of GoMobile - Attachments */
	
	/* Nets Table Styling */
	td.nets-service-column:before {
		content: "Service";
	}
	td.nets-scheduled-column:before {
		content: "Scheduled";
	}
	td.nets-status-column:before {
		content: "Status";
	}	
	td.nets-reference-column:before {
		content: "Reference";
	}
	/* End of Nets Table Styling */
}