.download-link { display: block; }

th.stack { width: 15%; }
th.doxygen { width: 29%; }
th.docblox { width: 28%; }
th.sami { width: 28%; }

.main-nav.affix { top: 0; width: 1170px; z-index: 20; }

.navbar-inner {
    background: #ff9e00; /* Old browsers */
    background: -moz-linear-gradient(top, #ff9e00 0%, #ffc054 51%, #ff9e00 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9e00), color-stop(51%,#ffc054), color-stop(100%,#ff9e00)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ff9e00 0%,#ffc054 51%,#ff9e00 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ff9e00 0%,#ffc054 51%,#ff9e00 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ff9e00 0%,#ffc054 51%,#ff9e00 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ff9e00 0%,#ffc054 51%,#ff9e00 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9e00', endColorstr='#ff9e00',GradientType=0 ); /* IE6-9 */
    border-radius: 0;
    border-color: #ff9a00;
}
.navbar .nav>li>a { text-shadow: none; color: black;}

.navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus {
    background: #f69000; color: black;
}

.version-nav { margin-bottom: 5px; }
.tab-pane h3 { margin-top: 0; }

.news ul { list-style: none; padding: 0; margin: 0; }
.news li { list-style: none; border-bottom: 1px solid #ddd; padding-bottom: 10px; margin-top: 10px;  }
.news li p { margin: 0; }

section { border-bottom: 1px solid #ddd; margin-bottom: 3em; padding-bottom: 1em; }

/* ── Tile grid (flexbox) ──────────────────────────────────────────────────── */
#other_resources {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: stretch;
}

#other_resources h3 {
    flex: 0 0 100%;
    width: 100%;
}

.tile {
    display: flex;
    flex-direction: column;
    border: 1px solid #ccc;
    flex: 1 1 calc(33.333% - 10px);
    min-width: 220px;
    padding: 12px;
    border-radius: 4px;
    box-sizing: border-box;
}

.tile h4 { margin-top: 0; }

.tile .btn { margin-top: auto; }

.main-logo {
    display: block;
    width: 300px;
    max-width: 90%;
    height: auto;
    border: 0;
}


/* ── Mobile / Responsive ────────────────────────────────────────────────────── */

@media (max-width: 767px) {

    /* Logo */
    .main-header { text-align: center; padding: 10px 0; }
    .main-logo { max-width: 90vw; width: 220px !important; height: auto; }

    /* Navbar affix: full-width, no fixed pixel width */
    .main-nav.affix { width: 100%; }

    /* Container: tight side padding */
    .container.main { padding-left: 10px; padding-right: 10px; }

    /* Tables: allow horizontal scroll so they don't blow out the viewport */
    section table.table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        width: 100%;
    }

    /* Release columns: drop fixed percentage widths */
    th.stack, th.doxygen, th.docblox, th.sami { width: auto; white-space: nowrap; }

    /* Tiles: single column */
    .tile { flex: 1 1 100%; min-width: 0; }

    /* Download links: more breathing room between options */
    .download-link { padding: 3px 0; }

    /* Sections */
    section { margin-bottom: 1.5em; }

    /* Version tabs: allow wrapping */
    .nav-tabs > li > a { padding: 6px 8px; font-size: 0.9em; }

    /* Copyright footer */
    body > div[style*="text-align:center"] { font-size: 0.9em; padding: 0.6em 10px; }
}

@media (min-width: 768px) and (max-width: 979px) {

    /* Narrow tablets: two-column tiles */
    .tile { flex: 1 1 calc(50% - 10px); min-width: 0; }

    /* Affix: full width (avoids the 1170px overflow) */
    .main-nav.affix { width: 100%; }

    /* Tables scrollable on portrait tablets too */
    section table.table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}