﻿@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-Light.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-LightItalic.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-LightItalic.woff") format("woff");
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-Italic.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-Italic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-Black.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-Black.woff") format("woff");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-SemiBoldItalic.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-SemiBoldItalic.woff") format("woff");
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-SemiBold.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-Regular.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-Bold.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-ExtraLight.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-ExtraLight.woff") format("woff");
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-ExtraLightItalic.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-ExtraLightItalic.woff") format("woff");
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Titillium Web';
    src: url("/Content/TitilliumWeb/TitilliumWeb-BoldItalic.woff2") format("woff2"), url("/Content/TitilliumWeb/TitilliumWeb-BoldItalic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Font Awesome 5 Brands';
    font-style: normal;
    font-weight: normal;
    src: url("/Content/FontAwesome/webfonts/fa-brands-400.eot");
    src: url("/Content/FontAwesome/webfonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("/Content/FontAwesome/webfonts/fa-brands-400.woff2") format("woff2"), url("/Content/FontAwesome/webfonts/fa-brands-400.woff") format("woff"), url("/Content/FontAwesome/webfonts/fa-brands-400.ttf") format("truetype"), url("/Content/FontAwesome/webfonts/fa-brands-400.svg#fontawesome") format("svg");
}

@font-face {
    font-family: 'Font Awesome 5 Free';
    font-style: normal;
    font-weight: 400;
    src: url("/Content/FontAwesome/webfonts/fa-regular-400.eot");
    src: url("/Content/FontAwesome/webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("/Content/FontAwesome/webfonts/fa-regular-400.woff2") format("woff2"), url("/Content/FontAwesome/webfonts/fa-regular-400.woff") format("woff"), url("/Content/FontAwesome/webfonts/fa-regular-400.ttf") format("truetype"), url("/Content/FontAwesome/webfonts/fa-regular-400.svg#fontawesome") format("svg");
}

@font-face {
    font-family: 'Font Awesome 5 Free';
    font-style: normal;
    font-weight: 900;
    src: url("/Content/FontAwesome/fa-solid-900.eot");
    src: url("/Content/FontAwesome/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("/Content/FontAwesome/webfonts/fa-solid-900.woff2") format("woff2"), url("/Content/FontAwesome/webfonts/fa-solid-900.woff") format("woff"), url("/Content/FontAwesome/webfonts/fa-solid-900.ttf") format("truetype"), url("/Content/FontAwesome/webfonts/fa-solid-900.svg#fontawesome") format("svg");
}

div, span {
    box-sizing: border-box;
}

body, html {
    margin: 0px;
    padding: 0px;
    background-color: #111111;
    color: #cecece;
    font-size: 16px;
}

input.date-picker {
    background-color: #111111;
    color: #56baca;
    font-size: 12px;
    font-family: 'Titillium Web';
    width: 100px;
    padding: 2px 5px 2px 5px;
    border: 1px #5d858d solid;
    margin: 2px 0px 2px 0px;
    background-image: url("/images/Analysis/calender-icon.png");
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: calc(100% - 4px) center;
    cursor: pointer;
}

section {
    width: 100%;
}

    section.header {
        background-color: #000000;
        display: grid;
        grid-template-columns: 220px 1fr 1fr;
        width: 100%;
        padding: 10px 0px 10px 0px;
    }

        section.header div.right {
            margin-left: auto;
            padding-right: 20px;
            display: flex;
        }

            section.header div.right div.icon-button:last-child {
                margin-right: 0px;
            }

        section.header div.left {
            padding-left: 20px;
            font-size: 1px;
        }

            section.header div.left img {
                height: 25px;
                width: auto;
            }

        section.header div.center {
            line-height: 25px;
        }

div.dropdown {
    position: relative;
}

    div.dropdown ul.dropdown-menu {
        background-color: #000000;
        display: none;
        position: absolute;
        top: 25px;
        right: 0px;
        font-size: 16px;
        list-style: none;
        margin: 0px;
        padding: 0px;
        color: #56baca;
        z-index: 99;
    }

        div.dropdown ul.dropdown-menu li {
            white-space: nowrap;
            list-style: none;
            padding: 5px 10px 5px 10px;
            color: #56baca;
            border-left: 2px #000000 solid;
        }

            div.dropdown ul.dropdown-menu li:hover {
                background-color: #545356;
                border-left: 2px #cecece solid;
                color: #cecece;
            }

            div.dropdown ul.dropdown-menu li span.icon {
                visibility: hidden;
                color: #56baca;
            }

            div.dropdown ul.dropdown-menu li div.div-date-picker {
                display: none;
            }

            div.dropdown ul.dropdown-menu li.active {
                background-color: #545356;
                border-left: 2px #cecece solid;
                color: #cecece;
            }

                div.dropdown ul.dropdown-menu li.active div.div-date-picker {
                    display: block;
                }

                div.dropdown ul.dropdown-menu li.active span.icon {
                    visibility: visible;
                }

div#LoadingContainer {
    z-index: 5;
    height: 150%;
    width: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    background-color: rgba(255, 255, 255, 0.5);
}

    div#LoadingContainer #LoadingContainer div#LoadingStatus {
        position: absolute;
        text-align: left;
        width: 300px;
        /*loadingcontainerwidth*/
        margin-left: -86px;
    }

        div#LoadingContainer #LoadingContainer div#LoadingStatus ul#LoadingStatusList {
            list-style: none;
            margin: 10px 0px 0px 0px;
            padding: 0px;
            width: 300px;
        }

            div#LoadingContainer #LoadingContainer div#LoadingStatus ul#LoadingStatusList li {
                margin: 0px 0px 10px 0px;
                padding: 2px 20px 2px 20px;
                width: 300px;
                box-sizing: border-box;
                background-color: black;
                border-radius: 20px;
            }

                div#LoadingContainer #LoadingContainer div#LoadingStatus ul#LoadingStatusList li span.title {
                    padding-right: 20px;
                    color: silver;
                }

                div#LoadingContainer #LoadingContainer div#LoadingStatus ul#LoadingStatusList li span.status {
                    color: white;
                }

