.image-section {
    max-width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin: 12px 6px 100px 6px;
}

.image-section .image-item {
    width: calc(100%/3 - 12px);
    margin: 0 6px;
    position:relative;
    overflow:hidden;
}
.image-section .image-item a{
text-decoration:none;
}
.image-section .image-item a img {
	transition: 0.8s all ease;
}
.image-section .image-item a:hover img{
	transition: 0.8s all ease;
	transform: scale(1.03);
}

.image-section .image-item a h2.text-area {
    position:absolute;
    content:"";
    bottom: 43px;
    left: 43px;
}
.image-section .image-item a h2.text-area div{
font-family: 'Futura Std';
font-style: normal;
font-weight: 700;
font-size: 45px;
line-height: 54px;
letter-spacing: 0.03em;
color: #FFFFFF;

}
@media screen and (max-width: 1500px){
.image-section .image-item a h2.text-area div {
  font-size: 40px;
}
}
@media screen and (max-width: 1400px){
.image-section .image-item a h2.text-area div {
  font-size: 35px;
  line-height: 50px;
}
  .image-section .image-item a h2.text-area {
  bottom: 30px;
  left: 30px;
}
}
@media screen and (max-width: 1300px){
.image-section .image-item a h2.text-area div {
  font-size: 30px;
  line-height: 45px;
}
}
@media screen and (max-width: 1200px){
.image-section .image-item a h2.text-area div {
  font-size: 25px;
  line-height: 40px;
}
.image-section .image-item a h2.text-area {
  bottom: 25px;
  left: 25px;
}
}
@media screen and (max-width: 991px){
.image-section .image-item a h2.text-area div {
  font-size: 22px;
  line-height: 32px;
}
.image-section .image-item a h2.text-area {
  bottom: 20px;
  left: 20px;
}
.image-section {
  margin: 10px 5px 50px 5px;
}
}
@media screen and (max-width: 767px){
.image-section {
  display: block;
margin: 15px 0 0 0;
padding: 0 15px;

}
.image-section .image-item {
  width: 100%;
  margin: 0 0 15px 0;
}
.image-section .image-item a h2.text-area div {
  font-size: 20px;
  line-height: 30px;
}
}