.container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;

}

.column {
    display: flex;
    flex-direction: column;
    position:relative;
    max-height: 98vh;
    overflow: hidden;
    flex: 1;
    justify-content: center;
}

.column-left{
    display: flex;
    flex-direction: column;
    position:relative;
    max-height: 98vh;
    overflow: hidden;
    flex: 1;
    justify-content: center;
    filter: grayscale(60%);
}

.column-right{
    display: flex;
    flex-direction: column;
    position:relative;
    max-height: 98vh;
    overflow: hidden;
    flex: 1;
    justify-content: center;
    filter: grayscale(60%);
}

.shop-left {
    display:flex;
    min-height: 97vh;
}
.column-left:hover {
    
    filter: grayscale(0%);
    transition: 0.6s;
}

.about-right {
    display:flex;
    min-height: 97vh;
}
.column-right:hover {
    filter: grayscale(0%);
    transition: 0.6s;
}

.button {
    display: flex;
    justify-content: center;
    position:absolute;
}
.shopbutton {
    width:70%;
}
.aboutbutton {
    width:70%;
}

.shopbutton:hover {
    width:75%;
    filter: grayscale(0%);
    transition: 0.3s;
    
}
.aboutbutton:hover {
    width:75%;
    filter: grayscale(0%);
    transition: 0.3s;
}
@media (max-width: 425px) {
    .container {
      flex-direction: column;
    }
}

@media (max-width: 1020px) {
    .container {
      flex-direction: column;
      max-height: 100vh;
    }
    .column {
        max-height: 50vh;
        max-width: 99%;
    }
    .img {
        object-fit: scale-down;
    }
}