@import url(style-fpl-all.css) all;
@import url(style-fpl-print.css) print;

html {
    overflow:-moz-scrollbars-vertical; 
    overflow-y:scroll;
    max-width:100%;
	overflow-x:hidden;
}
h1,h2,h3{margin:0;}
h2{margin-bottom:14px;}
body {
	font-family:arial,sans-serif;
	font-size:14px;
	margin:0;
	background:#444;
	text-align:center;
}

.container,
div#page{
	background:#f6f8f6;
	padding-top:22px;
	padding-bottom:22px;
	text-align:center;
}

a {
	color:#2351B8;
	cursor:pointer;
}

a:hover{color:#709dff;}

div#page_header {
	text-align:left;
	padding:8px 0 6px 9px;
	border-bottom:2px solid #cadffb;
	color:#444452;
	background:#ffffff;
}

ul {
    list-style-type: none;
    padding-left:0;
    margin:0;
}
form#flight_data label,
div.label{
	text-align:left;
	display:inline-block;
	width:70px;
}

footer{
	font-size:12px;
	color:#666;
}

form{line-height:1.8;}

div#dashboard div.elem{
	display:inline-block;
	border:1px solid #aaa;
	width:400px;
	height:250px;
	margin:0 20px;
}

div#dashboard div.elem h2{
	margin:0;
	padding:0;
	font-size:18px;
	display:block;
	text-align:left;
}


div#dashboard div#flights ul{
	padding:0;
	margin:0;
	vertical-align:top;
}
div#dashboard div#flights ul li{list-style:none;}
div#dashboard div#flights ul>li>div{
	display:inline-block;
}

ul#menu_main{
	max-width:100%;
	box-sizing:border-box;
	border-top:1px solid #e3e6ea;
	border-bottom:1px solid #e3e6ea;
	background:#3f3f3f;          /* your dark bar */
	margin:0;
	padding:10px 12px;
	list-style:none;

	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:8px;
}

ul#menu_main li{
  margin:0;
  background:none;
  border:none;
}

ul#menu_main li a{
  display:inline-block;
  padding:6px 12px;
  border-radius:8px;
  background:#f3f6f8;
  color:#222;
  text-decoration:none;
  white-space:nowrap;
}

ul#menu_main li a:hover{
  background:#e0f2ff;
}

ul#menu_main li.active a{
  background:#003049;
  color:#fff;
  font-weight:600;
}

/* hamburger default hidden */
ul#menu_main li.icon{ display:none; }

/* mobile behavior */
@media (max-width: 700px){
  ul#menu_main{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none; /* Firefox */
  }

  ul#menu_main::-webkit-scrollbar{ display:none; height:0; } /* WebKit */

  ul#menu_main li{ flex:0 0 auto; }

  /* if you want hamburger on mobile */
  ul#menu_main li.icon{ display:inline-block; }
}



form#flight_data{
    border-radius:10px;
	width:300px;
	margin:0 auto;
	border:1px solid #aaa;
	text-align:left;
	padding:8px 0;
	position:fixed;
	top:90px;
	right:0px;
	background:#eee;
	z-index:100;
}
#quick_settings {
	margin:20px;
    border:2px solid #f00;
}
#quick_settings form{
    border:1px solid #aaa;
}
#quick_settings input[name="wind_dir"],
#quick_settings input[name="wind_spd"]{
    width:40px;
    text-align:center;
}


/**
 * Login
 */
div.login_box.loggedout {
	margin:30px auto 0 auto;
}

div.login_box.loggedin {width:280px;position:absolute;right:12px;top:0;text-align:right;}

div.login_box.loggedin div{text-align:center;}


div.login_box.loggedout form#login_form{
	padding:10px 10px 4px 10px;
	border:1px solid #cadffb;
	text-align:center;
    margin:0 auto;
    display:inline-block;
    background:#bdf3dc;
    border-radius:8px;
}
div.login_box.loggedout form#login_form>div{padding:6px 0px;}

div.login_box.loggedin form#login_form .user,
div.login_box.loggedin form#login_form img.logout{display:inline-block;}
div.login_box.loggedin form#login_form .user{margin-left:10px;}
div.login_box.loggedin form#login_form .manage{margin-left:12px;}
div.login_box.loggedin form#login_form img.logout{margin-left:12px;}
div.login_box.loggedin .airline{display:inline-block;}

