/* Required css to support functionality, not for theming. Only modify with good reason. */

.tla-aop-results-page:not(.tla-aop-results-page-visible) {
    display: none;
}

.tla-aop-results-page.tla-aop-results-page-visible {
    animation-name: tlaShowPage;
    animation-duration: .66s;
    animation-timing-function: ease-in;
}

.tla-aop-results-nav input[type="radio"] {
    position: fixed;
    left: -999px;
    width: 1px;
    overflow: hidden;
}

@keyframes tlaShowPage {
    from {
        opacity: 0;
    }
    
    to {
        opacity: 1;
    }
}

.tla-unseen {
    position: fixed;
    left: -999px;
    width: 1px;
    overflow: hidden;
}

.tla-legend-focus {
    border: 2px solid #00446B;
    border-radius: 3px;
}

[data-nav-target="AOPNavItem0"] {
    display: flex;
    flex-wrap: wrap;
}

[data-nav-target="AOPNavItem0"] > .tla-aop-chart {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 100%;
}

.tla-flex-break {
    flex-basis: 100%;
    width: 0px; 
    height: 0px; 
    overflow: hidden;
}

@media (min-width: 800px) {

    [data-nav-target="AOPNavItem0"] > .tla-aop-chart {
        flex-basis: inherit;
    }
}