.grid-4cols {
    display: grid;
    grid: auto / 200px auto;
    grid-gap: 20px;
}
.grid-4cols > div {
    text-align: left;
} 
.grid-4cols p {
    margin-top: 0px;
    text-align: justify;
} 
.grid-4cols > div:firstchild {
    text-align: right;
} 
.grid-4cols img {
    opacity: 0.85;
    -webkit-transition: 0.25s ease-out;
    -moz-transition: 0.25s ease-out;
    -o-transition: 0.25s ease-out;
    -ms-transition: 0.25s ease-out;
    transition: 0.25
}
.grid-4cols img:hover {
    opacity: 1;
    transform : scale(1.03);
}

.grid-4cols h1 {
    margin-top: 0;

}

.grid-4cols h1:hover {
    color : blue;
    text-shadow: 0 0 20px blue;

}
.grid-4cols a {
    text-decoration: none;
}

.container {
    width: 200px;
    height: 200px;
    overflow:hidden;
}

@media (min-width: 769px) {
    .grid-4cols {
    display: grid;
    grid: auto / 200px auto 200px auto ;
    grid-gap: 20px;
}
}