@font-face {
    font-family: IPASansL;
    src: url(webfonts/ipa_sans_L.woff) format('woff');
}

@font-face {
    font-family: IPASansS;
    src: url(webfonts/ipa_sans_S.woff) format('woff');
}

@font-face {
    font-family: DejaVuSans;
    src: url(webfonts/DejaVuSans.ttf);
}

/*DISPLAY*/
/*display*/
body, .tra_cont, .tt_cont, .tra_H, .sym_cont {display: block;}
.input_M {display: flex;}
.input_M {align-items: center;}
/*position*/
.tra_cont {position: relative;}
.tt_cont, .sym_cont {position: fixed; top: 0px; left: -3000px;}
.close_cont {position: absolute; bottom: 9px; right: 10px;}
/*overflow*/
body {overflow-y: scroll;}
.inTr, .tt_cont, .input_tr {overflow-y: hidden;}
/*resize*/
.inTr {resize: vertical;}
.input_tr {resize: none;}

/*BORDERS*/
/*border style*/
table, td, .inTr_cont, .tt_cont {border: solid;}
.sym_cont {border: ridge;}
button, .trans, .tra_cont, .inTr, .tbl_L, .tbl_R, .tt, .tt_L, .tt_R, .tt_sym, .tbl_cont, .symdes_L, .symdes_R, .audes_L, .ausym_L, .ausym_R, .ausym_R_0, .close_cont, .input_tr {border: none;}
/*border-width*/
table, tr, td {border-width: 1px;}
.inTr_cont, .tt_cont {border-width: 2px;}
.sym_cont {border-width: 4px;}
.tt, .tbl_cont, .sym_L, .sym_R, .input_tr {border-width: 0px;}
.cpS_R, .cpS_Le, .cpS_Re, .cpS_LRe, .cpS_Rn, .cnpD, .cnpD_T, .cnpD_B, .coD_TL, .coD_L, .coD_BL, .coD_TR, .coD_R, .coD_BR, .coS_TM, .coS_M, .coS_BM, .coS_TR, .coS_R, .coS_BR, .diaD, .diaD_T, .diaD_TR, .supD_T, .supD, .supD_B, .twaD_TL, .twaD_L, .twaD_BL, .twaD_TR, .twaD_R, .twaD_BR, .twaS_TR, .twaS_TM, .twaS_R, .twaS_M, .twaS_BR, .twaS_BM, .twaOR, .twaOR_T, .vD_TL, .vD_TM, .vD_TR, .vD_BR {border-left-width: 0px;}
.sym_R {border-left-width: 1px;}
.cpS_L, .cpS_Le, .cpS_Re, .cpS_LRe, .cpS_Ln, .cnpS, .cnpS_T, .cnpS_B, .coD_TL, .coD_L, .coD_BL, .coS_TL, .coS_L, .coS_BL, .coS_TM, .coS_M, .coS_BM, .coS_TR, .coS_R, .coS_BR, .diaS, .diaS_T, .diaS_TL, .supS_T, .supS, .supS_B, .twaD_TL, .twaD_L, .twaD_BL, .twaS_TL, .twaS_L, .twaS_BL, .twaS_TR, .twaS_TM, .twaS_R, .twaS_M, .twaS_BR, .twaS_BM, .twaOR, .twaOR_T, .vD_TLL, .vD_TL, .vD_TM, .vD_L, .vD_ML, .vD_BL {border-right-width: 0px;}
.sym_L {border-right-width: 1px;}
.cnpD, .cnpS, .coD_L, .coD_R, .coS_L, .coS_M, .coS_R, .supD, .supS, .twaD_L, .twaD_R, .twaS_L, .twaS_R, .twaS_M, .twaOR, .vD_L, .vD_ML, .vD_M, .vD_R {border-top-width: 0px; border-bottom-width: 0px;}
.cnpD_T, .cnpS_T, .coS_TL, .coS_TM, .coS_TR, .coD_TL, .coD_TR, .supD_T, .supS_T, .twaD_TL, .twaD_TR, .twaS_TL, .twaS_TR, .twaS_TM, .twaOR_T, .vD_TLL, .vD_TL, .vD_TM, .vD_TR {border-top-width: 1px; border-bottom-width: 0px;}
.cnpD_B, .cnpS_B, .coS_BL, .coS_BM, .coS_BR, .coD_BL, .coD_BR, .supD_B, .supS_B, .twaD_BL, .twaD_BR, .twaS_BL, .twaS_BR, .twaS_BM, .vD_BL, .vD_BR {border-top-width: 0px; border-bottom-width: 1px;}
/*border-radius*/
table, .tr_T, .cpD_TL, .coS_TL, .diaS_TL, .supS_T, .twa_TL, .vD_TLL, .inTr_cont, .tt_cont {border-top-left-radius: 11px;}
table, .tr_T, .cpD_TR, .coD_TR, .diaD_TR, .supD_T, .twa_TR, .vD_TR, .inTr_cont, .tt_cont {border-top-right-radius: 11px;}
.sym_cont {border-radius: 11px;}
/*border-color*/
table, tr, td, .inTr_cont, .tt_cont, .sym_cont, .sym_L, .sym_R {border-color: rgba(193,79,30,1);}
/*border-spacing*/
table, tr, td {border-spacing: 0px;}
/*box-shadow*/
table, .sym_cont {box-shadow: 0 0 0 1px rgba(50,50,50,1);}
.tt_cont, .sym_cont {box-shadow: 0 0 0 1px rgba(50,50,50,0.75), 0 0 5px 5px rgba(50,50,50,0.75);}
.inTr_cont {box-shadow: 0 0 0 1px rgba(50,50,50,1), 0 25px 25px 0px rgba(30,30,30,0.75), 0 -25px 25px 10px rgba(30,30,30,0.75);}
.trans, .tt, .tbl_cont, .tbl_R, .tt_L, .tt_R, .tt_sym {box-shadow: none;}