section.body-content {
    display: grid;
    grid-template-columns: 200px 1fr;
}

section div.left-bar {
    background-color: #000000;
    color: #56baca;
}
.left-bar-fixed {
    position: fixed !important;
    height: 100vh;
    overflow-y: scroll;
    overflow-x:hidden;
    width:inherit;
    max-width:inherit;
}
.right-part-request {
    position: fixed;
    height: 100vh;
    overflow-y: scroll;
    width:inherit;
    overflow-x:hidden;
    border-left:1px solid #2f2f2f;
}

section div.main-body {
    background-color: #111111;
    padding: 0 0 20px 0;
}

    section div.main-body div.title {
        font-family: "Avenir Next Condensed";
        font-weight: bold;
        font-size: 18px;
        color: #cecece;
        text-transform: uppercase;
        line-height: 100%;
        margin: 0px 0px 25px 0px;
        padding-top: 12px !important;
    }

    section div.main-body div.breadcrumb {
        line-height: 20px;
        font-size: 12px;
        display: flex;
        align-items: center;
    }

        section div.main-body div.breadcrumb span.sep {
            width: 8px;
            height: 1px;
            background-color: #444259;
            border-left: #56baca 1px solid;
            border-right: #56baca 1px solid;
            margin-left: 5px;
            margin-right: 5px;
        }

        section div.main-body div.breadcrumb span.link {
            color: #56baca;
        }

        section div.main-body div.breadcrumb span.active {
            color: #5d858d;
        }

div.icon-button {
    position: relative;
    display: inline-block;
    margin-right: 10px;
    font-size: 1px;
    height: 25px;
    cursor: pointer;
}

    div.icon-button:hover {
        color: #cecece;
    }

    div.icon-button span.icon,
    div.icon-button span.icon-text {
        font-size: 12px;
        display: inline-block;
    }

    div.icon-button.icon-shaded span.icon,
    div.icon-button.icon-shaded span.icon-text {
        padding-left: 5px;
        padding-right: 5px;
        line-height: 25px;
    }

    div.icon-button.icon-shaded span.icon-text {
        border-left: 1px #000000 solid;
    }

    div.icon-button span.image {
        display: block;
        float: left;
        width: 31px;
        height: 31px;
        background-size: cover;
        background-repeat: no-repeat;
        border: 1px #111111 solid;
        margin-right: 5px;
        margin-top: -3px;
    }

