.index__container {
    display: flex;
    flex-direction: column-reverse;
}

.index__container a{
  min-width: 296px;
  width: 296px;
  cursor: pointer;
  padding: 10px 16px 14px 16px;
  outline: none;
  border: none;
  font-size: 14px;
  font-family: 'CupraRegular', sans-serif;
  text-align: center;
  transition: all 0.5s linear;
  transition: border 0s;
  max-height: 40px;
  background-color: #1b1b1b;
  color: #fff;
}

.index__container a:hover{
	background-color: #4c4c4c;
}

.index__container--img img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.index__container--text {
    display: flex;
    padding: 20px;
    flex-direction: column;
    background: #f5f5f5;
}

@media screen and (max-width: 860px) {
.index__container--text {
        padding: 110px 20px 60px 20px;
    }
}

@media screen and (min-width: 601px) {
    .index__container--text {
        padding: 110px 20px 60px 20px;
    }
    .index__container--img img {
        height: 300px;
        width: 100%;
    }

}

@media screen and (min-width: 861px) {
    .index__container--text {
        padding: 110px 20px 60px 20px;
    }
}

@media screen and (min-width: 1080px) {
    .index__container {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
	.index__container--img {
		overflow: hidden;
    }
    .index__container--img img {
        height: 100%;
        width: 100%;
		transform: scale(1);
		transition: transform .2s, -webkit-transform .2s;
    }
	
	.index__container--img img:hover { 
	transform: scale(1.1);
	}

    .index__container--text {
        justify-content: center;
        padding: 100px 80px 100px 80px;
    }
}

@media screen and (min-width: 1280px) {}