/* =========== *
 * ## Fonts ##
 * =========== */

@font-face {
   font-family: "Lato";
   src: local("Lato"), url("fonts/Lato/Lato-Bold.ttf");
   font-weight: bold;
}

@font-face {
   font-family: "Lato";
   src: local("Lato"), url("fonts/Lato/Lato-BoldItalic.ttf");
   font-style: italic;
   font-weight: bold;
}

@font-face {
   font-family: "Lato";
   src: local("Lato"), url("fonts/Lato/Lato-Italic.ttf");
   font-style: italic;
}

@font-face {
   font-family: "Lato";
   src: local("Lato"), url("fonts/Lato/Lato-Regular.ttf");
   font-weight: normal;
}


/* ================== *
 * ## Miscelaneous ##
 * ================== */
abbr[title], abbr[data-original-title] { text-decoration: none; }

p:first-of-type:last-of-type:first-child:last-child { margin-bottom: 0 !important }

.btn:hover, .button:hover, button:hover { opacity: 1 !important; }

._rbb {
    float: left;
    height: 100%;
    position: relative;
    width: 100%;
}

/* ================ *
 * ## Box Shadow ##
 * ================ */

.ri-boxshd .row-item,
.boxshd { box-shadow: 0px 0px 20px -5px rgba(0, 0, 0, 0.45); }

.boxshd-thin { box-shadow: 0 0 5px 0 rgba(0, 0, 0, .25); }


/* ============ *
 * ## Charts ##
 * ============ */

#chart-info { height: 200px; }


/* ======================== *
 * ## Dropdown Component ##
 * ======================== */

.dropdown-component:not(.tools-dropdown) .list-toggle .icon { stroke-width: 5px; }
.dropdown-component .role-display,
.dropdown-component .role-listitems .list-item[data-value],
.dropdown-component .role-placeholder {
    font-size: .75rem;
}

.dropdown-component .role-list { padding-top: 15px; }
.dropdown-component .role-list .tip { top: 25px; }
.dropdown-component.list-open .role-list .tip { top: 15px; }

.dropdown-component .role-placeholder {
    font-style: italic;
    opacity: .66;
}

.dropdown-component .display-wrapper .list-toggle {
    transition-property: background-color;
    transition-duration: .25s;

    -webkit-transition-property: background-color;
    -webkit-transition-duration: .25s;
}


/* ======== *
 * ## F3 ##
 * ======== */

