{# -- Slick Styling -- #}
{# -- White arrow (Default) -- #}
.hero_banner button.slick-next.slick-arrow {
  background: transparent url(https://www.hammond.com.au/hubfs/HammondCare/Icon-right.svg);
  background-repeat: no-repeat;
  background-position: 50%;
  padding: 0;
  position: absolute;
  top: auto;
  bottom: 10px;
  transform: translateY(-50%);
  right: 30px;
  z-index: 100;
  border: 2px solid #fff;
  font-size: 0;
  width: 54px;
  height: 54px;
  border-radius: 50%;
}

.hero_banner button.slick-prev.slick-arrow {
  background: transparent url(https://www.hammond.com.au/hubfs/HammondCare/Icon-left.svg);
  background-repeat: no-repeat;
  background-position: 50%;
  padding: 0;
  position: absolute;
  top: auto;
  bottom: 10px;
  transform: translateY(-50%);
  left: 30px;
  z-index: 100;
  border: 2px solid #fff;
  font-size: 0;
  width: 54px;
  height: 54px;
  border-radius: 50%;
}

.hero_banner button.slick-next.slick-arrow:hover {
  background: #fff url('https://www.hammond.com.au/hubfs/HammondCare/Icon%20(Stroke)%20(2).svg');
  background-repeat: no-repeat;
  background-position: center;
}

.hero_banner button.slick-prev.slick-arrow:hover {
  background: #fff url('https://www.hammond.com.au/hubfs/HammondCare/Icon%20(Stroke)%20(3).svg');
  background-repeat: no-repeat;
  background-position: center;
}

.hero_banner button.slick-prev.slick-arrow:focus, .hero_banner button.slick-next.slick-arrow:focus,
.hero_banner ul.slick-dots li button:focus { 
  outline:0; 
}

.hero_banner ul.slick-dots {
  position: absolute;
  bottom: 40px;
  left: 0;
  right: 0;
  text-align: center;
  padding:0;
}

.hero_banner ul.slick-dots li {
  display: inline-block;
  margin: 0 5px;
}

.hero_banner ul.slick-dots li button {
  background: transparent;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  padding: 0;
  border: 2px solid #fff;
  font-size: 0;
}

.hero_banner ul.slick-dots li button:hover, 
.hero_banner ul.slick-dots li.slick-active button {
  background: #fff;
}

{# -- Orange Arrow --#}
.hero_banner.orange_arrow button.slick-prev.slick-arrow, .hero_banner.orange_arrow button.slick-next.slick-arrow {
  border: 2px solid var(--orange);
}

.hero_banner.orange_arrow button.slick-prev.slick-arrow{
  background: transparent url('https://www.hammond.com.au/hubfs/HammondCare/Icon%20(Stroke)%20(3).svg');
  background-repeat: no-repeat;
  background-position: center;
}

.hero_banner.orange_arrow button.slick-prev.slick-arrow:hover{
  background: #4D2777 url('https://www.hammond.com.au/hubfs/HammondCare/Icon-left.svg');
  border: 2px solid #4D2777;
  background-repeat: no-repeat;
  background-position: center;
}

.hero_banner.orange_arrow button.slick-next.slick-arrow {
  background: transparent url('https://www.hammond.com.au/hubfs/HammondCare/Icon%20(Stroke)%20(2).svg');
  background-repeat: no-repeat;
  background-position: center;
}

.hero_banner.orange_arrow button.slick-next.slick-arrow:hover{
  background: var(--plum) url('https://www.hammond.com.au/hubfs/HammondCare/Icon-right.svg');
  border: 2px solid var var(--plum);
  background-repeat: no-repeat;
  background-position: center;
}

.hero_banner.orange_arrow ul.slick-dots li button {
  border: 2px solid var(--orange);
}

.hero_banner.orange_arrow ul.slick-dots li button:hover, 
.hero_banner.orange_arrow ul.slick-dots li.slick-active button {
  border: 2px solid var(--orange);
  background: var(--orange);
}

@media (max-width: 991px) {  
  .hero_banner.-light.white_arrow ul.slick-dots li button { 
    border: 2px solid var(--plum);
  }

  .hero_banner.-light.white_arrow ul.slick-dots li button:hover, 
  .hero_banner.-light.white_arrow ul.slick-dots li.slick-active button {
    background: var(--plum);
  }
  
  .hero_banner.-light.white_arrow button.slick-prev.slick-arrow{
    border: 2px solid var(--plum);
    background: transparent url('https://www.hammond.com.au/hubfs/HammondCare/Icon%20(Stroke)%20(3).svg');
    background-repeat: no-repeat;
    background-position: center;
  }

  .hero_banner.-light.white_arrow button.slick-next.slick-arrow{
    border: 2px solid var(--plum);
    background: transparent url('https://www.hammond.com.au/hubfs/HammondCare/Icon%20(Stroke)%20(2).svg');
    background-repeat: no-repeat;
    background-position: center;
  }
  
  .hero_banner.-dark.orange_arrow button.slick-prev.slick-arrow{
    background: transparent url('https://www.hammond.com.au/hubfs/HammondCare/Icon-left.svg');
    background-repeat: no-repeat;
    background-position: center;
  }
  .hero_banner.-dark.orange_arrow button.slick-next.slick-arrow {
    background: transparent url('https://www.hammond.com.au/hubfs/HammondCare/Icon-right.svg');
    background-repeat: no-repeat;
    background-position: center;
  }
}

@media (min-width: 992px) {
  .hero_banner button.slick-prev.slick-arrow {
    background-position: center;
    width: 68px;
    height: 68px;
    top: 50%;
    bottom: auto;
    left: 20px;
  }
  
  .hero_banner button.slick-next.slick-arrow {
    background-position: center;
    width: 68px;
    height: 68px;
    top: 50%;
    bottom: auto;
    right: 20px;
  }
  
  .hero_banner ul.slick-dots { 
    bottom:40px;
  }
  
  .hero_banner ul.slick-dots li button { 
    width: 15px; 
    height: 15px;
  }
}

@media (min-width: 1441px) {
  .hero_banner button.slick-prev.slick-arrow{ 
    left: 70px;
  }
  .hero_banner button.slick-next.slick-arrow{ 
    right: 70px;
  }
}

{# -- Other styles -- #}
.hero_banner .m-heroBanner__buttons a:first-child {
  margin-right: 10px;
}

.hero_banner .content.-light a.button.-secondary_orange.-regular {
  color: var(--white);
}
.hero_banner .content.-light a.button.-secondary_orange.-regular:hover {
  color: var(--white);
}
 
.o-heroBanner {
  position: relative; 
  overflow: hidden;
}

.m-heroBanner__content .title:only-child {
  margin-bottom: 0; 
}
.m-heroBanner__content .subtitle:last-child {
  margin-bottom: 0; 
}

.m-heroBanner__bgImage img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
}
.m-heroBanner__buttons .button, 
.m-heroBanner__buttons .textLink {
  display: block;
  text-align: center;
}
.m-heroBanner__buttons .hs_cos_wrapper_type_cta:not(:last-child), 
.m-heroBanner__buttons .textLink:not(:last-child) {
  margin-bottom: 20px; 
  display: block;
}
.m-heroBanner__video video { 
  display: block;
  width: 100%;
  height: auto;
}

.hero_banner .content.-light .o-heroBanner.no-padding h1 {
  color: var(--plum);
}
.hero_banner .content.-light .o-heroBanner.no-padding p.subtitle{ color:#474747;}
.hero_banner .content.-light a.button.-secondary_orange.-regular {
  color: var(--plum);
}
.hero_banner .content.-light a.button.-secondary_orange.-regular:hover{ color:#fff;}

.hero_banner .content.-light.white_arrow a.button.-secondary_orange.-regular {
  color: var(--white);
}

.h-100 .caption {
  width: 240px;
  position: absolute;
  z-index: 99;
  right: 2.5%;
}

.h-100 .caption p {
  line-height: 1.3;
  color: #fff;
}

@media (min-width: 992px) and (max-width: 1440px) {
  .h-100 .caption {
    display: none;
  }
}

@media (max-width: 991px) {
  .h-100 .caption {
    top: 16%;
  }
  .m-heroBanner__bgImage {
    background-position: center right;
  }
  .o-heroBanner .container>div {
    padding-left: 0;
  }
  .m-heroBanner__content {
    padding: 50px 30px 100px;
  }
  .hero_banner .m-heroBanner__buttons a:first-child {
    margin-right: 0;
    margin-bottom: 20px;
  }
  .hero_banner .content.-light .m-heroBanner__content.content.-light a.button.-secondary_orange.-regular{ color:var(--plum);}
  .hero_banner .content.-light .m-heroBanner__content.content.-light a.button.-secondary_orange.-regular:hover{ color:var(--white);}

  .m-heroBanner__buttons {
    margin-bottom: 30px;
  }
  
  .o-heroBanner.no-padding .m-heroBanner__content {
    padding: 0 0 100px;
  }
  .hero_banner .content.-light h1{
    color: var(--plum);
  }
  .hero_banner .content.-light .content.-light p {
    color: var(--granite);
  }
  .hero_banner .content.-light .m-heroBanner__content.content.-dark h1, .hero_banner .content.-light .m-heroBanner__content.content.-dark p {
    color: #fff;
  }
}

@media (max-width: 1440px) {
  .o-heroBanner .container > div {
    padding-left: 7%;
  }
} 

@media (min-width: 992px) {
  .m-heroBanner__buttons .button, 
  .m-heroBanner__buttons .textLink {
    display: inline-block;
  }
  .m-heroBanner__buttons .hs_cos_wrapper_type_cta:not(:last-child), 
  .m-heroBanner__buttons .textLink:not(:last-child) {
    margin-bottom: 0;
    margin-right: 20px; 
    display: inline-block;
  }
  .m-heroBanner__video { 
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; 
  }
  .m-heroBanner__video video {
    height: 100%;
    object-fit: cover;
  }

}  

@media (max-width: 740px) {
  .h-100 .caption {
    display: none;
  }
}
