@charset "utf-8";

/*
	==============================================
		General elements
	==============================================
	*/

table {
    margin: 0;
    caption-side: top;
    empty-cells: hide;
    margin-bottom: 1.6em;
    width: 100%;
}

caption {
    padding-bottom: .5em;
    font-style: italic;
    text-align: right;
}

/*
    ==============================================
        Cells
    ==============================================
    */

th {
    background-color: #1686a8;
    font-weight: bold;
    color: #fff;
    text-align: left;
    padding: 3px 8px 8px 8px;
}

td {
    border: 1px solid #fff;
    border-top-width: 0;
    background-color: #fff;
    padding: .6em .2em;
    color: #333;
}

.main_content table th {
    border: 2px solid #fff;
}

.main_content table tr.even td {
    background-color: #def1fa;
}

.dataTables_info{
    padding-bottom: 15px;
}

.paginate_button{
    padding: 0 5px 0 0;
    text-decoration: underline;
}

.paginate_active{
    padding: 0 5px 0 0;
}

.paginate_button:hover{
    cursor: pointer;
}

@media screen and (max-width: 769px)  {
	
	#jobresults, #mypublicjobs table.data 
	{
		width: 100%;
		font-size: 1.0em;				
	}
	
	#jobresults  thead tr, #mypublicjobs .data thead tr {
		display: none;
		border: none;
	}
	
	#jobresults  tbody tr, #mypublicjobs .data tbody tr {
		display: block;		 
		border-top: 1px solid #828485;	        
	}
	
	#jobresults  tbody tr th, #mypublicjobs .data  tbody tr th {
		display: none;	
	}
	
	#jobresults  tbody tr td , #mypublicjobs .data tbody tr td{
		display: block; 
	    border: none;
	    border-bottom: 1px solid #E1E1E1;	
	    border-left: 1px solid #828485;
	    border-right: 1px solid #828485;
	    padding-left: 10px;			
	    min-height: 20px;
	}	
	
	#jobresults  tbody tr td:nth-child(1)
	{
		font-size: 1.1em;
		font-weight: bold;
	}
	
	#jobresults  tbody tr td:nth-child(3), #mypublicjobs .data tbody tr td:nth-last-child(1)
	{
		border-bottom: 1px solid #828485;
		margin-bottom: 10px; 
	}
	
	#jobresults  tbody tr td:nth-child(1n+4)
	{
		display: none;
	}
	
	.paginate_button{
    	border: 1px solid #000000;
		padding: 5px;
		text-decoration: none !important;
		margin-right: 10px;    	 	
	}
	
	.paginate_active{
	    margin-right: 10px;
	}
	
	.paginate_button:hover{
	    cursor: pointer;
	}
	
	.dataTables_paginate , .pagelinks{
		font-size: 1.3em;
		margin-bottom: 25px;
	}
	
	.pagelinks a
	{
		border: 1px solid #6C9240;
		padding: 5px;
		margin-right: 5px;    	 	
		text-decoration: none !important;
	}
}	

@media screen and (min-width: 500px) and (max-width: 769px)  {
	
	#jobresults  tbody tr td, #mypublicjobs table.data  {
		position: relative;
		padding-left: 20%;			 	
	}
	
	#jobresults  tbody tr td:before { 
		/* Now like a table header */
		position:absolute;
		/* Top/left values mimic padding */ 
		top: 0;
		bottom:0;
		left: 0;
		width: 15%;
		font-weight: bold;
		color: #fff;
		background-color: #1686A8;		
		padding-left: 20px;		
		padding-top: 10px;
		vertical-align: -50%;
		display: table-cell;	
	}
	
	/*
	Label the data
	*/
	#jobresults td:nth-of-type(1):before { content: "Position"; }
	#jobresults td:nth-of-type(2):before { content: "Location"; }
	#jobresults td:nth-of-type(3):before { content: "Employer"; }
	
	/*table td:nth-of-type(1):before { content: "Column1"; }
	table td:nth-of-type(2):before { content: "Column2"; }
	table td:nth-of-type(3):before { content: "Column3"; }*/
	
}