.block-gallery .tns-outer {
  position: relative;
}
.block-gallery .tns-outer .tns-controls button {
  background: #FFF;
  border: 2px solid #dcddde;
  border-radius: 50%;
  height: 30px;
  font-size: 0;
  position: absolute;
  top: 50%;
  width: 30px;
  z-index: 10;
  -webkit-transition: background 0.3s ease;
  -moz-transition: background 0.3s ease;
  -ms-transition: background 0.3s ease;
  -o-transition: background 0.3s ease;
  transition: background 0.3s ease;
}
@media screen and (min-width: 768px) {
  .block-gallery .tns-outer .tns-controls button {
    height: 45px;
    width: 45px;
  }
}
@media screen and (min-width: 1200px) {
  .block-gallery .tns-outer .tns-controls button {
    height: 65px;
    width: 65px;
  }
}
.block-gallery .tns-outer .tns-controls button::before {
  color: #4d4d4f;
  content: "\f060";
  font-size: 2rem;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  -webkit-transition: color 0.3s ease;
  -moz-transition: color 0.3s ease;
  -ms-transition: color 0.3s ease;
  -o-transition: color 0.3s ease;
  transition: color 0.3s ease;
}
@media screen and (max-width: 991px) {
  .block-gallery .tns-outer .tns-controls button::before {
    font-size: 1.1rem;
  }
}
@media (pointer: fine), (-ms-high-contrast: none) {
  .block-gallery .tns-outer .tns-controls button:hover {
    background: #7f7f7f;
  }
  .block-gallery .tns-outer .tns-controls button:hover::before {
    color: #FFF;
  }
}
.block-gallery .tns-outer .tns-controls button[data-controls=prev] {
  left: 0;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
}
.block-gallery .tns-outer .tns-controls button[data-controls=next] {
  right: 0;
  transform: translate(50%, -50%);
  -ms-transform: translate(50%, -50%);
  -moz-transform: translate(50%, -50%);
  -webkit-transform: translate(50%, -50%);
  -o-transform: translate(50%, -50%);
}
.block-gallery .tns-outer .tns-controls button[data-controls=next]::before {
  content: "\f061";
}
.block-gallery #thumbnails-nav {
  display: flex;
  flex-wrap: wrap;
  margin: 10px -10px -10px -10px;
  padding: 0;
}
@media screen and (min-width: 768px) {
  .block-gallery #thumbnails-nav {
    margin: 15px -15px -15px -15px;
  }
}
@media screen and (min-width: 1200px) {
  .block-gallery #thumbnails-nav {
    margin: 20px -20px -20px -20px;
  }
}
.block-gallery #thumbnails-nav li {
  display: inline-block;
  flex: 1 0 50%;
  list-style-type: none;
  padding: 10px;
}
@media screen and (min-width: 768px) {
  .block-gallery #thumbnails-nav li {
    flex: 1 0 25%;
    padding: 15px;
  }
}
@media screen and (min-width: 1200px) {
  .block-gallery #thumbnails-nav li {
    flex: 1 0 10%;
    padding: 20px;
  }
}
.block-gallery #thumbnails-nav li img {
  border: 4px solid #FFF;
  cursor: pointer;
  width: 100%;
  -webkit-transition: border-color 0.3s ease;
  -moz-transition: border-color 0.3s ease;
  -ms-transition: border-color 0.3s ease;
  -o-transition: border-color 0.3s ease;
  transition: border-color 0.3s ease;
}
.block-gallery #thumbnails-nav li.tns-nav-active img {
  border-color: #2bcd2a;
}

body.page-color--primary .block-gallery #thumbnails-nav li.tns-nav-active img {
  border-color: #2bcd2a;
}
@media (pointer: fine), (-ms-high-contrast: none) {
  body.page-color--primary .tns-outer .tns-controls button:hover {
    background: #2bcd2a;
    border-color: #2bcd2a;
  }
}
body.page-color--secondary .block-gallery #thumbnails-nav li.tns-nav-active img {
  border-color: #510c5d;
}
@media (pointer: fine), (-ms-high-contrast: none) {
  body.page-color--secondary .tns-outer .tns-controls button:hover {
    background: #510c5d;
    border-color: #510c5d;
  }
}
body.page-color--tertiary .block-gallery #thumbnails-nav li.tns-nav-active img {
  border-color: #00a9b7;
}
@media (pointer: fine), (-ms-high-contrast: none) {
  body.page-color--tertiary .tns-outer .tns-controls button:hover {
    background: #00a9b7;
    border-color: #00a9b7;
  }
}
body.page-color--quaternary .block-gallery #thumbnails-nav li.tns-nav-active img {
  border-color: #465daa;
}
@media (pointer: fine), (-ms-high-contrast: none) {
  body.page-color--quaternary .tns-outer .tns-controls button:hover {
    background: #465daa;
    border-color: #465daa;
  }
}
body.page-color--quinary .block-gallery #thumbnails-nav li.tns-nav-active img {
  border-color: #65bd60;
}
@media (pointer: fine), (-ms-high-contrast: none) {
  body.page-color--quinary .tns-outer .tns-controls button:hover {
    background: #65bd60;
    border-color: #65bd60;
  }
}

/*# sourceMappingURL=gallery.css.map */
