/* Site-specific styles for aasite_new on The Project v2 (Bootstrap 4).
   Carried over from the customizations appended to the old v1 Content/css/style.css,
   plus the styles that were repeated inline in every view. */

.displaynone {
    display: none;
}

@-ms-viewport {
    width: auto !important;
}

@media (max-width: 1189px) {
    .largescreenonly {
        display: none;
    }
}

@media (min-width: 1190px) {
    .largescreenonly {
        display: block;
    }
}

@media (max-width: 769px) {
    .largescreenonlyprev {
        display: none;
    }
}

@media (min-width: 770px) {
    .largescreenonlyprev {
        display: block;
    }
}

@media (max-width: 769px) {
    .showonlarge {
        display: none;
    }
}

@media (min-width: 770px) {
    .showonlarge {
        display: block;
    }
}

@media (max-width: 769px) {
    .showonsmall {
        display: block;
    }
}

@media (min-width: 770px) {
    .showonsmall {
        display: none;
    }
}

.underline-on-hover {
    text-decoration: none !important;
}

    .underline-on-hover:hover {
        text-decoration: underline !important;
    }

@media (min-width: 0px) and (max-width: 977px) {
    .visibleonsmallandlarge {
        display: block !important;
    }
}

@media (min-width: 978px) and (max-width: 1199px) {
    .visibleonsmallandlarge {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .visibleonsmallandlarge {
        display: block !important;
    }
}

@media (max-width: 1189px) {
    .smallscreenonly {
        display: block;
    }
}

@media (min-width: 1190px) {
    .smallscreenonly {
        display: none;
    }
}

@media (max-width: 1189px) {
    .topmarginonsmallscreenonly {
        margin-top: 130px !important;
    }
}

/* Previously inline in each view
----------------------------------------------------------------------------- */
input[type=text]::-ms-clear {
    display: none;
    width: 0;
    height: 0;
}

input[type=text]::-ms-reveal {
    display: none;
    width: 0;
    height: 0;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    display: none;
}

.img1 img {
    opacity: 0.8;
}

    .img1 img:hover {
        opacity: 1.0;
    }

/* Used by the autosuggest rows built in HomeController. Bootstrap 4 has its own .no-gutters
   (zero margins/padding); these restore what the rows looked like under Bootstrap 3. */
.row.no-gutters {
    z-index: 9999 !important;
    margin-right: -15px;
    margin-left: -15px;
}

    .row.no-gutters > [class^="col-"],
    .row.no-gutters > [class*=" col-"] {
        padding-right: 15px;
        z-index: 9999 !important;
        padding-left: 0;
    }

.form-control2 {
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

    .form-control2:focus {
        border-color: #66afe9;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
    }

    .form-control2::-moz-placeholder {
        color: #999;
        opacity: 1;
    }

    .form-control2:-ms-input-placeholder {
        color: #999;
    }

    .form-control2::-webkit-input-placeholder {
        color: #999;
    }

/* Autosuggest rows: picture (col-md-3) with the headline beside it. Bootstrap 4 rows are wrapping
   flex containers, which pushed the headline div (no col class) onto its own line. */
.autosuggest .row.no-gutters {
    flex-wrap: nowrap;
}

    .autosuggest .row.no-gutters > div {
        flex: 1 1 0%;
        min-width: 0;
    }

    /* flex items stretch to the row height by default; keep the picture square */
    .autosuggest .row.no-gutters > img {
        align-self: flex-start;
        height: auto;
    }

/* "Read More" links in the sidebar/footer media lists: Bootstrap 4's .small is 80% / weight 400,
   Bootstrap 3's was 85% with the inherited (lighter) weight */
.media-body a.small {
    font-size: 85%;
    font-weight: inherit;
}

/* v2 header: text logo + inline search (replaces the v1 header-dropdown-buttons search)
----------------------------------------------------------------------------- */
.logo a.site-name {
    color: rgb(140,140,140);
    font-family: Raleway, sans-serif;
    font-size: 26px;
    font-weight: bold;
    text-decoration: none;
    white-space: nowrap;
}

.header-first .logo {
    margin-top: 7px;
}

.header-search {
    display: flex;
    align-items: center;
    z-index: 9999 !important;
}

    .header-search .form-control2 {
        width: 270px;
    }

    .header-search .btn {
        margin: 0 0 0 10px;
        text-align: left;
        width: 90px;
    }

@media (min-width: 992px) {
    .header-search {
        margin-left: 15px;
    }
}

/* the header column is ~690px at this size, so keep the narrower box there */
@media (min-width: 992px) and (max-width: 1199px) {
    .header-search .form-control2 {
        width: 250px;
    }
}

@media (max-width: 991px) {
    .header-search {
        padding: 10px 0 15px;
    }

        .header-search .form-control2 {
            flex: 1 1 auto;
            width: auto;
        }
}

/* Keep the v1 (Bootstrap 3) page width: 1170px container instead of Bootstrap 4's 1140px */
@media (min-width: 1200px) {
    .container {
        max-width: 1170px;
    }
}

/* Revolution slider 5 caption text wraps (v1 layer used white-space:pre-wrap) */
.slider-banner-fullwidth .tp-caption .caption-wrap {
    white-space: pre-wrap;
}