* { margin: 0; padding: 0; } body { width: 100%; display: flex; flex-direction: column; } main { width: 35em; margin: auto; display: flex; flex-direction: column; } h1, h2, h3, h4, h5, h6 { font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif !important; } a { color: rgb(0, 86, 179); text-decoration: none; } a:visited { color: rgb(0, 86, 179); } a:hover { text-decoration: underline; } html { color: #333; font-family: charter, Georgia, Cambria, "Times New Roman", Times, serif; font-size: 26px; line-height: 1.55rem; } p { margin: 20px 0; } img { margin: auto; max-width: 100%; display: block; } figcaption { text-align: center; } /* code { font-family: monospace; font-size: 15px; white-space: pre-wrap; font-weight: 600; line-height: 1rem; padding: 5px; border-radius: 6px; background-color: rgba(175, 184, 193, 0.2); } */ pre { font-family: Menlo, Monaco, "Courier New", Courier, monospace; font-size: 15px; white-space: pre-wrap; /* font-weight: 600; */ line-height: 1rem; padding: 20px; border-radius: 6px; background-color: rgba(175, 184, 193, 0.2); } .code-block { display: block; margin: 5px 0; padding: 20px; } iframe { width: 100%; display: block; margin: auto; min-height: 100px; } @media screen and (max-width: 1200px) { html { font-size: 16px; line-height: 1.5rem; } main { width: 90%; } img { display: block; } h1, h2, h3, h4, h5, h6 { font-family: "Times New Roman", Times, serif; line-height: 30px; } } .author__photo { width: 28px; height: 28px; border-radius: 20px; display: inline-block; margin: auto; margin-right: 5px; display: inline-flex; } .medium__source { font-style: italic; } .author { display: inline-flex; flex-direction: row; margin-right: 5px; } .meta { display: inline-flex; } .gist_contianer { border-radius: 6px; border: 1px solid rgb(211, 211, 211); } .gist_link { margin-left: 5px; } .libmedium__meta { background-color: rgb(255, 165, 0); padding: 5px; } blockquote { margin-left: -5px; padding-left: 19px; border-left: 4px solid #333; font-style: italic; } ol, ul { margin-left: 40px; } .line-number { margin-right: 20px; display: inline-block; } .gist-block { overflow-x: scroll; display: block; } .mixtape { padding: 20px; border: 1px solid gray; display: flex; align-items: center; margin: 30px 0; }