/* 
Generic Styling, for Desktops/Laptops 
*/
table { 
  width: 100%; 
  border-collapse: collapse; 
}
/* Zebra striping */
th { 
  font-weight: bold; 
}
td, th { 
  padding: 6px; 
  text-align: left; 
}

td .labelResponsive, tr .labelResponsive {
	display: none;
}

th.templateSelection input,
th.templateSelection label {
	text-align: left;
	margin-left: 1rem;
}

.table-responsive>.table.application>tbody>tr>td {
	white-space: initial;
}

.table.application>tbody>tr>td, 
.table.application>tbody>tr>th, 
.table.application>tfoot>tr>td,
.table.application>tfoot>tr>th, 
.table.application>thead>tr>td, 
.table>thead>tr>th {
    padding: 8px;
    line-height: initial;
    vertical-align: middle;
}

/* table styling */

table#service caption, table#connecting caption {
	font-family: sans-serif !important;
	font-weight: 700 !important;
	font-size: 155% !important;
	line-height: 150% !important;
	vertical-align: bottom !important;
	color: #555555 !important;
	text-align: left !important;
	background-color: #ffffff !important;
}

table#service caption, table#connecting caption {
	border: none;
}

table#service th, table#connecting th {
	padding: 6px !important;
	background-color: #666666;
	color: #ffffff;
	font-weight: 100;
}

table#service td, table#connecting td {
	padding: 4px !important;
}


/* Table pagination styling */

.tableWidth65 {
	width: 65%;
}

table.lined th, table.lined td {
	border-style: none;
}

table th, table td {
	border-style: none;
	padding: 2px;
}

div.center div.vnavNextPreviousLink a:visited:hover, div.center div.vnavNextPreviousLink a:hover,
	div.center div.vnavNextPreviousLink a:active, div.center div.vnavNextPreviousLink a:visited:hover,
	div.center div.vnavNextPreviousLink a:hover, div.center div.vnavNextPreviousLink a:active
	{
	color: #CC0000;
}

span.vnavCurrent {
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #DDDDDD;
	color: #000000;
	font-weight: bold;
	height: 100px;
	padding: 2px 8px;
	vertical-align: top;
}

.wet-boew-zebra.rowzebra tbody tr:nth-child(2n) {
	background-color: #eeeeee;
}

.filterLabel { display:block; }


/* Mobile and tablets */
@media (max-width: 320px) {

	.table-responsive>.table.application>tbody>tr>td, 
	.table-responsive>.table.application>tbody>tr>th, 
	.table-responsive>.table.application>tfoot>tr>td, 
	.table-responsive>.table.application>tfoot>tr>th, 
	.table-responsive>.table.application>thead>tr>td, 
	.table-responsive>.table.application>thead>tr>th {
	    white-space: normal!important;
	}
	
}

/* Small screens and desktops */
@media (max-width: 991px) {
	
	/* Force table to not be like tables anymore */
	table.application, 
	table.application thead, 
	table.application tbody, 
	table.application th, 
	table.application td, 
	table.application tr { 
		display: block; 
	}

	table.application thead tr th {
	    display: none;
	}
	
	table.application thead tr .selectingDeselecting {
	    display: block;
	}
	
	table.application thead tr th.selectingDeselecting {
		border: 2px solid #ffffff;
	}
	
	table.application tr { border: 1px solid #ccc; }
	
	table.application td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
		text-align: left;
	}
	
	table.application tfoot {
		display:none;
	}
	
	table.application caption {
		text-align: left;
	}
	
	table.application td:last-child,
	table.application td:first-child {
		text-align: left;
	}

	table.application td:before { 
		/* Now like a table header */
		position: initial;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: auto; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	table.application td .labelResponsive,
	table.application tr .labelResponsive {
		display: inline-block;
	    color: #000;
	    font-size: inherit;
	    border: none;
	    padding: 0;
	}
	
	table.application td.labelResponsive {
		display: inline-block;
	    color: #000;
	    font-size: inherit;
	    border: none;
	    padding: 1rem;
	}
	
	th.templateSelection input,
	th.templateSelection label {
		text-align: left;
		margin-left: 0;
	}
	
	.table-responsive>.table.application>caption {
		display: block;
	}
	
}