a:not(.button){
  word-wrap: break-word;
}
.image-gallery-mod{
  padding: 60px 0; 
  background: #fff;
}
.fancybox-bg{
  background: #000 !important;
}
.fancybox-is-open .fancybox-bg{
  opacity:.95 !important;
}
.fancybox-button--arrow_left:before{ 
  position:absolute;
  content:'';
  left:5px;
  width:40px;
  height:40px;
  border-radius:50px;
  background-color:transparent;
}
.fancybox-button--arrow_left:hover:before{
  position:absolute;
  content:'';
  left:5px;
  width:40px;
  height:40px;
  border-radius:50px;
  background-color:rgb(212, 199, 171);
}
.fancybox-button--arrow_right:before{ 
  position:absolute;
  content:'';
  right:5px;
  width:40px;
  height:40px;
  border-radius:50px;
  background-color:transparent;
}
.fancybox-button--arrow_right:hover:before{
  position:absolute;
  content:'';
  right:5px;
  width:40px;
  height:40px;
  border-radius:50px;
  background-color:rgb(212, 199, 171);
}
.container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 20px 20px;
  justify-content: center;
  align-items: center;
  padding: 0 15px;
  max-width: 1230px;
  width: 100%;
  margin: 0 auto;
}

.card {
  /*   background: $color-white;
  box-shadow: $box-shadow;
  color: $color-dark; */
  border-radius: 2px;
}
.card-image {
  /*   background: $color-white; */
  display: block;
  padding-top: 66%;
  position: relative;
  width: 100%;
  overflow: hidden;
}
.card:hover .card-image a{
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  transition: all 0.4s cubic-bezier(.15,.75,.5,1) 0s;
  -webkit-transition: all 0.4s cubic-bezier(.15,.75,.5,1) 0s;
}
.card:hover .card-image a:after{
  opacity:0.8;
}
.card-image a:after {
  opacity: 0;
  height: 100%;
  width: 100.2%;
  content:'';
  top: 0;
  left: 0;
  background-color: #000;
  position: absolute;
  z-index: 2;
  transition: all 0.4s cubic-bezier(.15,.75,.5,1) 0s;
  -webkit-transition: all 0.4s cubic-bezier(.15,.75,.5,1) 0s;
}
.card:hover .card-image img {
  transform: scale(1.1);
  transition: transform 1s cubic-bezier(0, 1, 0.5, 1);
}
.card-image img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  transition: transform 1s cubic-bezier(0, 1, 0.5, 1);
}
@media only screen and (min-width: 1px) and (max-width: 999px){
  .container {
    grid-template-columns: repeat(2,1fr);
  }
}
@media only screen and (max-width: 600px) {
  .container {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 1rem;
  }
}