@media only screen and (max-width: 568px) {
    code {
        overflow-x: scroll;
    }
    .content {
        width: initial !important;
        padding: 1em 2em 0 2em !important;
        overflow: auto;
    }
    .header, .podcast-header {
        padding-top: 0 !important;
    }
    .header h1, .podcast-header h1 {
        font-size: 2.5em !important;
        text-align: center;
        line-height: 1em !important;;
        padding: 0.4em 0 !important;
    }
    p {
        font-size: 17px !important;
    }
    h2 {
        font-size: 1.9em !important;
        margin-bottom: .6em !important;
    }
    h3 {
        font-size: 1.8em !important;
        margin-bottom: .6em !important;
    }
    ol {
        font-size: 16px !important;
        margin: 0 !important;
    }
}

@media only screen and (min-width: 568px) and (max-width: 768px) {
    code {
        overflow-x: scroll;
    }
    .content {
        width: initial !important;
        padding: 1em 7em 0 7em !important;
        overflow: auto;
    }
    .header {
        padding-top: 0 !important;
    }
    .header h1 {
        font-size: 2.6em !important;
        text-align: center;
        line-height: 1em !important;;
        padding: 0.4em 0 !important;
    }
    h2 {
        font-size: 2.4em !important;
        margin-bottom: .6em !important;
    }
    h3 {
        font-size: 2.3em !important;
        margin-bottom: .6em !important;
    }
    ol {
        font-size: 17px !important;
        margin: 0 !important;
    }
}
