.autoseo-infographic-wrapper {
margin: 40px 0;
clear: both;
overflow: hidden;
}
.autoseo-infographic-container {
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
} .autoseo-infographic-container img {
max-width: 100%;
height: auto;
} .autoseo-infographic-container svg {
display: inline-block;
vertical-align: middle;
} .autoseo-infographic-container table {
width: 100%;
border-collapse: collapse;
}
.autoseo-infographic-container table th,
.autoseo-infographic-container table td {
padding: 12px;
text-align: left;
} .autoseo-infographic-container > div {
margin-bottom: 1rem;
} .youtube-embed {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
max-width: 100%;
margin: 1.5em 0;
}
.youtube-embed iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
} .key-takeaways,
.table-of-contents {
writing-mode: horizontal-tb;
display: block;
width: 100%;
max-width: 100%;
margin: 2rem 0;
padding: 1.5rem;
border-radius: 8px;
overflow: hidden;
clear: both;
}
.key-takeaways {
background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
border: 1px solid #bae6fd;
border-left: 4px solid #0ea5e9;
}
.table-of-contents {
background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%);
border: 1px solid #e9d5ff;
border-left: 4px solid #a855f7;
}
.key-takeaways h2,
.key-takeaways h3,
.table-of-contents h2,
.table-of-contents h3 {
writing-mode: horizontal-tb;
display: block;
width: 100%;
margin-top: 0;
margin-bottom: 1rem;
}
.key-takeaways ul,
.table-of-contents ul {
writing-mode: horizontal-tb;
display: block;
margin-bottom: 0;
padding-left: 1.5rem;
}
.key-takeaways li,
.table-of-contents li {
writing-mode: horizontal-tb;
display: list-item;
}
.autoseo-heading-anchor {
color: inherit;
text-decoration: none;
font: inherit;
writing-mode: horizontal-tb;
display: inline;
} @media print {
.autoseo-infographic-wrapper {
page-break-inside: avoid;
}
}