.homepage-explainer {
	margin: 30px auto;
	width: 60%;
}

.homepage-explainer h1 {
	margin: 0 0 30px 0;
	text-align: center;
}

.homepage-explainer h2 {
	margin: 0 0 20px 0;
}

.homepage-explainer p {
	margin: 0 0 10px 0;
}


/* jssor slider loading skin spin css */
.jssorl-009-spin img {
  animation-name: jssorl-009-spin;
  animation-duration: 1.6s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes jssorl-009-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.jssorb052 .i {
  position: absolute;
  cursor: pointer;
}
.jssorb052 .i .b {
  fill: white;
  fill-opacity: 1;
  stroke: black;
  stroke-width: 1000;
}
.jssorb052 .i:hover .b {
  fill-opacity: .7;
  fill: #66FCF1;
}
.jssorb052 .iav .b {
  fill: red;	/* accessibility contrast */
  stroke: black;
  stroke-width: 1000;
}
.jssorb052 .i.idn {
  opacity: .3;
}
.jssora053 {
  display: block;
  position: absolute;
  cursor: pointer;
}

.jssora053 .a {
  fill: none;
  stroke: #fff;
  stroke-width: 640;
  stroke-miterlimit: 10;
}
.jssora053:hover {
  opacity: .8;
}
.jssora053.jssora053dn {
  opacity: .5;
}
.jssora053.jssora053ds {
  opacity: .3;
  pointer-events: none;
}
.slides h1,.slides .description {
  position: absolute;
  max-width: 46%;
  color: white;
}
.slides h1 {
  font-size: 50px;
  text-shadow: 0 4px 0 rgba(0, 0, 0, 0.4);
  left: 32px;
  top: 140px;

  /* hide heading */
  display:none;

  /* right-justify */
/*
  left: 770px;
  top: 140px;
  text-align: right;
*/
}
@media (max-width: 768px) {
  .slides h1 {
    left: 5%;
    top: 48px;
    font-size: 6em;
    max-width: 80%;
  }
}
.slides .description {
  opacity:.9;
  background: rgba(0, 0, 0, 0.8);
  padding: 1.25em 2em;
  top: 476px;
	display:none;

  /* flush right */
  margin-left: 830px;
  width: 450px;
  text-align:right;
}
@media (max-width: 768px) {
  .slides .description {
    background: rgba(0, 0, 0, 0.65);
    max-width: 85%;
    padding: 0.5em 0.5em 0.5em 5%;
    font-size: 2em;
    top: 400px;
  }
}
@media (max-width: 420px) {
  .slides .description {
    background: rgba(0, 0, 0, 0.55);
    font-size: 2.5em;
    line-height: 1.3;
    max-width: 100%;
    bottom: 0;
    padding-bottom: 60px;
    top: auto;
  }
}
.slides .description a {
  font-size: 1.4em;
  color: #66fcf1;
  font-style: italic;
}

.slider-secondary {
  width: 100% !important;
  margin: 0 auto 2em;
  /* jssor slider loading skin spin css */
}
@media (min-width: 667px) {
  .slider-secondary {
    margin: 0 auto 50px;
  }
}
.slider-secondary .jssorl-009-spin img {
  animation-name: jssorl-009-spin;
  animation-duration: 1.6s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes jssorl-009-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.slider-secondary .jssora073 {
  display: block;
  position: absolute;
  cursor: pointer;
}
.slider-secondary .jssora073 .a {
  fill-opacity: 0.7;
}
.slider-secondary .jssora073:hover {
  opacity: 1;
}
.slider-secondary .jssora073.jssora073dn {
  opacity: 0.7;
}
.slider-secondary .jssora073.jssora073ds {
  opacity: .3;
  pointer-events: none;
}
.slider-secondary .arrow:before {
  content: "";
  background: rgba(255, 255, 255, 0.6);
  height: 300px;
  width: 55px;
  display: block;
  position: absolute;
  top: -125px;
}
.slider-secondary .arrow svg {
  display: block;
  margin: 0 auto;
  top: -60px !important;
  position: relative;
}
.slider-secondary .arrow[data-u="arrowright"] svg {
  left: 0px;
}
.slider-secondary img {
  max-height: 150px;
}
.slider-secondary .slides {
  width: 100% !important;
}
.slider-secondary .slides > div > div {
  position: static !important;
  height: 150px !important;
}
.slider-secondary .slides a {
  display: block;
  margin: 0.5em 0;
  font-style: italic;
}
.slider-secondary .slides p {
  font-size: 14px;
  line-height: 1.2;
}