#post {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        @apply font-bold;
    }

    h2 {
        @apply text-3xl mt-16;
    }

    h3 {
        @apply text-2xl;
    }

    h4 {
        @apply text-xl;
    }

    h5 {
        @apply text-lg;
    }

    h1,
    h2,
    h3,
    h4,
    ul,
    p,
    div.video {
        @apply max-w-3xl break-words mx-auto px-6 mb-6;
    }

    blockquote {
        @apply max-w-4xl relative mx-auto bg-gray-100 text-base font-semibold italic rounded py-6 mt-8 mb-6;
    }
    blockquote::before {
        content: '“';
        @apply absolute text-3xl;
        top: 0;
        left: 5px;
    }
    blockquote::after {
        content: '”';
        @apply absolute text-3xl;
        bottom: -5px;
        right: 15px;
    }
    blockquote p:last-child {
        @apply mb-0;
    }
    blockquote p code {
        @apply text-base;
    }

    @screen md {
        blockquote {
            @apply text-xl py-10;
        }
        blockquote::before {
            @apply text-6xl;
            top: -5px;
            left: 15px;
        }
        blockquote::after {
            @apply text-6xl;
            bottom: -25px;
            right: 30px;
        }
        blockquote p code {
            @apply text-lg;
        }
    }

    > ul,
    > ol {
        @apply pl-12;
    }
    ul li {
        list-style-type: disc;
        @apply mb-1;
    }
    ul ul,
    ol ol {
        @apply my-1;
    }

    p code,
    ul code {
        @apply bg-gray-100 text-base py-1 px-2;
    }

    pre {
        @apply max-w-4xl mx-auto rounded px-0 my-8;
        background-color: #282a36;
    }
    pre code {
        @apply font-mono text-xs px-6 py-8;
    }

    p.image {
        @apply max-w-4xl text-center text-sm text-gray-400 my-10 px-0;
    }
    img {
        @apply block mx-auto shadow-lg mb-4;
    }

    .share-links a {
        @apply text-gray-400;
    }
    .share-links a:hover {
        text-decoration: none;
    }
}

@screen sm {
    #post pre code {
        @apply text-base;
    }
}

@screen md {
    #post pre code {
        @apply p-12;
    }
}