/*
div.login_box.loggedout form#login_form input{text-align:center;}
div.login_box.loggedin form#login_form input{text-align:center;}
*/
div.login_box.loggedin form#login_form input[type="submit"]{font-size:11px;}


form#user_data{
	text-align:left;
	vertical-align:top;
	display:inline-block;
	margin-right:50px;
}

form#user_data label{
	display:inline-block;
	width:100px;
}

#flights .header>div,
#flights .data>div,
#flights .totalizer>div{display:inline-block;}

#flights .col_flight_number,
#flights .col_deice,
#flights .col_blkoff,
#flights .col_to,
#flights .col_ldg,
#flights .col_blkon,
#flights .col_ft,
#flights .col_bt,
#flights .col_night,
#flights .col_refuel,
#flights .col_fuel_dep,
#flights .col_fuel_arr,
#flights .col_fuel_used,
#flights .col_pax_m,
#flights .col_pax_f,
#flights .col_pax_c,
#flights .col_pax_i,
#flights .col_ck,
#flights .col_hl,
#flights .col_remarks{width:58px;}

#flights .col_flight_number{width:64px;}
#flights .col_deice{width:42px;}
#flights .col_night{width:38px;}
#flights .col_blkoff,
#flights .col_to,
#flights .col_ldg,
#flights .col_blkon,
#flights .col_ft,
#flights .col_bt{width:60px;}
#flights .col_refuel,
#flights .col_fuel_dep,
#flights .col_fuel_arr,
#flights .col_fuel_used{width:44px;}
#flights .col_pax_m,
#flights .col_pax_f,
#flights .col_pax_c,
#flights .col_pax_i{width:28px;}
#flights .col_ck,
#flights .col_hl{width:36px;}
#flights .col_remarks{width:182px;}




form#flights input{
	width:56px;
	text-align:center;
	vertical-align:middle;
}
form#flights input[name="flight_number"]{width:60px;}
form#flights input[name="blkoff"],
form#flights input[name="to"],
form#flights input[name="ldg"],
form#flights input[name="blkon"],
form#flights input[name="flight_time"],
form#flights input[name="block_time"]{width:44px;}
form#flights input[name="fuel_dep"],
form#flights input[name="fuel_arr"],
form#flights input[name="fuel_used"]{width:40px;}
form#flights input[name="pax_m"],
form#flights input[name="pax_f"],
form#flights input[name="pax_c"],
form#flights input[name="pax_i"]{width:24px;}
form#flights input[name="ck"],
form#flights input[name="hl"]{width:30px;}
form#flights input[name="remarks"]{width:178px;}
form#flights input[type="submit"]{
	margin-top:20px;
	width:100px;
}


form#duty{text-align:left;}

form#duty div.date_start label,
form#duty div.duty_type{margin:20px 0px 20px 0px;}
form#duty div.duty_type label{display:inline-block;width:72px;}
form#duty span.duty_type{
	font-size:20px;
	font-weight:bold;
}

form#duty div.date_start input.date,
form#duty div.date_end input.date,
form#duty div.date_start input.time,
form#duty div.date_end input.time{text-align:center;}

form#duty div.date_start input.date,
form#duty div.date_end input.date{width:78px;}

form#duty div.date_start input.time,
form#duty div.date_end input.time{width:42px;}


form#duty div.duty_users{
	display:inline-block;
	vertical-align:top;
}

form#duty ul#duty_users li span.user,
form#duty ul#duty_users li span.user_pos{display:inline-block;}

form#duty ul#duty_users li span.user{width:38px;}

form#duty ul#duty_users li span.user_pos{margin-right:14px;}

form#duty .available_users,
form#duty .available_flights{
	display:inline-block;
	vertical-align:top;
}

form#duty div#flights table {border-collapse:collapse;}
form#duty div#flights table tr.flight_header{background:#e8e8fa;}
form#duty div#flights table tr.flight_header th{font-weight:bold;font-size:15px;}

form#duty div#flights table tr.flight_header th,
form#duty div#flights table tr.flight th{text-align:center;}

