/* table CSS - this is currently specific since the site uses tables instead of divs */
.headlines-table {
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 12px;
	border-collapse: collapse;
}

.headlines-table thead {
	background-color: #ccc;
	font-weight: bolder;
}

.headlines-table thead th,
.headlines-table td {
	text-align: center;
}

.headlines-table tr:nth-child(even) td {
	text-align: left;
}

.table-striped.headlines-table > tbody > tr:nth-child(odd) > td {
	background-color: #cad5e5;
}

.table-striped.headlines-table > tbody > tr:nth-child(even) > td {
	background-color: none;
}

/* Special styles applied to the headlines table to hide some columns on smaller screens*/
@media (max-width: 767px) {
	.table.headlines-table > thead > tr > th,
	.table.headlines-table > tbody > tr > td {
		white-space: normal;
	}

	.table.headlines-table img {
		width: 100px;
	}

	.table.headlines-table th:not(.required),
	.table.headlines-table td:not(.required) {
        display:none;
        width:0;
        height:0;
        opacity:0;
        visibility: collapse;
	}

	.table.headlines-table.responsive thead {
		display: none;
	}

	.table.headlines-table.responsive td.required {
		display: block;
		text-align: left;
	}

	.table.headlines-table.responsive td:before {
		content: attr(data-label);
		display: block;
		text-transform: uppercase;
		font-weight: bold;
	}
}
