p {
	color: black;
}

#initial_text {
	margin-top: -20px;
	height: 200px;
}

.small-italic {
	font-size: 0.85em;
	font-style: italic;
}

.high-pitch {
    background-color: #EEDDFF;
    vertical-align: +3px;
}
.low-pitch {
    vertical-align: -3px;
    background-color: #DDEEFF;
}
.high-pitch-overline {
    text-decoration: overline;
}

.arrow_colors {
	vertical-align:+7px; font-weight: bold;
}
.arrow_colors_ruby {
	vertical-align:+6px; font-weight: bold;
}
.arrow_overline {
	vertical-align:+5px; font-weight: bold;
}
.arrow_overline_ruby {
	vertical-align:+4px; font-weight: bold;
}

.hsk-1, .N5 {
	background-color: #FFC6C6;
}
.hsk-2, .N4 {
	background-color: #FEDDC0;
}
.hsk-3, .N3 {
	background-color: #FEFFC6;
}
.hsk-4, .N2 {
	background-color: #DAFFC6;
}
.hsk-5, .N1 {
	background-color: #C6EBFF;
}
.hsk-6 {
	background-color: #CEC6FF;
}
.hsk-white, .N0 {
	background-color: #FFFFFF;
}
.not-hsk {
	background-color: #99573E;
}

.fq-very-popular, .frequency-1 {
	background-color: #FFC6C6;
}
.fq-popular, .frequency-2 {
	background-color: #FEDDC0;
}
.fq-medium, .frequency-3 {
	background-color: #FEFFC6;
}
.fq-rare, .frequency-4 {
	background-color: #DAFFC6;
}
.fq-relatively-rare, .frequency-5 {
	background-color: #C6EBFF;
}
.fq-very-rare, .frequency-6 {
	background-color: #CEC6FF;
}
.frequency-none {
	background-color: #FFFFFF;
}


.vocabulary-candidate {
	border: 2px solid #999999;
}
.vocabulary-not-candidate {
	border: 2px solid #FFFFFF;
}

.vocabulary-candidate-selected {
	background-color: #FFFB00;
	color: #000000;
}
.vocabulary-candidate-selected:hover {
	color: #000000;
}
.vocabulary-transcription-candidate-selected {
	background-color: #DAFFC6;
	color: #000000;
}
.vocabulary-transcription-candidate-selected:hover {
	color: #000000;
}


.dsl-tag-c, .dsl-tag-p {
	color: #11A52F;
}
.dsl-tag-ex, .chinese-homograph {
	color: #8C02BD;
}


.disabled_button {
	opacity: 0.5;
}

.quiz-radio-buttons {
	list-style-type: none !important;
	margin:-25px 0 30px 0 !important;
	padding:0;
}

.quiz-radio-buttons li {
	list-style-type: none !important;
	margin:0 8px 0 0;
	display: inline-block;
}

.quiz-radio-buttons label:not(.error), .quiz-radio-buttons input:not(.error) {
	display:block;
}

.quiz-radio-buttons input[type="radio"] {
	opacity:0.011;
	z-index:100;
}

.quiz-radio-buttons input[type="radio"]:checked + label:not(.error) {
	background-color: #65BAF9;
}

.quiz-radio-buttons label:not(.error) {
	color: #000000;
	font-weight: normal;
	font-size: 17px;
	line-height: 24px;
	padding: 2px 8px 4px 8px;
	background-color: #E0ECF5;
	border: 1px solid #000000; 
	border-radius: 5px;
	cursor: pointer;
	z-index: 90;
}

.quiz-radio-buttons label:hover {
	background:#7EB9E5;
}

.quiz-button button {
	color: #000000;
	font-weight: normal;
	font-size: 18px;
	line-height: 25px;
	padding: 2px 10px 4px 10px;
	margin-right: 10px;
	background-color: #E0ECF5;
	border: 1px solid #000000;
	border-radius: 5px;
	white-space: nowrap;
}
.quiz-button button:hover {
	background-color: #7EB9E5;
	color: #FFFFFF;
}
.quiz-word-translation {
	color: #777;
	font-style: italic;
}
.quiz-flag {
	border: 1px solid #000000;
}
#quiz-content {
	min-height: 170px;
}
.stressed-letter {
	color: red;
}
.yo-e-pair {
	color: #9F029D;
}

.unstressed-vowel {
  text-decoration: none;
  font-weight: bold;
  color: #000000;
}
.unstressed-vowel:hover {
  color: #000000;
}
.stressed-vowel {
  background-color: #FFFB00;
  text-decoration: none;
  font-weight: bold;
  color: #000000;
}
.stressed-vowel:hover {
  color: #000000;
}

.e-yo-vowel {
  text-decoration: none;
  font-weight: bold;
  color: #000000;
}

.hanzi-tone-1 {
	color: rgb(227,0,0);
}
.hanzi-tone-2 {
	color: rgb(2,179,28);
}
.hanzi-tone-3 {
	color: rgb(21,16,240);
}
.hanzi-tone-4 {
	color: rgb(137,0,191);
}
.hanzi-tone-5 {
	color: rgb(119,119,119);
}

.homographs {
  position: relative;
  display: inline;
  color: #0EC101;
}
.homographs:hover {
  cursor: pointer;
  color: #0EC101;
}
.homographs span {
  position: absolute;
  color: #0EC101;
  background-color: #E3FEE1;
  border: 1px solid #999999;
  visibility: hidden;
  border-radius: 5px;
  line-height: 1.3;
  padding: 0.5em;
}
.homographs:hover span {
  visibility: visible;
  opacity: 1;
  z-index: 999;
  top: 28px;
  left: 0px;
}

