/* */
html { overflow: scroll; }

.navbar-end { flex-grow: 0.33; }
.navbar-end .navbar-item { width: 100%; }
.navbar-end form { width: 100%; }
.navbar-end input { color: #fff; background: transparent; box-shadow: none; border: none; border-radius: 0; border-bottom: 1px solid #98b8ed;}
.navbar-end input::placeholder { color: #98b8ed; }
.navbar-end input:focus { border-color: #fff; }
.navbar-end .control .icon { color: #98b8ed; }
.navbar-end .control .icon { color: #98b8ed; }

.navbar-end a.navbar-item {
    width: auto;
}
.navbar-end a.is-active {
    background-color: transparent !important;
}

@keyframes reload {
    0% { background-image: linear-gradient(to top, #2366d1ff 0%, #2366d100 10%); }
    10% { background-image: linear-gradient(to top, #2366d1ff 10%, #2366d100 20%); }
    20% { background-image: linear-gradient(to top, #2366d1ff 20%, #2366d100 30%); }
    30% { background-image: linear-gradient(to top, #2366d1ff 30%, #2366d100 40%); }
    40% { background-image: linear-gradient(to top, #2366d1ff 40%, #2366d100 50%); }
    50% { background-image: linear-gradient(to top, #2366d1ff 50%, #2366d100 60%); }
    60% { background-image: linear-gradient(to top, #2366d1ff 60%, #2366d100 70%); }
    70% { background-image: linear-gradient(to top, #2366d1ff 70%, #2366d100 80%); }
    80% { background-image: linear-gradient(to top, #2366d1ff 80%, #2366d100 90%); }
    90% { background-image: linear-gradient(to top, #2366d1ff 90%, #2366d100 100%); }
    100% { background-image: linear-gradient(to top, #2366d1ff 100%, #2366d1ff 100%); }
}

.container.is-fluid { margin-left: 0; padding: 1.5rem 0; }


/* aside menu has toggle for mobile */
aside.menu { padding: 1.5rem; margin-top: -1.5rem; }

main { flex-grow: 1; flex-shrink: 1; }

h1 .links,
h2 .links {
    margin: 0 1rem;
}
h1 { display: flex; }
h1 .meta,
h2 .meta {
    margin-left: auto;
    font-size: 1rem;
    font-weight: normal;
    padding-top: 0.5rem;
}

/* desktop+ */
@media screen and (min-width: 1024px) {
    aside.menu { flex-grow: 0; flex-shrink: 0; flex-basis: 12rem; padding: 1.5rem; margin-right: 1.5rem; margin-top: -1.5rem; }
}
/* mobile & touch */
@media screen and (max-width: 1023px) {

    /* mobile menu has white background, so change our text color */
    .navbar-end input { color: #363636; }

    aside.menu { padding: 0.5rem 1.5rem; margin-bottom: 1.5rem; }
    aside #aside-menu { display: none; padding-top: 1rem; }

    aside a[role=button] { display: block; height: 1rem;}
    aside a[role=button] span { display: block; background: hsl(0, 0%, 71%); position: relative; height: 1px; margin: 0 auto; width: 66%; }
    aside a[role=button] span:nth-child(1) { top: calc(50% - 1px); }
    aside a[role=button] span:nth-child(2) { top: calc(50% + 1px); }

    #aside-menu.is-active { display: block; }

    main { padding: 0 1.5rem; }

    /* show meta created below title */
    h1 { display: block; }
    h1 .meta,
    h2 .meta {
        margin-left: 0;
        display: block;
    }
}

table th.num:not([align]),
table td.num:not([align]) { text-align: right; }

table.table.has-bottom-controls { margin-bottom: 0.5rem; }
.bottom-controls { margin-bottom: 1.5rem; }

div.section { margin: 0 0 1rem 0; padding: 0; }
div.section h4.title { margin-bottom: 1rem; }

div.section.collapsible h4.title { cursor: pointer; border-bottom: 1px solid #fff; }
div.section.collapsible h4.title:hover { border-bottom: 1px solid #dbdbdb; }

div.section.collapsible h4.title:hover::after { content: " ▴"; }
div.section.is-collapsed h4.title { color: #7a7a7a; border-bottom: 1px solid #dbdbdb; }
div.section.is-collapsed h4.title:hover::after { content: " ▾"; }
div.section.is-collapsed .content,
div.section.is-collapsed table { display: none; }

a.toggle-tools.is-active span {
    transform: rotate(180deg);
}
form.tools-form { display: none; margin-bottom: 1rem; }
form.tools-form.is-active { display: block; }
form .checkboxes { }
form .checkboxes label { margin-right: 0.5rem; padding-top: 0.375em; }

.search-result p { font-size: 0.75rem; }
.search-result h3.title { margin: 0 0 0.5rem 0; }
.search-result { margin-bottom: 1.5rem; }
.search-result p { margin-bottom: 0.25rem; }
.search-result em { font-style: normal; background: hsl(48, 100%, 67%) }