/* Slider */
.slick-slider{position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
-webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y;  touch-action: pan-y; -webkit-tap-highlight-color: transparent;}
.slick-list{position: relative; display: block; overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus{outline: none;}
.slick-list.dragging{cursor: pointer; cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list{-webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);    transform: translate3d(0, 0, 0);}
.slick-track{position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto;}
.slick-track:before, .slick-track:after{display: table; content: '';}
.slick-track:after{clear: both;}
.slick-loading .slick-track{visibility: hidden;}
.slick-slide{display: none; float: left; height: 100%; min-height: 1px;}
[dir='rtl'] .slick-slide{float: right;}
.slick-slide img{display: block;}
.slick-slide.slick-loading img{display: none;}
.slick-slide.dragging img{pointer-events: none;}
.slick-initialized .slick-slide{display: block;}
.slick-loading .slick-slide{visibility: hidden;}
.slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden {display: none;}
header {overflow: hidden;}
.hero-text h2 {margin-bottom: 50px;}
.hero-text .hero {position: relative;}
.hero-text .hero .hero-slide a:hover span {color: #033a71;}
.hero .hero-slide img {width: 100%;height: 600px;object-fit: cover; object-position: top center;}
.hero .hero-slide .header-content {top: 20%; margin-left: 8rem;  max-width: 550px; width: 90%; padding: 2rem; max-width: 1200px; left: 0; right: 0; margin: auto;
    z-index: 99; position: absolute;}
.slide-content {padding: 10px 20px 10px 0;}
.slide-content .h1 {font-size: 62px}

.btn-primary {
  background-color: #5302FE;
  border: #111;
  border-radius: 0;
}

/** Text Animation **/

@-webkit-keyframes fadeInUpSD {
  0% {
      opacity: 0;
      -webkit-transform: translateY(100px);
      transform: translateY(100px)
  }

  100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none
  }
}

@keyframes fadeInUpSD {
  0% {
      opacity: 0;
      -webkit-transform: translateY(100px);
      transform: translateY(100px)
  }

  100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none
  }
}

.fadeInUpSD {-webkit-animation-name: fadeInUpSD;animation-name: fadeInUpSD;}
.slick-active .slide-content {animation-name: fadeInUpSD; animation-duration: 1s; opacity: 1; width: 100%; padding: 10px 20px 30px 0;}
/* Text Animation End **/
.slick-dots {position: absolute; bottom:50px; display: block; width: 100%; padding: 0; list-style: none; text-align: center;}
.slick-dots li{width: auto;position: relative;display: inline-block; width: 15px;height: 20px; margin: 0 5px; padding: 0; cursor: pointer;}
.slick-dots li button {font-size: 0; line-height: 0; display: block; width:13px; height:13px; padding: 5px; cursor: pointer; border-radius: 50%; border: 0; outline: none;}
.slick-dots li button::before {font-size: 18px;color: #fff;opacity: 1;}
.slick-active button {background: #646464;}
/* Media Queries */



@media (max-width: 768px) {
  .hero-text .hero .hero-slide a {padding-top: 0.8rem;}
  .hero-text .hero .hero-slide a span {font-size: 20px; margin-top: 0.5rem;}
  .hero .hero-slide .header-content {left:0%; -webkit-transform: translateX(0%); transform: translateX(0%); margin: 0 auto;}
}
.parts {top: 0; left: 0; display: none; font-size: 36px; color: white; font-weight: 400; line-height: 1.4em;}
.parts ul {list-style: none;}
.parts ul li {font-size: 1.6rem; line-height: 30px; padding: 7px 0;}
.slick-initialized .slick-slide::after {background-color: rgba(0,0,0,.5); width: 100%; height: 100%; position: absolute; content: ''; z-index: 9;
    top: 0;  left: 0;}
    

    @media (max-width: 1024px) {
        .hero .hero-slide .header-content{left:0;  transform: translateX(0%);}
        .parts{font-size:3em;}
        }

@media (max-width:767px){
.parts {font-size: 2.6em;}
.parts ul li{font-size: 1.3rem;}
 }

 @media (max-width: 480px){
.hero .hero-slide img { height: 500px;}
.hero .hero-slide .header-content{padding:0;}
.parts ul li{font-size: 1.2rem; padding: 3px 0;}
 }