.tcf-en {
 color:#387365;
}
.com-content-category__table tr {
  display: block;
  float: left;
}
#ariQuizContainer .aq-question-correct-answer, #ariQuizContainer .aq-question-explanation {
 border-top: none !important;
}
.bottom-margin {
  padding: 20px 0;
}
.yui-pg-first, .yui-pg-previous, .yui-pg-next, .yui-pg-last, .yui-pg-current {
  display: none !important;
}
#dtResults_pag select {
  display: none !important;
}
.question-img {
  max-width: 350px !important;
}
.chart-img {
  max-width: 600px !important;
}
/** quiz result page **/
.result-tittle-top {
  margin: 50px 0px -30px 0px !important;
  padding-bottom: 10px;
  border-bottom: solid aliceblue;
  }
.tcf-canada-chart {
  background: aliceblue;
  padding: 10px 20px;
  border: solid 2px beige;
  border-radius: 5px;
  max-width: 800px;
  margin: 0 auto !important;
}
.score-img {
  width: 25px;
  margin-bottom: 6px;
}
.result-box {
  background: #ffffff;
  border: 1px solid #dee2e6;
  border-radius: 10px;
  padding: 25px 30px;
  max-width: 500px;
  margin: 0px auto 40px auto;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  text-align: center;
  font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
}
.result-box h3 {
  font-size: 22px;
  margin-bottom: 20px;
  color: #333;
}
.result-item {
  font-size: 18px;
  margin-bottom: 10px;
}
.result-item .score {
  color: #007bff;
  font-weight: bold;
}
.result-item .time {
  color: #28a745;
  font-weight: bold;
}
.result-item .level {
  color: #fd7e14;
  font-weight: bold;
}
.result-item .status {
  color: #dc3545;
  font-weight: bold;
  margin-left: 8px;
}
/** quiz result page end **/
.accordion-toggle {
  padding: 8px 16px;
  background-color: #337ab7;
  color: white;
  border: none;
  cursor: pointer;
  margin-top: 10px;
  font-size: 16px;
  border-radius: 4px;
}
.accordion-toggle:hover {
  background-color: #286090;
}
.accordion-content {
  padding: 10px;
  border: 1px solid #ccc;
  margin-top: 5px;
  background: #f9f9f9;
}
.quiz-image {
max-width: 350px !important;
}
/* login icon */
.dafenbiao h3{
 text-align: center;   
 font-size: 16px !important;
}
.eye-icon {
background-image: url("/123/images/eye-icon.png");
background-color: #ffffff;
}
video {
 max-width: 600px;
}
.dj-megamenu-clean li a.dj-up_a {
  font-size: 18px !important;
  color: #4e7661 !important;
}
div.mod-languages li {
 margin-right: 12px !important;
}
.mod-languages {
 margin-right: 20px;
}
/** speaking template */
.sp-template {
margin-bottom: 20px;
padding: 15px;
border: 1px solid #ddd;
border-radius: 5px;
background-color: #cfe1d4;
}
.sp-sample {
margin-bottom: 20px;
padding: 15px;
border: 1px solid #ddd;
border-radius: 5px;
background-color: #f9f9f9;
}
.sp-template h4 {
 padding-left: 10px !important;
}
.sp-sample h4 {
 padding-left: 10px !important;
}
html[lang="en-gb"] .zhongwen,
html[lang="en-GB"] .zhongwen {
  display: none !important;
}
html[lang="zh-CN"] .yingwen {
  display: none !important;
}
/** huo disable font
body {
font-family: "Microsoft YaHei" ! important;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
font-family: "Microsoft YaHei" ! important;
}
*/
h1, .h1 {
  font-size: 20px !important;
}
h2, .h2 {
  font-size: 19px !important;
}
h3, .h3 {
  font-size: 19px !important;
}
h4, .h4 {
  font-size: 18px !important;
}
h5, .h5 {
  font-size: 16px !important;
}
h6, .h6 {
  font-size: 14px !important;
}
.alert-message {
  text-align: center !important;
  font-size: 20px !important;
}
table{
border: solid 1px #e0e0e0;
}
.breadcrumb {
background-color: #d8d8d8 !important;
}
/* marquee */
#mod-custom112 {
  max-width: 800px;
}
.scroll-container {
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
            padding: 10px 0;
            position: relative;
        }