div.search {
    border: 1px #5d858d solid;
}

    div.search input {
        font-size: 10px;
        border: 0px;
        padding: 2px 5px 2px 5px;
        width: 80px;
        margin-right: 5px;
        box-sizing: border-box;
        background-color: #000000;
        color: #56baca;
    }

    div.search span.icon {
        margin-right: 5px;
        line-height: 23px;
        height: 23px;
    }

div.icon-shaded {
    background: #353346;
    background: -moz-linear-gradient(-45deg, #353346 0%, #2d3c41 100%);
    background: -webkit-gradient(left top, right bottom, color-stop(0%, #353346), color-stop(100%, #2d3c41));
    background: -webkit-linear-gradient(-45deg, #353346 0%, #2d3c41 100%);
    background: -o-linear-gradient(-45deg, #353346 0%, #2d3c41 100%);
    background: -ms-linear-gradient(-45deg, #353346 0%, #2d3c41 100%);
    background: linear-gradient(135deg, #353346 0%, #2d3c41 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#353346', endColorstr='#2d3c41', GradientType=1 );
}

span.icon.set1 {
    font-family: 'Font Awesome 5 Free';
}

span.icon.set2 {
    font-family: 'Font Awesome 5 Free';
    font-weight: bold;
}

a.pilot-info {
    /* padding-left: 1.4rem;*/
    cursor: pointer;
    max-height: 90px;
    min-height: 90px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items:center;
}
    a.pilot-info img {
        max-width: 100%;
        padding: 14px 0 8px 0;
        max-width: 224px;
        /*  padding-right: 6px;*/
        /* width: 200px;*/
        max-height: 100px;
        object-fit: contain;
        object-position: left;
    }
    div .pilot-info > div {
        margin: auto auto auto auto;
        text-align: center;
    }

    div.pilot-info div.pilot-image {
        width: 50px;
        height: 50px;
        background-size: cover;
        background-repeat: no-repeat;
        border: 1px #111111 solid;
        margin-bottom: 5px;
        border-radius: 50%;
    }

    div.pilot-info div.pilot-name {
        color: #cecece;
        margin-bottom: 5px;
    }

div.pilot-registration {
    display: grid;
    margin: 0px auto 20px auto;
    width: 70%;
    grid-template-columns: 20px 1fr;
    font-size: 12px;
    grid-row-gap: 2px;
    margin-bottom: 5px;
    color: #5d858d;
}

    div.pilot-registration div.text {
        background-color: #111111;
        padding: 0px 5px 0px 5px;
    }

div.date-time {
    display: grid;
    margin: 20px auto 20px auto;
    width: 90%;
    /*border: 1px $BodyBackgroundColor solid;*/
    text-align: center;
    grid-template-columns: 1fr 1px 1fr;
    /*div.sub-title {
    color: $BodyColor !important;
    padding: 5px 10px 5px 10px;
    font-family: Avenir Next Condensed;
    font-size: 14px;
    font-weight: bold;
    text-transform: initial;
    text-align: left;
    font-style: italic !important;
  }*/
    /*div.grid-column > div.sub-title {
    padding: 5px 10px 5px 10px;
    font-family: Avenir Next Condensed;
    font-size: 14px;
    text-transform: initial;
    text-align: left;
    font-style: italic;
  }*/
}

    div.date-time div.date,
    div.date-time div.time {
        padding: 10px;
    }

    div.date-time div.form-group > div.sub-title {
        color: #cecece;
        padding: 5px 10px 5px 10px;
       
        font-size: 14px;
        font-weight: bold;
        text-transform: initial;
        font-style: italic !important;
        text-align: left;
    }

    div.date-time div.border {
        background-color: #111111;
    }

ul#MainMenu {
    list-style: none;
    margin: 0px;
    padding: 0px;
    font-size: 13px;
}

    ul#MainMenu li {
        list-style: none;
        margin: 0px;
        padding: 15px 0px 15px 25px;
        border-left: 0px #000000 solid;
        text-align: left;
    }
@media(min-width:1700px) {


    ul#MainMenu li {
        padding: 15px 0px 15px 1.2rem;
    }
}
        ul #MainMenu li a {
            color: #cecece;
            text-decoration: none;
        }

        ul#MainMenu li span.icon {
            font-size: 20px;
            width: 30px;
            display: inline-block;
        }

     /*   ul#MainMenu li:hover, ul#MainMenu li.active {
            border-left: 2px white solid;
            border-left: 2px white solid;
            background-color: #545356;
            color: #56baca;
        }

            ul#MainMenu li:hover a, ul#MainMenu li.active a {
                color: #cecece;
            }*/

ul#SubMenu {
    list-style: none;
    margin: 0px;
    padding: 7px;
    font-size: 13px;
}

    ul#SubMenu li {
        list-style: none;
        margin: 0px;
        padding: 10px 0px 10px 10px;
        border-left: 2px #000000 solid;
        text-align: left;
    }

        ul#SubMenu li a {
            color: #cecece;
            text-decoration: none;
        }

        ul#SubMenu li span.icon {
            font-size: 20px;
            width: 30px;
            display: inline-block;
        }

        ul#SubMenu li:hover, ul#SubMenu li.active {
            border-left: 2px white solid;
            background-color: #545356;
            color: #56baca;
        }

            ul#SubMenu li:hover a, ul#SubMenu li.active a {
                color: #cecece;
            }

