.HeroTitleBanner{position:relative;width:100%;text-align:center;top:0;left:0;z-index:2}.HeroTitleBanner__bgImage{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.HeroTitleBanner .backgroundImage{display:block;-ms-behavior:url(/resources//public/css/backgroundsize-iepolyfill.min.htc?v=3646d426d3f484b6166c39ae1e83de1e);position:absolute;width:100%;height:100%;background-position:center center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}.HeroTitleBanner .headings{position:relative;padding:0;margin-bottom:0}.HeroTitleBanner.withImage .shelfComponent{padding-left:0;padding-right:0}.HeroTitleBanner.left{text-align:left}.HeroTitleBanner.centre .shelfComponent{justify-content:center}.HeroTitleBanner.tall .shelfComponent{min-height:640px;display:flex;flex-wrap:wrap;align-items:center;width:100%}@media screen and (min-width: 1px) and (max-width: 1924px){.HeroTitleBanner.tall .shelfComponent{min-height:480px}}@media screen and (min-width: 1px) and (max-width: 1440px){.HeroTitleBanner.tall .shelfComponent{min-height:445px}}@media screen and (min-width: 1px) and (max-width: 1280px){.HeroTitleBanner.tall .shelfComponent{min-height:341px}}@media screen and (min-width: 741px) and (max-width: 899px){.HeroTitleBanner.withTCO .shelfComponent{padding:0}.HeroTitleBanner.withTCO .shelfComponent .headings{width:100%}.HeroTitleBanner.withTCO .headerBox.withImage{margin:0;padding:0;display:flex;max-width:none;width:100% !important}.HeroTitleBanner.withTCO .headerBox.withImage .headerBoxContent{padding:35px 40px;width:50%}.HeroTitleBanner.withTCO .headerBox.withImage .totalCost{padding:38px 40px;width:50%;margin:0;bottom:0}.HeroTitleBanner.withTCO .headerBox.withImage .totalCost .priceColumn{width:auto;margin-right:0;display:block}.HeroTitleBanner.withTCO .headerBox.withImage .totalCost .infoColumn{margin-top:12px;display:block}.HeroTitleBanner.withTCO .totalCostRow{display:block;margin-top:-12px}.HeroTitleBanner.withTCO.tall .shelfComponent{min-height:0}.HeroTitleBanner.withTCO.tall>.image{height:360px;position:relative}}@media screen and (min-width: 1px) and (max-width: 740px){.HeroTitleBanner .headings{width:100%}.HeroTitleBanner .shelfComponent{padding:0}.HeroTitleBanner.left{text-align:center}.HeroTitleBanner:not(.tall) .headings{padding:30px 30px}.HeroTitleBanner.tall .headerBox.withImage{max-width:none}.HeroTitleBanner.tall .headings{display:block}.HeroTitleBanner.tall .shelfComponent{min-height:0}.HeroTitleBanner.tall>.image{height:360px}.HeroTitleBanner.withTCO .headerBox.withImage{max-width:none}.HeroTitleBanner.withTCO .headerBoxContent,.HeroTitleBanner.withTCO .totalCostRow{margin:auto}.HeroTitleBanner.withTCO .totalCostRow{max-width:290px}.HeroTitleBanner.withTCO .totalCost{text-align:left}}@media screen and (min-width: 1px) and (max-width: 500px){.HeroTitleBanner.tall>.image{height:240px}}@media screen and (min-width: 1px) and (max-width: 415px){.HeroTitleBanner.withTCO .totalCostRow{width:100%;max-width:100%;margin:0}}.HeroTitleBanner.noImage .shelfComponent{padding:60px 90px 65px}@media screen and (min-width: 1px) and (max-width: 900px){.HeroTitleBanner.noImage .shelfComponent{padding:40px}}@media screen and (min-width: 1px) and (max-width: 740px){.HeroTitleBanner.noImage .shelfComponent{padding:0}}@media screen and (min-width: 1px) and (max-width: 740px){.HeroTitleBanner>.image{height:240px;position:relative}.HeroTitleBanner .headerBox.withImage{margin:0 auto}}.no-js .HeroTitleBanner{overflow:hidden}.no-js .HeroTitleBanner img{display:block;width:100%}.no-js .HeroTitleBanner:not(.tall) span img{position:absolute;bottom:0;left:0}