.scroll-text {
            display: inline-block;
            white-space: nowrap;
            position: absolute;
			top: 0;
            animation: scroll 15s linear infinite;
        }
        @keyframes scroll {
            from {
                transform: translateX(0%);
            }
            to {
                transform: translateX(-100%);
            }
        }
/* header */
.container-below-top {
 width: 100%;
 background-color: #fff;
}
.container-below-top .mod-custom {
 margin: 0 auto;
}
.container-header {
  background-color: #f7f7f7;
  box-shadow: unset;
  background-image: none;
}
.container-topbar {
  background-color: #4e7661;
  padding: 10px 0;
  text-align: right;
  min-height: 40px;
  margin-top: -5px;
}
.container-header .mod-menu {
  color: #4e7661;
}
/* menu center */
.container-header .container-nav {
  justify-content: center;
}
.below-top-bg {
 padding: 10px 0;
}
.logo-img {
max-height: 80px;
margin-left: -10px;
}
/* footer */
.footer {
background-color: #fff;
background-image: url(/images/fto.png);
background-repeat: repeat-x;
  background-size: 100% auto;
  background-position: top;
}
.footer .grid-child {
padding: 0;
}
/* login */
.login-note {
  display: none;
}
.mod-login {
  width: 300px;
  margin: 0 auto;
  padding: 20px 10px 0;
}
.mod-login-logout {
  width: 200px;
  margin: 0 auto;
  padding: 20px;
}
#com-users-login__form {
  display: none;
}
.com-users-login__options  {
  display: none;
}
/* alert */
#system-message-container joomla-alert[type="info"], #system-message-container joomla-alert[type="notice"] {
  --alert-accent-color: #4e7661;
  --alert-heading-text: #fffffff2;
  --alert-close-button: #4e7661;
  background-color: #fff;
}
#system-message-container joomla-alert{
  border: 1px solid #4e7661;
}
/* menu */
.container-banner {
  background-color: #e2eaf5;
}
#navbar1 {
  margin-left: -16px;
}
.container-header .navbar-toggler {
  color: #333;
  cursor: pointer;
  border: none;
  position: fixed;
  left: 10px;
  top: 68px;
}
.navbar-toggler:focus {
  box-shadow: none;
}
/* button */
.btn-primary {
  --btn-color: #fff;
  --btn-bg: #4e7661;
  --btn-border-color: #4e7661;
  --btn-hover-color: #fff;
  --btn-hover-bg: #4e7661;
  --btn-hover-border-color: #4e7661;
  --btn-focus-shadow-rgb: 39,39,111;
  --btn-active-color: #fff;
  --btn-active-bg: #4e7661;
  --btn-active-border-color: #4e7661;
  --btn-active-shadow: inset 0 3px 5px #00000020;
  --btn-disabled-color: #fff;
  --btn-disabled-bg: #4e7661;
  --btn-disabled-border-color: #4e7661;
}
.btn-primary {
  background-color: #4e7661;
  border-color: #4e7661;
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus {
    background-color: #446754;
    box-shadow: inset -1px -1px 1px rgba(0, 0, 0, 0.15);
    color: #ffffff;
	border: 1px solid #4e7661;
}
.pagenavigation .btn-secondary {
  background-color: #4e7661 !important;
  color: #fff !important;
}
/* link */
a {
  color: #4e7661;
}
a:hover {
  color: #4e7661;
}
a:not([class]) {
  text-decoration: none !important;
}
/* component */
.container-component {
 max-width: 90% !important;
}
/* alert */
#system-message-container joomla-alert div{
 background-color: #e2eaf5;
}
/* huo add */
#ariQuizContainer .aq-clear {
  display: none;
}
#ariQuizContainer .aq-progress-panel {
  width: 140px !important;
}
#ariQuizContainer .aq-page-status {
    padding: 0px 3px 3px 3px !important;
    font-size: 16px !important;
    font-weight: bold;
    color: goldenrod;
	background-color: black;
}
#ariQuizContainer .aq-progress-bar {
  border-bottom: solid 1px goldenrod !important;
}
.aq-question-answers {
  margin-top: -20px !important;
  width: 50%;
  float: left;
}
.aq-question {
 width: 50%;
 float: left;
}
.aq-button-panel{
margin: 0px 10px 10px 0px !important;
}
#ariQuizContainer audio {
  width: 100%;
  max-width: 350px;
}
/** huo
html[lang="en-gb"] .aq-dt-results {
max-height: 750px;
}
/** RESULT */
.yui-skin-sam {
min-height: 200px;
}
#ariQuizContainer .aq-status-panel {
    margin-bottom: 10px !important;
}
#ariQuizContainer .pagination {
text-align: center;
}
#dtResults_pag {
 display: block;
}
#dtResults .clear {line-height:0px;}
#dtResults .aq-question-answers {display:none;}
#dtResults .aq-answer-result-summary {display:none;}
#ariQuizContainer .aq-question-panel-content {
    padding: 10px 0px 10px 10px !important;
    width: 99% !important;
    max-width: 99% !important;
}
@media screen and (max-width: 480px) {
#ariQuizContainer .aq-question-panel-content {
width: 98%;
}
.question-img {
  max-width: 300px !important;
}
}
/* ariquiz */
#limitactivelogins {
background: #fff;
margin-bottom:100px;
padding: 20px;
position: absolute;
top: 30px;
left: 0px;
z-index: 999999;
}
.w357kit-alert-danger {
padding: 10px 20px;
border: solid 1px #ddd;
border-radius: 4px;
background: #f9f9f9;
color: #3a5748;      
}
.chinese-trans-s {
  color: #666;
  font-size: 14px;
  font-style: italic;
}
#ariQuizContainer blockquote {
  background-color: beige;
}
#ariQuizContainer blockquote p {
  white-space: pre-wrap;
  font-size: 14px;
  font-weight: 400;
  line-height: 1 !important;
  padding: 5px;
}
.aq-button-panel a{
width: 100%;
}
#ariQuizContainer TABLE.aq-timer TH{
  background-image: linear-gradient(#00B9B9,#009999);
  border-color: #009999;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0,0,0,0.33);
}

