@import url(https://fonts.googleapis.com/css?family=Open+Sans);


.staff__block {
  max-width: 1500px;
  margin: 0;
  padding:0;
  margin: 5px auto 5px auto;
}

.card {
  width: 33%;
  float: left;
  position: relative;
  margin-bottom:2%;
  -webkit-transform: translateY(0);
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.card:hover {
  -webkit-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
  z-index: 10;
}
.card:hover:after {
  opacity: 1;
}
.card:after {
  content: "";
  border-radius: 5px;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 25px 40px -20px #CA6C00;
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.image {
  osition: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  -moz-transform: translateZ(0px);
  -webkit-transform: translateZ(0px);
}
.image img {
  width: 100%;
  height: 350px;
  display: block;
  object-fit: cover;
}
.image:before {
  position: absolute;
  content: '';
  background-image: linear-gradient(-180deg, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, 0.9) 100%);
  width: 100%;
  height: 100%;
  display: block;
  z-index: 6;
}

.text_holder {
  text-align: center;
  position: absolute;
  bottom: 0;
  width: 100%;
  left: 0;
  right: 0;
  z-index: 5;
  box-sizing: border-box;
  -webkit-transition: all 0.6s ease-in-out;
  transition: all 0.6s ease-in-out;
}
.text_holder .title {
  margin-bottom: 5px;
  color: #fff;
}

.text_holder_inner {
  padding: 15px 10px;
}

.card.slow_zoom:hover .text_holder {
  bottom: 40%;
}

.card.slow_zoom p
{
  text-align:center;
  color:#333;
  border-top:1px solid #b3b3b3;
}


.card .image_shader {
  position: absolute;
  width: 100%;
  height: auto;
  background-color: rgba(21, 21, 21, 0.78);
}

.card.slow_zoom .image_shader {
  z-index: 3;
  opacity: 0;
  -webkit-transition: all 3s cubic-bezier(0.21, 1, 0.12, 1) 0s;
  transition: all 3s cubic-bezier(0.21, 1, 0.12, 1) 0s;
}

.card.slow_zoom:hover .image_shader {
  opacity: 1;
}

.card.slow_zoom .staff_image_holder img {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 2s cubic-bezier(0.21, 1, 0.12, 1) 0s;
  transition: all 2s cubic-bezier(0.23, 1, 0.12, 1) 0s;
}

.card.slow_zoom:hover .staff_image_holder img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-transition: all 3s cubic-bezier(0.21, 1, 0.12, 1) 0s;
  transition: all 3s cubic-bezier(0.21, 1, 0.12, 1) 0s;
}