div.grid-section {
    display: grid;
    grid-gap: 20px;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: repeat(auto-fill);
}

div.ChartContainer {
    position: relative;
    border: 1px #ed145b solid;
    box-sizing: border-box;
}

    div.ChartContainer div.Chart {
        height: 200px;
        width: 100%;
        padding: 2px;
    }

    div.ChartContainer div.DragHandler {
        position: absolute;
        top: 2px;
        right: 2px;
        visibility: hidden;
        cursor: all-scroll;
        color: #5d858d;
    }

    div.ChartContainer:hover div.DragHandler {
        visibility: visible;
    }

    div.ChartContainer.span1 {
        grid-column: span 1;
    }

    div.ChartContainer.span2 {
        grid-column: span 2;
    }

    div.ChartContainer.span3 {
        grid-column: span 3;
    }

    div.ChartContainer div.ChartTitle {
        text-transform: uppercase;
        color: #cecece;
        padding: 5px 5px 5px 5px;
        font-size: 12px;
    }

    div.ChartContainer div.ChartWithLegend.None div.ChartLegends {
        display: none;
    }

    div.ChartContainer div.ChartWithLegend.Right {
        grid-template-columns: 1fr 100px;
        display: grid;
    }

    div.ChartContainer div.ChartWithLegend.Bottom div.Chart {
        height: 156px;
    }

    div.ChartContainer div.ChartWithLegend.Bottom div.ChartLegends {
        height: 44px;
        overflow: hidden;
        overflow-y: no-display;
        border-top: 1px #ed145b solid;
        padding-right: 16px;
        /* width */
        /* Track */
        /* Handle */
        /* Handle on hover */
    }

        div.ChartContainer div.ChartWithLegend.Bottom div.ChartLegends::-webkit-scrollbar {
            width: 10px;
        }

        div.ChartContainer div.ChartWithLegend.Bottom div.ChartLegends::-webkit-scrollbar-track {
            background-color: transparent;
        }

        div.ChartContainer div.ChartWithLegend.Bottom div.ChartLegends::-webkit-scrollbar-thumb {
            background: #5d858d;
        }

            div.ChartContainer div.ChartWithLegend.Bottom div.ChartLegends::-webkit-scrollbar-thumb:hover {
                background: #56baca;
            }

        div.ChartContainer div.ChartWithLegend.Bottom div.ChartLegends:hover {
            overflow-y: scroll;
            padding-right: 6px;
        }

    div.ChartContainer.span2 div.ChartWithLegend.Bottom UL.Legents,
    div.ChartContainer.span1 div.ChartWithLegend.Bottom UL.Legents {
        display: grid;
        grid-gap: 0px;
    }

        div.ChartContainer.span2 div.ChartWithLegend.Bottom UL.Legents li,
        div.ChartContainer.span1 div.ChartWithLegend.Bottom UL.Legents li {
            border-collapse: collapse;
        }

    div.ChartContainer.span1 div.ChartWithLegend.Bottom UL.Legents {
        grid-template-columns: 1fr 1fr;
    }

    div.ChartContainer.span2 div.ChartWithLegend.Bottom UL.Legents {
        grid-template-columns: 1fr 1fr 1fr;
    }

    div.ChartContainer UL.Legents {
        margin: 5px 0px 5px 0px;
        padding: 0px;
        list-style: none;
        font-size: 10px;
        line-height: 16px;
    }

        div.ChartContainer UL.Legents li {
            margin: 0px;
            padding: 1px 5px 1px 5px;
            list-style: none;
            white-space: nowrap;
            overflow: hidden;
        }

            div.ChartContainer UL.Legents li div.square {
                border-radius: 50%;
                width: 10px;
                height: 10px;
                line-height: 25px;
                display: inline-block;
                margin-right: 5px;
            }

            div.ChartContainer UL.Legents li div.legend-item-label {
                display: inline-block;
            }