#ariQuizContainer .aq-answer-container {
    width: 98%;
    margin: 10px;
    background-color: #eee;
    padding-bottom:8px;
    border-radius: 5px;
}
#ariQuizContainer .aq-question-buttons {
    padding: 0px !important;
}

/** huo change number **/
#ariQuizContainer label {
    font-size: 12px;
    line-height: 12px;
}
#ariQuizContainer .aq-answer-container .aq-answer-label LABEL {
    padding: 1px 3px;
	border-radius: 0;
}
#ariQuizContainer .aq-answer-label {
    width: 38px !important;
}
#ariQuizContainer .btn-primary {
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#00B9B9), to(#009999)) !important;
border: none !important;
padding: 6px 30px !important;
width: 150px !important;
}
.disable-onsubmit {
margin: 3px;
font-size: 15px !important;
}
#ariQuizContainer .pagination ul > li > a, #ariQuizContainer .pagination ul > li > span {
width: 25px !important;
}
#ariQuizContainer .icon-off {
  margin-top: 4px !important;
  margin-right: 1px;
}
#ariQuizContainer .icon-stop {
  margin-top: 4px !important;
}
@media screen and (max-width:767px){
.aq-question-answers {
  margin-top: 20px !important;
  width: 98%;
  float: left;
}
.aq-question {
 width: 98%;
 float: left;
}
}
/** bellow small screen */
@media (max-width: 767px) {
/** footer */
.footer {
  margin-top: 20px;
  padding: 10px 0;
}
.container-component {
 max-width: 100% !important;
}
/* language center */
.container-topbar {
  text-align: center;
}
div.mod-languages ul {
	margin-left: 14px !important;
}
}
/** huo add */
#ariQuizContainer .aq-question-explanation {
 margin-top: -20px !important;
}
.kouyunote {
 font-size: 12px;
 margin-top: 100px !important;
}
.kouyutable {
 margin-left: auto; 
 margin-right: auto; 
 max-width: 600px;
 min-width: 500px;
}
.com-content-article__body {
 margin-bottom:-10px;
}
.com-content-article__body p{
 padding: 0 10px;
}

@media screen and (max-width: 480px) {
.chart-img {
  max-width: 320px !important;
}
 audio {
  width: 260px;
 }
 .kouyutable {
 max-width: 320px;
 min-width: 300px;
}
.kouyunote {
 margin-top: 10px;
 margin-bottom: 30px;
}
}
/** 隐藏系列 */
.home_class .pagenavigation {
display: none;
}
.home_class .footer {
margin-top: 20px !important;
}