/* 
----------------------------------------------------------------------------------------------
GLOBAL 
----------------------------------------------------------------------------------------------
*/

html {
    background: no-repeat center center fixed;
    -o-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    background: rgba(0, 0, 255, 0);
}
h1 {
    font-size: x-large
}
h2 {
    font-size: large
}
h3 {
    font-size: normal
}
h4 {
    font-size: small
}
a {
    font-weight: bolder;
}
input[readonly] {
    background-color: #E1E1E1;
    color: black;
}
table {
    border-style: none;
    font-size:small
}
table.activityTableStyle {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #9d9d9d;
}
table.activityTableStyle td {
    padding-left: 2px;
    padding-right: 2px;
}
table.header {
    width: 100%;
    height: 30px
}
.containerTable {
    width: 100%;
    display: table;
}
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
    .containerTable {
        display: grid; /* for some reason, Chrome will show scrollbars on all overflow divs with display:table, so we have to change that.....*/
    }
}
tr {
    vertical-align: top
}
tr.groupdivrow {
    height: 3px
}
tr.links {
    width: 100%;
    text-align: right;
    height: 40px
}
td.center {
    text-align: center
}
td.rowlabel {
    font-weight: bold
}
td.headerblock {
    width: 90%
}
td.text {
    width: 200px
}
td.texttype {
    width: 100px
}
td.textinstance {
    width: 16%
}
td.textvalidity {
    width: 33%;
    text-align: left
}
div.printOnly {
    display: none;
}
tr.printOnly {
    display: none;
}
select.clear-height {
    height: inherit;
}
.center {
    float: none;
    margin: 0 auto;
}
.bottom-buffer {
    margin-bottom: 20px;
}
.top-buffer {
    margin-top: 20px;
}
.panel-compress {
    padding-bottom: 5px;
    padding-top: 5px;
}
.shadow {
    -moz-box-shadow: 0px 1px 3px #888;
    -webkit-box-shadow: 0px 1px 3px #888;
    box-shadow: 0px 1px 3px #888;
}
.dropdown-auto-size {
    width: auto;
    max-width: 100%;
}
.monospace-font {
    font-family: Monospace;
    font-size: 1.3em;
}
.align-glyphicon {
    vertical-align: text-top;
}
a[disabled=disabled]{
    color:grey;
    cursor:default;
}
.text-invisible {
    color: rgba(255, 255, 255, 0);
}
DropDownList.standard {
    width: 200px
}
.overflow-indicator {
    position: absolute;
    right: 0;
    height: 100%;
    padding-left: inherit;
    padding-right: inherit;
    margin-right: 15px;
    pointer-events: none;
    z-index: 1002; /* overrule the floattheader */
    -webkit-transform: translate3d(0,0,0);
    -webkit-box-shadow: inset 0px 0px 20px -25px rgba(0, 0, 0, 0.8), inset -30px 0px 20px -25px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: inset 0px 0px 20px -25px rgba(0, 0, 0, 0.8), inset -30px 0px 20px -25px rgba(0, 0, 0, 0.8);
    box-shadow: inset 0px 0px 20px -25px rgba(0, 0, 0, 0.8), inset -30px 0px 20px -25px rgba(0, 0, 0, 0.8);
}

.btn-cancel {
    margin-left: 5px;
}

.div-table {
    display: table;
}

.div-table-row {
    display: table-row;
}

.div-table-cell {
    display: table-cell;
}

.datepicker-calendar-input {
    max-width: 160px;
    display: block;
    margin: 0 auto;
}

.datepicker-calendar-input-small {
    width: 90px;
    display: block;
    margin: 0 auto;
}

.nowrap {
    white-space: nowrap;
}

/* 
----------------------------------------------------------------------------------------------
CHECK-IN PAGE 
----------------------------------------------------------------------------------------------
*/


/* 
----------------------------------------------------------------------------------------------
DEBRIEFING PAGE 
----------------------------------------------------------------------------------------------
*/

table.FlightCrew {
    border: 1px solid black;
    border-collapse: collapse;
    width: 100%;
    background-color: White;
}
table.FlightCrew tr th {
    border: 1px solid black;
    padding-right: 10px;
    text-align: left;
    width: 120px;
    white-space: nowrap;
}
table.FlightCrew tr td {
    border: 1px solid black;
    padding-right: 10px;
    text-align: left;
    width: 120px;
    white-space: nowrap;
}
textarea.DebriefingFlight {
    Width: 100%;
    resize: vertical;
}
td.DebriefingFlightSpace {
    width: 5%;
}
.notes-column {
    width: 66%;
    resize: vertical;
}
.open-description {
    cursor: pointer;
}

