/* **************************************** */
/*              MAIN DIVS                   */
/* **************************************** */

:root {             
  --aside-width: 430px;
  --nf-image-height: 430px;
}

  body {
        background-image: none;     /* Because image no longer full width so has to be in banner and nav */
  }

  header.banner {
    background-repeat: no-repeat;
    background-position: 0 0;
    background-image: url(https://cms03-uk.s3.eu-west-2.amazonaws.com/arc-ar3-ux-06-page-top-desktop-1400max-20220524-b-kraken.jpg);
  }
  body                              header.banner   { background-position-x:-11200px; }
  body.home                         header.banner   { background-position-x:    -0px; }
  body.faqs                         header.banner   { background-position-x: -1400px; }
  body.documents                    header.banner   { background-position-x: -2800px; }
  body.updates                      header.banner   { background-position-x: -4200px; }
  body.contacting-us                header.banner   { background-position-x: -5600px; }
  body.spare1                       header.banner   { background-position-x: -7000px; }
  body.spare2                       header.banner   { background-position-x: -8400px; }
  body                              header.banner   { background-position-x: -9800px; }

  div.wrapper.nav {
    background-repeat: no-repeat;
    background-position: 0 -90px;
    background-image: url(https://cms03-uk.s3.eu-west-2.amazonaws.com/arc-ar3-ux-06-page-top-desktop-1400max-20220524-b-kraken.jpg);
  }
  body                              div.wrapper.nav   { background-position-x:-11200px; }
  body.home                         div.wrapper.nav   { background-position-x:    -0px; }
  body.faqs                         div.wrapper.nav   { background-position-x: -1400px; }
  body.documents                    div.wrapper.nav   { background-position-x: -2800px; }
  body.updates                      div.wrapper.nav   { background-position-x: -4200px; }
  body.contacting-us                div.wrapper.nav   { background-position-x: -5600px; }
  body.spare1                       div.wrapper.nav   { background-position-x: -7000px; }
  body.spare2                       div.wrapper.nav   { background-position-x: -8400px; }
  body                              div.wrapper.nav   { background-position-x: -9800px; }

  nav.primary {
    right: auto;
  }

/* **************************************** */
/*          CONTENT/ARTICLE                 */
/* **************************************** */

  section.content {
    width: calc( 1400px - var(--aside-width) ); /* ARP 3 has wider sidebar, so narrower main content area */
    padding-left: 0;
    padding-right: var(--grid-margin);
  }
  aside {
    width: var(--aside-width);
  }  

  body.search section.content {
    padding-right: 0;               /* Because no aside on search results page */
  }


  section.content h2 {
    width: auto; /* calc( 1400px - 2 * var(--left-margin) ); */
  }


  section.content.promos div.promo p:first-of-type {
    min-height: 60px;
  }

/* **************************************** */
/*          NON-FUNC PROMOS                 */
/* **************************************** */

  div.promo,
  section#main div#nf-promos div.promo.side-note {
    width: auto;
  }

  /* Changed nth-of-type(2) to nth-of-type(1) 11 Jun 2024 */
  section#main div#nf-promos div:nth-of-type(1).promo.side-note:before {
    width: var(--aside-width);
  }


/* **************************************** */
/*    IMAGE ABOVE FIRST NON-FUNC PROMOS     */
/* **************************************** */

  /* Changed nth-of-type(2) to nth-of-type(1) 11 Jun 2024 */
  /* Override the background image with the Desktop one */
  section#main div#nf-promos div:nth-of-type(1).promo.side-note:before {
    background-image: url(https://cms03-uk.s3.eu-west-2.amazonaws.com/arc-ar3-ux-44-support-extra-desktop-1400max-20220606-optim.jpg);
  }
  section#main div.promo.side-note.promo1:before    { background-position-x:    -0px; }
  section#main div.promo.side-note.promo2:before    { background-position-x:  -450px; }
  section#main div.promo.side-note.promo3:before    { background-position-x:  -900px; }
  section#main div.promo.side-note.promo4:before    { background-position-x: -1350px; }
  section#main div.promo.side-note.promo5:before    { background-position-x: -1800px; }
  section#main div.promo.side-note.promo6:before    { background-position-x: -2250px; }
  section#main div.promo.side-note.promo7:before    { background-position-x: -2700px; }
  section#main div.promo.side-note.promo8:before    { background-position-x: -3150px; }
  section#main div.promo.side-note.promo9:before    { background-position-x: -3600px; }
  section#main div.promo.side-note:before           { background-position-x: -4050px; }


/* **************************************** */
/*          EMPTY ASIDE                     */
/* **************************************** */

  aside:empty:after {
    background-image: url(https://cms03-uk.s3.eu-west-2.amazonaws.com/arc-ar3-ux-44-support-extra-desktop-1400max-20220606-optim.jpg);
    background-position: -450px 0;
  }


/* **************************************** */
/*          BODY IMAGE                      */
/* **************************************** */

  body.home {       /* Keep image from appearimg below footer */
    background-size: 1400px 100%;
  }