.f3-edit.f3-image:empty,
.noise-header.iframe-header .f3-item.f3-edit {
    border-style: dashed;
    border-width: 1px;
    background: repeating-linear-gradient(-45deg, #fafafa, #fafafa 10px, #fff 10px, #fff 20px) !important;
}
.noise-header .banner-image .dz-clickable:before { content: attr(nl-caption); }

.f3-new-item-wrapper,
.f3-new-item-wrapper ~ .f3-item-wrapper {
    float: left;
    position: relative;
    width: 100%;
}

.f3-new-item-wrapper {
   left: 50%;
   margin-bottom: 2rem;
   width: 300px;

   transform: translate(-50%,0);
   -webkit-transform: translate(-50%,0);
}

.f3-new-item-wrapper .f3-item-menu { display: none; }

.f3-new-item-wrapper .news-item.new-item {
   border-radius: 0;
   float: left;
   font-style: normal;
   height: 100%;
   outline: none;
   position: relative;
   width: 100%;
}

.f3-new-item-wrapper .news-item.new-item .item-button {
   cursor: pointer;
   height: 40px;
   left: 50%;
   margin-bottom: 10px;
   pointer-events: all;
   position: relative;
   width: 40px;

   transform: translate(-50%,0);
   -webkit-transform: translate(-50%,0);
}

.f3-new-item-wrapper .news-item.new-item .item-button .item-button-icon {
   border-radius: 50%;
   float: left;
   height: 100%;
   padding: 5px;
   pointer-events: none;
   position: relative;
   stroke-width: 2px;
   width: 100%;
}

.f3-new-item-wrapper .news-item.new-item .news-item-content {
   float: left;
   position: relative;
   width: 100%;
}
.f3-new-item-wrapper .news-item.new-item .news-item-content p {
   font-size: .66rem;
   line-height: 20px;
   margin-bottom: 0;
   text-align: center;
}

.f3-new-item-wrapper .news-item.new-item .item-date,
.f3-new-item-wrapper .news-item.new-item .news-item-title {
   display: none;
}

.f3-new-item-wrapper .news-item.new-item * { pointer-events: none; }

.item-editor { max-width: 90vw; }


/* ================ *
 * ## Noise Line ##
 * ================ */

.nline-bottom:after,
.nline-left:after,
.nline-right:after,
.nline-top:after {
    border-style: solid;
    border-width: 0;
    content: "";
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
}

.nline-left:after { border-left-width: 1px !important; }
.nline-left-none:after { border-left-width: 0px !important; }
.nline-right:after { border-right-width: 1px !important; }
.nline-right-none:after { border-right-width: 0px !important; }
.nline-bottom:after { border-bottom-width: 1px !important; }
.nline-bottom-none:after { border-bottom-width: 0px !important; }
.nline-top:after { border-top-width: 1px !important; }
.nline-top-none:after { border-top-width: 0px !important; }


/* =============== *
 * ## z-indexes ##
 * =============== */

.pika-single { z-index: 9900 !important; }
#noise-header { z-index: 9901; }


/* ========= *
 * ## Row ##
 * ========= */

.row {
   position: relative;
   z-index: 0;
}

/* ===================== *
 * ## Chart Component ##
 * ===================== */

.casper-chart-component .highcharts-data-table,
.casper-chart-component .role-HC,
.casper-chart-component .chart-title.no-title + .role-HC {
   height: 200px;
}

.casper-chart-component .highcharts-data-table table { width: 100%; }
.casper-chart-component .highcharts-data-table table caption { display: none; }


/* ============================= *
 * ## Chart Component - Table ##
 * ============================= */

.casper-chart-component .highcharts-data-table tr {
   font-size: 12px;
   line-height: 22px;
}

.casper-chart-component .highcharts-data-table tr td,
.casper-chart-component .highcharts-data-table tr th {
   padding: 0 10px;
}

.casper-chart-component .highcharts-data-table tr td:first-child,
.casper-chart-component .highcharts-data-table tr th:first-child {
   white-space: nowrap;
   width: 0;
}

.casper-chart-component .highcharts-data-table table thead tr {
   background: var(--primary);
   color: var(--white);
}

.casper-chart-component .highcharts-data-table table tbody tr:nth-child(even) {
   background: var(--grey-lighter);
}


/* =============== *
 * ## Container ##
 * =============== */

#noise-header + .container,
.noise-container {
   flex: 1;
   position: relative;
   width: 100%;
   z-index: 100;
}


/* ==================== *
 * ## Cookie Consent ##
 * ==================== */

#cc-window h3,
#cc-window-settings h3 {
   font-size: 16px !important;
   font-weight: bold !important;
}

#cc-window .cc-window-message a,
#cc-window .cc-window-message a:hover,
#cc-window .cc-window-message a:visited {
   text-decoration: none;
}


.noise-p-big/*,
.container [data-type="item"] p:first-of-type,
.container [data-type="news"] p:first-of-type*/ {
    font-weight: bold;
    font-size: 18px;
    line-height: 27px
}

[data-type="item"] h2 {
    margin-top: 3rem !important;
}

[data-type="item"] h2:first-child {
   margin-top: 0 !important;
}

