/* IPA chart stylesheet */


/* _____ */
/* Shaw | GENTIUM (ORMIN) | Regular 400 */
@font-face {
  font-display: swap;
  font-family: 'Gentium';
  font-style: normal;
  font-weight: 400;
  src: url('Shaw-ormin-400-regular.woff2') format('woff2'); 
  unicode-range: U+10450-1047F;
  size-adjust: 120%;
}

@font-face {
  font-display: swap;
  font-family: 'Gentium';
  font-style: italic; /* faux */
  font-weight: 400;
  src: url('Shaw-ormin-400-regular.woff2') format('woff2'); 
  unicode-range: U+10450-1047F;
  size-adjust: 120%;
}

@font-face {
  font-display: swap;
  font-family: 'Gentium';
  font-style: normal;
  font-weight: 700; /* faux */
  src: url('Shaw-ormin-400-regular.woff2') format('woff2'); 
  unicode-range: U+10450-1047F;
  size-adjust: 120%;
}

@font-face {
  font-display: swap;
  font-family: 'Gentium';
  font-style: italic; /* faux */
  font-weight: 700; /* faux */
  src: url('Shaw-ormin-400-regular.woff2') format('woff2'); 
  unicode-range: U+10450-1047F;
  size-adjust: 120%;
}


/* _____ */
/* Latn Grek Cyrl | GENTIUM | Regular 400 700, Italic 400 700 */
@font-face {
  font-family: 'Gentium';
  font-style: normal;
  font-weight: 400;
  src: url('Latn-gentium-400-regular.woff2') format('woff2');
  font-feature-settings: "ss05" 0, "cv43" 2, "cv70" 1, "cv71" 1, "cv77" 1;
}

@font-face {
  font-family: 'Gentium';
  font-style: italic;
  font-weight: 400;
  src: url('Latn-gentium-400-italic.woff2') format('woff2');
  font-feature-settings: "ss05" 0, "cv43" 2, "cv70" 1, "cv71" 1, "cv77" 1;
}

@font-face {
  font-family: 'Gentium';
  font-style: normal;
  font-weight: 700;
  src: url('Latn-gentium-700-regular.woff2') format('woff2');
  font-feature-settings: "ss05" 0, "cv43" 2, "cv70" 1, "cv71" 1, "cv77" 1;
}

@font-face {
  font-family: 'Gentium';
  font-style: italic;
  font-weight: 700;
  src: url('Latn-gentium-700-italic.woff2') format('woff2');
  font-feature-settings: "ss05" 0, "cv43" 2, "cv70" 1, "cv71" 1, "cv77" 1;
}


/* _____ */
/* Brai | ANDIKA (QUIVIRA) | Regular 400 */

@font-face { 
font-display: swap;
font-family: 'Andika';
font-weight: 400;
font-style: normal;
src: url('Brai-quivira-subset-400-regular.woff2') format('woff2'); 
unicode-range: U+2800-28FF;
} 

@font-face { 
font-display: swap;
font-family: 'Andika';
font-weight: 400;
font-style: italic; /* faux */
src: url('Brai-quivira-subset-400-regular.woff2') format('woff2'); 
unicode-range: U+2800-28FF;
} 

@font-face { 
font-display: swap;
font-family: 'Andika';
font-weight: 700; /* faux */
font-style: normal;
src: url('Brai-quivira-subset-400-regular.woff2') format('woff2'); 
unicode-range: U+2800-28FF;
} 

@font-face { 
font-display: swap;
font-family: 'Andika'; 
font-weight: 700; /* faux */
font-style: normal; /* faux */
src: url('Brai-quivira-subset-400-regular.woff2') format('woff2'); 
unicode-range: U+2800-28FF;
} 


/* _____ */
/* Latn Grek Cyrl | Andika | Regular 400 500 700, Italic 400 500 700 */
@font-face {
  font-display: swap; 
  font-family: 'Andika';
  font-style: normal;
  font-weight: 400;
  src: url('Latn-andika-400-regular.woff2') format('woff2'); 
font-feature-settings: "ss01" 1, "cv06" 1, "cv07" 1, "cv10" 1, "cv31" 1, "cv39" 1, "cv43" 2, "cv51" 1, "cv52" 1, "cv70" 1, "cv71" 1, "cv77" 1;
}

@font-face {
  font-display: swap;
  font-family: 'Andika';
  font-style: italic;
  font-weight: 400;
  src: url('Latn-andika-400-italic.woff2') format('woff2'); 
font-feature-settings: "ss01" 1, "cv06" 1, "cv07" 1, "cv10" 1, "cv31" 1, "cv39" 1, "cv43" 2, "cv51" 1, "cv52" 1, "cv70" 1, "cv71" 1, "cv77" 1;
}

@font-face { 
font-display: swap;
font-family: 'Andika';
font-style: normal;
font-weight: 500;
src: url('Latn-andika-500-regular.woff2') format('woff2'); 
font-feature-settings: "ss01" 1, "cv06" 1, "cv07" 1, "cv10" 1, "cv31" 1, "cv39" 1, "cv43" 2, "cv51" 1, "cv52" 1, "cv70" 1, "cv71" 1, "cv77" 1;
} 

@font-face { 
font-display: swap;
font-family: 'Andika';
font-style: italic;
font-weight: 500; 
src: url('Latn-andika-500-italic.woff2') format('woff2'); 
font-feature-settings: "ss01" 1, "cv06" 1, "cv07" 1, "cv10" 1, "cv31" 1, "cv39" 1, "cv43" 2, "cv51" 1, "cv52" 1, "cv70" 1, "cv71" 1, "cv77" 1;
} 

