/* Hero backgrounds, one rule per page, keyed off the body class that
   views/locations/base.php emits. Loaded last so these win over the theme. */

.location-atlanta-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
      url(/locations/img/atlanta-google-advertising.jpg);
    background-size: cover;
  }
}

.location-calgary-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/calgary-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/calgary-mb.jpg);
      background-size: cover;
    }
  }
}

.location-chicago-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/chicago-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/chicago-mb.jpg);
      background-size: cover;
    }
  }
}

.location-edmonton-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/edmonton-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/edmonton-mb.jpg);
      background-size: cover;
    }
  }
}

.location-edmonton-seo {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/edmonton-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/edmonton-mb.jpg);
      background-size: cover;
    }
  }
}

.location-halifax-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/halifax-desktop.png);
    background-size: cover;
  }
}

.location-hamilton-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/hamilton-desktop.png);
    background-size: cover;
  }
}

.location-kelowna-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/kelowna-desktop.png);
    background-size: cover;
  }
}

.location-kingston-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/kingston-desktop.png);
    background-size: cover;
  }
}

.location-kitchener-seo {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
      url(/locations/img/kitchener-waterloo-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
        url(/locations/img/kitchener-waterloo-mb.jpg);
      background-size: cover;
    }
  }
}

.location-kitchener-waterloo-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
      url(/locations/img/kitchener-waterloo-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
        url(/locations/img/kitchener-waterloo-mb.jpg);
      background-size: cover;
    }
  }
}

.location-london-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/london-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/london-mb.jpg);
      background-size: cover;
    }
  }
}

.location-los-angeles-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
      url(/locations/img/los-angeles-desktop.png);
    background-size: cover;
  }
}

.location-miami-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
      url(/locations/img/miami-google-advertising.jpg);
    background-size: cover;
  }
}

.location-montreal-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/montreal-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/montreal-mb.jpg);
      background-size: cover;
    }
  }
}

.location-muskoka-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/muskoka-desktop.png);
    background-size: cover;
  }
}

.location-new-york-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/new-york-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/new-york-mb.jpg);
      background-size: cover;
    }
  }
}

.location-niagara-falls-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/niagara-desktop.png);
    background-size: cover;
  }
}

.location-ottawa-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/ottawa-desktop.png);
    background-size: cover;
  }
}

.location-quebec-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/quebec-desktop.png);
    background-size: cover;
  }
}

.location-regina-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/regina-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/regina-mb.jpg);
      background-size: cover;
    }
  }
}

.location-regina-seo {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/regina-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/regina-mb.jpg);
      background-size: cover;
    }
  }
}

.location-saskatoon-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/saskatoon-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/saskatoon-mb.jpg);
      background-size: cover;
    }
  }
}

.location-seo-london {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/london-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/london-mb.jpg);
      background-size: cover;
    }
  }
}

.location-seo-toronto {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/toronto-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/toronto-mb.jpg);
      background-size: cover;
    }
  }
}

.location-st-john-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/st-john-desktop.png);
    background-size: cover;
  }
}

.location-toronto-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/toronto-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/toronto-mb.jpg);
      background-size: cover;
    }
  }
}

.location-vancouver-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/vancouver-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
        url(/locations/img/vancouver-mobile.jpg);
      background-size: cover;
    }
  }
}

.location-vancouver-seo {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/vancouver-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
        url(/locations/img/vancouver-mobile.jpg);
      background-size: cover;
    }
  }
}

.location-victoria-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/victoria-desktop.png);
    background-size: cover;
  }
}

.location-waterloo-seo {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
      url(/locations/img/kitchener-waterloo-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
        url(/locations/img/kitchener-waterloo-mb.jpg);
      background-size: cover;
    }
  }
}

.location-winnipeg-google-advertising {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/winnipeg-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/winnipeg-mb.jpg);
      background-size: cover;
    }
  }
}

.location-winnipeg-seo {
  .main-container section.header {
    background:
      linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/winnipeg-desktop.jpg);
    background-size: cover;
  }

  @media (width <= 767px) {
    .main-container section.header {
      background:
        linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)), url(/locations/img/winnipeg-mb.jpg);
      background-size: cover;
    }
  }
}
