html {
    height: 100%;
}

body {
    /* No scrolling - timeline has builtin scroll */
    position:   relative;
    overflow-x: hidden;
    width:      100%;
    max-width:  100%;
    height:     100%;
    max-height: 100%;
    margin:     0;
    padding:    0;
}

@media (min-width: 400px) {
    .tvg-d-xs1-block {
        display: block !important;
    }
}

@media (min-width: 512px) {
    .tvg-d-xs2-block {
        display: block !important;
    }
}

@media (min-width: 640px) {
    .tvg-d-xs3-block {
        display: block !important;
    }
}

.dropdown-menu {
    z-index: 2000;
}

.tvg-container {
    padding: 0;
}

.breadcrumb {
    display: none;
}

/* Hide default header */
.vis-panel.vis-top {
    display: none;
}

#tvg-grid-container {
    display: grid;
}

#tvg-grid {
    grid-area: 1/1;
}

.tvg-grid-header {
    background: white;
    border:     1px solid #bfbfbf;
}

.tvg-vis-time-axis.vis-background {
    border-left: 1px solid #bfbfbf;
}

.tvg-vis-time-axis .vis-minor {
    border-top: 1px solid #e5e5e5;
}

/* Copied from vis-timeline timeaxis.css */

.tvg-vis-time-axis {
    position: relative;
    overflow: hidden;
}

.tvg-vis-time-axis.vis-foreground {
    top:   0;
    left:  0;
    width: 100%;
}

.tvg-vis-time-axis.vis-background {
    position: absolute;
    top:      0;
    /*left:     0;*/
    width:    100%;
    height:   100%;
}

.tvg-vis-time-axis .vis-text {
    position:    absolute;
    color:       #4d4d4d;
    padding:     3px;
    overflow:    hidden;
    box-sizing:  border-box;

    white-space: nowrap;
}

.tvg-vis-time-axis .vis-text.vis-measure {
    position:      absolute;
    padding-left:  0;
    padding-right: 0;
    margin-left:   0;
    margin-right:  0;
    visibility:    hidden;
}

.tvg-vis-time-axis .vis-grid.vis-vertical {
    position:    absolute;
    border-left: 1px solid;
}

.tvg-vis-time-axis .vis-grid.vis-vertical-rtl {
    position:     absolute;
    border-right: 1px solid;
}

.tvg-vis-time-axis .vis-grid.vis-minor {
    border-color: #e5e5e5;
}

.tvg-vis-time-axis .vis-grid.vis-major {
    border-color: #bfbfbf;
}

/* End of copied css */

.tvg-small {
    font-size: small;
}

.tvg-x-small {
    font-size: x-small;
}

.vis-minor.vis-odd {
    font-size: small;
}

.tvg-line-height-1-1 {
    line-height: 1.1;
}

.tvg-mt-0-5 {
    margin-top: 0.125rem;
}

.tvg-channel .vis-inner {
    padding: 2px 4px !important;
}

.vis-timeline {
    /* Hide top border since we have a custom header with a bottom border */
    border-top: none;
}

.vis-major {
    font-size: large;
}

.vis-minor {
    font-size: medium;
}

.tvg-vis-time-axis.tvg-vis-foreground {
    z-index: 4;
}

.vis-item .vis-item-content {
    padding: 0 .2em;
    width:   100%;
    cursor:  pointer;
}

.vis-current-time {
    z-index:     3;
    width:       20px;
    border:      none;
    border-left: solid rgba(255, 255, 255, 0.3) 1px;
    background:  linear-gradient(
                     to right,
                     rgba(255, 255, 255, 0.25),
                     rgba(255, 255, 255, 0.0)
                 );
}

div.vis-tooltip {
    background-color: black !important;
    color:            white !important;
    padding:          0.25rem 0.5rem;
    text-align:       center;
    border-radius:    0.25rem;
    border:           none;
    font-family:      -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-style:       normal;
    font-weight:      400;
    line-height:      1.5;
}

.tvg-text-justify-hyphens {
    text-align:      left;

    -ms-word-break:  break-all;
    word-break:      break-all;

    /* Non standard for WebKit */
    word-break:      break-word;

    -moz-hyphens:    auto;
    -ms-hyphens:     auto;
    -webkit-hyphens: auto;
    hyphens:         auto;
}

.tvg-text-ellipsis {
    overflow:      hidden;
    white-space:   nowrap;
    text-overflow: ellipsis;
}

.tvg-text-gold {
    color: #ffd700
}

.tvg-text-silver {
    color: #c0c0c0
}

.btn-group-xs > .btn, .tvg-btn-xs {
    padding:       .25rem .4rem;
    font-size:     .875rem;
    line-height:   .5;
    border-radius: .2rem;
}

.tvg-bg-light-gradient {
    /* copied from .navbar.bg-light */
    background-image: linear-gradient(#f9fafb, #f8f9fa 60%, #e9eaeb) !important;
}

.vis-foreground:not(.tvg-vis-time-axis) {
    background-color: #bbb;
}

.tvg-navbar-title {
    display: none;
}