/* Space out content a bit */

body, .container {
  padding: 0px;
  margin: 0px;
  border: 0px;
}

.vocpage {
  position: absolute;
  padding: 0px;
  padding-top: 20px;
  padding-bottom: 20px;
  margin: 0px;
  width: 100%;
}

.skyrim {
  background-color: black;
  color: #ccc;
}

.skyrim a:link    { color: #ddd }  /* unvisited links */
.skyrim a:visited { color: #ccc }  /* visited links   */
.skyrim a:hover   { color: #fff }  /* user hovers     */
.skyrim a:active  { color: #fff }  /* active links    */

.skyrim .currentlink {
  color: #aaa;
}

.skyrim .lowkey {
  color: grey;
}

.miyazaki {
  background-color: #12639B;
  color: white;
}

.miyazaki a:link    { color: #B0CBDE }  /* unvisited links */
.miyazaki a:visited { color: #6197BC }  /* visited links   */
.miyazaki a:hover   { color: #fff }  /* user hovers     */
.miyazaki a:active  { color: #fff }  /* active links    */

.miyazaki .currentlink {
  color: #D8E5EE;
}

.miyazaki .lowkey {
  color: #09324E;
}

.naruto {
  background-color: #AFDEFC;
  color: black;
}

.naruto a:link    { color: #BF2F0C }  /* unvisited links */
.naruto a:visited { color: #D54610 }  /* visited links   */
.naruto a:hover   { color: #EB5D13 }  /* user hovers     */
.naruto a:active  { color: #EB5D13 }  /* active links    */

.naruto .currentlink {
  color: #EB5D13;
}

.naruto .lowkey {
  color: #EBF7FE;
}

.conan {
  background-color: #002;
  color: white;
}

.conan a:link    { color: yellow }  /* unvisited links */
.conan a:visited { color: yellow }  /* visited links   */
.conan a:hover   { color: red }  /* user hovers     */
.conan a:active  { color: red }  /* active links    */

.conan .currentlink {
  color: red;
}

.conan .lowkey {
  color: #335;
}

.onepiece {
  background-color: white;
  color: black;
}

.onepiece a:link    { color: #03f }  /* unvisited links */
.onepiece a:visited { color: #36f }  /* visited links   */
.onepiece a:hover   { color: #69f }  /* user hovers     */
.onepiece a:active  { color: #acf }  /* active links    */

.onepiece .currentlink {
  color: red;
}

.onepiece .lowkey {
  color: #8bf;
}


/* Everything gets side spacing for mobile first views */
.header,
.footer {
  padding-left: 15px;
  padding-right: 15px;
}

body, table, td, th {
  font-family: futura;
}

.count {
  font-size: 10px;
}

.word {
  white-space:nowrap;
  font-size: 25px;
}


.jlpt {
  font-size: 15px;
}

.examples {
  font-size: 20px;
  line-height: 22px;
  position: relative;
  margin-left: 10px;
}

.examples > div {
  position: absolute;
}

.padtop {
  margin-top: 10px;
}

.dialogarrow {
  position: absolute;
  left: -16px;
  top: 2px;
}

.signature {
  text-align: right;
}


.navlinks {
  position: absolute;
  right: 0;
  z-index: 10;
  background-color: white;
  padding: 3px;
}

.episodename {
  text-transform: capitalize;
}

.episode table {
  margin: 10px;
}

.TOTO {
  border: 2px solid blue;
}


.episode td {
  margin: 3px;
  padding: 3px;
}

.episode th {
  color: white;
  margin: 3px;
  padding: 3px;
}


.episode table.known {
  border: 2px solid blue;
}

.episode table.known th {
  background-color: blue;
}

.episode table.known .defrow_1 {
  background-color: #eef;
}

.episode table.tolearn {
  border: 2px solid #0d0;
}

.episode table.tolearn th {
  background-color: #0d0;
}

.episode table.tolearn .defrow_1 {
  background-color: #efe;
}

.episode table.all {
  border: 2px solid grey;
}

.episode table.all th {
  background-color: grey;
}

.episode table.all .defrow_1 {
  background-color: #eee;
}

.episode table.other {
  border: 2px solid grey;
}

.episode table.other th {
  background-color: grey;
}

.episode table.other .defrow_1 {
  background-color: #eee;
}


.word {
  text-align: center;
}

.word.known {
  color: #bbb;
}

.episode ul {
  padding-left: 15px;
}

.reading {
  color: darkblue;
  font-weight: bold;
}

.episode .example {
  white-space: pre-wrap;
  min-width: 200px;
}

.example-highlight {
  color: blue;
}

.example.known {
  color: #bbb;
}

.episodewordsbutton {
  display: inline-block;
  height: auto;
  border-radius: 10px;
  padding: 10px;
  margin: 3px;
  text-align: center;
}

.sublabel {
  font-size: 10px;
}

.episodewordsbutton.summary {
  background-color: black;
}

.episodewordsbutton.tolearn {
  background-color: #0d0;
}

.episodewordsbutton.known {
  background-color: blue;
}

.episodewordsbutton.all {
  background-color: grey;
}

.episodewordsbutton.other {
  background-color: grey;
}

.episodetitle {
  text-align: center;
}

/* Word tags
 */

.wordtags {
  text-align: right;
}

.wordtag {
  background-color: grey;
  color: white;
  border-radius: 10px;
  display: inline-block;
  padding-left: 6px;
  padding-right: 6px;
  margin: 3px;
}

.wordtag.tolearn {
  background-color: #0d0;
}

.wordtag.episode {
  background-color: blue;
}

.wordtag.jlpt-5 {
  background-color: blue;
}

.wordtag.jlpt-4 {
  background-color: #B6B6FF;
}

.wordtag.jlpt-3 {
  background-color: #B6B6FF;
}

.wordtag.jlpt-2 {
  background-color: #DBDBFF;
}

.wordtag.jlpt-1 {
  background-color: #DBDBFF;
}



.wordtag.anime-5 {
  background-color: #ED6DED;
}

.wordtag.anime-4 {
  background-color: #F6B6F6;
}

.wordtag.anime-3 {
  background-color: #F6B6F6;
}

.wordtag.anime-2 {
  background-color: #FBDBFB;
}

.wordtag.anime-1 {
  background-color: #FBDBFB;
}

.definitiontoggle {
  color: #bbb;
  border-radius: 10px;
  display: inline-block;
  padding-left: 6px;
  padding-right: 6px;
  border: 1px solid #bbb;
  margin: 3px;
}

.statstable th{
  min-width: 80px;
}


.learningstat {
  color: white;
}

.learningstat.stat-known {
  background-color: blue;
}

.learningstat.stat-tolearn {
  background-color: #0d0;
}

.learningstat.stat-other {
  background-color: grey;
}

.statstable td {
  vertical-align: top;
} 

/*
 * Series table in series index
 */

.seriestitle {
  color: darkblue;
  text-transform: capitalize;
  text-align: center;
}

.seriesline {
  cursor: pointer;
  text-align: center;
}

tr.seriesline:nth-child(even) {
  background-color: #eef;
}

tr.seriesline:hover {
  background-color: #ccf;
}

.seriesline .tolearn {
  background-color: #0d0;
  border-radius: 10px;
  padding: 10px;
  margin: 3px;
  color: white;
}