body {
    background-color: #F5F5F5;
    font-family: Roboto, Roboto-Bold, Arial !important;
    font-weight: 400;
    font-size: 100%;
}

/* --------------------------------------------------------------
Header / Bootstrap Navbar NEW!!!!!!!!!!
-------------------------------------------------------------- */
*, *:after, *:before {
    box-sizing: unset; /* !important; */
}

#h1-left {
    font-size: 1.5em !important;
    top: 32%;
    left: 2.5em;
    text-shadow: none;
    position: absolute;
}

.header-left {
    left: 2.1em;
}

.header-text {
    font-size: 2em !important;
    top: 10%;
    text-shadow: none;
    position: absolute;
}

.header-right {
    right: 2.5em;
}

.h1 {
    margin-top: 0px !important;
    margin-bottom: 10px !important;
}

#showMenu {
    background-image: url(images/menu.png) !important;
    width: 27px;
    height: 31px;
    background-repeat: no-repeat;
    background-position: center;
    padding-left: 2em;
    top: 30%;
    position: absolute;
    cursor: pointer;
}

#goBack {
    background-image: url(../images/back.png) !important;
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-position: center;
    padding-left: 2em;
    top: 30%;
    position: absolute;
    cursor: pointer;
}

#cancel {
    background-image: url(../images/cancel.ico) !important;
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-position: center;
    padding-left: 2em;
    top: 30%;
    position: absolute;
    cursor: pointer;
}

#saveChanges {
    background-image: url(../images/save.ico) !important;
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-position: center;
    padding-left: 2em;
    right: 0;
    top: 30%;
    position: absolute;
    cursor: pointer;
}

.change-saved {
    box-shadow: 0 0 12px rgb(77, 255, 0);
}

.change-failed {
    box-shadow: 0 0 12px rgb(255, 45, 0);
}

.alertBar {
    position: absolute;
    display: flex;
    height: 50px;
    width: 60px;
    padding-right: 1em;
    right: 0%;
    top: 30%;
}

.alert-count {
    padding-top: 10px;
    padding-right: 5px;
    text-shadow: none;
}

#showAlerts {
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-position: center;
    position: initial;
    cursor: pointer;
}

.timezoneIndicator {
    position: absolute;
    padding-right: 1.3em;
    top: 65px;
    right: 0%;
    text-shadow: none;
}

.outdatedFlight {
    /*background-color: #ff6565;*/
    font-weight: bold;
}

#user-settings {
    display: block;
    font-size: 90%;
    padding: 0;
    top: 0em;
    left: 0%;
    z-index: 50;
}

.ui-btn {
    text-shadow: none !important;
}

.userMenu .ui-btn:focus {
    box-shadow: none !important;
}

.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 1; /* Stay on top */
    top: 0;
    left: 0;
    background-color: #ccc; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.3s;
    text-shadow: none;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover, .offcanvas a:focus {
    color: #f1f1f1;
}

.divider {
    background-color: #bdbdbd;
    position: relative;
    display: block;
    height: 1px;
    /*margin: 8px 0;*/
    padding: 0;
    overflow: hidden;
}

#menuHeader {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    justify-content: flex-end;
    flex-flow: row wrap;
    height: 6.7em;
    background-color: #78052D;
    /*margin-bottom: 2em;*/
    position: relative;
}

#menuLabel {
    font-weight: bold;
    left: 15%;
    top: 30%;
    position: absolute;
    text-shadow: none;
}

.navbar-toggle {
    margin-right: 5px !important;
    margin-left: 5px !important;
}

.navbar {
    margin-bottom: 0 !important;
}

.navbar-default {
    background-image: none !important;
    background-color: #CCC !important;
    border-color: #86b6da !important;
}

.navbar-default .navbar-toggle {
    border: none;
    border-color: transparent;
}

.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    border: none;
    background-color: transparent;
}

.ui-body-a .navbar-default {
    background-image: none !important;
    background-color: #333333 !important;
    border-color: #111111 !important;
}

.navbar-header {
    height: 6em;
    background-color: #86b6da;
}

section.ui-content {
    padding: 0;
}

table#resourcestable {
    /*border-collapse: collapse !important;*/
    background-color: white;
}

.searchPanel {
    padding: 1em 1em 0.5em 1em;
}

.search {
    position: relative;
    color: #aaa;
    font-size: 16px;
}

.search input {
    width: 99%;
    height: 31px;
    color: black;
    background: #fcfcfc;
    border: 2px solid #d9d9d9;
}

