/* styling for index.html */
html, body {
    overflow: hidden;
    /*overflow: auto;
	-webkit-overflow-scrolling: touch;*/
}

#td_map {
    width: 100%;
    height: 100%;
    background-color: #000000;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

#chooseMap {
    height: 100%;
    width: 100%;
    max-width: 800px !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/*screen resize necessity*/ 
.ui-content, .ui-header, ui-bar-a {
    min-width: 100% !important;
    max-width: 100% !important;
}

/*Display DataPopups correctly  #popupSchedule,*/
#popupSchedule, #scheduleDetailsContainer, #stockDetailsContainer, #crewDetailsContainer, #alertDetailsContainer   {
    min-width: 100% !important;
    max-width: 100% !important;  
}

#stickyHeader {
    position: sticky;
    top: 0;
}

#choose_map_header {
    max-width: 800px;
}

.map_link_shape	{
    opacity: 0.6;
}

#choosemap_content {
    max-height: 300px !important;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

#chooseMap, #choosemap_content, #choose_map_header  {
   min-width: 100% !important;
   max-width: 90% !important;
}

#allMapsContainer {
    max-width: 800px;
}

.ui-listview, .ui-listview-filter {
    margin: 0 !important;
    padding: 0 !important;
    list-style-type: square;
}

#popupSchedule .ui-content {
    overflow: hidden;
}

#popupSchedule .ui-header {
    text-align: center;
    font-size: medium;
    padding-bottom: 5px;
    padding-top: 5px;
}

#find_results_list  {
    overflow-y:scroll;
    max-height: 400px;
}


.info_table_style {
    width: 100%;
    font-size: small;
    border-collapse:collapse !important;
    border-style:solid !important;
    border: 0.5px !important;
    border-color: lightgrey !important;
}

.schedule_row {
    height: 30px;
}

.schedule_row_retina {
    height: 20px;
}

.ui-popup .ui-content {
    overflow: auto;
}

.green_text {
    font-weight: bold;
    color: #00CC00 !important;
}

.red_text {
    font-weight: bold;
    color: #FF0000 !important;
}

#extra_options {
    top: 0px;
}

#search_maps {
    overflow: auto;
   margin-bottom: 10px;
}

#optionsContent, #changePwdContent {
/*    max-width: 480px !important;*/
    max-height: 480px !important;
    position: center;
}

#viewContainer, #optionsFilter, #optionsTOC, #pwdViewContainer {
    margin: 40px;
    min-width: 300px;
    max-width: 380px;
}

#latenessIntervals .ui-li {
    margin-left: 10px;
    margin-right: 10px;
}

#lateness_title_cell {
    padding-left: 10px;
}

#add_button_cell {
    width: 100px;
    padding-right: 10px;
}

.intervalSquare {
    width: 50px;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
}

.intervalMinMaxTBs .ui-input-text {
    width: 70px;
    text-align: right;
}

.example_square {
    height: 100%;
    width: 100%;
    padding: 10%;
    border: .1em solid #FFFFFF;
}

.ui-popup .ui-content {
    overflow: hidden;
}

.schedule_time {
    text-align: center;
}

.schedule_runningline {
    text-align: center;
}

.schedule_platform {
    text-align: center;
}

#adj_maps {
    font-size: small;
}

#adj_maps table, td, tr, thead, tfoot, tbody, th, tf {
    border-collapse: collapse;
    margin: 0px;
    padding: 0px;
}

.adj_map a {
    margin-left: 10px;
}

#last_updated {
    position:relative;
    top: 50%;
    transform: translateY(-50%);
    font-size: small;
    text-align:center
}

#toggle_updates {
    width: auto;
    text-align: right;
}

#stock_header {
    text-align: center;
}

.stock_titles, .crew_titles {
    font-weight: bold;
    font-size: medium;
    /*margin-left: 10px;*/
    margin-top: 10px;
}

.alert_title {
    font-weight: bold;
    font-size: medium;
    margin-top: 10px;
}

.alerts_incident {
    width: 5%;
}

.alerts_description {
    width: 75%
}

.stock_expander_headers, .crew_expander_headers {
    font-weight: normal;
    font-size: small;
}

.stock_expander_headers {
    margin-top: 8px;
    margin-bottom: 8px;
}

.stock_expander_set, .crew_expander_set {
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 5px;
    margin-bottom: 10px;
}

table.crew_expander_headers td {
    padding-left: 10px;
}

#no_stock_avail, #no_crew_avail, #no_alerts, #optionsFav {
    margin: 10px;
}

#chooseMap .ui-li .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li {
    height: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.crew_working_headers {
    font-size: small;
    margin-left: 10px;
    margin-top: 10px
}


#scheduleDetailsContainer, #crewDetailsContainer, #stockDetailsContainer, #alertsDetailsContainer {
    max-height: 350px !important;
    overflow: scroll;
    min-height: 350px !important;
}

#crewDetails, #scheduleDetails, #stockDetails {
    padding-bottom: 10px;
}
  
    #mouse_pointer_overlay {
        fill: none;
        pointer-events: all;
    }

.mouse_events {
    pointer-events: all;
}

#display_find_button.ui-btn-icon-notext {
    width: 31px;
    height: 31px;
}

.dialog_buttons {
    text-align: center;
}

#logoutPopup {
	position: center;
    min-width: 50%;
    max-width: 200px !important;
    text-align: center;
    border: 1px solid black;
	padding: 18px;
}

#tracking_train_row {
/*    background-color: #5893BE;
    text-align: center;*/
}

.map_link_shape {
    background: linear-gradient(#444, #2d2d2d) repeat scroll 0 0 #333;
}

.ui-dialog-contain {
    width: 92.5%;
    max-width: 1200px;
    margin: 10% auto 15px auto;
    padding: 0;
    position: relative;
    top: -15px;
}

.train_list_row {
    padding: 4px;
    text-align: center;
}

#stationDetailsContainer, #platformDetailsContainer {
    overflow: auto;
}

#train_list_title_table {
    width: 300px;
    text-align: center;
    margin: 0px auto;
}

#suspendTrackButton {
    margin-left: 10px;
    margin-right: 10px;
}

.favourite_maps_fieldset .ui-controlgroup-controls, #optionsFilter .ui-controlgroup-controls {
    width: 96%;
    margin-left: 2%;
    margin-right: 2%;
}

.favourite_maps_fieldset .ui-checkbox {
    width: 25%;
}

#optionsFilter .ui-checkbox {
    width: 10%;
}

#favContainer, #filterContainer {
    height: 80%;
    overflow: auto;
}

#fav_maps_title {
    margin: 10px;
}

#header {
    width: 100%;
    font-size: 10px;
    text-align: center;
}

.modalButton {
    margin:5px 5px 5px 5px;
}

.modalHeader {
    margin:5px 0 5px 0;
}

.logoutBtn {
   width:min-content;
}

#schedule_header {
    padding-bottom: 10px;
}

.changePasswordButton{
    z-index:99 !important;
    padding:5px;
    position: absolute !important;
}