@font-face { 
font-display: swap;
font-family: 'Andika';
font-style: normal;
font-weight: 700;
src: url('Latn-andika-700-regular.woff2') format('woff2'); 
font-feature-settings: "ss01" 1, "cv06" 1, "cv07" 1, "cv10" 1, "cv31" 1, "cv39" 1, "cv43" 2, "cv51" 1, "cv52" 1, "cv70" 1, "cv71" 1, "cv77" 1;
} 

@font-face { 
font-display: swap;
font-family: 'Andika';
font-style: italic;
font-weight: 700;
src: url('Latn-andika-700-italic.woff2') format('woff2'); 
font-feature-settings: "ss01" 1, "cv06" 1, "cv07" 1, "cv10" 1, "cv31" 1, "cv39" 1, "cv43" 2, "cv51" 1, "cv52" 1, "cv70" 1, "cv71" 1, "cv77" 1;
} 


/* _____ */
/* Latn Grek Cyrl | CHARIS | Regular 400 700, Italic 400 700 */

@font-face { 
font-display: swap;
font-family: 'Charis';
font-style: normal;
font-weight: 400;
src: url('Latn-charis-400-regular.woff2') format('woff2');
}

@font-face { 
font-display: swap;
font-family: 'Charis';
font-style: italic; 
font-weight: 400; 
src: url('Latn-charis-400-italic.woff2') format('woff2');
}

@font-face { 
font-display: swap;
font-family: 'Charis';
font-style: normal;
font-weight: 700; 
src: url('Latn-charis-700-regular.woff2') format('woff2');
}

@font-face { 
font-display: swap;
font-family: 'Charis';
font-style: italic; 
font-weight: 700; 
src: url('Latn-charis-700-italic.woff2') format('woff2');
}


/* _____ */
/* Latf | UNIFRAKTUR | Regular 400 */
@font-face {
  font-display: swap; 
  font-family: 'Unifraktur';
  font-style: normal;
  font-weight: 400;
  src: url('Latf-unifraktur-400-regular.woff2') format('woff2'); 
}

/* _____ */
/* Latg | BUNCHLO | Regular 400 */
@font-face {
  font-display: swap; 
  font-family: 'Bunchlo';
  font-style: normal;
  font-weight: 400;
  src: url('Latg-bunchlo-400-regular.woff2') format('woff2'); 
}



/* _____ */
/* END @font-face | START style specs */


body, body * {
    margin: 0;
    padding: 0; 
    font-family: 'Gentium', 'Andika';
    font-weight: 400; 
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-smooth: always; 
	scroll-behavior: smooth; 
	font-optical-sizing: auto;
	text-rendering: optimizeLegibility; 
	font-variant-numeric: lining-nums; 
	font-kerning: normal;
	text-decoration-skip-ink: all; 
	text-wrap: balance;
    & .gentium { font-family: 'Gentium'; }
    & .andika { font-family: 'Andika'; } 
  
  & [lang*="-Latf"] * {
font-family: 'Unifraktur'; 
& .symbol { font-family: 'Andika'; }
}
}

body {
	margin: 1em;
	font-size: 12pt;
}
h1 {
	font-size: 18pt;
	text-align: center;
}
h2 {
	margin-top: 1em;
	font-size: 14pt;
	text-align: left; 
        background-color: ButtonFace; 
        color: ButtonText;
}


.row {
	display: table;
	width: 100%;
}
.column-1-1,
.column-1-3,
.column-1-2-a,
.column-1-2-b,
.column-2-3 {
	display: table-cell;
}
.column-1-1 {
	width: 100%;
}
.column-1-3 {
	width: 40%;
	padding-right: 0.5em;
}
.column-1-2-a {
	width: 50%;
	padding-right: 0.5em;
}
.column-1-2-b {
	width: 50%;
	padding-left: 0.5em;
}
.column-2-3 {
	width: 60%;
	padding-left: 0.5em;
}

p {
	margin-top: 1em;
}
table {
	margin-top: 1em;
	width: 100%;
}
th, td {
	padding: 2px 4px;
	font-weight: normal;
}
.colhead {
	text-align: center;
}
.rowhead {
	text-align: left;
}

.symbol {
    text-align: center; 
    font-family: 'Andika';
    font-size: 16pt; 
    & .gentium { 
        font-family: 'Gentium'; 
        font-weight: 400; 
        font-size: 12pt; 
    }
    & .fraktur { 
        font-family: 'Unifraktur';
        font-weight: 400;
        font-size: 12pt; 
    }
}

.xsymbol {
	text-align: center;
	font-family: Gentium;
	font-size: 10pt;
	padding: 6px;
}
.impossible {
	background: gray;
}
#consonants-pulmonic th.colhead {
	width: 8%;
}
#consonants-pulmonic th.rowhead {
	width: 12%;
}
#consonants-pulmonic td.symbol,
#consonants-pulmonic td.xsymbol {
	width: 4%;
}
#consonants-non-pulmonic td.symbol,
#consonants-non-pulmonic td.xsymbol {
	width: 5%;
}
#vowels th.colhead {
	width: 16%;
}
#vowels th.rowhead {
	width: 20%;
}
#vowels td.symbol,
#vowels td.xsymbol {
	width: 8%;
}
#other-symbols td {
	width: 40%;
}
#other-symbols td.symbol,
#other-symbols td.xsymbol {
	width: 10%;
}
#suprasegmentals td {
	width: 90%;
}
#suprasegmentals td.symbol,
#suprasegmentals td.xsymbol {
	width: 10%;
}