.md-typeset .admonition,
.md-typeset details {
    border-width: 0;
    border-left-width: 3px;
    border-right-width: 1px;
}

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    grid-gap: 20px;
    align-items: stretch;
}

.grid > article {
    border: 1px solid #ccc;
    padding-top: 10px;
}

.grid > article:hover {
    box-shadow: 0 10px 16px 0 rgba(0, 0, 0, 0.5);
}

.grid > article img {
    max-width: 100%;
}

.text {
    padding: 0 20px 20px;
    position: relative;
    height: 100%;
}

.grid > article .text footer {
    display: flex;
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 0 20px 10px 0;
}

.grid > article .text .example {
    display: flex;
    position: absolute;
    padding: 0 20px 0 0;
    top: -40px;
    right: 0;
    max-width: 40%;
}

.blink {
  animation: blinker linear 2s  infinite;
}

@keyframes blinker {
  0% {
    opacity: 0.1;
  }
  30% {
    opacity: 1;
  }
  60% {
    opacity: 1;
  }
  100% {
    opacity: 0.1;
  }
}