form#duty div#flights table th,
form#duty div#flights table td{border:1px solid #cacad4;text-align:center;}

form#duty div#flights table .flight_number{width:71px;}
form#duty div#flights table .sdt{width:44px;}
form#duty div#flights table .sat{width:44px;}
form#duty div#flights table .fl{width:29px;}
form#duty div#flights table .reg{width:58px;}
form#duty div#flights table .icao_route{width:90px;}
form#duty div#flights table .icao_dep{width:48px;}
form#duty div#flights table .icao_arr{width:48px;}

form#duty div#flights table tr.flight_header th.blkoff,
form#duty div#flights table tr.flight_header th.takeoff,
form#duty div#flights table tr.flight_header th.landing,
form#duty div#flights table tr.flight_header th.blkon,
form#duty div#flights table .blkoff,
form#duty div#flights table .takeoff,
form#duty div#flights table .landing,
form#duty div#flights table .blkon{width:73px;}

form#duty div#flights table tr.flight_header span.pax_m,
form#duty div#flights table tr.flight_header span.pax_f,
form#duty div#flights table tr.flight_header span.pax_c,
form#duty div#flights table tr.flight_header span.pax_i,
form#duty div#flights table .pax_m,
form#duty div#flights table .pax_f,
form#duty div#flights table .pax_c,
form#duty div#flights table .pax_i{width:22px;}

form#duty div#flights table tr.flight_header .ck,
form#duty div#flights table .ck{width:49px;}

form#form_del_duty {margin-top:20px;}

div#docs {
	vertical-align:top;
	display:inline-block;
	width:520px;
}
div#docs h3 {text-align:left;}

.user div#docs table.docs{
	text-align:left;
	line-height:1.6;
}
table.docs_to_expire td.dates,
div#docs table.docs tr td.dates{width:170px;}
div#docs table.docs tr.doc.about_to_expire td,
div#docs table.docs tr.doc.about_to_expire td a{color:#f80;}
div#docs table.docs tr.doc.expired td,
div#docs table.docs tr.doc.expired td a{color:#f00;font-weight:bold;}

.warning{font-style:italic;}

ul#docs,
ul.links{
	display:inline-block;
	text-align:left;
	line-height:1.5;
}


/**
 * Flights Report
 */
table.flights_data{
	width:1200px;
	margin:0 auto;
	line-height:1.4;
	border-collapse:collapse;
}

table.flights_data th{
	border:1px solid #ddd;
	background:#faf8da;
}

table.flights_data th.pax_m,
table.flights_data th.pax_f,
table.flights_data th.pax_c,
table.flights_data th.pax_i{ width:24px; }

