﻿html, body, form { height: 100%; width:100%; }
body{ text-align:left; font-family:Verdana; font-size:0.8em; padding:0px; margin:0px; }
fieldset, img { border:0; }
input, img { margin: 0; vertical-align: middle; }
a { text-decoration:none; color:#79b7e7; }
input[type="radio"] { margin:0px 5px 0px 0px; padding:0px; vertical-align: middle; }
input[type="checkbox"] { margin:1px 5px 3px 0px; vertical-align: middle; }
input[type="text"], input[type="password"] { height:1.2em; line-height:1.2em; border: 1px solid #CCC; font-family: Verdana, Helvetica, Sans-Serif; } 
h1, h2, h3 { text-decoration: none; }
h1 { font-size:17pt; font-weight:lighter; color:#7F7F3F;margin:0; padding:5px 15px; }
h2 { font-size:15pt; font-weight:lighter; color:#7F7F3F;margin:0; padding:0px 20px;}
h3 { font-size:14pt; font-weight:lighter; color:#7F7F3F;margin:0px 0px 10px 0px; padding:0px;}
h4 { font-size:13.5pt; font-weight:lighter; color:#7F7F3F;margin:0px 0px 13px 21px; padding:0px;}

/****************
* Main
*****************/
div#page {text-align:left; width:960px; margin:auto; min-height:600px; }
div#page_head { height:80px }
div#logo { width: 280px; height:60px; float:left; margin-top:10px;}
div#logo_right {width: 117px; height:25px; float:right; margin:30px 35px 0px 0px;}
div#loginout { clear:right; width: 117px; float:right; margin:5px 60px 0px 0px; text-align:right;}

div#inner_page { margin:38px 0px 0px 10px; padding:0px; }
div#body_top { background:url(images/page_top.png) top left no-repeat; height:40px; width:900px;}
div#body_top span { color:#ffffff; padding: 7px 0px; font-size:1.1em; font-weight:bold; margin: 0px 15px 0px 15px; text-align:left; display:block; }
/*div#standing_roy { float:right; position:absolute; right:0px; margin:80px 35px 0px 0px; width:104px; height:343px }*/
div#body_mid { background:url(images/page_mid.png) top left repeat-y; width:925px; min-height:180px; } 
div#body_bot { background:url(images/page_bot.png) top left no-repeat; height:64px; width: 943px; }
div#content, div#content_ftr { margin:0px 20px 0px 10px; padding:10px 40px 10px 20px; } 

div#page_ftr { }
div#affiliate {width:1005px; margin:auto; padding-bottom:40px; text-align:left;}
div#affiliate a { margin-right: 40px; }

.test { background: url(/ui/burnmedia/images/button.png) no-repeat; width:142px; height:45px; border:none; cursor:pointer; color:#ffffff;  font-weight:bold; }
button.test:hover { background: url(/ui/burnmedia/images/button_over.png) no-repeat; } 
/****************
* Login & Register
*****************/
div#outer_cntr { width:730px; margin:40px auto 20px auto; }
div#login_cntr { width:450px; padding:20px 0px 0px 0px; font-family: Verdana; color: #1d5987; font-size:1em; height:160px; }
div#login_cntr .login_panel { width:100%; padding:0px; }
div#login_cntr { margin-left:35px; margin-top:20px; }
div#register_cntr { width:450px; padding:20px 0px 0px 0px; font-family: Verdana; color: #1d5987; font-size:1em; height:110px; }
div#register_cntr { margin-left:35px;  }
/*div#register_cntr { float:left; text-align:center; }*/

/**************************************
* Form Element Layout
**************************************/
fieldset { padding: 0 0 0 1em; margin: 0 0 10px 0; display: block; border: 0px solid #CCC; border-top: 1px solid #CCC; }
fieldset legend { font-size: 1em; line-height:1em; color: #79b7e7; margin:0 0 5px 0;}
fieldset label { clear:left; float:left; width: 30%; line-height:20px; vertical-align:middle; padding: 0 3px 0; margin: 0 0 3px 0; text-align: right; color: #1d5987; }
fieldset div {float:left; padding:0; margin: 0 0 3px 0px; width:64%; line-height:20px; vertical-align:middle; }
fieldset div div { float:none; padding:0; margin: 0; min-height:0px; width:auto;}
fieldset textarea { width:80%; }
fieldset input, fieldset select { vertical-align:top; }
fieldset input[type="text"], fieldset input[type="password"] { width: 200px;}
div > fieldset select { width: 203px; border: 1px solid #CCC; }
fieldset .required { background:#edf2f6; }

/**************************************
* Test Layout
**************************************/
.test_listing .l_col { float:left; width:47%; text-align:right; }
.test_listing .r_col { background:#ffffff; text-align:left; margin-left:52%; }
/* reading */
.test_listing .test_reading_block { float:right; width:100%; margin-bottom: 10px; }
.test_listing .test_reading, .test_listing .test_reading_selected, .test_listing .test_reading_disabled { 
        background: url(images/reading_mod.png) no-repeat; width:210px; height:142px; text-align:left; margin-bottom:10px; float:right;}
.test_listing .test_reading_selected { background-position: 0 -142px; }
.test_listing .test_reading_disabled { background-position: 0 -284px; }
/* listening */
.test_listing .test_listening_block { margin-bottom: 10px; width:100%; float:left; }
.test_listing .test_listening, .test_listing .test_listening_selected, .test_listing .test_listening_disabled { 
        background: url(images/listening_mod.png) no-repeat; width:210px; height:142px; vertical-align:top; text-align:left; margin-bottom:10px;}
.test_listing .test_listening_selected { background-position: 0 -142px; }
.test_listing .test_listening_disabled { background-position: 0 -284px; }
.test_listing div.t_header { margin:0; padding:7px 0 0 7px; font-weight:bold; font-size:8pt; color:#FFFFFF; }
.test_listing div.t_info { padding:20px 0px 0px 100px; }
.test_listing a { display:block; margin:5px 0px 0px 95px; width:95px; padding:0px; text-align:center; font-size:0.9em; color:#ffffff; text-decoration:none; }

div.l-col {float:left; width:345px; padding-left:0px; }
div.r-col {text-align:left; margin-left:390px;  }
div.survey-r-col {text-align:left; padding-left:190px;  }
/************Nahed Feb 23 - 2018 - fixing the vertical alignment of listening test to be top after adding the reading 3 test*************/
.testformr_col{ vertical-align: top;}
/************Nahed Feb 23 - 2018 - fixing the horizontal alignment for listening & reading tests give width to table cell that hold reading tests*************/
#tdMiddleColumn{width:420px;}
/* generic reading/listening media/text container */
.text_media_panel {background:none;width:337px; padding:0px 0px 0px 1px; margin:0px; }
.text_media_panel .task_text, .text_media_panel .survey_instruction_text { padding:10px 20px 10px 20px; }
.text_media_panel_end {background:none; width:337px; height:10px; margin:0px; padding:0px; }

/* Multiple choice question item */
.question_item { padding:0px 0px 10px 0px; }
.question_item .qi_question, .survey_question .s_question {margin:10px 0px 0px 0px; padding:0px;  font-size:10pt; color:#000000; font-weight:bold; }
.question_item .qi_question .qi_q_audio { display:inline;vertical-align:middle; border:solid 0px red; font-size:20px; margin-left:5px; z-index:-1000; }
.question_item .qi_choices, .survey_question .s_choices { margin:5px 0px 0px 20px; padding:0px; font-size:10pt; color:#000000; }
.question_item .qi_choices p, .survey_question .s_choices p { margin-bottom:5px; padding:0px; }
.question_item .qi_choices td {padding:5px 0px 5px 0px;}
.question_item .qi_choices_w_media { margin:0px 10px 10px 10px ; float:left; }
.answer_image { height:100%; }

/*Abort reason choice question item*/
.aquestion_item { padding:0px 0px 0px 0px; text-align:left; }
.aquestion_item .aqi_question{margin:10px 0px 0px 0px; padding:0px;  font-size:0.9em; color:#000000; font-weight:bold; }
.aquestion_item .aqi_choices { margin:5px 0px 0px 0px; padding:0px; font-size:0.9em; color:#000000; }

/* Table in test task */
.mc_table_format { border-left:1px solid #DCDCB6; font-size:10pt; color:#000000; background-color:#FFFFFF; width:99%; }
.mc_table_format .tdh {padding:3px; border-right:1px solid #C9C9C9; border-top:1px solid #DCDCB6;  border-bottom:1px solid #C9C9C9; background-color:#C4C484; font-weight:bold; font-size:9pt; color:#2C4761;}
.mc_table_format .td1 {padding:6px; border-right:1px solid #DCDCB6; border-bottom:1px solid #DCDCB6; font-weight:bold; font-size:9pt; color:#2C4761; }
.mc_table_format .td2 {padding:6px; border-right:1px solid #DCDCB6; border-bottom:1px solid #DCDCB6; background-color:#FAFAF5;}



/**************************************
* Misc
**************************************/
.failure_text { color:Red; font-size:0.9em; padding: 10px;}
.message_text { color:Red; font-size:0.9em; padding: 10px;}
.buttons_cntr, .buttons_cntr_right { font-size:0.9em; font-family:Verdana;}
.buttons_cntr, .buttons_cntr_left { font-size:0.9em; font-family:Verdana;}
.buttons_cntr_right { text-align: right; width:65%; float:right; position: relative; top:0px; }
.buttons_cntr_left { text-align: left; width:30%; float:left; position: relative; top:0px; }
.clb_button { height: 24px; }
p.dialogtext { text-align:left; margin:0px 0px 10px 0px;font-size:0.9em; padding:0px; }
p.dialogtext p{ text-align:left; margin:0px 0px 10px 0px;font-size:0.9em; padding:0px; }
.clear { clear:both; height:1px; overflow:hidden;}
/* Logout Test */
.loginout { padding:67px 0px 0px 0px; text-align:right; float:right; } 
/*timer*/
.timer_container { position:fixed; top:20px; right:0px; padding:5px 10px 5px 10px; text-align:center;}
.timer_label, .timer_label_last60 { font-size: 3em; padding:5px; font-family: Verdana; width:140px; }
.timer_label_last60 {
    color: black;
}


/* Assessment Result */
.assessment_result { background-color:#FFFFFF; border:1px solid #CBCBCB; width:100%; }
.assessment_result .ar_content { padding:10px 20px; }

/* benchmark info page */
.pnl_img_info { padding:0px 10px 0px 10px; text-align:left;  background-color: White; border: 1px solid #9b9b9b; width:400px; }
.pnl_img_info h1 { text-align: center; margin: 0px; }
.pnl_img_info ul { padding: 0px; padding-left: 15px; margin:0px; }
.pnl_img_info .pinfo_cnt  { margin:0px 20px 20px 20px; }


/* Misc */
.error_message, .error { color:Red;}

.ajax-loading { position:fixed; top:40%; left:50%; z-index:10002; }
.modalBackground { background-color:#000000; filter:alpha(opacity=60); opacity:0.6; }

.useroptions, .useroptions a {color:#79b7e7;}
.ui-widget-content { border:solid 0px #ffffff }
.question_audio { width:11px; height:17px } 