.variants, .japanese-variants, .chinese-homographs {
  position: relative;
  display: inline;
  color: #05A1FC;
}
.variants:hover, .japanese-variants:hover, .chinese-homographs:hover {
  cursor: pointer;
  color: #05A1FC;
}
.variants span, .japanese-variants span.japaneseVariantsList, .chinese-homographs span.chineseHomographsList {
  position: absolute;
  color: #05A1FC;
  border: 1px solid #999999;
  visibility: hidden;
  border-radius: 5px;
  line-height: 1.3;
  padding: 0.5em;
}
.variants span {
  background-color: #E7F4FB;
}
.japanese-variants span.japaneseVariantsList, .chinese-homographs span.chineseHomographsList {
  background-color: #EDEDED;
}
.variants:hover span, .japanese-variants:hover span.japaneseVariantsList, .chinese-homographs:hover span.chineseHomographsList {
  visibility: visible;
  opacity: 1;
  z-index: 999;
  top: 28px;
  left: 0px;
}

.big-hanzi, .big-hanzi-example {
	font-size: 160%;
	line-height: 60px;
}
.big-hanzi-example {
	margin-bottom: -25px;
}
.big-hanzi a {
	color: black;
}
.phonetic-transcription {
	line-height: 2.5;
	word-spacing: 4px;
}
.qtip_audio_video {
	color: black;
}
.qtip_audio_video:hover {
	color: black;
}

.play-audio-icon, .play-video-icon {
	color: #05A1FC;
	padding-left: 4px;
}


.audio-disabled {
	background-color: #EEEEEE !important;
}

#clear_initial_text {
	visibility: hidden;
	margin-top: -20px;
	float: right;
}
#clear_initial_text a {
	padding: 0px 10px 0px 10px;
	color: #000000;
	background-color: #EEEEEE;
	border: 1px solid #003366;
}
#clear_initial_text a:hover {
	color: #000000;
	background-color: #DDDDDD;
}

.converters_advanced_option {
	display: none;
}


/* hamburger menu button */
.nav-button-right{
	margin-left: auto;
	margin-right: 0;
}
#unlock_all_audios_and_videos, #unlock_all_lessons {
	display: none;
	z-index: 99999;
	background: rgba(224,236,245,0.95);
}

.popup_in_the_middle {
	position: fixed;
    top: 50%;
	width: 350px;
	color: #000000;
	font-size: 17px;
	padding: 20px;
	border: 1px solid #003366;
	border-radius: 5px;
	margin: 5% auto;
    margin-top: -100px;
	left: 0;
	right: 0;	
}

.popup_in_the_middle .close-window {
	font-size: 25px;
	text-align: right;
	margin-top: -15px;
	margin-right: -15px;
}

.popup_in_the_middle .close-window span {
	cursor: pointer;
}



body {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
}
.myContainer {
	padding-right: 0;
	padding-left: 0;
	margin-top: 20px;
  }
  .navContainer{
	padding-right: 0;
	padding-left: 0;
  }

  @media (max-width: 767.98px) {
	.bg-img-hero-center{
	  background-size: auto !important;
	}
  }

.nav-space{
	padding-top: 1rem;
	padding-bottom: 1rem;
  }

  /* Navbar Brand */
.u-header__navbar-brand,
.u-header__navbar-brand > img {
  width: 4rem;
}
.pro-logo{
  width: 25%;
}

.u-header__nav-link {
	color: #77838f !important;
	cursor: pointer;
  }

  
.footer-links{
	color: #77838f !important;
	cursor: pointer;
  }
  .footer-links:hover{
	color: #0052ea !important;
  }


/* adjusting logo on mobiles and smaller tablets */
@media (max-width: 768px) {
	.u-header__section {
	  margin-top: 10px;
	  margin-bottom: 10px;
	}
	.navbar-brand {
	  margin-right: 0;
	}
	.u-header__navbar-brand, .u-header__navbar-brand > img {
	  width: 3.5rem;
	}
  
	.pro-logo{
	  width: 95%;
	  margin-top: 5%;
	  margin-left: 0;
	  padding-left: 0;
	}
  }




.jqEasyCounterMsg{
	display: none !important;
  }
  .input-small{
	display: inline !important;
	width: 12%;
  }
  .input-small-translator{
	display: inline !important;
	width: 35%;
  }
  .form-group{
	  margin-left: 1.25rem;
  }

.export-file button, .export-file a {
	background-color: #E0ECF5;
	color: #000000;
}
.export-file button:hover, .export-file a:hover {
	background-color: #7EB9E5;
	color: #FFFFFF;
}
.export-file-highlighted {
	background-color: #65BAF9 !important;
	color: #FFFFFF !important;
}



#word-of-the-day {
	background-color: #E0ECF5;
	border: 2px solid #22356C;
	margin-top: 22px;
	margin-bottom: 30px;
	padding: 15px;
}
#word-of-the-day h3 {
	color: #22356C;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: 5px;
}
#word-of-the-day p {
	text-align: center;
}
#word-of-the-day .word {
	 font-size: 50px;
	 line-height: 55px;
}
#word-of-the-day .pinyin {
	line-height: 150%;
}

.tooltips-bottom {
  position: relative;
  display: inline;
}
.tooltips-bottom #tip-for-the-first-word, .tooltips-bottom #tip_for_word_list {
  position: absolute;
  color: #000000;
  font-size: 90%;
  background-color: #FFFD77;
  border: 1px solid #999999;
  line-height: 1.5;
  border-radius: 5px;
  min-width: 260px;
  visibility: visible;
  opacity: 1;
  padding: 5px 9px;
  z-index: 9999;
  top: 28px;
  left: 0px;
}

.fake-link {
	color: #3b8dbd;
	cursor: pointer;
	text-decoration: none; 
}
.fake-link:hover {
	color: #3b8dbd;
}