Template:IPA vowels/sandbox/styles.css

.IPA-vowels-main, .IPA-vowels-noaudio .IPA-vowels-container > div > span, .IPA-vowels-container-dot, .IPA-vowels-audio .IPA-audiocell { background-color: var(--background-color-neutral-subtle, #f8f9fa); color: var(--color-base, #202122); }

.IPA-vowels-main { table-layout: fixed; border-collapse: collapse; text-align: center; }

.IPA-vowels-nocaption { border: 1px solid var(--border-color-base, #a2a9b1); }

.IPA-vowels-main th { vertical-align: middle; padding: 0; }

.IPA-vowels-main th[scope="col"] { padding-top: 0.2em; }

.IPA-vowels-main th[scope="row"] { text-align: right; padding-left: 0.4em; }

.IPA-vowels-minorcaption { font-weight: normal; }

.IPA-vowels-main td { vertical-align: middle; padding: 0; font-size: 125%; line-height: 1.2; }

.IPA-vowels-noaudio td { width: 106.67px; min-width: 106.67px; height: 32px; }

.IPA-vowels-audio td { width: 200px; min-width: 200px; height: 60px; }

.IPA-vowels-image-cell { position: relative; }

.IPA-vowels-image { position: absolute; top: 0; left: 0; }

.IPA-vowels-container { display: flex; justify-content: center; }

.IPA-vowels-noaudio .IPA-vowels-container > div { width: 1em; }

.IPA-vowels-noaudio .IPA-vowels-container > div:first-child { direction: rtl; text-align: right; }

.IPA-vowels-noaudio .IPA-vowels-container > div:last-child { direction: ltr; text-align: left; }

.IPA-vowels-noaudio .IPA-vowels-container > div:first-child > span { padding-left: 0.2em; }

.IPA-vowels-noaudio .IPA-vowels-container > div:last-child > span { padding-right: 0.2em; }

.IPA-vowels-container-dot { /* Prevent poorly placed diacritics from cutting off */ z-index: -1; }

.IPA-vowels-audio .IPA-vowels-container > div:empty { width: 40px; }

.IPA-vowels-audio .IPA-audiocell-audio { font-size: 90%; }