table.tabular-table {
    width: 100%;
    height: 100%;
}

    table.tabular-table tr td {
        border-bottom: 1px #ed145b solid;
        padding: 10px;
    }

        table.tabular-table tr td:last-child {
            border-left: 1px #ed145b solid;
        }

        table.tabular-table tr td.title {
            color: #5d858d;
        }

        table.tabular-table tr td.data {
            color: #56baca;
            font-size: 22px;
            text-align: right;
        }

    table.tabular-table tr:last-child td {
        border-bottom: 0px #56baca none;
    }

div.ChartContainer.span1 table.tabular-table tr td.title {
    font-size: 14px;
}

span.tooltip-header,
span.tooltip-name,
span.tooltip-data,
span.tooltip-color {
    font-size: 10px;
    font-family: 'Titillium Web';
}

span.tooltip-color {
    display: inline-block;
    width: 5px;
    margin-right: 5px;
}

span.tooltip-header {
    color: #cecece;
    font-weight: bold;
}

span.tooltip-name {
    color: #5d858d;
}

span.tooltip-data {
    color: #56baca;
}

@media screen and (max-width: 1200px) {
    div.grid-section {
        display: grid;
        grid-gap: 20px;
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media screen and (max-width: 1050px) {
    div.grid-section {
        display: grid;
        grid-gap: 20px;
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 900px) {
    div.grid-section {
        display: grid;
        grid-gap: 20px;
        grid-template-columns: 1fr;
    }

    div.ChartContainer.span1,
    div.ChartContainer.span2,
    div.ChartContainer.span3 {
        grid-column: span 1;
    }

    section.body-content {
        grid-template-columns: 80px 1fr;
    }

    div.pilot-info {
        width: 80px;
    }

    ul#MainMenu li span.text,
    div.pilot-registration {
        display: none;
    }

    div.date-time {
        grid-template-columns: 1fr;
    }

        div.date-time div.border {
            display: none;
        }

    section.header {
        grid-template-columns: 100px 1fr 1fr;
        background-color: #000000;
    }

        section.header div.left {
            padding-left: 10px;
            padding-right: 10px;
        }

            section.header div.left img {
                width: 100%;
                height: auto;
            }
}

div.leaflet-control-attribution {
    display: none;
}

div#OverlayBackground {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    z-Index: 1000;
    display: none;
}

div#PopupWindow {
    width: 80%;
    height: 80%;
    border: 1px #ed145b solid;
    margin: 5% auto auto auto;
}

div#PopupWindowTitle {
    font-family: 'Titillium Web';
    font-size: 16px;
    line-height: 30px;
    background-color: #111111;
    color: white;
    padding-left: 10px;
    padding-right: 10px;
    text-transform: uppercase;
}

    div#PopupWindowTitle span.PopupWindowHide {
        display: block;
        float: right;
        color: red;
        cursor: pointer;
    }

iframe#PopupWwindowIframe {
    width: 100%;
    height: calc(100% - 30px);
    border: 0px;
    padding: 0px;
}

div.filterdropdown {
    position: relative;
}

    div.filterdropdown ul.filterdropdown-menu {
        background-color: #000000;
        display: none;
        position: absolute;
        top: 25px;
        right: 0px;
        font-size: 16px;
        list-style: none;
        margin: 0px;
        padding: 0px;
        color: #56baca;
        z-index: 99;
    }

        div.filterdropdown ul.filterdropdown-menu li {
            white-space: nowrap;
            list-style: none;
            padding: 5px 10px 5px 10px;
            color: #56baca;
            border-left: 2px #000000 solid;
        }

            div.filterdropdown ul.filterdropdown-menu li:hover {
                background-color: #545356;
                border-left: 2px #cecece solid;
                color: #56baca;
            }

            div.filterdropdown ul.filterdropdown-menu li span.icon {
                visibility: hidden;
                color: #56baca;
            }

            div.filterdropdown ul.filterdropdown-menu li div.div-date-picker {
                display: none;
            }

            div.filterdropdown ul.filterdropdown-menu li.active {
                background-color: #545356;
                border-left: 2px #cecece solid;
                color: #cecece;
            }

                div.filterdropdown ul.filterdropdown-menu li.active div.div-date-picker {
                    display: block;
                }

                div.filterdropdown ul.filterdropdown-menu li.active span.icon {
                    visibility: visible;
                }