.search input {
    text-indent: 32px;
}

.searchImage {
    position: absolute;
    top: 8px;
    left: 10px;
    width: 18px;
    height: 18px;
    background-image: url(../images/search.png) !important;
    border: none !important;
}

#resourcestable_wrapper {
    padding-bottom: 1em;
}

table.dataTable thead th, table.dataTable thead td {
    padding: 0px 18px;
    border-bottom: 1px solid #111;
}

.section {
    border: none;
}

table#resourcestable tr {
    border: 5px #ccc solid !important;
}

table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
    background-color: #86b6da;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th:first-child:before {
    background-color: #86b6da !important;
}

#searchInput {
    padding: 1em;
}

#connectionbar {
    margin-bottom: 0px !important;
}

header {
    display: flex;
    height: 4.2em;
}

.bootstrap-btn {
    margin: 0 !important;
    border-style: none !important;
    border-width: none ! important;
}

.navbar-nav > li > a {
    color: #FFFFFF !important;
    padding-top: 15px !important;
}

.icon-bar {
    background-color: #FFFFFF !important;
}

/* jquery mobile overwrite */
.ui-input-text input, .ui-input-search input, textarea.ui-input-text {
    box-sizing: border-box;
    display: block;
    line-height: 2.4em !important;
    outline: 0 none;
    padding: 0.4em;
    width: 100%;
}

.field .ui-checkbox {
    display: inline-block;
    padding: 10px 0px;
}

#details .field .ui-state-disabled, #details .field .ui-disabled {
    opacity: 0.6;
}

#resourcestable .ui-checkbox {
    display: inline-block;
}

.ui-input-btn, .ui-select .ui-btn, .ui-btn .ui-btn:hover {
    background-color: #78052d !important;
    border-color: #78052d !important;
    text-shadow: none !important;
    /*box-shadow: none !Important;*/
}

.ui-overlay-b .ui-datebox-container {
    border-color: #ccc !important;
}

.ui-datebox-container .ui-header .ui-title {
    text-shadow: none;
}

.ui-datebox-container .ui-bar-a {
    background-color: #ccc;
}

.ui-datebox-container .ui-datebox-dboxin input {
    background-color: #cccccc;
    color: #000;
    border-color: white;
    text-shadow: none;
}

.ui-btn .btn-hover-b {
    box-shadow: none;
}

/* --------------------------------------------------------------
	Bootstrap-Workaround
-------------------------------------------------------------- */

option {
    color: #525a4f !important;
}

/* --------------------------------------------------------------
	General-Content
-------------------------------------------------------------- */
.content-heading {
    font-size: 23px !important;
}

/* --------------------------------------------------------------
	DataTable - Workarounds
-------------------------------------------------------------- */

table.dataTable {
    width: 100% !important;
}

/* --------------------------------------------------------------
	Flights
-------------------------------------------------------------- */

#resourcestable tbody {
    white-space: nowrap;
}

#resourcestable tbody tr td {
    height: 15px;
}



.ui-footer, .ui-header {
    background-color: #78052D !important;
    border-color: #78052D !important;
}

/*.ui-footer .version, .ui-footer .year {*/
    /*visibility: hidden !important;*/
/*}*/

#myfooter {
    /*height:60px;*/
    text-align: center;
}

.hideOption {
    display: none;
}

.logo {
    margin: 0.5em 0;
}

ul > li > a {
    font-size: 15px !important;
}

.aodb-controls {
    border-bottom-right-radius: unset !important;
    border-top-right-radius: unset !important;
    border-bottom-left-radius: unset !important;
    border-top-left-radius: unset !important;
    border-right-width: 1px !important;
    float: none !important;
    font-size: 15px !important;
}

.aodb-date {
    display: flex;
    justify-content: space-between;
}

.aodb-date div {
    width: 40%;
}

.aodb-date div:nth-child(2) {
    width: 50%;
}

}
.ui-icon-resource:after {
    background-image: url(../images/resources.png) !important;
}

.ui-icon-arrival:after {
    background-image: url(../images/arrival.png) !important;
}

.ui-icon-departure:after {
    background-image: url(../images/departure.png) !important;
}

/* --------------------------------------------------------------
	Login-Page
-------------------------------------------------------------- */
.row {
    margin-left: 0;
    margin-right: 0;
}

#language-sel > option {
    color: #5e5c5e
}

