.twocolumn .left { text-align: center; } .twocolumn .left img { max-width: 100%; transition: box-shadow 300ms; } .twocolumn .left a { transition: transform 300ms; } .twocolumn .left a:hover { transform: scale(103%); } .twocolumn .left a:hover img { box-shadow: 0px 7px 40px -17px #0009; } .twocolumn .left a { position: relative; display: inline-block; line-height: 0; } .twocolumn .left a::after, .twocolumn .left img { border-radius: 8px; } .twocolumn .left a::after { content: "Open in nieuw tabblad"; font-size: 75%; } .twocolumn .left a::after { white-space: nowrap; display: block; background-color: var(--bg-alt); color: var(--fg); padding: 8px 12px; position: absolute; bottom: -8px; left: 50%; transform: translate(-50%, 100%) translateY(-10px); line-height: initial; margin-top: 20px; transition-property: opacity, transform; transition-duration: 300ms; opacity: 0; } .twocolumn .left a:hover:after { transform: translate(-50%, 100%) translateY(0px); opacity: 1; } .twocolumn .right h2 { margin-top: 0; }