.dataTables_wrapper .dataTables_filter input {
    background-color: #333333 ;
    border-radius: 25px;
    border: 0;
    color: #cecece;
    padding-left: 8px;
}

.dataTables_wrapper {
    position: relative;
    clear: both;
    zoom: 1;
    padding: 7px 10px 0px 10px;
    border-radius: 25px;
    background-color: #222222;
}

table.report tbody tr:hover td {
    transition: background-color 100ms linear;
    background-color: #6b6b6b;
}

table.dataTable.no-footer {
    border-bottom: 1px none #222222 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background-color: black !important;
    /*border: 0 !important;*/
}

table#ConfigTable thead {

    font-size: 13pt;
    font-weight: bolder;
    white-space: nowrap;
    text-transform: uppercase;
}

div#LoginForm {
    width: 500px;
    height: auto;
    padding: 30px;
    border-radius: 65px;
    background-color: #222222;
    color: #dedede;
}

div#LoginFormAero {
    width: auto;
}

div.form-section div.form-label {
    margin: 0px 0px 5px 0px;

}

div.form-section {
    margin: 0px 0px 15px 0px;
}

input
input[type="text"], input[type="number"] {
    border: 0;
    background-color: #333333;
    color: #cecece;
}

input[type="text"], input[type="number"] {
    /*border: 0;
  background-color: #222222;
  color: #cecece;*/
    width: 100%;
    padding: 7px 12px 7px 12px;
    margin: 0px;
    box-sizing: border-box;
    font-size: 12pt;
    border-radius: 25px;
  
}

input[type="color"] {
    /*border:0;
  width: 50%;*/
    /*padding: 7px 12px 7px 12px;
  margin: 0px;
  /*box-sizing: border-box;*/
    /*border-radius: 15px;*/
}

input[type="color"] {
    -webkit-appearance: none;
    border: none;
    width: 50%;
    height: 28px;
    background-color: none !important;
}

    input[type="color"]::-webkit-color-swatch-wrapper {
        padding: 0;
        background-color: none !important;
    }

    input[type="color"]::-webkit-color-swatch {
        background-color: none !important;
        border: none;
    }

input[type="button"], input[type="submit"] {
    background-color: #333333;
    color: #cecece;
  
}

input[type="button"], input[type="submit"] {
    padding: 7px 12px 7px 12px;
    margin: 0px;
    box-sizing: border-box;
    font-size: 12pt;
    border: 0;
    border-radius: 5px;
   
    cursor:pointer;
}

h3 {
  
    /*padding: 7px 12px 7px 12px;*/
    margin: 0px;
    font-size: 15pt;
    font-weight: bold;
    color: #cecece;
    /*padding-left: 25px;*/
    padding-top: 20px;
    padding-bottom: 20px;
    text-transform: uppercase;
}

ul#MainMenu li a {
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
}
    ul#MainMenu li a:hover{
        cursor:pointer;
        color:white;
    }
    /*ul#MainMenu li:hover, ul#MainMenu li.active {
    border-left: 0;
    background-color: black;
    color: #fd4c3d;
}*/
    section div.left-bar {
        background-color: #000000;
        color: #cecece;
    }

div.pilot-registration div.text {
    background-color: #000000;
    padding: 0px 5px 0px 5px;
    color: #cecece;
}

div.pilot-registration {
    font-size: 12px;
    color: #cecece;
}

/*ul#MainMenu li:hover a, ul#MainMenu li.active a {
    color: #fd4c3d;
}*/

div.icon-button-aero {
    position: relative;
    display: inline-block;
    margin-right: 10px;
    font-size: 20px;
    height: 25px;
    cursor: pointer;
    align-items: center;
}

    div.icon-button-aero:hover {
        color: #cecece;
    }

.servermessage {
    color: #56baca;
}