[data-type="item"] h2:after {
    content: "";
    display: block;
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

p.noise-p-small {
    font-size: 12px !important;
    line-height: 21px;
}

.noise-content-tile {
    box-shadow: 0px 0px 20px -5px rgba(0, 0, 0, 0.45);
}

.noise-content-table {
    font-size: 13px;
    line-height: 1.7em;
}

.noise-content-tile p,
.noise-content-tile div {
    font-size: 13px;
    font-weight: normal;
}

.noise-content-tile img {
    max-width: 100%;
}

.noise-content-tile .tile-body {
    float: left;
    position: relative;
    width: 100%;
}

h4.noise-title-bar, .editor-header {
    font-size: 0.9em;
    padding: 8px 10px;
}

.noise-nav-link {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 12px;
    letter-spacing: 0.06em;
}

.noise-centered-intro {
    display: flex;
    align-items: center;
}

.noise-select {
    //background: #fff url('/config/products/noiselab/images/combo-arrow.png') no-repeat right 0rem center;
    margin-right: 55px;
    margin-right: 130px;
    border-radius: 0;
    border: 0;
    margin-top : 3px;
    padding : 0.3rem 1.75rem 0.3rem 0.75rem!important;
    height : calc(2.1rem + 2px);
    font-size : 18px;
}

.noise-bar {
    padding: 5px;
}

.noise-bar div {
    height: 18px;
}

.noise-kruimelpad { font-size: 21px; }

.noise-kruimelpad ul {
    padding: 0;
    margin: 0;
}

.noise-kruimelpad ul li {
    padding: 5px;
    margin-right: -13px;

    list-style-type: none;
    display: inline-block;
}

.noise-kruimelpad ul li:not(:last-child):after {
    padding: 20px;
    content: ">";
}

.noise-container-header h1 {
    font-size: 30px;
    line-height: 1.6em;
    padding: 0 20px;
    margin: 0;
}

.noise-intro {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f1f1f1+100 */
    background: #FFFFFF; /* Old browsers */
    background: -moz-linear-gradient(top, #FFFFFF 0%, #F1F1F1 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #FFFFFF 0%, #F1F1F1 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #FFFFFF 0%, #F1F1F1 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f1f1f1', GradientType=0); /* IE6-9 */
}

.noise-intro h1 {
    font-size: 30px;
}

.noise-intro-button-bar ul {
    padding: 0;
    margin: 0;
    text-align: center;
}

.noise-intro-button-bar ul li {
    list-style-type: none;
    display: inline-block;
}

.noise-intro-button-bar ul li a {
    font-weight: bold;
    font-size: 15px;
    text-transform: uppercase;
    display: inline-block;
    padding: 15px;
    text-decoration: none;
}

.tagged-item {
   display: none;
}

.noise-pagination {
    border: 0;
}

.noise-pagination .page-item .page-link {
    border: 0;
    border-radius: 0;
    margin-right: 10px;
    font-weight: bold;
    line-height : 18px;
}

.noise-pagination .page-item.active .page-link {
    border: 0;
}

.noise-pagination .page-item .page-link.noise-pagination-link-accent {
    font-size: 13px;
    line-height: 18px;
    padding-right: 20px;
    padding-left: 20px;
}

.noise-info-bar {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 10px;
    font-weight: bold;
}

.fixed-ratio {
    position: relative;
    width: 100%;
    height: 0;
}

.ratio-2-1 {
    padding-bottom: 51%;
}

.fixed-ratio > * {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0; top: 0;
}

iframe {
    border: none;
    padding: 0;
    margin: 0;
}

.f3-selected-menu-parent > a:after {
    content: none !important;
}

.row > .f3-item-wrapper {
    flex: 0 0 100%;
    max-width: 100%;
}

h1 .f3-item.f3-edit {
    min-width: 500px;
}


/* ======================== *
 * ## Flighttracking Map ##
 * ======================== */

.fl-map-container {
    display: flex;
    flex-direction: column;
}

.fl-map-container,
.fl-map-container .fl-map {
    float: left;
    height: 100%;
    position: relative;
    width: 100%;
}

.fl-map-container .fl-map {
    display: flex;
    flex: 1;
    -ms-flex: 1;
}

.fl-map-container .fl-map iframe {
    height: 100%;
    width: 100%;
}

.fl-map-container .fl-map-intro {
    font-size: 13px;
    width: 100%;
}

.fl-map-container .fl-map-intro > div {
    float: left;
    height: 100%;
    position: relative;
    width: 100%;
}

.fl-map-container .fl-map-intro > div * { margin-bottom: 0; }


/* ===================== *
 * ## Full row swiper ##
 * ===================== */

.full-row-swiper { position: relative; }

.full-row-swiper .swiper-buttons-container {
    display: block;
    height: 80px;
    left: 50%;
    max-width: 100vw;
    position: absolute;
    top: 50%;
    width: 100vw;

    transform: translate(-50%, -50%);
    transition-property: height, max-width;
    transition-duration: .25s;

    -webkit-transform: translate(-50%, -50%);
    -webkit-transition-property: height, max-width;
    -webkit-transition-duration: .25s;
}

.full-row-swiper .swiper-buttons-container .swiper-button-container {
    height: 100%;
    position: absolute;
    width: 90px;

    transition: width .25s;
    -webkit-transition: width .25s;
}

.full-row-swiper .swiper-buttons-container .swiper-button-container.noise-browse-next {
    right: 0;

    transform: translate(50%, 0);
    -webkit-transform: translate(50%, 0);
}
.full-row-swiper .swiper-buttons-container .swiper-button-container.noise-browse-prev {
    left: 0;

    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
}

.full-row-swiper .swiper-buttons-container .swiper-button {
    border-radius: 50%;
    cursor: pointer;
    float: left;
    height: 100%;
    pointer-events: all;
    position: relative;
    width: 100%;
}

.full-row-swiper .swiper-buttons-container .swiper-button .icon {
    float: left;
    height: 15px;
    overflow: visible;
    pointer-events: none;
    position: absolute;
    stroke-width: 5px;
    top: 50%;
    width: 15px;

    transition-property: height, width;
    transition-duration: .25s;

    -webkit-transition-property: height, width;
    -webkit-transition-duration: .25s;
}

.full-row-swiper .swiper-buttons-container .role-swipe-next .icon {
    right: 75%;
    transform: translate(50%,-50%);
    transition: right .25s;

    -webkit-transform: translate(50%,-50%);
    -webkit-transition: right .25s;
}

.full-row-swiper .swiper-buttons-container .role-swipe-prev .icon {
    left: 75%;
    transform: translate(-50%,-50%);
    transition: left .25s;

    -webkit-transform: translate(-50%,-50%);
    -webkit-transition: left .25s;
}

.full-row-swiper .swiper-buttons-container .swiper-button.swiper-button-disabled {
    cursor: default;
    opacity: .5;
}

.full-row-swiper .role-swiper { width: 100%; }
.full-row-swiper .swiper-slide { padding: 1.5em 15px; }

.full-row-swiper .role-swiper-pagination {
    bottom: 0;
    left: 50%;
    opacity: 0;
    position: absolute;

    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
}

.full-row-swiper .role-swiper-pagination .swiper-pagination-bullet {
    height: 10px;
    width: 10px;
}

.full-row-swiper .role-swiper-pagination .swiper-pagination-bullet + .swiper-pagination-bullet {
    margin-left: 8px;
}

/* ## Accessible Mode ## */
.full-row-swiper[data-accessible=true] .row-item .item-content { padding: 0 !important; }
.full-row-swiper[data-accessible=true] .casper-chart-component .highcharts-data-table { height: 232px; }


/* ======================== *
 * ## HC Export Dropdown ##
 * ======================== */

.hc-export-dropdown .display-wrapper .list-toggle {
   height: 33px;
   padding: 6px;
   width: 33px;
}

.hc-export-dropdown.list-open .list-toggle .icon {
       transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
}

.hc-export-dropdown .role-list { padding-top: 0; }
.hc-export-dropdown .role-list .list-container { float: right; }

.hc-export-dropdown .chart-export-button {
   cursor: pointer;
   display: flex;
   flex-direction: row;
   height: 30px;
   gap: 10px;
   padding: 0 5px;

   background: var(--chart-export-button-bg);
}

.hc-export-dropdown .chart-export-button .icon {
   fill: var(--chart-export-button-fill);
   height: 100%;
   stroke: var(--chart-export-button-stroke);
   stroke-width: 0;
   width: 20px;
}

.hc-export-dropdown .chart-export-button .label {
   color: var(--chart-export-button-font);
   font-size: 10px;
   font-weight: normal;
   line-height: 30px;
}

.hc-export-dropdown .chart-export-button:hover { background: var(--chart-export-button-hover-bg); }
.hc-export-dropdown .chart-export-button:hover .icon {
   fill: var(--chart-export-button-hover-fill);
   stroke: var(--chart-export-button-hover-stroke);
}
.hc-export-dropdown .chart-export-button:hover .label {
   color: var(--chart-export-button-hover-font);
}


/* ========== *
 * ## Item ##
 * ========== */

.item-date {
   float: right;
}

.news-item {
   font-size: 80%;
}

.f3-edit.news-item br {
   display: none;
}

.upload-item .mimetype {
    display: none;
}

.upload-item a {
    pointer-events: none;
    color: inherit;
}


/* ============= *
 * ## Buttons ##
 * ============= */

.btn-round,
.btn-square {
    cursor: pointer;
    height: 40px;
    width: 40px;
    display: flex;
    align-items: center;
    /justify-content: center;

    transition-property: height, margin, width;
    transition-duration: .33s;

    -webkit-transition-property: height, margin, width;
    -webkit-transition-duration: .33s;
}
.btn-round > *,
.btn-square > * { pointer-events: none; }

.btn-round { border-radius: 50%; }

.btn-text {
    cursor: pointer;
    font-size: 12px;
    font-weight: bold;
    line-height: 30px;
    text-align: center;
    text-transform: uppercase;
}


/* ========== *
 * ## Page ##
 * ========== */

.page-content { z-index: 0; }

.page-sidemenu-container {
    display: none;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
    width: 100%;
    z-index: 1;
}

.page-sidemenu-container .page-sidemenu {
    float: left;
    height: 100%;
    position: relative;
    width: 100%;
}

.page-sidemenu .f3-menu-main {
    float: left;
    position: relative;
}

.page-sidemenu ul {
    margin: 0;
    padding: 0;
}

.page-sidemenu ul li {
    list-style-type: none;
}

.page-sidemenu ul li:not(:first-child) > a { border-style: solid; }

.page-sidemenu ul li a {
    display: block;
    font-weight: bold;
    padding: 10px 14px;
    text-decoration: none;
}

.page-sidemenu ul li.f3-selected-menu-item > a {
   pointer-events: none;
}
/*
.page-sidemenu ul li a:not(.active)::after {
    content: url("/config/products/noiselab/images/arrow-right-small.png");
    float: right;
}
*/

.page-sidemenu > .f3-menu > .f3-menu-item > a,
.page-sidemenu > .f3-item-wrapper > .f3-menu > .f3-menu-item > a,
.page-sidemenu .f3-menu-main > li,
.page-sidemenu .f3-menu-parent li {
    display: none;
}

.page-sidemenu .f3-menu-main .f3-selected-menu-parent,
.page-sidemenu .f3-menu-main .f3-selected-menu-parent .f3-selected-menu-parent .f3-selected-menu-item,
.page-sidemenu .f3-menu-main .f3-selected-menu-parent .f3-selected-menu-parent .f3-selected-menu-item li,
.page-sidemenu .f3-menu-main .f3-selected-menu-parent .f3-selected-menu-parent .f3-selected-menu-item > a,
.page-sidemenu ul ul .f3-selected-menu-parent,
.page-sidemenu ul ul .f3-selected-menu-parent li,
.page-sidemenu ul ul .f3-selected-menu-parent > a {
    display: block;
    text-transform: initial;
    margin: 0;
    white-space: nowrap;
}

.page-sidemenu .f3-menu-parent > a {
    background: none;
    color: inherit;
    font-weight: bold;
    padding: 0 0 14px 0;
    text-transform: uppercase;
}

.page-sidemenu .f3-item-menu { display: none; }
.page-sidemenu .f3-item-wrapper .f3-edit { outline: none; }

/* hamburger button */
.page-sidemenu .sidemenu-btn-container {
    height: 100%;
    left: 0;
    position: absolute;
    z-index: 1;
}

.page-sidemenu .sidemenu-btn-container .btn-square {
    /height: 25px;
    /width: 25px;
}

.page-sidemenu .sidemenu-hamburger {
    float: left;
    left: 50%;
    padding: 0;
    position: relative;
    top: 50%;

    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}

.page-sidemenu .sidemenu-hamburger .hamburger-box {
    height: 12px;
    width: 25px;
}

.page-sidemenu .sidemenu-hamburger .hamburger-box .hamburger-inner,
.page-sidemenu .sidemenu-hamburger .hamburger-box .hamburger-inner:after,
.page-sidemenu .sidemenu-hamburger .hamburger-box .hamburger-inner:before {
    height: 2px;
    width: 25px;
}

.page-sidemenu .sidemenu-hamburger:not(.is-active) .hamburger-box .hamburger-inner:after { bottom: -7px; }
.page-sidemenu .sidemenu-hamburger:not(.is-active) .hamburger-box .hamburger-inner:before { top: -7px; }


.page-sidemenu ul ul .f3-selected-menu-parent > a {
    float: left;
    padding: 10px 14px;
    position: relative;
}

/* ============== *
 * ## Row item ##
 * ============== */

.row .row-item + .row-item {
    border-style: solid;
    border-width: 0 0 0 1px;
}

.row-item,
.row-item .item-content,
.row-item .item-header,
.row-item.row-item-expand .item-container {
    float: left;
    position: relative;
}

.row-item,
.row-item .item-container,
.row-item .item-content {
    width: 100%;
}

.row-item.row-item-expand { flex: 1 0 100%; }

.row-item.row-item-contain,
.row-item.row-item-contain .item-container,
.row-item.row-item-contain .item-content {
    height: 100%;
}

.row-item.row-item-expand,
.row-item.row-item-expand .item-container,
.row-item.row-item-expand .item-content {
    height: auto;
}

.row-item-overflow { z-index: 9999; }
.row-item-overflow ~ .row-item-overflow { z-index: 9998; }

.row-item .item-header {
   cursor: weight;
   font-weight: bold;
   width: 100%;
   z-index: 1;
}

.row-item .item-header span[data-dynamic] { padding-left: 5px; }

.row-item .item-header.filled-header {
   display: flex;
   flex-direction: row;
   font-size: 14px;
   justify-content: center;
   line-height: 33px;
   text-align: center;
}

.row-item .item-header:not(.filled-header)
{
   font-size: 18px;
   line-height: 24px;
   padding-top: 24px;
}

.row-item .item-header .info .ui-info-button {
   height: 33px;
   width: 33px;
}
.row-item .item-header .info .ui-info-button .icon {
   padding: 6px;
   stroke: 2px;
}

.row-item .item-header .title { flex: 1; }

.row-item .item-content > div {
    /* Overflow shorthand is not allowed in IE */
    overflow-x: hidden;
    overflow-y: auto;
}
.row-item .item-content > .f3-item-wrapper { overflow: visible; }
.row-item .item-content .dropdown-component {
   overflow: visible; /* IE backup */
   overflow: initial;
}

.row-item.content-left .item-content { padding-left: 0; }
.row-item.content-right .item-content { padding-right: 0; }

.row-item .item-links .item-link {
    clear: both;
    cursor: pointer;
    font-size: 13px;
    float: left;
    height: 30px;
    line-height: 30px;
    margin-top: 5px;
    padding: 0 10px;
    position: relative;
}
.row-item .item-links .item-link:first-child { margin-top: 0; }
.row-item .item-links .item-link:hover { opacity: .8; }

.row-item.row-item-contain .item-container {
    left: 0;
    position: absolute;
    top: 0;
}

.row-item.row-item-contain .item-container .item-content > div { height: 100%; }

.row-item.row-item-contain .item-header.filled-header + .item-container { padding-top: 33px; }
.row-item.row-item-contain .item-header:not(.filled-header) + .item-container { padding-top: 48px; }

.row-item-direction .item-content { gap: 10px; }
.row-item-direction .item-content .radio-button {
   flex: 0;
   overflow: visible;
}
.row-item-direction .item-content .radio-button .label { white-space: nowrap; }


/* ===================== *
 * ## Noise Sub Panel ##
 * ===================== */
.noise-gray-sub-panel .col-12, .noise-gray-sub-panel .col-md-6 {
    padding: 0;
}

.noise-gray-sub-panel .col-12 .f3-item, .noise-gray-sub-panel .col-md-6 .f3-item {
    padding: 0 15px !important;
}

.noise-gray-sub-panel .col-12 .f3-item {
    padding-top: 3rem !important;
    padding-bottom: 1rem !important;
}

.noise-gray-sub-panel .col-md-6 .f3-item {
    padding-bottom: 3rem !important;
    padding-top: 1rem !important;
}

.noise-gray-sub-panel .f3-item:after {
    content: "";
    position: absolute;
    left: -2000px;
    width: 4000px;
    top: 0;
    bottom: 0;
    z-index: -1;
}


/* ==================== *
 * ## Radio Checkbox ##
 * ==================== */

.checkbox, .checkbox .role-label,
.group-checkbox, .group-checkbox .role-label,
.radio-checkbox, .radio-checkbox .role-label {
    float: left;
    min-height: 20px;
    position: relative;
}

.checkbox,
.group-checkbox,
.radio-checkbox {
    cursor: pointer;
    width: 100%;
}

.checkbox.disabled,
.group-checkbox.disabled,
.radio-checkbox.disabled {
    cursor: default;
    opacity: .5;
}

.checkbox .role-label,
.group-checkbox .role-label,
.radio-checkbox .role-label {
    line-height: 30px;
    padding-left: 40px;
    z-index: 1;
}

/*
.checkbox .role-label::first-letter,
.group-checkbox .role-label::first-letter,
.radio-checkbox .role-label::first-letter {
    text-transform: uppercase;
}
*/

.checkbox .role-button,
.group-checkbox .role-button,
.radio-checkbox .role-button {
    height: 100%;
    //left: 0;
    max-height: 30px;
    padding: 8px;
    position: absolute;
    top: 0;
    width: 30px;
    z-index: 0;
}

.checkbox .role-button .icon,
.group-checkbox .role-button .icon,
.radio-checkbox .role-button .icon {
    float: left;
    height: 100%;
    opacity: 0;
    overflow: visible;
    position: relative;
    stroke-width: 5px;
    width: 100%;
}

.checkbox:not(.disabled):hover .role-button .icon,
.group-checkbox:not(.disabled):hover .role-button .icon,
.radio-checkbox:not(.disabled):hover .role-button .icon { opacity: .5; }

.checkbox:not(.disabled).checked .role-button .icon,
.group-checkbox:not(.disabled).checked .role-button .icon,
.radio-checkbox:not(.disabled).checked .role-button .icon { opacity: 1; }



/* ========== *
 * ## Info ##
 * ========== */

.info-table {
    display: flex;
    flex-wrap: wrap;
}

.info-table .info-label,
.info-table .info-value {
    font-size: 14px;
    line-height: 24px;
}

.info-table .info-label { font-weight: bold; }

.info-table .info-label[data-inbound],
.info-table .info-label[data-outbound],
.info-table .info-value[data-inbound],
.info-table .info-value[data-outbound] {
    display: none;
}

.info-table .info-label[data-inbound="INB"],
.info-table .info-label[data-outbound="OUT"],
.info-table .info-value[data-inbound="INB"],
.info-table .info-value[data-outbound="OUT"] {
    display: block;
}


/* ==================== *
 * ## Location Label ##
 * ==================== */

.location-label-container { position: absolute; }
.location-label-container .location-label {
    left: 0;
    position: absolute;
    z-index: 9999;

    transform: translate(-50%, -100%);
    -webkit-transform: translate(-50%, -100%);
}

.location-label-container .location-label .content,
.location-label-container .location-label .svg-icon {
    float: left;
    position: relative;
}

.location-label-container .location-label .content { padding: 6px; }

.location-label-container .location-label .svg-icon {
    height: 20px;
    stroke-width: 2px;
    width: 20px;
}

.location-label-container .location-label .tip {
    bottom: -10px;                  /* height/width * -1 */
    height: 10px;                   /* same as width */
    left: 50%;
    margin-left: -5px;              /* height/width / 2 * -1 */
    pointer-events: none;
    position: absolute;
    width: 10px;                    /* same as height */
}
.location-label-container .location-label .tip:after {
    content: "";
    height: 10px;                   /* same as width */
    left: 0;
    position: absolute;
    top: -5px;                      /* height/width / 2 * 1 */
    width: 10px;                    /* same as height */

    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}


/* ===================== *
 * ## Location Search ##
 * ===================== */

.search-location-component .input-container { flex: 1; }
.search-location-component .input-container .role-input {
    border: 0;
    float: left;
    font-size: .75rem;
    height: 100%;
    line-height: 30px;
    padding: 0 10px;
    width: 100%;
}
.search-location-component .input-container .role-input.input-placeholder { font-style: italic; }

.search-location-component .search-location-input {
    height: 30px;
    display: flex;
    width: 100%;
}

.search-location-component .button-container {
    flex: 0 1 25%;
    position: relative;
}

.search-location-component .button-container .btn-text {
    height: 100%;
    width: 100%;
}

.search-location-component .button-container .search-button {
    float: left;
    position: relative;
    z-index: 0;
}

.search-location-component .button-container .clear-button {
    display: none;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 1;
}

.search-location-component.input-searched .button-container .search-button { display: none; }
.search-location-component.input-searched .button-container .clear-button { display: block; }

.search-location-component .search-location-autocomplete-container { box-shadow: 0 0 5px 0 rgba(0, 0, 0, .25); }

.search-location-component .search-location-autocomplete-list {
   max-height: 0px;
   overflow: visible;
   padding-top: 15px;
   position: absolute;

   transition: max-height .25s;
   -webkit-transition: max-height .25s;
}

.search-location-autocomplete.input-searching .search-location-autocomplete-list {
    max-height: 200px;
}

.search-location-component .pac-item {
    border-top: 0;
    font-family: 'Lato', sans-serif;
    font-size: 10px;
    height: 30px;
    padding: 0 10px;
}
.search-location-component .pac-item-query { font-size: 12px; }


/* ========================== *
 * ## Photo Data Component ##
 * ========================== */

.photo-data-component .role-no-photo {
    display: none;
    left: 0;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%;

    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
}

.photo-data-component.no-photo .role-no-photo { display: block; }


/* ================== *
 * ## NMT Position ##
 * ================== */

.nmt-position-photo {
    overflow: hidden !important;
    position: relative;
}

.nmt-position-photo .role-photo {
    left: 0;
    position: absolute;
    top: 50%;
    width: 100%;

    transform: translate(0,-50%);
    -webkit-transform: translate(0,-50%);
}


/* ================ *
 * ## NMT Legend ##
 * ================ */

.nmt-legend-container,
.nmt-legend-container .label {
    float: left;
    position: relative;
    width: 100%;
}

.nmt-legend-container {
    height: 30px;
    padding-left: 40px;
}

.nmt-legend-container .icon {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 30px;
}

.nmt-legend-container .label { line-height: 30px; }


/* ================= *
 * ## Text Button ##
 * ================= */

.btn-text {
    transition-property: background-color;
    transition-duration: .25s;

    -webkit-transition-property: background-color;
    -webkit-transition-duration: .25s;
}


/* ============= *
 * ## Z-index ##
 * ============= */

.z-1,.z-2,.z-3,.z-4,.z-5,.z-6,.z-7,.z-8,.z-9,
.z-10,.z-20,.z-30,.z-40,.z-50,.z-60,.z-70,.z-80,.z-90,
.z-100,.z-200,.z-300,.z-400,.z-500,.z-600,.z-700,.z-800,.z-900,
.z-1000 {
   position: relative;
}

.z-1 { z-index: 1; }
.z-2 { z-index: 2; }
.z-3 { z-index: 3; }
.z-4 { z-index: 4; }
.z-5 { z-index: 5; }
.z-6 { z-index: 6; }
.z-7 { z-index: 7; }
.z-8 { z-index: 8; }
.z-9 { z-index: 9; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-30 { z-index: 30; }
.z-40 { z-index: 40; }
.z-50 { z-index: 50; }
.z-60 { z-index: 60; }
.z-70 { z-index: 70; }
.z-80 { z-index: 80; }
.z-90 { z-index: 90; }
.z-100 { z-index: 100; }
.z-200 { z-index: 200; }
.z-300 { z-index: 300; }
.z-400 { z-index: 400; }
.z-500 { z-index: 500; }
.z-600 { z-index: 600; }
.z-700 { z-index: 700; }
.z-800 { z-index: 800; }
.z-900 { z-index: 900; }
.z-1000 { z-index: 1000; }


/* ====================== *
 * ## dropdown toggles ##
 * ====================== */
a[data-toggle='dropdown'] { pointer-events: none; }
.navbar a[data-toggle='dropdown'] { pointer-events: all; }


/* ================ *
 * ## Chart Grid ##
 * ================ */

.chart-grid {
   display: grid;
   gap: 30px;
}

.chart-grid .casper-chart-component[data-active="false"] { display: none; }