:root { --md-admonition-icon--note: url("data:image/svg+xml;charset=utf-8,"); --md-admonition-icon--abstract: url("data:image/svg+xml;charset=utf-8,"); --md-admonition-icon--info: url("data:image/svg+xml;charset=utf-8,"); --md-admonition-icon--tip: url("data:image/svg+xml;charset=utf-8,"); --md-admonition-icon--success: url("data:image/svg+xml;charset=utf-8,"); --md-admonition-icon--question: url("data:image/svg+xml;charset=utf-8,"); --md-admonition-icon--warning: url("data:image/svg+xml;charset=utf-8,"); } .md-typeset .admonition { display: flex; border-radius: 0.25rem; margin: 1rem 0; padding: 1rem; position: relative; } .md-typeset .admonition.note { background-color: var(--md-admonition-background-color--note, #f9fafb); border: 1px solid var(--md-admonition-border-color--note, #e9ecef); } .md-typeset .admonition.abstract { background-color: var(--md-admonition-background-color--abstract, #f9f9f9); border: 1px solid var(--md-admonition-border-color--abstract, #e1e4e8); } .md-typeset .admonition.info { background-color: var(--md-admonition-background-color--info, #e7f1fb); border: 1px solid var(--md-admonition-border-color--info, #addbee); } .md-typeset .admonition.tip { background-color: var(--md-admonition-background-color--tip, #e5f8ec); border: 1px solid var(--md-admonition-border-color--tip, #a3e1b1); } .md-typeset .admonition.success { background-color: var(--md-admonition-background-color--success, #d4edda); border: 1px solid var(--md-admonition-border-color--success, #c3e6cb); } .md-typeset .admonition.question { background-color: var(--md-admonition-background-color--question, #fefefe); border: 1px solid var(--md-admonition-border-color--question, #dadada); } .md-typeset .admonition.warning { background-color: var(--md-admonition-background-color--warning, #fff3cd); border: 1px solid var(--md-admonition-border-color--warning, #ffeeba); } .md-typeset .admonition-title { font-size: 1rem; font-weight: 700; margin: 0; } .md-typeset .admonition-content { margin: 0; padding: 0 1rem; flex: 1; } .md-typeset .admonition-icon { display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; position: absolute; top: 0; left: 0; } .md-typeset .admonition-icon > svg { fill: var(--md-admonition-icon-fill, #212529); width: 1.5rem; height: 1.5rem; }