/*
 * Small layout fixes loaded on every page, after the main stylesheets.
 */

/* Header: the six menus + three buttons need ~1460px at default spacing, so on laptop
   screens the dealer buttons were pushed off the right edge. Tighten the spacing instead. */
@media (min-width: 1200px) and (max-width: 1599.98px) {
    #nav-primary .navbar-nav > .nav-item:not(.cta) > .nav-link {
        padding-left: .5rem;
        padding-right: .5rem;
    }
    #nav-primary .navbar-nav > .nav-item.cta {
        margin-left: .5rem !important;
    }
    #nav-primary .navbar-nav > .nav-item.cta .btn {
        padding-left: .5rem;
        padding-right: .5rem;
    }
}
@media (min-width: 1200px) and (max-width: 1365.98px) {
    #nav-primary .navbar-nav > .nav-item:not(.cta) > .nav-link {
        font-size: 13px;
        padding-left: .35rem;
        padding-right: .35rem;
    }
}

/* Hero rows use "no-gutter" (not Bootstrap's "no-gutters") inside a px-0 container, so the
   row's -15px margins stuck out past the screen edge and caused sideways scrolling. */
.container-fluid.px-0 > .row.no-gutter {
    margin-left: 0;
    margin-right: 0;
}

/* Dealer listings: long website addresses wrap instead of running off the screen. */
.dealer-website,
.dealer-website a {
    overflow-wrap: anywhere;
}

/* Tables pasted into page content with a fixed width (e.g. Patents, width="1039") are wider
   than the page container below 1200px, so they ran past the section's background. Fit them
   to the container. Email pages (/eblast-*) don't use .container, so they're left alone. */
@media (min-width: 576px) and (max-width: 1199.98px) {
    .container table[width] {
        width: 100% !important;
        height: auto !important;
    }
}