/* 
----------------------------------------------------------------------------------------------
DOCUMENT PAGE 
----------------------------------------------------------------------------------------------
*/

.document-table>tbody>tr {
    height: 50px;
}

.table>tbody>tr>td.remove-padding-sides {
    padding-left: 0px;
    padding-right: 0px;
}

.acknowledged-color {
    color: #5cb85c;
}

.read-color {
    color: #5bc0de;
}

/* 
----------------------------------------------------------------------------------------------
HOTEL-DETAILS PAGE 
----------------------------------------------------------------------------------------------
*/

td.hoteltexttype {
    width: 33%;
    font-weight: bold;
    padding-bottom: 6px
}
td.hoteltext {
    width: 66%;
    padding-bottom: 6px
}

/* 
----------------------------------------------------------------------------------------------
LOGIN PAGE
----------------------------------------------------------------------------------------------
*/

input.input-login {
    max-width:30em;
    min-width:15em;
}
div.buttons-login {
    padding-top:15px;
    display: flex;
    display: flexbox;
    display: box; 
    display: -webkit-flex;
}
div.center-login {
    width: 50%;
    margin: 0 auto;
}
.input-login-container {
    max-width: 300px;
}

/* 
----------------------------------------------------------------------------------------------
MAIN PAGE 
----------------------------------------------------------------------------------------------
*/

tr.mainpage {
    height: 60px
}
.main-notification-container {
    max-width: 800px;
}
.calender-link {
    width: 100%;
    word-wrap: break-word;
}

.document-table-frontpage {
    margin-top: 10px;
}
.document-table-frontpage td {
    padding-top: 5px;
    padding-right: 5px;
}


.briefingdoc-table-frontpage td {
    padding-top: 5px;
    padding-right: 5px;
}
/* 
----------------------------------------------------------------------------------------------
MASTER SCHEDULE PAGE 
----------------------------------------------------------------------------------------------
*/

.ScheduleTable {
    max-width: 100%;
    border-collapse: collapse;
    border: 1px solid black;
    background-color: White;
}
.ScheduleTable td {
    border-right: 1px solid black;
}
.ScheduleTable .InfoColumn {
    border-right: 1px solid black;
    text-align: left;
}
.ScheduleTable .UL {
    border-bottom: 1px solid black;
}
.ScheduleTable .DayColumn {
    width: 90px;
    text-align: center;
    border-right: 1px solid ddd;
}
.table .DayColumn {
    width: 90px;
    text-align: center;
    border-left: 1px solid #ddd;
}
.ScheduleTable thead {
    border-bottom: 1px solid black;
}
.MultiSelectionBox {
    width: 100px;
    height: 96px;
}
.TopBorder td {
    border-top: 1px solid black;
}

/* 
----------------------------------------------------------------------------------------------
OTHER FLIGHTS PAGE 
----------------------------------------------------------------------------------------------
*/

td.OtherFlightSpace {
    width: 5%;
}

/* 
----------------------------------------------------------------------------------------------
PILOTSLOG PAGE 
----------------------------------------------------------------------------------------------
*/

table.pagetable {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    font-size: x-small;
}
table.contentstable {
    width: 100%;
    border-collapse: collapse;
    margin-left: auto;
    margin-right: auto;
}
.PilotsLogTable {
    margin-left: auto;
    margin-right: auto;
}
.PilotsLogTable input[type=text] {
    width: 190px;
}
.PilotsLogTable input.TimeInput {
    width: 144px;
}
.PilotsLogTable input.DateInput {
    width: 114px;
}
.PilotsLogTable input.DurationInput {
    width: 144px;
}
.PilotsLogTable input.DelayTextBox {
    width: 39px;
}
.PilotsLogTable select.CrewNameDropdown {
    width: 200px;
}
.NotFilledControl {
    background-color: Red;
}
.Warning {
    background-color: #FAEBD7;
    padding: 10px;
    text-align: center;
}
td.PilotsLog {
    width: 240px;
}
td.PilotsLogSpace {
    width: 5%;
}
input.PilotsLog 
{
    margin-bottom: 5px;
    width: 85px;
    text-align: right;
}
select.PilotsLog {
    width: 95px;
}
textarea.PilotsLog {
    Height: 100%;
    Width: 100%;
}
.pilotslog-radiobutton {
    padding-left: 5px;
}

