
/* Home Banner */
.BanImgText { 
 ___color: #202020 !important;
 ___background-color: rgba(255, 255, 255, 0.5); 
 ___border: 0px; 
 ___border-radius: 1rem; 
 padding: 2rem;
}
.BanImgText p { 
 ___color: #202020 !important;
}

.HomeBannerHdrTop {
 font-size: 1.8rem; 
 letter-spacing: -1px; 
 font-weight: 150;
 margin-bottom: 1rem;
}
.HomeBannerHdr {
 font-size:3.5rem; 
 letter-spacing:-1.4px; 
 padding-bottom:1.1vw; 
 font-weight:680;
 line-height:1.1;
}
.HomeBannerTxt {
 font-size: 1.5rem; 
 letter-spacing:-0.3px; 
 padding-bottom:3vw; 
 font-weight:300;
}

/* Slide Show */
.sldShw-mySlides {
 ___position: relative;   
 display: none;
 width: 100%; 
 ___max-height: 690px; 
 ___min-height :320px; 
 ___height: 100vh; 
}
.___sldShw-mySlides img {vertical-align: middle;}

.sldShw-img {
 width: 100%;
 height: 690px;
 background-repeat: no-repeat; 
 display: block;
}   



/* Slideshow container */
.sldShw-container {
 max-width: 1920px;
 position: relative;
 margin: auto;
 width: 100%;
 __color: white;
}

/* Next & previous buttons */
.sldShw-prev, .sldShw-next {
 cursor: pointer;
 position: absolute;
 top: 17%;
 width: auto;
 padding: 16px;
 margin-top: -22px;
 __color: white;
 font-weight: bold;
 font-size: 30px;
 transition: 0.6s ease;
 border-radius: 0 3px 3px 0;
 user-select: none;
}

.sldShw-prev {
 left: 0;
}

/* Position the "next button" to the right */
.sldShw-next {
 right: 0;
 border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.sldShw-prev:hover, .sldShw-next:hover {
 background-color: rgba(0,0,0,0.8);
}

.buttonTimer {
 font-size: 2rem;
 vertical-align: middle;  
}
.buttonTimer:hover {
   cursor: pointer;
}   
/* Caption text */
.sldShw-capText {
 display: none;
 __color: #202020;
 font-size: 17px;
 padding: 8px 12px;
 position: absolute;
 bottom: 40px;
 width: 100%;
 text-align: center;
 font-weight: 500;
 __z-index: 10;
}

/* Number text (1/3 etc) */
.sldShw-numText {
 ___color: #C20000;
 font-size: 14px;
 padding: 0;
 position: absolute;
 bottom: 5px;
 right: 8px;
 font-weight: 600 
}

/* The dots/bullets/indicators */
.sldShw-dot {
 cursor: pointer;
 height: 16px;
 width: 16px;
 margin: 0 3px;
 __background-color: #bbb;
 border-radius: 50%;
 display: inline-block;
 transition: background-color 0.6s ease;
 border:1px solid var(--pri-color);
 vertical-align: middle;
}

.sldShw-dotActive, .sldShw-dot:hover {
 background-color: #c20000;
}

/* Fading animation */
.sldShw-fade {
 animation-name: fade;
 animation-duration: 1.5s;
}

@keyframes sldShw-fade {
 from {opacity: .4} 
 to {opacity: 1}
}

.sldShw-dotContainer {
 position: absolute;
 left: 0;
 right: 0;
 bottom: 10px;
}

/* Responsive */
@media (max-width:450px) {
 .___BanVidText {position:relative !important; width:100% !important; max-width:100% !important; margin:0 auto !important; vertical-align:top !important; 
  padding: 3% !important; left: 0 !important; right: 0 !important; top: 17% !important; transform: none !important;
 }

 .BanImgText {
  position:relative !important; 
  width:100% !important; 
  max-width:100% !important; 
  margin:0 auto !important; 
  vertical-align:top !important; 
  padding: 3% !important; 
  left:0 !important; 
  right:0 !important; 
  ___top:17% !important; 
  ___transform: none !important;
  ___background-color: transparent !important; 
  ___color: var(--pri-color) !important;
  ___border-radius: 0 !important;
 }

 .sldShw-prev, .sldShw-next {
  padding: 6px;
  ____margin-top: -22px;
 }
 .HomeBannerHdrTop {
  font-size: 1.4rem; 
  font-weight:200;
 }
 .HomeBannerHdr {
  font-size:1.9rem;
 }
 .HomeBannerTxt {
  font-size:1.15rem;
 }
 .sldShw-img {
   height:300px; 
 } 
 /*.sldShw-prev, .sldShw-next, .sldShw-capText {font-size: 11px;}*/
 .sldShw-capText, .sldShw-dotContainer, .sldShw-numText {
  display: none;
 }
}

@media (min-width:451px) and (max-width:640px) {
 .BanImgText { 
  position: relative !important; 
  width: 100% !important; 
  max-width:100% !important; 
  margin:0 auto !important; 
  vertical-align:top !important; 
  padding: 3%; 
  left:0 !important; 
  right:0 !important; 
  ___top:0 !important; 
  ___transform: none !important;
 }
 .HomeBannerHdrTop {
  font-size:1.4rem; 
  font-weight:200;
 }
 .HomeBannerHdr {
  font-size:1.9rem;
 }
 .HomeBannerTxt {
  font-size:1.15rem;
 }
 .sldShw-img {
    height:400px; 
 } 
}

@media (min-width:641px) and (max-width:1007px) {
 .BanImgText {
  ___position:relative !important; 
  width:60% !important; 
  max-width:100% !important; 
  margin:0 auto !important; 
  vertical-align:top !important; 
  padding: 2% 5% 2% 5%; 
  __left:0 !important; 
  __right:0 !important; 
  top:15% !important;
 }
 .HomeBannerHdrTop {
  font-size:1.4rem; 
  font-weight:200;
 }
 .HomeBannerHdr {
  font-size:2rem;
 }
 .HomeBannerTxt {
  font-size:1.15rem;
 }
 .sldShw-img {
   height: 500px; 
 } 
}

@media (min-width:1008px) and (max-width:1279px) { 
 .HomeBannerHdrTop {
  font-size:1.6rem; 
  font-weight:200;
 }
 .HomeBannerHdr {
  font-size:2.3rem;
 }
 .HomeBannerTxt {
  font-size:1.3rem;
 }
}

@media (min-width:1280px) and (max-width:1365px) {
 .HomeBannerHdrTop {font-size:1.8rem; font-weight:150;}
 .HomeBannerHdr {font-size:2.6rem;}
 .HomeBannerTxt {font-size:1.5rem;}
}

@media (min-width:1366px) and (max-width:1420px) {
 .HomeBannerHdrTop {
  font-size:1.8rem; 
  font-weight:150;
 }
 .HomeBannerHdr {
  font-size:3rem;
 }
 .HomeBannerTxt {
  font-size:1.6rem;
 }
}

@media (min-width:1421px) and (max-width:1740px) {
 .HomeBannerHdrTop {
  font-size:1.8rem; 
  font-weight:150;
 }
 .HomeBannerHdr {
  font-size:3.1rem;
 }
 .HomeBannerTxt {
  font-size:1.6rem;
 }
}










