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

.index__container a{
align-items: center;
justify-content: center;
border: 1px solid #000;
text-align: center;
cursor: pointer;
padding-block-start: 1em;
padding-inline-end: 2em;
padding-block-end: 1em;
padding-inline-start: 2em;
color: #fff;
background-color: #000;
min-width: 240px;
font-size: 16px;
}

.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;
    }
	.index__container--img{
		padding-bottom: 10px;
	}
}

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

}

@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) {}