table th.pax_m{ background:#88f; }
table th.pax_f{ background:#f8f; }
table th.pax_c{ background:#8ff; }
table th.pax_i{ background:#8f8; }

table td.pax_m{ background:#ddf; }
table td.pax_f{ background:#fdf; }
table td.pax_c{ background:#cff; }
table td.pax_i{ background:#cfc; }

table.flights_data td{border:1px solid #ddd;}
table.flights_data td.date{background:#faf8f4;}


table.flights_data tr.new_day td{border-top:2px solid #dad0bb;}

table.flights_data caption {
    caption-side:top;
    font-weight:bold;
    font-size:18px;
    margin-bottom:12px;
}


/**
 * Docs Confirmations
 */
table.docs_confirmations{
	width:1200px;
	margin:0 auto;
	line-height:1.4;
	border-collapse:collapse;
}

table.docs_confirmations th{
	border:1px solid #ddd;
	background:#faf8da;
}

table.docs_confirmations td{border:1px solid #ddd;}
table.docs_confirmations td.date{background:#faf8f4;}

table.docs_confirmations caption {
    caption-side:top;
    font-weight:bold;
    font-size:18px;
    margin-bottom:12px;
}




form#frm_file_flight_report {margin-top:20px;}
form#frm_file_flight_report input {width:70px;text-align:center;}

table#users_access{margin:0 auto;}
table#users_access td{border:1px solid #ccc;}

div.users_permissions{
	display:inline-block;
	vertical-align:top;
	margin:20px 16px;
}

div.users_permissions tr.file{font-weight:bold;}

div.users_permissions tr.file td {
	padding:4px 0px;
	background:#eaefea;
}

div.users_permissions table.users_permissions {
	border-collapse:collapse;
	background:#eed;
}

div.users_permissions table.users_permissions th{background:#cdc;}

div.users_permissions table.users_permissions th,
div.users_permissions table.users_permissions td{border:1px solid #bbb;}

table.docs_to_expire td.user{width:40px;}

div.warning_count_info span.expired{margin-right:20px;}
div.warning_count_info span.toexpire{margin-left:20px;}

form#change_pass {
	display:inline-block;
	width:300px
}
form#change_pass label {
	display:inline-block;
	width:160px;
	text-align:left;
}
form#change_pass input[type="password"] {
	text-align:center;
	width:80px;
}

tr.totalizer{
	background:#eed;
	color:#666;
	font-style:italic;
}

p.note_timezone{
	font-style:italic;
	font-size:12px;
}

a.pilotlogbook{margin-top:20px;display:inline-block;}

.flight_hours,
.flight_duty_periods{display:inline-block;text-align:left;}
.flight_hours table,
.flight_duty_periods table{
	border-collapse:collapse;
	text-align:center;
}
.flight_hours table th,
.flight_hours table td,
.flight_duty_periods table th,
.flight_duty_periods table td{border:1px solid #aaa;}
.flight_hours table td,
.flight_duty_periods table td{text-align:right;}
.flight_hours table td.user,
.flight_duty_periods table td.user{text-align:left;}

a.go_back{
	margin:16px auto 0px auto ;
}

td.file {text-align:left;}


table.users_docs {
	border-collapse:collapse;
	margin:0 auto;
	border:3px double #ccc;
}
table.users_docs th,
table.users_docs td{
	border:1px solid #ccc;
	height:26px;
}
table.users_docs tr.training td.training_name{
	text-align:left;
	width:320px;
}
table.users_docs tr.training td.training_date{
	font-size:12px;
	width:86px;
}
table.users_docs tr.training td.training_date span.expired,
table.users_docs tr.training td.training_date span.expired a{
	color:#f00;
	font-weight:bold;
}

table.users_docs tr.training td.training_date span.about_to_expire,
table.users_docs tr.training td.training_date span.about_to_expire a{
	color:#f80;
	font-weight:bold;
}

div#search_result table {
	margin:8px auto;
	border-collapse:collapse;
}
div#search_result table th,
div#search_result table td {
	border:1px solid #ccc;
}

div#reposition label {
	display:inline-block;
	width:100px;
}

table#flights {
	line-height:1.5;
}

table#openflights td.active{
	background:#afa;
}

form#frm_upload_training {
	display:inline-block;
	text-align:left;
	line-height:1.5;
}

form#frm_upload_training label {
	display:inline-block;
	width:80px;
}
#calendar_filter{
	padding-top:20px;
}
.calendar-filter-image{
	width:38px;
	height:38px;
}
.filt-icons img{cursor:pointer;}

.icon_atc {margin-right:8px;}

.content-container {
    width: 80%;
    margin: 0 auto;
    padding: 20px;
    line-height: 1.6;
    background-color: #f9f9f9;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    text-align: left;
}

.content-container h3 {
    margin-top: 20px;
    color: #333;
}

.content-container p, .content-container ul {
    color: #555;
}

.content-container ul {
    margin-left: 20px;
}

.content-container ul li {
    margin-bottom: 10px;
}

.content-container a {
    color: #007bff;
    text-decoration: none;
}

.content-container a:hover {
    text-decoration: underline;
}

.content-container form {
    margin-top: 20px;
}

.content-container label {
    display: block;
    margin: 10px 0 5px;
    color: #333;
}

.content-container input,
.content-container textarea {
    width: 100%;
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.content-container button {
    padding: 10px 20px;
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.content-container button:hover {
    background-color: #45a049;
}

/* Reusable horizontal scroll wrapper */
.table-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.table-scroll table {
    border-collapse: collapse;
    min-width: 100%;
}

.table-scroll th,
.table-scroll td {
    white-space: nowrap; /* prevent ugly wrapping */
}

.table-wide {
    width: max-content;
}