@charset "utf-8";
/* CSS EXERCISE: MULTIPLE CHOICE */

.exercise{}
.exercise .template, .exercise .exercise-contents .content{clear: both}

.exercise .exercise-bar{display: block; clear: both; font-size: 0.8em; font-weight: bold; overflow: hidden}

/* Float right */
.f-right{float: right;}
.f-left{float: left;}
.color_red{color: #FF0000; font-weight: bold;}
.color_green{color: #019FA8; font-weight: bold;}
.b-bottom{border-bottom:  1px dashed #CCC;}

.activity-legend{font-style: italic; font-weight: bold;}
.activity-legend p{margin: 0; padding: 0; line-height: 1.25em;}

.rule .floating-list{float: left; width: 140px; padding: 10px 0 0 10px; margin: 0; display: block; text-align: left; font-size: 0.9em;}
.rule .floating-list.last{width: 200px}

/* Orange buttons */
a.orange-button{display:block; float:left; color:#FFF; text-decoration:none; text-align:center; cursor:pointer; padding: 2px 7px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #f87a4b; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#f87a4b), to(#f85317)); background: -moz-linear-gradient(#f87a4b, #f85317); background: linear-gradient(#f87a4b, #f85317); -pie-background: linear-gradient(#f87a4b, #f85317); border: solid 1px #cf3f10; margin-right: 5px; }
a:hover.orange-button{color: #000; background: #f85317; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#f85317), to(#f87a4b)); background: -moz-linear-gradient(#f85317, #f87a4b); background: linear-gradient(#f85317, #f87a4b); -pie-background: linear-gradient(#f85317, #f87a4b);}
a.orange-button span.label{float: left; padding: 4px}
a.orange-button span.ico{float: right; width: 1px; height: 24px; background: url(ico_bt_blue.png) no-repeat; display: block}

a.listen-button{display:block; float:left; color:#FFF; text-decoration:none; text-align:center; cursor:pointer; padding: 2px 7px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #2e679e; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#2e679e), to(#09426f)); background: -moz-linear-gradient(#2e679e, #09426f); background: linear-gradient(#2e679e, #09426f); -pie-background: linear-gradient(#2e679e, #09426f);  border: solid 1px #1c4f8a; margin-right: 5px;}
a:hover.listen-button{color: #b7e2e8; background: #09426f; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#09426f), to(#2e679e)); background: -moz-linear-gradient(#09426f, #2e679e); background: linear-gradient(#09426f, #2e679e); -pie-background: linear-gradient(#09426f, #2e679e);}
a.listen-button span.label{float: left; padding: 4px}
a.listen-button span.icon{float: right; width: 28px; height: 24px; background: url(ico_bt_listen.png) no-repeat; display: block}


/* Blue buttons */
a.blue-button{display:block; float:left; color:#FFF; text-decoration:none; text-align:center; cursor:pointer; padding: 2px 7px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #2e679e; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#2e679e), to(#09426f)); background: -moz-linear-gradient(#2e679e, #09426f); background: linear-gradient(#2e679e, #09426f); -pie-background: linear-gradient(#2e679e, #09426f);  border: solid 1px #1c4f8a; margin-right: 5px;}
a:hover.blue-button{color: #b7e2e8; background: #09426f; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#09426f), to(#2e679e)); background: -moz-linear-gradient(#09426f, #2e679e); background: linear-gradient(#09426f, #2e679e); -pie-background: linear-gradient(#09426f, #2e679e);}
a.blue-button span.label{float: left; padding: 4px}
a.blue-button span.ico{float: right; width: 23px; height: 24px; background: url(ico_bt_blue.png) no-repeat; display: block}
#try-again-button span.ico{background-position: left top}
#try-again-button:hover span.ico{background-position: left bottom}
#reset-button span.ico{background-position: -24px top}
#reset-button:hover span.ico{background-position: -24px bottom}
#done-button span.ico, #see-next-answer-button span.ico, #see-all-answers-button span.ico{background-position: -48px top}
#done-button:hover span.ico, #see-next-answer-button:hover span.ico, #see-all-answers-button:hover span.ico{background-position: -48px bottom}


/* White buttons */
a.white-button{display:block; float:left; color:#497bba; text-decoration:none; text-align:center; cursor:pointer; padding: 2px 7px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background: #FFF; border: solid 3px #497bba; margin-right: 5px;}
a:hover.white-button{color: #FFF; background: #497bba;}
a.white-button span.label{float: right; padding: 4px}
a.white-button span.ico{float: left; background: url(ico_bt_white.png) no-repeat; display: block}
#ok-button.white-button span.ico{width: 30px; height: 25px; background-position: left top;}
#next-exercise-button.white-button span.ico, .next-question .white-button span.ico{width: 55px; height: 25px; background-position: right top;}

/* Next question */
.next-question{display: none; padding-top: 1.5em;}


/* Feedback */
.exercise-feedback{padding: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background: #e8eff9; border: solid 3px #497bba; width: 280px; position: absolute; z-index: 100; top: 0; right: 0;}
.exercise-feedback .title{color: #f95315;}
.exercise-feedback p.text{margin: 0.5em 0; padding: 0.5em 0;}

/* Answers */
.show-answers ul{margin: 0; padding: 0; list-style-type: none}
.show-answers ul li{padding: 10px; margin: 5px; border: solid 1px #cbd9e6}
.show-answers ul li span.ok{ color: #093;}
.show-answers ul li span.notok{ color: #900;}


/* Content */
.activity {font-size: 1.1em; line-height: 1.25em}

.activity .info{ margin: 20px 0; }

.activity .textdiv{ margin: 20px 0; }