@CHARSET "UTF-8";

/* April7 Inc. Solution Team */
*{margin:0;padding:0;}
html,body{width:100%;height:100%;}
html{overflow:hidden;}
body{background-color:#fff;}
body,input,button{font-size:12px;line-height:1.5em;font-family:Arial,Dotum,Helvetica,AppleGothic,Sans-serif;color:#383d41;}
h1,h2,h3,h4,h5,h6{font-size:12px;text-align:left;}
img,fieldset,iframe,table{border:0 none;}
li{list-style:none;}
a{color:#2f3743;text-decoration:none;}
a:hover{color:#5a93fe;text-decoration:underline;}
em,address{font-style:normal;}
button,label{cursor:pointer;_cursor /**/:hand;}
button *{position:relative;}
button img{left:-3px;*left:auto;}
textarea{overflow:auto;}
html:first-child select{height:20px;padding-right:6px;}
option{padding-right:6px;}
table{border-collapse: collapse;}
img,input,label{vertical-align:middle;}
th{text-align:left;font-weight:normal;}
div{margin:0;padding:0;}

div#Top { background: url(../img/player/bg_top.gif); height: 36px; position: relative; z-index: 2; }
div#Bottom { background: url(../img/player/bg_bottom.gif); height: 47px; position: relative; z-index: 2; }
table.Bottom { width: 560px; margin: 0 auto; }

div#Countdown { background: url(../img/player/btn_top_timer.gif) no-repeat; width: 27px; height: 26px; text-align: center; line-height: 26px; font-family: Tahoma; font-size: 12px; color: #3c81ff; font-weight: bold; }

div#ViewFrame { background: url(../img/player/bg_data.gif) repeat-x center bottom; }
div.View { position: relative; overflow: scroll; overflow-x: hidden; overflow-y: auto; text-align: center; }

td.Bar { background: url(../img/player/btn_bottom_split.gif) no-repeat center center; width: 2px; }

div#Title { line-height: 26px; padding: 4px 10px; white-space: nowrap; overflow: hidden; float: left; font-weight: bold; }

a.Btn { display: inline-block; }
a.Btn span { display: none; }

a#PopupMenu { background: url(../img/player/btn_top_mode.gif) no-repeat; width: 70px; height: 26px; }
a#PlaySound { background: url(../img/player/btn_top_sound.gif) no-repeat; width: 25px; height: 26px; } a#PlaySound.Enable { background-position: 0 -26px; }
a#IncreaseFontSize { background: url(../img/player/btn_top_plus.gif) no-repeat; width: 25px; height: 26px; } a#IncreaseFontSize.Enable { background-position: 0 -26px; }
a#DecreaseFontSize { background: url(../img/player/btn_top_minus.gif) no-repeat; width: 25px; height: 26px; } a#DecreaseFontSize.Enable { background-position: 0 -26px; }
a#ToggleMiniMode { background: url(../img/player/btn_top_mini.gif) no-repeat; width: 25px; height: 26px; } a#ToggleMiniMode.Enable { background-position: 0 -26px; }

a#ToggleMiniModeFloat { background: url(../img/player/btn_data_mini.gif) no-repeat; width: 21px; height: 20px; margin-top: 5px; z-index: 1; }

table.Panel01 { margin-top: 6px; }
a#Prev { background: url(../img/player/btn_bottom_prev.gif) no-repeat; width: 36px; height: 36px; } a#Prev:hover { background-position: 0 -36px; }
a#Play { background: url(../img/player/btn_bottom_play.gif) no-repeat; width: 36px; height: 36px; } a#Play:hover { background-position: 0 -36px; }
a#Play.Pause {background-position: -36px 0; } a#Play.Pause:hover {background-position: -36px -36px; }
a#Next { background: url(../img/player/btn_bottom_forw.gif) no-repeat; width: 36px; height: 36px; } a#Next:hover { background-position: 0 -36px; }

div.PositionArea { height: 16px; line-height: 16px; font-size: 11px; color: #c1c1c1; text-align: center; }
span.Position { color: #3c81ff; font-weight: bold; }
span.ItemCount { color: #8a8a8a; }

div.Progress { background: url(../img/player/btn_bottom_progress_bg.gif) no-repeat; width: 79px; height: 10px; margin: 0 auto; overflow:hidden; }
div.ProgressBar { background: #558eff; height: 10px; position: relative; line-height: 10px; overflow:hidden; }
div.Progress div.Cover { background: url(../img/player/btn_bottom_progress_cover.gif) no-repeat; width: 79px; height: 10px; position: relative; top: -10px; overflow:hidden; }

table.Panel03 { margin-top: 8px; }
td#ToggleTd a { background: url(../img/player/btn_bottom_mode.gif) no-repeat; width: 61px; height: 32px; }
td#ToggleTd a.ToggleModeOrder { background-position: 0 -32px; }
td#ToggleTd a.ToggleModeDefault { background-position: 0 -64px; }

a#ToggleName { background: url(../img/player/btn_bottom_word.gif) no-repeat; width: 39px; height: 32px; } a#ToggleName.On { background-position: 0 -32px; }
a#ToggleMean { background: url(../img/player/btn_bottom_mean.gif) no-repeat; width: 38px; height: 32px; } a#ToggleMean.On { background-position: 0 -32px; }
a#ToggleExample { background: url(../img/player/btn_bottom_example.gif) no-repeat; width: 39px; height: 32px; } a#ToggleExample.On { background-position: 0 -32px; }

a#Complete { background: url(../img/player/btn_bottom_remember.gif) no-repeat; width: 96px; height: 32px; } a#Complete:hover { background-position: 0 -32px; }

a#BtnCheckQuestion { background: url(../img/player/btn_bottom_solution.gif) no-repeat; width: 96px; height: 32px; } a#BtnCheckQuestion:hover { background-position: 0 -32px; }
a#BtnNextQuestion { background: url(../img/player/btn_bottom_next.gif) no-repeat; width: 96px; height: 32px; } a#BtnNextQuestion:hover { background-position: 0 -32px; }
a#BtnQuizResult { background: url(../img/player/btn_bottom_result.gif) no-repeat; width: 96px; height: 32px; } a#BtnQuizResult:hover { background-position: 0 -32px; }

div#Menu { position: absolute; top: 30px; z-index: 3; width: 100%; text-align: right; }
div#Menu div.Content { width: 78px; margin-right: 97px; display: inline-table; }
div#Menu div.Content a { overflow: hidden; display: block; }
a#MenuPlayer { background: url(../img/player/btn_mode_normal.gif) no-repeat; width: 78px; height: 27px;} a#MenuPlayer:hover { background-position: -78px 0; }
a#MenuQuiz { background: url(../img/player/btn_mode_quiz.gif) no-repeat; width: 78px; height: 23px;} a#MenuQuiz:hover { background-position: -78px 0; }
a#MenuConfig { background: url(../img/player/btn_mode_config.gif) no-repeat; width: 78px; height: 26px;} a#MenuConfig:hover { background-position: -78px 0; }

a#BtnQuizStart { background: url(../img/player/btn_data_quiz_ok.gif) no-repeat; width: 96px; height: 92px; }
a#BtnConfigApply { background: url(../img/player/btn_data_config_ok.gif) no-repeat; width: 96px; height: 92px; }

div#WordbreakWavPlayerDiv, div#WordbreakHelperDiv { height: 0; width: 0; }

table#Answers { margin: 0 auto;}
table#Answers a.Answer { display: block;text-align: left;text-decoration: none;padding: 5px;}

a#BtnQuizHome { background: url(../img/player/btn_data_back.gif) no-repeat; width: 115px; height: 49px; } a#BtnQuizHome:hover { background-position: 0 -49px; }

table#Answers a.Answer span.Num { display: block; width: 20px; height: 21px; float: left; margin-right: 10px; }

a#Answer0 span.Num { background: url(../img/player/btn_num_1.gif) no-repeat; } 
a#Answer1 span.Num { background: url(../img/player/btn_num_2.gif) no-repeat; }
a#Answer2 span.Num { background: url(../img/player/btn_num_3.gif) no-repeat; }
a#Answer3 span.Num { background: url(../img/player/btn_num_4.gif) no-repeat; }
a#Answer0.Correct span.Num, a#Answer1.Correct span.Num, a#Answer2.Correct span.Num, a#Answer3.Correct span.Num { background-position: 0 -42px; }
a#Answer0.Wrong span.Num, a#Answer1.Wrong span.Num, a#Answer2.Wrong span.Num, a#Answer3.Wrong span.Num { background-position: 0 -21px; }

a.Answer.Correct { font-weight: bold; }

div.CorrectQuizBackground { background: url(../img/player/btn_data_o.gif) no-repeat center center; }
div.WrongQuizBackground { background: url(../img/player/btn_data_x.gif) no-repeat center center; }

div#QuizResult { background: url(../img/player/st_data_quiz_icon.gif) no-repeat center 5px; padding: 55px 0 15px 0; font-size: 16px; line-height: 20px; }

table.ConfigTable { margin: 0 auto; text-align: left; width: 500px; }
table.ConfigTable td.ConfigData { vertical-align: top; border-right: solid 1px #f0f0f0; }
table.ConfigTable td.Ctrl { padding: 5px 4px 5px 20px; vertical-align: middle; width: 96px; }
table.ConfigTable div.Title { color: #548ffb; font-weight: bold; line-height: 30px; }
table.ConfigTable table.Content { width: 100%; line-height: 24px; }