@import url("article.css");

body {
    border-inline-start: 2px solid antiquewhite;
    }

.insertTranscription { display: block; }
p, h2, h3, h4, dl, div#footer, div.example, figure, details#scriptLinks {
    margin-inline: 1rem;
    margin-block: 1rem;
    }
h2 {
    color: #F63;
    text-transform: lowercase;
    }
.charDetails p {
    line-height: 2em;
    }
p.leadin {
    margin-inline: 1rem;
    }
.decomposition, .vowelPairing, .tonePairing, .otherPairing, .charLowercase, .charUppercase, .seealso, .subjPair {
    font-size: 85%;
    text-align: start;
    margin-inline: 1rem;
    line-height: 1;
    }
.charDetails {
    margin-block: 3rem;
    /* margin-inline-start: 4rem; */
    clear: both;
    }
tt {
    display: none;
    }


.unicodeName {
    display: none;
    }

.basicInfo {
    /*padding-inline-start: 2rem;*/
    text-align: start;
    }
.nnameLoc, .nameLoc, .typeLoc, .class {
    margin-right: 2rem;
    }
.basicInfo .name {
    margin-inline-end: 2rem;
    }
.basicInfo .class, .basicInfo .transLoc {
    font-size: 90%;
    color: #ccc;
    font-style: italic;
    }
.basicInfo .transLoc {
    float: right;
    margin-inline: 1rem;
    }
.charShape {
    float: right;
    margin-inline: 1rem;
    }


.transcription {
  font-size: 90%;
  line-height: 1em;
  text-align: end;
  clear: right;
  font-style: italic;
  float: right;
  margin-block-end: 2rem;
  margin-inline-start: 3rem;
  color: chocolate;
  padding-left: .5rem;
  padding-right: .5rem;
}

.orthogFilePath {
    text-align: end;
    margin-inline: 2rem;
    margin-block-end: 4rem;
    font-size: 70%;
    clear: both;
    }


.currentCharacter {
    text-align: end;
    font-size: 2rem;
    margin-inline: 2rem;
    margin-block-end: -3rem;
    direction: ltr;
    }

.charShape {
    float: right;
    font-size: 2rem;
    margin-inline: 2rem;
    }



/* ADDITIONS FOR XX-CHARACTER PAGES */

/*.xxCharacter { padding: 5%; padding-inline-end: 10%; }
.xxCharacter bdi.largeChar { min-width: 10rem; display: inline-block; text-transform: none; text-align: center; cursor:copy; }*/
.xxCharacter bdi.largeChar { min-width: 10rem; float:left; text-transform: none; text-align: center; cursor:copy; background: white; border: 1px solid #E7D10E; border-radius: 10px; line-height: 150px; margin-right: 2rem; color: black; min-width: 150px; min-height: 150px; }
/*.xxCharacter header { font-size: 3rem; font-weight: bold; margin-block-end: 3em; }*/
.xxCharacter .currentCharacter { margin-block-end: -4rem; }
.xxCharacter .orthogFilePath { margin-block-end: 10rem; }
.xxCharacter .unicodeName { display: block; color: #aaa; padding-inline-start: 10rem; line-height: 1; cursor:copy; }
.xxCharacter .largeHex { cursor:pointer; }


/*.xxCharacter h1 { margin-inline:0; margin-block:1rem; }
.xxCharacter .intro { font-size:1.4rem; font-weight: normal;margin-block-end:10em; }*/
.xxCharacter h1 { color: #F63; font-size: 400%; }
.xxCharacter header { font-size:110% }
.xxCharacter .intro { margin-inline-start: 7.5%; margin-inline-end: 32%; }
.xxCharacter #find { font-size:1.4rem; color:#ccc; line-height:1; font-weight: normal; position:fixed; bottom:10px; left:0; text-align:end; }
.xxCharacter #find input { width: 3.5em; text-align: center; }



#copyNotice {
    position: fixed;
    top: 40%;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 1rem;
    }



/* BOILERPLATE AT TOP */

#site-navigation {
  float: right;
  background-color: #fff;
  color: black;
  width: 28%;
  clear: right;
  padding-top: 1em;
  padding-bottom: 1em;
  text-align: center;
}

#topbar {
  text-align: left;
  font-size: 150%;
  color: #005a9c;
  background-color: #f5f5f5;
  padding: 5px;
  padding-inline-start: 10px;
  margin: 0;
  margin-inline-end: 29%;
  line-height: 1.1;
}

#sitelinks {
  padding-inline-start: 10px;
  margin-bottom: 5em;
  line-height: 24px;
}

#topbar a:visited {
  color: #005a9c;
  text-decoration: none;
}

#bp_picture {
  margin-top: 5em;
  margin-bottom: 0em;
  margin-inline-start: 20px;
  display: block;
}


/* END */





/* STATISTICS AT BOTTOM */

#stats {
    margin-inline: 10%;
    margin-block-end: 3rem;
    text-align: start;
    }
#stats bdi {
    cursor: pointer;
    }

/* END */



/* SHOW TRANSCRIPTIONS INLINE, RATHER THAN IN POPUP PANEL

section > article {
  margin-inline-start: 7.5%;
  margin-inline-end: 32%;
}
article {
  margin: 1rem;
  background: white;
  border: 1px solid #ccc;
  border-radius: 1rem;
  padding: 1rem;
}

article table {
  margin: 0;
  margin-inline: 0;
  width: 100%;
}
article .cdChar {
  text-align: center;
  font-size: 2rem;
  padding-inline: 1rem;
  }
article .advice {
    text-align: right;
    font-style: italic;
    font-size: 80%;
    margin-right: 2em;
    line-height: 1;
    margin-inline-start: 0;
    margin-inline-end: 0;
    margin-block-start: 3px;
    }
article .panelCharacter img {
    height: 2.25rem;
    border-radius: .5em;
    border: 1px solid #ddd;
    margin-block-start: 0.2em;
    vertical-align: middle;
    }
article td {
    width: 100%;
    border: 0;
    }
.exCharClose {
	font-size: 140%;
	color: burlywood;
	line-height: 1;
	display: inline-block;
	cursor: pointer;
    margin-block: 0;
	}
p.notesLink {
  float: right;
  font-style: italic;
  text-align: end;
  font-size: .7rem;
  line-height: 1.4;
}
article p {
  margin: 0;
}

 */