:root {
  --a-wc-imgslider-max-width: 36rem;
  --a-wc-imgslider-slide-width: 100%;
  --a-wc-imgslider-slide-height: 21rem;
  --a-wc-imgslider-slide-nav-font-size: 3.6rem;
  --a-wc-imgslider-nav-clr: #b5c9d3;
  --a-wc-imgslider-nav-clr-hvr: #134455;
  --a-wc-imgslider-nav-clr-sel1: #006681;
  --a-wc-imgslider-nav-clr-sel2: #b5c9d3;
  --a-wc-imgslider-nav-clr-circle: #dae4e9; }

@media only screen and (max-width: 48rem) {
  :root {
    --a-wc-imgslider-slide-height: 15rem; } }

.a-wc-slider {
  max-width: var(--a-wc-imgslider-max-width);
  padding: 0;
  display: block; }

.a-wc-slider * {
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none; }

.slides {
  margin: 0;
  padding: 0; }

.slide-container {
  /* display: none; */
  display: block; }

.slide-container.selected {
  display: block; }

.slide {
  width: 0;
  height: 0;
  opacity: 0;
  transform: scale(0);
  /*	transition: all 0.75s ease-in-out;*/ }

.slide-container.selected .slide {
  width: var(--a-wc-imgslider-slide-width);
  height: var(--a-wc-imgslider-slide-height);
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.9s ease-in-out;
  display: block; }

.slide img {
  width: 99%;
  height: 99%;
  display: inline-block;
  overflow: visible;
  /* hidden; */
  object-fit: contain; }

.nav {
  width: 100%;
  height: calc(var(--a-wc-imgslider-slide-nav-font-size)+ 3px);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  text-align: center; }

.nav .prev,
.nav .next {
  cursor: pointer;
  font-size: var(--a-wc-imgslider-slide-nav-font-size);
  font-family: Arial, Helvetica, sans-serif;
  text-shadow: 0px 0px 3px var(--a-wc-imgslider-nav-clr-sel2);
  box-shadow: 0px 0px 1px var(--a-wc-imgslider-nav-clr-sel1);
  border-radius: 100%;
  background: var(--a-wc-imgslider-nav-clr-circle);
  width: 2.1rem;
  height: 2.1rem;
  display: flex;
  justify-content: center;
  align-items: center; }

.nav .prev:hover,
.nav .next:hover {
  background: var(--a-wc-imgslider-nav-clr-sel1);
  /*		background-image: linear-gradient(to right, var(--a-wc-imgslider-nav-clr-sel1)
		0%, var(--a-wc-imgslider-nav-clr-sel2) 51%,
		var(--a-wc-imgslider-nav-clr-sel1) 100%);*/ }

.nav a {
  text-decoration: none;
  color: var(--a-wc-imgslider-nav-clr-sel1);
  width: 2.4rem;
  margin-top: -0.6rem;
  /* fixes next/prev character inherent margin */ }

.nav a:hover {
  color: var(--a-wc-imgslider-nav-clr-sel2); }

.nav .middle label {
  width: 2.1rem;
  height: 6px;
  margin: 3px 0.45rem;
  border-radius: 21px;
  display: inline-block;
  background: var(--a-wc-imgslider-nav-clr); }

.nav label:hover {
  cursor: pointer;
  background: var(--a-wc-imgslider-nav-clr-hvr); }

input.nav-radio {
  display: none; }

.nav label:has( > input.nav-radio:checked) {
  /*	background-image: linear-gradient(to right, #1A2980 0%, #26D0CE 51%, #1A2980 100%);*/
  background-image: linear-gradient(to right, var(--a-wc-imgslider-nav-clr-sel1) 0%, var(--a-wc-imgslider-nav-clr-sel2) 51%, var(--a-wc-imgslider-nav-clr-sel1) 100%); }