/* ------------------------------------------------------------------
   YPSSS - responsive comfort fixes.
   Loaded AFTER the theme stylesheets, so it only overrides four things.
   To undo everything: remove the <link> to this file. Nothing else changes.
   ------------------------------------------------------------------ */

/* 1. The fixed news ticker and chat bubble no longer hide the end of the page */
body { padding-bottom: 60px; }
@media (max-width: 991px) { body { padding-bottom: 110px; } }

/* 2. Top-bar links become big enough to tap accurately on a touch screen */
@media (max-width: 991px) {
  .header-top .login-register ul li { display: inline-block; }
  .header-top .login-register ul li a {
    display: inline-block;
    padding: 11px 8px;
    line-height: 1.25;
    white-space: nowrap;
  }
}

/* 3. Justified paragraphs read badly on narrow screens - left align on phones only */
@media (max-width: 767px) {
  .text-justify, p.text-justify { text-align: left !important; }
}

/* 4. The homepage slider gets a usable height instead of a thin cropped band */
@media (max-width: 767px) {
  .carousel-inner .carousel-item img.img-fluid {
    height: 230px; width: 100%;
    object-fit: cover; object-position: center 38%;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .carousel-inner .carousel-item img.img-fluid {
    height: 320px; width: 100%;
    object-fit: cover; object-position: center 38%;
  }
}

/* 5. On wide desktops the slider photo (1600px wide) stopped short of the
      screen edge and left a white gap. Let it fill the full width. */
@media (min-width: 992px) {
  .carousel, .carousel-inner, .carousel-item { width: 100%; }
  .carousel-inner .carousel-item img.img-fluid {
    width: 100%;
    height: auto;
    max-width: none;
    display: block;
  }
}

/* 6. Page headings converted from <h2> to <h1> for search engines.
      These rules reproduce the theme's original heading appearance exactly. */
.breadcrumb-area .breadcrumb-top h1 {
  font-family: Roboto, sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 36px;
  color: #fff;
  margin: 0 0 22px;
  text-transform: uppercase;
}
@media (max-width: 575px) {
  .breadcrumb-area .breadcrumb-top h1 { font-size: 35px; margin: 0 0 10px; }
}

/* Heading available to search engines and screen readers, not shown on screen */
.ypsss-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