/*BACKGROUNDS*/
/*background image*/
.btnLong {background: url(images/blank_out.png);}
/*.vD_BR {background: url(images/vowel_space.svg);}*/
.play_1 {background: url(images/play_1_out.png);}
.play_1:hover {background: url(images/play_1_over.png);}
.play_1:active {background: url(images/play_1_down.png);}
.play_2 {background: url(images/play_2_out.png);}
.pause {background: url(images/pause_out.png);}
.loop {background: url(images/loop_out.png);}
.volup {background: url(images/volup_out.png);}
.voldown {background: url(images/voldown_out.png);}
.mute {background: url(images/mute_out.png);}

/*background-position*/
.tra_cont {background-position: top;}
/*background-size*/
button {background-size: contain;}
/*background-repeat*/
.tra_cont {background-repeat: repeat-x;}
button {background-repeat: no-repeat;}
/*background-color*/
body {background-color: rgba(30,30,30,1);}
table {background-color: rgba(193,79,30,1);}
button, .trans, .tbl_L, .tbl_R, .tt, .tt_L, .tt_R, .tt_sym, .tbl_cont, .sym_L, .sym_R, .audes_L, .ausym_L, .ausym_R, .ausym_R_0, .symdes_L, .symdes_R, .close_cont, .input_tr {background-color: transparent;}
.cpLRn, .cpS_Ln, .cpS_Rn {background-color: rgba(226,183,154,1);}
td, .vD_BR, .inTr_cont, .tt_cont, .sym_cont {background-color: rgba(255,255,255,1);}
/*background-gradient*/
.cpD_T, .cpD_TL, .cpD_TR, .cpD_L, .twa_TL, .twa_TR {
	background-color: rgb(200,85,34);
	background: url(images/bckg.png);
	background-repeat: repeat-x;
	background-size: contain;
	background: -webkit-linear-gradient(270deg, rgba(227,101,40,1), rgba(201,85,34,1)); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(180deg, rgba(227,101,40,1), rgba(201,85,34,1)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(180deg, rgba(227,101,40,1), rgba(201,85,34,1)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(180deg, rgba(227,101,40,1), rgba(201,85,34,1)); /* Standard syntax */
}

/*TEXT*/
/*color*/
body, .symT, .inTr, .inTr_cont, .tt, .tbl_cont, .symdes_L, .symdes_R, .audes_L, .ausym_R, .ausym_R_0, .tt_L, .tt_R, .tt_sym, .symP {color: rgba(50,50,50,1);}
h1, .tra_H, A:link, A:visited, .tc_H, .cmt, .cmtV, .lg_lg, .btnNav, .tt_tbl {color: rgba(227,101,40,1);}
A:hover, .btnNav:hover, .btnLg:hover, .btnLgA:hover {color: rgba(254,206,49,1);}
.btnLg:active, .btnLgA, .btnLgA:active {color: rgba(227,101,40,1);}
.notr {color: rgba(75,75,75,0.75);}
.btnLg, .btnTr, .btnTrU {color: rgba(174,174,174,0.75);}
tr, td, h2, .ipa {color: rgba(255,255,255,1);}
.desT, .twaOR_T, .desTV {color: rgba(166,59,10,1);}
.input_tr {color: inherit;}
/*font*/
.btnLong, .btnLg, .btnLgA, .notr, .btnTr, .btnNav, .input_tr {font: inherit;}
/*font-family*/
body, td {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}
.IPASS {font-family: IPASansS;}
.symT, .btnTrU, .inTr, .res, .ausym_R, .ausym_R_0, .tt_sym, .symP {font-family: IPASansL;}
.nav_x {font-family: IPASansL;}
/*font-kerning*/
.ausym_R, .ausym_R_0 {font-kerning: normal;}
/*font-size*/
td {font-size: 13px;}
body, .nav_x, .lg_n {font-size: 14px;}
.desT, .btnLong, .btnLg, .btnLgA, .notr, .btnTr, .btnTrU, .lg_tr, .symdes_L, .symdes_R, .audes_L {font-size: 15px;}
.tt, .tt_L, .tt_R, .ausym_R_0 {font-size: 16px;}
.lg_lg {font-size: 17px;}
.res {font-size: 18px;}
h1, h2, .tra_H, .ausym_R, .btnNav, .tt_sym {font-size: 20px;}
.symT {font-size: 27px;}
.symP {font-size: 300px;}
.inTr {font-size: 1.4285em;}
.input_tr {font-size: inherit;}
/*font-weight*/
body, h1, .tra_H, .inTr {font-weight: normal;}
h2, .btnLong, .btnLg, .btnLgA, .notr, .btnTr, .btnTrU, .lg_lg, .symdes_L, .btnNav {font-weight: bold;}
.input_tr {font-weight: inherit;}
/*font-italic*/
.tt_L, .audes_L, .lg_n {font-style: italic;}
.input_tr {font-style: inherit;}
/*text-decoration*/
A {text-decoration: none;}
/*line-height*/
.inTr {line-height: 1.35em;}
/*white-space*/
A {white-space: nowrap;}
/*text-align*/
body, .tt {text-align: justify;}
.cpD_L, .desT, .vD_TLL, .vD_TL, .vD_L, .vD_ML, .vD_BL, .ipa, .tbl_L, h1, .sym_R, .symdes_L, .symdes_R, .audes_L, .ausym_L, .ausym_R, .ausym_R_0, .tt_L, .tt_R, .tt_sym {text-align: left;}
td, h2, .cmt, .btn_cont, .btnLg, .btnLgA, .res, .lg_au, .lg_n, .sym_cont, .twaS_TM, .twaS_M, .twaS_BM, .sym_L {text-align: center;}
.vD_TR, .twaS_TR, .twaS_R, .twaS_BR, .cmtV, .btnTr, .btnTrU, .tbl_R, .close_cont {text-align: right;}
.input_M, .input_tr {text-align: inherit;}
/*vertical-align*/
.tbl_L, .tbl_R, .tbl_cont, .sym_L, .sym_R, .symdes_L {vertical-align: top;}
.tt, .tt_cont, .btnLg, .btnLgA, .notr, .ausym_R, .ausym_R_0, .tt_L, .tt_R, .tt_sym, .symP, .input_M, .input_tr {vertical-align: middle;}
/*word-wrap*/
td {word-wrap: break-word;}
td {word-break: keep-all;}

/*SIZE*/
/*width*/
body {width: 1000px;}
button {width: 25px;}
td {width: 33.5px;}
.tra_cont, .tt_cont, .tt, .tt_L, .tt_R, .tt_tbl, .tbl_cont, .btnTr, .btnTrU {width: auto;}
.ausym_L {width: 31px;}
.ausym_R {width: 67px;}
.btnLg, .btnLgA, .notr {width: 82.83px;}
.tblVST {width: 375px;}
.tblCOSD {width: 592px;}
.sym_cont {width: 936px;}
.inTr_cont {width: 974px;}
.trans {width: 1000px;}
.twaS_TR, .twaS_TM, .twaS_R, .twaS_M, .twaS_BR, .twaS_BM {width: 20px; min-width: 20px; max-width: 20px;}
.coS_TM, .coS_TR, .coS_M, .coS_R, .coS_BM, .coS_BR, .twaOR_T, .twaOR {width: 29px; min-width: 29px; max-width: 29px;}
.twaD_L {width: 79.5px; min-width: 79.5px; max-width: 79.5px;}
.twaD_R {width: 84.85px; min-width: 84.85px; max-width: 84.85px;}
.cpD_T, .cpD_TR {width: 80.35px; min-width: 80.35px; max-width: 80.35px;}
.cpD_L {width: 84px; min-width: 84px; max-width: 84px;}
.vD_TLL, .symdes_L {width: 110px; min-width: 110px; max-width: 110px;}
.audes_L {width: 112px; min-width: 112px; max-width: 112px;}
.btnLong {width: 136px; min-width: 136px; max-width: 136px;}
.cnpD, .diaD {width: 156px; min-width: 156px; max-width: 156px;}
.coD_R {width: 200px; min-width: 200px; max-width: 200px;}
.vD_BR {width: 255px; min-width: 255px; max-width: 255px;}
.coD_L, .ipa, .ausym_R_0 {width: 280px; min-width: 280px; max-width: 280px;}
.tbl_R {width: 284px; min-width: 284px; max-width: 375px;}
.symdes_R {width: 320px; min-width: 320px; max-width: 320px;}
.supD {width: 332.5px; min-width: 332.5px; max-width: 332.5px;}
.sym_L, .sym_R {width: 467px; min-width: 467px; max-width: 467px;}
.tbl_L {width: 610px; min-width: 610px; max-width: 610px;}
.inTr {width: 958px; min-width: 958px; max-width: 958px;}
.input_M, .input_tr {width: inherit;}
/*max-width*/
.tt_cont {max-width: 500px;}
/*height*/
.tbl_L, .tbl_R, .tbl_cont, .symdes_L, .symdes_R, .audes_L {height: auto;}
.vD_TLL, .vD_TL, .vD_TM, .vD_TR {height: 20px;}
button {height: 25px;}
.audes_L, .ausym_L, .ausym_R, .ausym_R_0 {height: 31px;}
.vD_ML, .vD_L, .vD_BL, .vD_BR {height: 34.5px;}
td {height: 39px; min-height: 39px; max-height: 39px;}
.tt_L, .tt_R, .tt_sym {height: 26px;; min-height: 26px; max-height: 26px;}
.sym_L, .sym_R {height: 424px; min-height: 424px; max-height: 424px;}
.sym_cont {height: 430px; min-height: 430px; max-height: 430px;}
.inTr {height: 20px; min-height: 0px;}
.inTr_cont {height: 100%;}
.input_M {height: inherit;}

/*MARGINS*/
body {margin: auto;}
.tbl_cont, .tbl_L, .tbl_R, .sym_cont, .input_tr {margin: 0px;}
.inTr {margin-top: 0px; margin-bottom: 0px;}

/*PADDING*/
.tt_cont {padding: 9px;}
body {padding-right: 9px;}
table, tr, td, .btnTr, .btnTrU, .inTr, .tbl_cont, .tbl_L, .tbl_R, .sym_cont, .symdes_B, .input_tr, .input_M {padding: 0px;}
/*padding-left*/
.twaS_TL, .twaS_L, .twaS_BL {padding-left: 2px;}
.cnpS, .coS_TL, .coS_L, .coS_BL, .coS_TM, .coS_M, .coS_BM, .diaS, .supS_T, .supS, .supS_B {padding-left: 3px;}
.vD_TL, .btnTr, .btnTrU, .ausym_L, .ausym_R, .ausym_R_0 {padding-left: 5px;}
.cpS_L, .cpS_Le, .inTr, .tt_R, .tt_sym {padding-left: 6px;}
.cpD_L, .vD_L, .vD_ML, .vD_BL, .ipa {padding-left: 7px;}
.tbl_R {padding-left: 10px;}
h1, .tra_H {padding-left: 11px;}
.inTr_cont, .symdes_L {padding-left: 12px;}
.audes_L {padding-left: 20px;}
/*padding-right*/
.cnpS, .coS_TL, .coS_L, .coS_BL, .coD_L, .coD_R, .coS_TR, .coS_R, .coS_BR, .diaS, .supS_T, .supS, .supS_B {padding-right: 3px;}
.cpS_R, .cpS_Re, .twaD_L, .trans, .inTr, .inTr_cont, .tt_L, .symdes_R {padding-right: 6px;}
.twaD_R, .twaS_TR, .twaS_TM, .twaS_R, .twaS_M, .twaS_BR, .twaS_BM, .vD_TR {padding-right: 8px;}
.symdes_L {padding-right: 15px;}
.cmtV {padding-right: 31px;}
/*padding-top*/
.tt_L {padding-top: 1px;}
.vD_ML, .trans {padding-top: 3px;}
.cmt, .tt_cont, .lg_au, .sym_R, .symdes_T, .symdes_TB, .btnLg, .btnLgA, .notr {padding-top: 6px;}
.cmtV {padding-top: 7px;}
.vD_TLL, .vD_TL, .vD_TM, .vD_TR, .lg_n {padding-top: 10px;}
.inTr_cont {padding-top: 12px;}
.btn_cont, .symdes_TT, .symP {padding-top: 18px;}
/*padding-bottom*/
.tt_sym {padding-bottom: 1px;}
.lg_au {padding-bottom: 5px;}
.symdes_TB, .lg_n {padding-bottom: 6px;}
.cmt, .cmtV, .symdes_BB {padding-bottom: 10px;}
.inTr_cont, .tra_H {padding-bottom: 12px;}
.btn_cont {padding-bottom: 15px;}
.ipa, .symdes_TT {padding-bottom: 20px;}
.btnLg, .btnLgA, .notr {padding-bottom: 40px;}

/*CURSOR*/
h1, .tra_H, button, .symT {cursor: pointer;}

/*OTHER*/
.sym_cont {z-index: 110;}
.tt_cont {z-index: 210;}
input:focus, select:focus, button:focus, textarea:focus {outline: none;}
.sym_cont {
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none; /* Chrome/Safari/Opera */
	-khtml-user-select: none; /* Konqueror */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
	/* user-select: none; Non-prefixed version, currently not supported by any browser */
}
.symsel {
	-webkit-touch-callout: text; /* iOS Safari */
	-webkit-user-select: text; /* Chrome/Safari/Opera */
	-khtml-user-select: text; /* Konqueror */
	-moz-user-select: text; /* Firefox */
	-ms-user-select: text; /* Internet Explorer/Edge */
	/* user-select: text; Non-prefixed version, currently not supported by any browser */
}

/*SELECTION*/
::-moz-selection {color: rgba(255,255,255,1); background: rgba(193,79,30,1);}
::selection {color: rgba(255,255,255,1); background: rgba(193,79,30,1);}
.symsel::-moz-selection {background: transparent;}
.symsel::selection {background: transparent;}