/* 
----------------------------------------------------------------------------------------------
ROSTER PAGE 
----------------------------------------------------------------------------------------------
*/

table.rostergrid {
    border-collapse: collapse;
    font-size: small;
    min-width: 75%;
    background-color: White;
}
table.rostergrid td {
    border-width: 1px;
    padding: 3px;
    border-style: inset;
    border-color: black;
    width: 14%;
    text-align: right;
    font-weight: normal;
}
table.rostergrid th {
    border-width: 1px;
    padding: 3px;
    border-style: inset;
    border-color: black;
    background-color: #a0a0a0;
    text-align: center;
    font-weight: bold;
}
table.noteTable {
    width: 100%;
    border-collapse: collapse;
}
table.noteTable td {
    width: 10%;
}
table.noteTable td:first-child {
    white-space: nowrap;
}
table.noteTable td:last-child {
    width: 0px;
}
table.noteTable td {
    padding-right: 20px
}
td.rosterDetailsFirstTd {
    border-right-width: 1px;
    border-right-color: #9d9d9d;
    border-right-style: dashed;
}
input.stdField {
    width: 60px
}
select.stdField {
    width: 60px
}
@media (min-width: 765px) {
    #rosterFromTableDiv {
        float: right;
    }
}
.floatThead-table { /* important because FlotThead.js overwrites value */
    border-width: 1px 1px 3px !important;
    border-color: #9d9d9d !important;
    min-width: 100%; /* fix wrong width in Safari on Mac */
}
.activityGrid_class > thead > tr { /* Floatthead calculates inconsistently in browser, so lets hardcode it this way */
    height:30px !important;
}
.floatleft {
    float: left;
    padding-right: 20px;
}
/* Activity table lines */

td.lineLeft {
    border-left-style: solid;
    border-color: #9d9d9d;
    border-width: 1px
}
td.lineRight {
    border-right-style: solid;
    border-color: #9d9d9d;
    border-width: 1px
}
.lineTop td {
    border-top: 1px solid #9d9d9d;
}
.lineBottom td {
    border-bottom: 1px solid #9d9d9d;
}
.activity-table-header {
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    white-space: nowrap;
}


/* 
----------------------------------------------------------------------------------------------
TRAINING PAGE
----------------------------------------------------------------------------------------------
*/

button.training {
    Width: 100%;
}

