/*
 Theme Name:   COINS
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Twenty Nineteen Child Theme
 Author:       Neil Cook
 Author URI:   http://example.com
 Template:     twentynineteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twentynineteenchild
*/
.coinsManageIncidents table.dataTable.order-column tbody tr>.sorting_1, 
.coinsManageIncidents table.dataTable.order-column tbody tr>.sorting_2, 
.coinsManageIncidents table.dataTable.order-column tbody tr>.sorting_3, 
.coinsManageIncidents table.dataTable.display tbody tr>.sorting_1, 
.coinsManageIncidents table.dataTable.display tbody tr>.sorting_2, 
.coinsManageIncidents table.dataTable.display tbody tr>.sorting_3 {
    background-color: black;
}
.ljmu {
    font-size: 1.5rem;
}
.coinsBigScreen {
    width:100%;
    height: auto;
}
#tblCoinsBigScreen tbody tr td,#tblCoinsBigScreenNested tbody tr td {
	word-break:keep-all;
}
.coinsManageScreens, .coinsManageScreens td, .DTE {
background-color: white;	
color:black;
}
body, td {
background-color: black;	
color:#ffee33;
}
.site-header, .site-footer, .skip-link, .dataTables_length, .dataTables_paginate {
display:none;
}
.coinsManageIncidents .dataTables_paginate {
    display:block;
}
.dtr-details {
    width: 100%;
}
.coinsWhite {
    color:white;
}
.coinsOrange {
    color:orange;
}
.coinsRed {
    color:red;
}
.coinsGreen {
    color:palegreen;;
}
.dataTables_scrollHeadInner table thead tr th.columnText {
    /* datatables headers must be white */
    color:grey;
  font-weight: normal;    
}
/* =================================

Header

==================================*/
.coinsMargin {
	margin-left: 0;
	margin-right: 0;
	max-width:100%
}
.coinsHeader {
    font-size:2em;
    color: white;
}
/* =================================

Datatable styling

==================================*/
table.dataTable thead th, table.dataTable tbody td {
    padding-right: 2px;
    padding-left: 8px;
}
.coinsManageScreens table.dataTable thead th, .coinsManageScreens table.dataTable tbody td {
    padding-right: 18px;
    padding-left: 18px;
}
.columnText {
	/*color: #ffee33; */
	font-size: 2em;
    vertical-align : top !important;
    border-top-width: 1px !important;
    border-top-style: solid !important;
    border-top-color: white !important;         
}
.diagramTd{
    vertical-align: top !important;
    border-top-width: 1px !important;
    border-top-style: solid !important;
    border-top-color: white !important;
}
th.dt-center, td.dt-center { text-align: center; }
.disruptionCellOuter {
    border: 0 !important;
   /* padding-left:15% !important; */    
}
.disruptionCell {
    background: rgba(255, 230, 230, 0.4);
    color:white;
    border: 0;
    padding:2%;
    line-height: 1.1em;
    font-size: 0.7em;   
}
.disruptionCellAssistance {
    background: rgba(226,87,64, 0.4);
    color:white;
    border: 0;
    padding:2%;
    line-height: 1.1em;
    font-size: 0.7em;   
}
/* =================================

SVG Journey Diagram

==================================*/
.svgDisplay {
    display:inline;
    
}
svg {
  transform: rotate(-0.5deg);
}
.svgNoDisplay {
    display:none;    
}
text{
	fill: white;
}
.stop{
	stroke: #dbdbdb;
	stroke-width:6;
}
.stop.current{
	stroke-width: 16;
	stroke: #ee7600;
}
.segment{
	/*stroke: #ffd700;*/
	stroke: #dbdbdb;
	stroke-width:6;
}
.segment-prev{
	stroke: #ff9922;
	stroke-width:6;stroke-dasharray:6;stroke-dashoffset:0;
}
.segment.passed{
	stroke-width:6;
}
.stop-name.passed text{
	fill: #ffee33;
}
.stop-name.current text{
	font-weight: bold;
	fill: #ff9922;
	/*fill: #4169e1;*/
}
.stop-name.last{
	font-weight:bold;
}
.stop-name text{
	fill: #ffee33;
	text-anchor: start;
	transform: translate(0,-1.5em) rotate(-24deg);
	 font-size: 1.4em;
	/* transform: rotate(-24deg);*/	
}
.stop-time.current text{
	/*font-weight:bold;*/
	/*fill: #4169e1;*/
}
.stop-time text{
	text-anchor: end;
	transform: translate(1.5em,1.8em) rotate(-24deg);
}
.train{
	fill: white;
	/*fill: #4169e1;*/
}
.journeyPartText {
    fill:palegreen;
    float:right;
    /*opacity: 0.5;*/
}
/***
 * footer styling
 ***/
.fixed-row-bottom { position: fixed; bottom: 0;}
/***
 * toc icon styling
 ***/
	.st0{fill:#00BF6F;}
	.st1{fill:#004C45;}
	.st2{fill:#75787B;}
	.st3{fill:#FF8200;}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/******************** 
 *    Modal Content/Box 
 ********************/
.modal-content {
  background-color: black;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}



/***
 * media queries
 ***/
@media (max-width: 991.98px) { 
.columnText, .coinsHeader, .col-sm-4 {
    font-size: 0.5em;
}
.coinsHeaderLeft span,.coinsHeaderRight span {
    display:block;
    padding-top:1px;
}

 } 