section.grid-2-columns,
div.grid-2-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 45px;
    padding: 0px;
}

div.grid-column {
    margin: 0px 0px 8px 0px;
}

section.grid-3-columns {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 16px;
    padding: 0px;
}

    section.grid-3-columns > div.grid-column {
        margin: 0px;
        padding: 14px;
    }

        section.grid-3-columns > div.grid-column div.fixed-height {
            height: 400px;
            overflow: auto;
        }

            section.grid-3-columns > div.grid-column div.fixed-height div.btn_ExpandOnMobile {
                display: none;
            }

        section.grid-3-columns > div.grid-column.col-2-of-3 {
            width: 100%;
        }

        section.grid-3-columns > div.grid-column:last-child {
            margin-right: 0px;
        }

        section.grid-3-columns > div.grid-column div.content {
            width: 100%;
            box-sizing: border-box;
            padding: 10px;
        }

        section.grid-3-columns > div.grid-column ul.general-list {
            margin: 0px 0px 8px 0px;
        }

div.form-group label {
    
    font-size: 19px;
/*    margin-left: 15px;
    margin-right: 20px;*/
}

div.form-group input[type=text], input[type=number], input[type=text] {
    padding: 5px 19px;
    background-color: #111212 ;
    outline: none !important;
  
    color: #cacaca;
    font-size: 16px ;
    height: 45px;
    border: 1px solid #777;
    max-width: 500px;
    width: 100%;
    text-transform: none !important;
    border-radius: 4px;
}

select {
    box-sizing: border-box !important;
    padding: 2px 20px 2px 20px !important;
    font-family: 'Avenir Next Condensed' !important;
    /*width: 100%;*/
    border: 1px #222222 !important;
    font-size: 18px !important;
    border-radius: 25px !important;
    background-color: #333333 !important;
    color: #cecece !important;div.form-group input[type=number] 
    margin-top: 5px !important;
    margin-bottom: 16px !important;
}



#hbreach, #vbreach, #deconflictradius, #deconflictDAT, #deconflictMVS, #ddvbreach, #ddhbreach, #Deconfig_deconflictradius, #Deconfig_deconflictMVS {
    box-sizing: border-box !important;
    padding: 2px 20px 2px 20px !important;
    font-family: 'Avenir Next Condensed' !important;
    width: auto !important;
    /*border: 1px #222222 !important;*/
    /*font-size: 18px !important;*/
    /*border-radius: 25px !important;*/
    /*background-color: #333333 !important;*/
    color: #cecece !important;
    margin-top: 5px !important;
    margin-bottom: 16px !important;
}

#aerosubmenu, #modulesubmenu, #deconfliction, #dsmsubmenu, #possubmenu {
    padding-left: 30px !important;
}

span.error-rules{
    color:red;
}
input[type=date] {
    position: relative;
    left:unset;
    top:unset;
}
::-webkit-calendar-picker-indicator {
    filter: invert(0);
    width: 90%;
    position: absolute;
    background: transparent;
}

