/* Fixed GitHub "corner ribbon" in the top-right of every page. */
.github-corner {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1000;
    border: 0;
}

.github-corner svg {
    fill: var(--color-brand-primary, #2962ff);
    color: var(--color-background-primary, #fff);
    width: 80px;
    height: 80px;
}

/* The waving-arm animation on hover. */
.github-corner:hover .octo-arm {
    animation: octocat-wave 560ms ease-in-out;
}

@keyframes octocat-wave {
    0%, 100% { transform: rotate(0); }
    20%, 60% { transform: rotate(-25deg); }
    40%, 80% { transform: rotate(10deg); }
}

@media (max-width: 500px) {
    .github-corner:hover .octo-arm { animation: none; }
    .github-corner .octo-arm { animation: octocat-wave 560ms ease-in-out; }
}

/* On small screens the corner can overlap the mobile header controls;
   shrink it a touch so it stays out of the way. */
@media (max-width: 67em) {
    .github-corner svg { width: 60px; height: 60px; }
}
