.btn-read{border-radius:50px;padding:0.4em 1em;display:inline-block;background:#a50034;color:var(--theme-ui-colors-white);}
.btn-read:hover{color:var(--theme-ui-colors-white)!important;}

#quizStyle{padding:0;margin:0 auto;align-items:center;justify-content:center;text-align:center;background-color:transparent;}
#quizStyle a{font-weight:bold;border:none!important;}
#quizStyle .package{background:var(--theme-ui-colors-white);border-radius:0.6em;margin-bottom:2em;display:flex;align-items:center;justify-content:center;text-align:center;}
#quizStyle .summary{font-size:1.1em;background:rgba(240,243,244,1);border-radius:0.6em;margin-bottom:2em;}
#quizStyle h3{font-size:2.8em;padding-bottom:0.2em;border-bottom:4px solid #f791b0;display:inline-block;font-weight:700;}
#quizStyle fieldset{height:auto;padding:3em 2em;margin:1em auto;border-radius:0.6em;box-shadow:0 0 2em rgba(0,0,0,0.06);border:0;background-color:var(--theme-ui-colors-white);display000:flex;align-items:center;justify-content:center;text-align:center;}
#quizStyle .set{margin:0 auto;padding:0 4em;}
#quizStyle.pix-plate fieldset{height:auto;}
#quizStyle.pix-plate .set fieldset{margin-bottom:2em;padding-bottom:2em;border-bottom:1px solid #ccc;border-radius:0;display:block;box-shadow:none;text-align:left;}
#quizStyle.pix-plate .set{padding:4em;text-align:left;}
#quizStyle.pix-plate fieldset legend{font-size:1.2em;}

#quizStyle fieldset legend{font-size:1.4em;line-height:1.4;display:contents;font-weight:700;color:var(--theme-ui-colors-black);display:block;position:relative;}
#quizStyle input[type="radio"],#quizStyle button{display:none;}
#quizStyle label{line-height:1.6;border-radius:50px;}
#quizStyle .answers{margin:1em auto 0 auto;}
#quizStyle .answer{vertical-align:top;}
#quizStyle .answer.inline{display:inline-block;}
#quizStyle .answer__item{padding:0.4em 1em 0.4em 2.2em;margin:0 0.4em 0.4em 0;line-height:1.4;background:none;border:2px solid #fff;position:relative;cursor:pointer;transition:all .5s;-webkit-transition:all .5s;-moz-transition:all .5s;display:flex;align-items:center;justify-content:center;vertical-align:top;color:var(--theme-ui-colors-white);}
#quizStyle .answer__item:before{width:12px;height:12px;border:1px solid var(--theme-ui-colors-white);border-radius:50%;left:0.6em;position:absolute;display:block;content:'';}
#quizStyle0000 .answer__item:hover{background:#fbcddb;border-color:transparent;}
#quizStyle :valid .answer__item--is-correct{background-color:rgba(20,106,209,1);color:var(--theme-ui-colors-white);border-color:transparent;}

#quizStyle .answer__reveal-text{display:none;margin:1em auto 0 auto;}
#quizStyle .answer__reveal-text figure{width:70%;}
#quizStyle .answer__reveal-text figure img{width:100%;}
#quizStyle :valid .answer__reveal-text{padding:0;border-radius:0.6em;text-align:left;display:block;}

#quizStyle :checked + .answer__item{color:var(--theme-ui-colors-white);background-color:#000;border-color:transparent;}
#quizStyle :checked + .answer__item:before{border:1px solid var(--theme-ui-colors-white);content:'';background-image:url(https://interactive.zaobao.com/lib/imgs/icon-close-white.svg);}

#quizStyle :checked + .answer__item--is-correct{background-color:rgba(20,106,209,1);color:var(--theme-ui-colors-white);border-color:transparent;border-color:transparent;}
#quizStyle :checked + .answer__item--is-correct:before,#quizStyle :valid .answer__item--is-correct:before{background-image:url(https://interactive.zaobao.com/lib/imgs/icon-tick-white.svg);border:1px solid var(--theme-ui-colors-white);}

#quizStyle :checked + .answer__item:before,#quizStyle :checked + .answer__item--is-correct:before,#quizStyle :valid .answer__item--is-correct:before{width:20px;height:20px;margin:0 0.6em 0 0;display:inline-block;border-radius:50%;background-repeat:no-repeat;background-position:0;background-size:100%;content:'';}

#quizStyle :checked + .answer__item .answer__icon{display:inline-block;}

#quizStyle :valid{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
#quizStyle :valid + .answer__item{pointer-events:none;}

form{counter-reset:quiz-score;}

#quizStyle :checked + .answer__item--is-correct{counter-increment:quiz-score;}
#quizStyle .score{font-size:2.4em;padding-bottom:0.3em;line-height:1;display:block;counter(quiz-score, decimal) "/" attr(data-question-count);}
#quizStyle .score:before{padding-right:0.1em;font-weight:900;content:counter(quiz-score);}
#quizStyle .score:after{margin-left:0.1em;content:"/ " attr(data-question-count);font-weight:300;}

#quizStyle #score{width:40%;padding:3em 1em;display:block;color:var(--theme-ui-colors-white);position:fixed;height:auto;margin:0;vertical-align:bottom;border-radius:0.6em;background:#1654fc;z-index:10000000;top:50%;left:50%;-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);box-shadow:0 0 4em rgba(0,0,0,0.3);}
#quizStyle #score:before{content:'你答对';font-size:1.2em;margin-bottom:0.2em;}
#quizStyle #score a{color:var(--theme-ui-colors-white)!important;padding-bottom:0.1em;border-bottom:1px solid var(--theme-ui-colors-white);}
#quizStyle .message,#quizStyle #score{display:none;}
#quizStyle:valid .message,#quizStyle:valid #score{display:block;}
#quizStyle #score .alert-msg{font-size:1.2em;background:var(--theme-ui-colors-white);color:var(--theme-ui-colors-black);padding:1em;border-radius:0.4em;display:table;margin:auto;}
#quizStyle #score .alert-msg a{color:var(--theme-ui-colors-main)!important;font-weight:bold;}

#quizStyle .img{position:sticky;top:0;}
#quizStyle .img.circle{overflow:hidden;}
#quizStyle .img img{width:120%;margin:0 0 4em -4em;border-radius:50%;}
#quizStyle figure{overflow:hidden;margin:1em auto;}
#quizStyle figure img{width:80%;margin:0;border-radius:0.6em;border:1px solid rgba(0,0,0,0.2);}
#quizStyle figure figcaption{padding:1em 0;color:var(--theme-ui-colors-muted);}
#quizStyle figure.img-portrait{width:60%;}
#quizStyle figure.img-square{width:70%;}

@media (max-width:800px) and (orientation:portrait){
#quizStyle h3{font-size:1.8em;text-align:center;display:table;margin:auto;}
#quizStyle fieldset{padding:0;height:auto;display:block;}
#quizStyle fieldset .set{padding:1.6em;}
#quizStyle fieldset legend{font-size:1.2em;line-height:1.4;text-align:left;}
#quizStyle .package{display:block;}
#quizStyle.pix-plate .set{padding:2em;}
#quizStyle .img.circle{position:relative;}
#quizStyle .img.circle img{width:80%;margin:-10% auto 0 auto;}
#quizStyle figure img{width:100%;}
#quizStyle figure.img-portrait,#quizStyle figure.img-square{width:100%;}
#quizStyle figure figcaption{text-align:left;}
#quizStyle :valid .answer__reveal-text{padding:1em;}
#quizStyle .score:before,#quizStyle .score:after{font-size:1em;}
#quizStyle #score{width:80%;}
}

#quizStyle.quizStyle1 fieldset .set{position:relative;}
#quizStyle.quizStyle1 fieldset .set:before,#quizStyle.quizStyle1 fieldset legend:after{color:#aaa;}
#quizStyle.quizStyle1 fieldset .set:before{content:"题目";font-size:0.9em;top:0;left:4.5em;font-weight:normal;position:absolute;}
#quizStyle.quizStyle1 fieldset legend{font-size:1.4em;line-height:1.4;padding-top:1em;display:contents;font-weight:700;color:var(--theme-ui-colors-black);text-align:center;display:block;position:relative;}
#quizStyle.quizStyle1 fieldset legend:before,#quizStyle.quizStyle1 fieldset legend:after{font-size:0.7em;top:0;font-weight:normal;display:inline-block;position:absolute;}
#quizStyle.quizStyle1 fieldset legend:before{left:2em;content:attr(data-section-fraction);color:var(--theme-ui-colors-black);font-weight:bold;text-align:right;}
#quizStyle.quizStyle1 fieldset legend:after{left:3em;content:"/ " attr(data-section-total);}


#QuizList{padding:0;margin:0 auto;list-style:none;}
#QuizList li{width:100%;padding:0;margin:0;list-style-position:inside;counter-increment:custom-counter-name;position:relative;}
#QuizList li:before,#QuizList li:after{top:1em;font-size:1em;line-height:1;z-index:1;display:inline-block;position:absolute;}
#QuizList li:before{right:2.4em;font-weight:bold;color:var(--theme-ui-colors-main);content:counter(custom-counter-name);content:counter(custom-counter-name);text-align:right;}
#QuizList li:after{right:1em;content:"/ " attr(data-section-total);opacity:0.5;}
#QuizList fieldset{margin:4px auto!important;padding:3em 0 2em 0;}
#QuizList :checked + .answer__item{background-color:var(--theme-ui-colors-error);}
#QuizList :valid .answer__item--is-correct{background-color:var(--theme-ui-colors-main);}

.quizStyle2 #hero #program-logo{top:-2em;}
.quizStyle2 #hero #program-logo{transform:translate(-50%,0);}
.quizStyle2 #hero #program-headline{width:80%;padding:1em;margin:-3em auto 0 auto;text-align:center;z-index:10000;position:relative;line-height:1.2;font-size:2.2em;font-weight:700;color:var(--theme-ui-colors-white);background:var(--theme-ui-colors-main);box-shadow:0 0 4em rgba(0,0,0,0.3);border-radius:0.4em;}
.quizStyle2 #hero #program-headline .headline{line-height:1.4;font-size:1em;font-weight:900;color:var(--theme-ui-colors-white);}
.quizStyle2 #program-headline .sub-head{font-size:0.6em;font-weight:500;padding:0.4em 0;background:none;}

@media (min-width:200px) and (max-width:800px) and (orientation:portrait){
#QuizList fieldset{padding:2em 0 0 0;border-radius:0.4em;}
#QuizList fieldset .set{padding:1em;}
#quizStyle figure img{border-radius:0.4em;border:none;}
#quizStyle.quizStyle1 fieldset legend{text-align:left;}
#quizStyle .answer__reveal-text figure{width:100%;}
#quizStyle #score{padding:2em 1em;}
.quizStyle2 #hero #program-logo{top:-1em;}
.quizStyle2 #hero #program-headline{width:100%;line-height:1.2;font-size:1.6em;margin:-40% auto 0 auto;text-align:center;border-top-left-radius:0;border-top-right-radius:0;}
.quizStyle2 #hero #program-headline .headline{font-size:1em;}
}

.close{position:absolute;right:0.4em;top:0.4em;width:30px;height:30px;padding:0.6em;opacity:1;border-radius:50%;border:1px solid var(--theme-ui-colors-white);background-color:var(--theme-ui-colors-white);background-size:100%;background-position:center;background-repeat:no-repeat;background-image:url(https://interactive.zaobao.com/lib/imgs/icon-close.svg);}

#footer{background:var(--theme-ui-colors-white);}


#stickyBottom{left:0;bottom:40%;margin:0;padding:0;position:fixed;text-align:left;transition: all .5s;z-index:1000000;}
#stickyBottom .item{margin:1px;}
#stickyBottom .item a{font-size:1.2em;width:100%;display:block;padding:0.6em 1em;background:#e90044;line-height:1.2;color:#fff;}

@media screen and (min-height:320px) and (max-height:499px) and (orientation:landscape) {
#stickyBottom{display:none!important;}
}

@media screen and (min-width:768px) and (max-width:900px) and (orientation:portrait) {
#stickyBottom{left:0;top:auto;bottom:0;height:40px;width:100%;display:flex;display:flex;text-align:center;margin:auto;z-index:1000000;}
#stickyBottom .item{width:33%;margin:auto;justify-content:center;align-items:center;text-align:center;}
}

@media only screen and (max-width:767px){
#stickyBottom{left:0;top:auto;bottom:0;height:40px;width:100%;display:flex;display:flex;text-align:center;margin:auto;z-index:1000000;}
#stickyBottom .item{width:33%;margin:auto;justify-content:center;align-items:center;text-align:center;}
#stickyBottom .item a{font-size:1em;padding:0.6em;}
}