@media print {
    @page {
        size: A4 landscape;
    }
}

html,body {
    /*position: fixed;*/
    overflow: hidden;
    font-family:'Times New Roman', Times, serif;
    margin: 0px;
    height: 100%;
    width: 100%;
}


div#container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: column;
}


div#tabcontainer{
    height: 175px;
    padding: 0px 5px 0px 5px;
}


.tab {
    overflow: hidden;
    /* border: 1px solid #ccc; */
    /* background-color: #f1f1f1; */
}

/* Style the buttons inside the tab */
.tab button {
    float: left;
    border: 1px solid #ccc;
    background-color: rgb(170, 170, 170) ;
    outline: none;
    cursor: pointer;
    padding: 0px 30px;
    transition: 0.3s;
    font-size: 0.875em;
    font-weight: bold;
    height: 30px;
    border-radius: 0;
    margin: 2px 0px 0px 0px;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    height: 130px;
    /* border-top: none; */
}


.collapsed div#collapsibleheader{
    height: 0px;
}


div#collapsibleheader {
    flex: 0 0 auto;
    height: 228px;
    /*height:165px;*/
    /*background-color: rgb(196, 192, 184)*/
    background-color: #69838f;
    transition: all 0.5s ease;
    overflow: hidden;
}


div#scheduleheader {
    /* display: table-cell; */
    /* vertical-align: middle; */
    flex: 0 0 auto;
    height: 30px;
    background-color: #ccc;
}


p#titlebar {
    /*position: relative;
    top: 15px;*/
    font-size: 0.850em;
    margin: 8px 0px auto 5px;
    padding: 0px;
    font-weight: bold;
    height: 1em;
    color: black;
}


label#outputID{
    margin: 0px 3px 0px 3px;
}


img.uparrow{
    width: 10px;
    height: 10px;
}


.down{
    transform: scaleY(-1);
}


div#loginbox {
    border-width: 0px;
    border-radius: 10px;
    /*position: relative;
    top: 10px;
    left: 20px;*/
    margin: 0px;
    /* padding: 3px;
    background-color: #69838f;*/
    position: relative;
    overflow: hidden;
}


form#loginform{
    margin-block-end: 0px;
}


#logintable {
    width: 280px;
    border: 0px solid black;
    border-spacing: 0px;
    table-layout: fixed;
}


#logintable td {
    font-size: 0.875em;
    border: 0px solid black;
    /* min-width: 50px; */
    overflow: hidden;
}


#logintable td.caption {
    text-align: right;
    color: rgb(248 251 224);
}


#logintable td.caption label{
    margin-right: 5px;
}


td.input{
    width: 125px;
}


td#loading{
    width: 70px;
}


div#sidecontainer{
    text-align: center;
    height: 100%;
    /* border: 1px solid black; */
    /* position: relative; */
}


div#loadingdiv {
    position: relative;
    top:0px;
    bottom:0px;
    left:0px;
    right:0px;
    margin-bottom: 5px;
    overflow: hidden;
    text-align: center;
    height: 30px;
}


svg#loadingsvg {
    visibility: hidden;
}


div#buttoncontainer{
    display: block;
    padding: 5px 0px 0px 12px;
    /* margin-bottom: 0px; */
}


input, select, button {
    margin: 1px 0px 1px 0px;
    height: 20px;
    font-size: 0.875em;
    border-width: 0px;
    border-radius: 5px;
}


input#username, input#current-password, select#timesIn, select#airline {
    width: 120px;
}


input#startdate{
    width: 75px;
}


select#numberofdays {
     width: 40px;
}


table#offlinetable{
    width: 280px;
}


#offlinetable td{
    font-size: 0.875em;
}


#offlinetable td.caption{
    text-align: right;
    color: rgb(248 251 224);
    width: 115px;
}

#offlinetable td.caption label{
    margin-right: 5px;
}


select#previousschedule{
    width: 100%;
}


#submitbtn, #printbtn, #downloadbtn, #confirmbtn, #prevschedloadbtn{
    margin-top:2px;
    height: 40px;
    width: 60px;
    cursor: pointer;
    font-size: 0.825em;
    padding: 0px;
}


#printbtn, #downloadbtn{
    width: 65px;
}


#submitbtn{
    margin-left: 0px;
    margin-top: 4px;
    position: relative;
    bottom: 0px;
}


#downloadbtn{
    margin-left: 4px;
}


#confirmbtn {
    /* margin-left: 4px; */
    padding: 0px;
    background-color: #f76767;
    border: none;
    color: rgb(248 251 224);
    text-align: center;
    text-decoration: none;
    font-size: 0.8em;
    /* margin-top: 4px; */
    visibility: hidden;
}


div#infotext{
    font-size: 0.85em;
    margin: 0px;
    height: 100%;
    width: 100%;
    color: rgb(248 251 224);
    word-wrap: normal;
    overflow-y: scroll;
    /*border: 1px solid red;*/
}

div#infotext ul{
    margin-top: 8px;
    margin-bottom: 8px;
}


div#schedulecontainer {
    /*position: absolute;
    white-space: nowrap;
    top:140px;
    bottom:0;
    left:0px;
    right:0px;*/
    display: flex;
    flex: 1 1 auto;
    overflow-x: scroll;
    /*overflow-y: hidden;*/
}


.scheduletable {
    border-spacing: 0px;
    table-layout: fixed;
    /*width: 100%;*/
    height: 100%;
}


.print {
    height: 50%;
}


.scheduletable td, .scheduletable th, .scheduletable tfoot {
    border: 1px solid black;
    min-width: 100px;
    max-width: 100px;
    overflow: hidden;
  }


.print td, .print th, .print tfoot {
    min-width: 80px;
    max-width: 80px;
}
  

.scheduletable th {
    background-color: #89c3d5;
  }

  
.scheduletable td {
    vertical-align: top;
    font-size: 0.875em;
    /*height: 400px;*/
  }


.scheduletable tbody td {
    border-width: 1px 1px 0px 1px;
  }


.scheduletable tfoot td {
    border-width: 0px 1px 1px 1px;
    height: 25px;
    text-align: center;
    color: black;
    /*background-color: #1af0ba;*/
  }


.scheduletable td.offduty {
    background-color: #8fb58f;
  }


.scheduletable td.onduty{
    background-color: #ffffb2;
  }


.scheduletable td.notification{
    background-color: #f76767;
  }


div.hotelicon{
    width: 98%;
    /*border: 1px solid black;*/
    text-align: center;
}


img.hotelicon{
    height: 30px;
    width: 30px;
}


.marker{
    font-weight: bold;
    font-size: 1.2em;
}


a.marker:link, a.marker:hover, a.marker:active, a.marker:visited{
    font-weight: bold;
    font-size: 1.2em;
    text-decoration: none;
    color: rgb(126, 1, 131);
}


a.flightnumber:link, a.flightnumber:hover, a.flightnumber:active, a.flightnumber:visited{
    font-weight: bold;
    font-size: 1.1em;
    text-decoration: none;
    color: rgb(126, 1, 131);
}


.errordialog{
    color: #eb0a0a;
}


.hidden{
    display: none;
}