/* --------------------------------------------------------------
	Detail-Page
-------------------------------------------------------------- */
.detailForm {
    /*max-width: 500px;-page*/
}

@media (min-width: 420px) {
    .alertInfo {
        z-index: 1000;
        position: fixed;
        left: 0;
        bottom: 0;
        height: 150px;
        margin: 0 auto 0;
        padding: 15px 20px;
        width: 96%;
        background: #fff;
    }

    #alert-close {
        margin: 0;
        float: right;
    }
}

@media (max-width: 420px) {
    .alertInfo {
        z-index: 1000;
        position: fixed;
        left: 0;
        bottom: 0;
        height: 150px;
        margin: 0 auto 0;
        padding: 15px 20px;
        max-width: 380px;
        background: #fff;
    }

    #alert-close {
        margin: -10px -15px;
        float: right;
    }
}

@media (min-width: 420px) {
    .detail {
        margin: 20px auto 0;
        padding: 15px 20px;
        max-width: 380px;
        background: #fff;
        -moz-box-shadow: 0px 0px 7px #b9b9b9;
        -webkit-box-shadow: 0px 0px 7px #b9b9b9;
        box-shadow: 0px 0px 7px #b9b9b9;
    }
}

@media (max-width: 420px) {
    .detail {
        margin: 0 auto 0;
        padding: 15px 20px;
        max-width: 380px;
        background: #fff;
        -moz-box-shadow: 0px 0px 7px #b9b9b9;
        -webkit-box-shadow: 0px 0px 7px #b9b9b9;
        box-shadow: 0px 0px 7px #b9b9b9;
    }
}

@media (max-width: 420px) {
    .fullscreen {
        height: 85vh;
    }
}

.select2.select2-container .selection .select2-selection.select2-selection--single .select2-selection__arrow {
    height: 100%;
}

.select2-selection--single {
    background-color: inherit !important;
}

.select2-selection__rendered {
    color: inherit !important;
}

.select2-selection.select2-selection--single {
    padding: 5.6px;
    height: auto !important;
    border: none !important;
}

.option-value {
    font-weight: bold;
}

.option-description {
    font-style: italic;
}

.alertBar {
    visibility: hidden;
}

#main-msg {
    margin: 10%;
}

.ui-body-a .detail {
    border: 1px solid #1a1a1e;
    background: #19191c;
    background: -webkit-gradient(linear, left top, left bottom, from(#212226), to(#19191c));
    background: -moz-linear-gradient(top, #212226, #19191c);
    background: -o-linear-gradient(top, #212226, #19191c);
    background: -ms-linear-gradient(top, #212226, #19191c);
    background: linear-gradient(to bottom, #212226, #19191c);
    -moz-box-shadow: 0px 0 4px #222;
    -webkit-box-shadow: 0px 0 4px #222;
    box-shadow: 0px 0 4px #222;
}

/* --------------------------------------------------------------
Update Section
-------------------------------------------------------------- */
.updateStatus {
    color: #00FF00;
    font-weight: bold;
    visibility: hidden;
}

/* --------------------------------------------------------------
Alert section
-------------------------------------------------------------- */

.ui-popup-container, .ui-popup {
    width: 80%;
    left: 10%;
    right: 10%;
    position: absolute;
}

#popupDialog, #cancelDialog {
    background-color: #86b6da;
    color: #fff;
}

#connectionbar {
    float: left;
    padding-bottom: 4px;
}

.alertReaded {
    background-color: #ccc !important;
}

/*POPUP STYLES*/

/*SELECT 2 COMBOBOX*/
span.select2-selection__clear:before {
    content: url(../images/remove.png);
    position: absolute;
    top: 3px;
    right: 0;
    bottom: 0;
    background: white;
}

.aodb-footer {
    background-image: url("ber-logo.svg");
    background-position: left;
    background-repeat: no-repeat;
    /*background-size: 7%;*/
    background-size: 112px;
    background-position-x: 20px;
}

.textarea {
    overflow: auto;
}

.ui-btn-a {
     background-color: #78052d !important;
     color: #FFFFFF
 }

.ui-input-btn {
    background-color: #78052d !important;
    color: #FFFFFF
}

.input {outline: none; !important;}
body, input, select, textarea, button, .ui-btn {outline: none; !important;}

input:focus,
select:focus,
textarea:focus {
    outline: none!important;
}
.ui-btn, ui-btn:focus{  background-color: #78052d !important;
    box-shadow: none !important;
}

#fluglogo { overflow: auto; }