.reload-icon {
    background-image: url("data:image/svg+xml,%3Csvg width='19' height='22' viewBox='0 0 19 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.4545 5.25011C12.4545 5.25011 13.7002 4.63647 9.18182 4.63647C7.56361 4.63647 5.98174 5.11633 4.63625 6.01536C3.29075 6.91439 2.24207 8.19221 1.62281 9.68724C1.00355 11.1823 0.841518 12.8274 1.15722 14.4145C1.47291 16.0016 2.25215 17.4595 3.3964 18.6037C4.54065 19.748 5.99851 20.5272 7.58563 20.8429C9.17274 21.1586 10.8178 20.9966 12.3129 20.3773C13.8079 19.758 15.0857 18.7094 15.9848 17.3639C16.8838 16.0184 17.3636 14.4365 17.3636 12.8183' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round'/%3E%3Cpath d='M9.18176 1L13.7272 5.09091L9.18176 9.18182' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}
#ADSBSpeedSlider{
    padding-left:30px;
}
.hr-line {
    background: #2F2F2F;
    margin:20px 0;
}

.switch {
    font-size: 1rem;
    position: relative;
    float: right;
    transform: scale(.8);
}

    .switch input {
        position: absolute;
        height: 1px;
        width: 1px;
        background: none;
        border: 0;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        overflow: hidden;
        padding: 0;
    }
        .switch input:focus{
            box-shadow:none;
        }

        .switch input + label {
            position: relative;
            min-width: calc(calc(2.375rem * 0.8) * 2);
            border-radius: calc(2.375rem * 0.8);
            height: calc(2.375rem * 0.8);
            line-height: calc(2.375rem * 0.8);
            display: inline-block;
            cursor: pointer;
            outline: none;
            left: -12px;
            user-select: none;
            vertical-align: middle;
            text-indent: calc(calc(calc(2.375rem * 0.8) * 2) + 0.5rem);
        }

            .switch input + label::before,
            .switch input + label::after {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: calc(calc(2.375rem * 0.8) * 2);
                bottom: 0;
                display: block;
            }

            .switch input + label::before {
                right: 0;
                background-color: #969696;
                border-radius: calc(2.375rem * 0.8) !important;
                transition: 0.2s all;
                height:auto !important;
                border:0 !important;
            }

            .switch input + label::after {
                top: 2px;
                left: 2px;
                width: calc(calc(2.375rem * 0.8) - calc(2px * 2));
                height: calc(calc(2.375rem * 0.8) - calc(2px * 2));
                border-radius: 50%;
                background-color: white;
                transition: 0.2s all;
            }

        .switch input:checked + label::before {
            background: #5DBFD5 !important;
            background-size: inherit !important;
            border-radius: inherit !important;
            /*  background-image:none !important;*/
        }

        .switch input:checked + label::after {
            margin-left: calc(2.375rem * 0.8);
        }

        .switch input:focus + label::before {
            outline: none;
            box-shadow: 0 0 0 0.2rem rgba(0, 136, 221, 0.25);
        }

        .switch input:disabled + label {
            color: ;
            cursor: not-allowed;
        }

            .switch input:disabled + label::before {
                background-color: #e9ecef;
            }

    .switch.switch-sm {
        font-size:16px;
    }

        .switch.switch-sm input + label {
            min-width: calc(calc(1.9375rem * 0.8) * 2);
            height: calc(1.9375rem * 0.8);
            line-height: calc(1.9375rem * 0.8);
            text-indent: calc(calc(calc(1.9375rem * 0.8) * 2) + 0.5rem);
        }

            .switch.switch-sm input + label::before {
                width: calc(calc(1.9375rem * 0.8) * 2) !important;
                height:inherit !important;
            }

            .switch.switch-sm input + label::after {
                width: calc(calc(1.9375rem * 0.8) - calc(2px * 2));
                height: calc(calc(1.9375rem * 0.8) - calc(2px * 2));
            }

        .switch.switch-sm input:checked + label::after {
            margin-left: calc(1.9375rem * 0.8);
        }


    .switch + .switch {
        margin-left: 1rem;
    }
.caleran-container .caleran-input {
    background: #000000 !important;
    border: 1px solid #60240a !important;
}
    .caleran-container .caleran-input .caleran-calendars .caleran-calendar .caleran-days-container .caleran-weekend{
        color:white !important;
    }
    .caleran-container .caleran-input .caleran-calendars .caleran-calendar .caleran-days-container .caleran-today {
        color: #5DBFD5 !important;
        border-radius: 4px !important;
    }
    .caleran-container .caleran-input .caleran-calendars .caleran-calendar .caleran-days-container .caleran-dayofweek {
        text-transform: capitalize !important;
        font-size: 10px !important;
        font-weight: 500 !important;
    }
    .caleran-container .caleran-input .caleran-calendars .caleran-calendar .caleran-title{
        font-weight:300 !important;
        font-size:16px !important;
    }
.caleran-month-switch{
    font-weight:300 !important;
}
.caleran-container .caleran-input .caleran-calendars .caleran-calendar .caleran-days-container .caleran-day.caleran-end {
    background: #5DBFD5 !important;

}
.caleran-container .caleran-input .caleran-calendars .caleran-calendar .caleran-days-container .caleran-day.caleran-end span {
    background: #5DBFD5 !important;
}
.caleran-container .caleran-input .caleran-calendars .caleran-calendar .caleran-title .caleran-month-switch:hover {
    color: #5DBFD5 !important;
}
.caleran-container .caleran-input .caleran-calendars .caleran-calendar .caleran-title .caleran-year-switch:hover {
    color: #5DBFD5 !important;
}