.max-width-paragraph {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

/* 
----------------------------------------------------------------------------------------------
QUALIFICATIONS PAGE 
----------------------------------------------------------------------------------------------
*/

table.qualificationTable {
    border-collapse: collapse;
    font-size: x-small;
    text-align: left;
    border-style: solid;
    background-color: White;
}
table.qualificationTable th {
    font-weight: bold;
    text-align: center;
    border-style: solid;
    padding: 0px 5px;
}
table.qualificationTable td {
    border-style: solid;
    border-width: thin;
    padding: 0px 5px;
}

/* 
----------------------------------------------------------------------------------------------
VACATION REQUEST PAGE 
----------------------------------------------------------------------------------------------
*/

.vacation-season-calender 
{
    width:100%;
    table-layout: fixed;
}

.vacation-season-calender-header-cell {
    border: solid 1px #EBEBEB;
    background-color: White;
    text-align: center;
    height: 30px;
    line-height: 30px;
    font-weight: normal;
}

.vacation-season-calender-cell {
    height: 75px;
    border: solid 1px #EBEBEB;
    text-align: center;
}

.vacation-season-calender-cell:hover {
    background-color: #ddd;
    cursor: pointer;
}
.vacation-season-calender-cell.cell-disabled:hover {
    cursor: not-allowed;
}
.vacation-season-calender-cell.cell-readonly:hover {
    cursor: default;
}

.vacation-season-calender-cell.open {
    background-color: #ffffff;
}
.vacation-season-calender-cell.closed {
    background-color: #f7f7f7;
}
.vacation-season-calender-cell.limit {
    background-color: #fffac3;
}
.vacation-season-calender-cell.full {
    background-color: #ffc3c3;
}
.vacation-season-calender-cell.fullbutopen {
    background-color: #fffac3;
}
.vacation-season-calender-cell.vac {
    background-color: #bbecb5;
}
.vacation-season-calender-cell.off {
    background-color: #b5d8ec;
}

.vacation-season-calender-cell-inner {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.vacation-season-calender-cell-inner.chosen {
    background: rgba(0,0,0,.20);
    border: solid 1px rgba(0, 0, 0, 0.70);
    border-radius: 10px; 
}

.vacation-season-calender-cell-date {
    font-weight: bold;
    padding-bottom: 4px;
    padding-top: 4px;
}

.vacation-season-calender-cell-text {
    line-height: 1.2em;
}

.selected-period * .div-table-cell {
    height: 20px;
}

.selected-period * .div-table-cell {
    padding-right: 20px;
}

.vacation-season-calender-inputs * {
    display: inline-block;
    width: 100px;
}
.vacation-season-calender-inputs .focused {
    border-color: rgba(104, 146, 239, 0.8);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(104, 189, 239, 0.6);
    outline: 0 none;
}

.vacation-season-calender-inputs > button {
    width: initial;
}

.vacation-season-calender-description {
    padding-top: 8px;
}

.readonly-input {
    cursor: default;
}


/* 
----------------------------------------------------------------------------------------------
SPINNER
----------------------------------------------------------------------------------------------
*/

.overlay {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background: #000;
    opacity: 0.8;
    filter: alpha(opacity=80);
    z-index: 10000;
}

/* 
----------------------------------------------------------------------------------------------
INTERNET EXPLORER SPECIFIC
----------------------------------------------------------------------------------------------
*/

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    .monospace-font {
        font-size: 1em;
    }
    .floatThead-container {
        position: relative !important; /* floatThead puts position absolut for table header, which doesn't work in IE, so we set it to relative */  
    }
    .floatThead-wrapper 
    {
        background-color: White; /* when setting the floatHead position to relative we have to insert a white background */
        border: 1px solid #9d9d9d; /*...and insert the same border again */
    }
    .activityGrid_class > thead > tr { /* Floatthead calculates inconsistently in browser, so lets hardcode it this way */
    height:0px !important;
}
}
@supports (-ms-accelerator:true) {
    /* IE Edge 12+ CSS styles go here */ 
    .monospace-font {
        font-size: 1em;
    }
}

.monospace-font {
    font-size: 1em\9 /* apply to all ie from 8 and below */
}

/* 
----------------------------------------------------------------------------------------------
TABLE SORTING STYLING
----------------------------------------------------------------------------------------------
*/

table.tablesorter thead tr .header {
	background-image: url(../images/bg.gif);
	background-repeat: no-repeat;
	background-position: center right;
	padding-right: 15px;
	cursor: pointer;
}
table.tablesorter thead tr .header.headerFirst {
	padding-right: 0px;
	padding-left: 15px;
}

table.tablesorter tbody tr.odd td {
	background-color:#F0F0F6;
}
table.tablesorter thead tr .headerSortUp {
	background-image: url(../images/asc.gif);
}
table.tablesorter thead tr .headerSortDown {
	background-image: url(../images/desc.gif);
}

/* 
----------------------------------------------------------------------------------------------
THE REST OF THE DOCUMENT IS NOT ORGANIZED!!!
----------------------------------------------------------------------------------------------
*/

tr.blackRow {
    background-color: #9d9d9d;
    height: 1px
}
tr.coloredRow {
    background-color: Gray;
    border-collapse: collapse
}
tr.emptyLine {
    height: 10px
}
.AcVersionDropDown {
    width: 190px;
}
.FltId {
    font-weight: bold;
    text-align: left;
}
table.FullBorderedGrid {
    border: 1px solid black;
    border-collapse: collapse;
}
table.FullBorderedGrid tr th {
    border: 1px solid black;
    padding-right: 10px;
}
table.FullBorderedGrid tr td {
    border: 1px solid black;
    padding-right: 10px;
}
input.Flight {
    width: 100px;
}
input.FlightSmall {
    width: 20px;
}
select.Flight {
    width: 80px;
}
td.FlightHeader {
    font-weight: bold;
    text-align: left;
}
table.Flight tr {
    text-align: left;
}
table.FlightReport {
    width: 800px;
    border-collapse: collapse;
}
.blink_text {
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    color: black;
}
@-webkit-keyframes blinker {
    0% {
        opacity: 1.0;
    }
    50% {
        opacity: 0.0;
    }
    100% {
        opacity: 1.0;
    }
}
@-moz-keyframes blinker {
    0% {
        opacity: 1.0;
    }
    50% {
        opacity: 0.0;
    }
    100% {
        opacity: 1.0;
    }
}
@keyframes blinker {
    0% {
        opacity: 1.0;
    }
    50% {
        opacity: 0.0;
    }
    100% {
        opacity: 1.0;
    }
}