/* Homepage main slider */
.firstpage-video video {
    width: 100%;
    height: auto;
}

.main-slider {
	padding-bottom: 20px;
}

.tns-outer {
    position: relative;
}

.tns-outer .tns-nav {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

.tns-nav button {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid #fff;
    background: var(--blue);
    margin-right: 5px;
    padding: 0;
    display: inline-block;
}

.tns-nav button.tns-nav-active {
    background: var(--red);
}

.main-slider img {
    width: 100%;
}

.main-slider .tns-item {
    position: relative;
}

.main-slider .tns-item .slider-inner-block .caption-block h3 {
    font-weight: 600;
}



.main-slider .tns-item .slider-inner-block .caption-block .caption-block-button .btn {
    background-color: transparent;
    border-color: #fff;
    border: 2px solid #fff;
    color: #fff;
}

.main-slider .tns-item .slider-inner-block .caption-block {
    max-width: 460px;
    padding: 50px;
    background-color: rgba(20, 0, 55, 0.75);
    color: #fff;
}

@media (max-width: 767px) {

    .main-slider .tns-item img,
    .main-slider .tns-item video {
        object-fit: cover;
        height: 375px;
    }

    .main-slider .tns-item .slider-inner-block {
        margin-top: -5px;
    }

    .main-slider .container {
        padding: 0;
    }

    .main-slider .tns-item .slider-inner-block .caption-block {
        max-width: 100%;
        padding: 30px 30px 40px;
        display: block;
    }

    .main-slider .tns-item .slider-inner-block .caption-block .caption-block-button {
        margin-top: 25px;
        text-align: left;
    }

    .main-slider .tns-item .slider-inner-block .caption-block .caption-block-button .btn {
        height: 34px;
    }

    .main-slider .tns-outer .tns-nav {
        bottom: 10px;
    }
}

@media (max-width: 575px) {

    .main-slider .tns-item img,
    .main-slider .tns-item video {
        object-fit: cover;
        height: 200px;
    }
}



@media (min-width: 768px) {
    .main-slider .tns-item {
        height: 400px;
    }

    .main-slider .tns-item img,
    .main-slider .tns-item video {
        object-fit: cover;
        height: 400px;
    }

    .main-slider .tns-item .slider-inner-block {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        transform: translateY(-50%);
    }

    .main-slider .tns-item .slider-inner-block .container {
        display: flex;
        justify-content: flex-end;
    }

    .main-slider .tns-item .slider-inner-block .caption-block .caption-block-button {
        margin-top: 45px;
        text-align: right;
    }

}

@media (min-width: 1200px) {
    .main-slider .tns-item {
        height: 525px;
    }

    .main-slider .tns-item img,
    .main-slider .tns-item video {
        object-fit: cover;
        height: 525px;
    }
}


@media (min-width: 1920px) {
    .main-slider .tns-item {
        height: 750px;
    }

    .main-slider .tns-item img,
    .main-slider .tns-item video {
        object-fit: cover;
        height: 750px;
    }
}

@media (min-width: 2400px) {
    .main-slider .tns-item {
        height: 950px;
    }

    .main-slider .tns-item img,
    .main-slider .tns-item video {
        object-fit: cover;
        height: 950px;
    }
}

.select2-container--open {
    font-size: 14px;
}

// Version: 2.9.3

.tns-outer {
  padding: 0 !important; // remove padding: clientWidth = width + padding (0) = width
  [hidden] { display: none !important; }
  [aria-controls], [data-action] { cursor: pointer; }
}
.tns-slider {
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  transition: all 0s;
  > .tns-item {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
}

.tns-horizontal {
  &.tns-subpixel {
    white-space: nowrap;
    > .tns-item {
      display: inline-block;
      vertical-align: top;
      white-space: normal;
    }
  }
  &.tns-no-subpixel {
    &:after {
      content: '';
      display: table;
      clear: both;
    }
    > .tns-item {
      float: left;
    }
  }
  &.tns-carousel {
    &.tns-no-subpixel {
      > .tns-item {
        margin-right: -100%;
      }
    }
  }
}
.tns-no-calc {
  position: relative;
  left: 0;
}
.tns-gallery {
  position: relative;
  left: 0;
  min-height: 1px; // make sure slider container is visible
  // overflow: hidden;
  > .tns-item {
    position: absolute;
    left: -100%;
    -webkit-transition: transform 0s, opacity 0s;
    -moz-transition: transform 0s, opacity 0s;
    transition: transform 0s, opacity 0s;
  }
  > .tns-slide-active {
    position: relative;
    left: auto !important;
  }
  > .tns-moving {
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    transition: all 0.25s;
  }
}
.tns-autowidth { display: inline-block; }
.tns-lazy-img {
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  transition: opacity 0.6s;
  opacity: 0.6;
  &.tns-complete { opacity: 1; }
}
.tns-ah {
  -webkit-transition: height 0s;
  -moz-transition: height 0s;
  transition: height 0s;
}
.tns-ovh { overflow: hidden; }
.tns-visually-hidden { position: absolute; left: -10000em; }
.tns-transparent { opacity: 0; visibility: hidden; }

.tns-fadeIn {
  opacity: 1;
  filter: alpha(opacity=100);
  z-index: 0;
}
.tns-normal, .tns-fadeOut {
  opacity: 0;
  filter: alpha(opacity=0);
  z-index: -1;
}


// *** Fix a viewport issue in initialization
.tns-vpfix {
  white-space: nowrap;
  > div, > li {
    display: inline-block;
  }
}

// *** Detecting browser capability ***
$width: 310px;
$height: 10px;
$count: 70;
$perpage: 3;

.tns-t {
  &-subp2 {
    margin: 0 auto;
    width: $width;
    position: relative;
    height: $height;
    overflow: hidden;
  }
  &-ct {
    width: (100% * $count / $perpage);
    width: -webkit-calc(100% * #{$count} / #{$perpage});
    width: -moz-calc(100% * #{$count} / #{$perpage});
    width: calc(100% * #{$count} / #{$perpage});
    position: absolute;
    right: 0;
    &:after {
      content: '';
      display: table;
      clear: both;
    }
    > div {
      width: (100% / $count);
      width: -webkit-calc(100% / #{$count});
      width: -moz-calc(100% / #{$count});
      width: calc(100% / #{$count});
      height: $height;
      float: left;
    }
  }
}

.firstpage-video .tns-item video {
    width: 100%;
    height: auto;
}