.errorbox {border: 0px solid silver; background-color: #F0F0F0; width: 20px;}
.contentItemArea { width:100%; padding-bottom:10px;} /* Container */

.contentItemTitleBar { width:100%; background-color:#FBF5E4;border-top:1px solid #CC0000;} 

.contentItemTitleBar .textHolder 
{
	padding:5px 5px 5px 5px;
	color:#000000; 
	font-size:1.15em;  
	line-height:1.15em;
}
.contentItemTitleBar .textHolder h3 {font-size:1em; font-weight:bold; color:#CC0000;}

.contentItemTitleBar .textHolder a:link {color:#CC0000;}
.contentItemTitleBar .textHolder a:visited {color:#990000;}
.contentItemTitleBar .textHolder a:hover, .contentItemTitleBar .textHolder a:active, .contentItemTitleBar .textHolder a:focus { 
  /* color:#FF6600;20071127:hover no change */
}

.contentItemTitleBar .legendRightSide {float:right; padding:0.45em 2px 3px 2px;}
/* --- writeup legend Right Side --- */
/* 2007.05.02 TH: do not use list to display the legends */
/* .legendRightSide ul {float:left; list-style:none; padding:0.45em 2px 3px 2px;}
.legendRightSide ul li {display:inline; padding:0; margin:0; } */

/* 20070530: use "contentItemArea" instead of "contentItemTitleBar" because of the "Expand ALL" is not in "TitleBar" */
.contentItemArea .expandRightSide {float:right; padding:0.45em 10px 3px 0px;} /* T R B L */

.contentItemContent {padding:5px; font-size:1em;}

.contentItemContent a:link, .contentItemContent a:visited {color:#000000; font-size:1em; }
.contentItemContent a:hover, .contentItemContent a:active, .contentItemContent a:focus {
  /* color:#FF6600; 20071127:hover no change */
	font-size:1em; 
}

.contentItemContent a.linkWithLine:link {color:#CC0000; font-size:1em;  text-decoration:underline;}
.contentItemContent a.linkWithLine:visited {color:#CC0000; font-size:1em;  text-decoration:underline;}
.contentItemContent a.linkWithLine:hover, .contentItemContent a.linkWithLine:active, .contentItemContent a.linkWithLine:focus {
 /* color:#CC0000; 20071127:hover no change */
 font-size:1em;  text-decoration:none;
}

.contentItemContent a.moreArticle:link, .contentItemContent a.moreArticle:visited {color:#FF6600;}
.contentItemContent a.moreArticle:hover, .contentItemContent a.moreArticle:active, .contentItemContent a.moreArticle:focus {
  /* color:#000000;20071127:hover no change */
}

.contentItemContent ul, .contentItemContent ol {list-style:disc; padding-left:1.3em;} 
.contentItemContent ul li, .contentItemContent ol li { line-height:1.15em; font-size:1em;} 

.contentItemContent li a:link {color:#000000;}
.contentItemContent li a:visited {color:#666666;}
.contentItemContent li a:hover, .contentItemContent li a:active, .contentItemContent li a:focus {
  /* color:#FF6600;20071127:hover no change */
}

.contentItemContent li a.moreArticle:link {color:#FF6600;}
.contentItemContent li a.moreArticle:visited {color:#FF6600;}
.contentItemContent li a.moreArticle:hover, .contentItemContent li a.moreArticle:active, 
.contentItemContent li a.moreArticle a:focus {
  /* color:#000000;20071127:hover no change */
}

.contentItemContent textarea {font-family:inherit; font-size:inherit;}

.title_bar {background-color: #7E6E9F; font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #FFFFFF; padding:5px;}


.announcePanelTitle    { background-color: #CC0000;  }

.EngHeading      { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #FFFFFF; padding:5px; }
.EngHeading      { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #FFFFFF; padding:5px;  }
.EngRedHeading   { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #CC0000; padding:5px;  }
.EngText1        { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px;  }
.EngText1_sub        { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px;}
.EngText1iAMSmart        { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #2B7366; padding:5px;  }
.EngText1B       { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #000000; padding:5px;  }
.EngText1C       { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #000000; padding:5px; background-color:#DCE3F4;}
.EngText1D        { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px; background-color:#F0F0F0; border-color:#FFFFFF; border-width:0 0 2px 0; border-style:solid;}
.EngText1E        { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px; border-width: 2px 0px 2px 0px; border-style: solid; border-color: #FFFFFF; }
.EngText2        { font-family: "Arial";    font-size: 0.85em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px;  }
.EngText2B       { font-family: "Arial";    font-size: 0.85em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #000000; padding:5px;  }
.EngText3        { font-family: "Arial";    font-size: 0.75em;  font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; vertical-align: top; padding:5px; }
.EngRedText1     { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #CC0000; padding:5px;  }
.EngRedText1B    { font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #CC0000; padding:5px;  }
.EngRedText2     { font-family: "Arial";    font-size: 0.85em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #CC0000; padding:5px;  }
.EngRedText3     { font-family: "Arial";    font-size: 0.75em;  font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #CC0000; vertical-align: top; padding:5px;  }
.EngTextFooter        { font-family: "Arial";    font-size: 0.5em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px;  }


/* Scroll box */
div.formBoxWithScrollBar { background-color:#F0F0F0; font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px;}
.step_table    { background-color: #FFFFFF; }
.shaded_area { width: 100%; border-collapse: collapse;  border-spacing: 0pt; background-color: #F0F0F0; }

/* Button Bar */
.button_bar    { height: 34px; background-color: #F0F0F0;  vertical-align: bottom; text-align: right;}
.button_bar2    { height: 34px; background-color: #F0F0F0;  vertical-align: bottom; text-align: right; padding-right:5px; padding-top:12px;}
.button_bar3    { height: 34px; background-color: #F0F0F0;  vertical-align: bottom; text-align: left; padding-right:5px; padding-top:12px;}

/*agree Button Bar */
.agree_button_bar    { background-color: #F0F0F0;  vertical-align: middle; text-align: left;}

/* Left Navigation */
.ln_EngHeading      { font-family: "Arial";    font-size: 0.8em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #000000 }
.ln_EngRedHeading   { font-family: "Arial";    font-size: 0.8em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #CC0000 }
.ln_EngWhiteHeading { font-family: "Arial";    font-size: 0.8em; font-style: normal; line-height: normal; font-weight: bold;   font-variant: normal; color: #FFFFFF }
.ln_EngText         { font-family: "Arial";    font-size: 0.75em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000 }
.ln_EngRedText      { font-family: "Arial";    font-size: 0.75em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #CC0000 }
.ln_EngWhiteText    { font-family: "Arial";    font-size: 0.75em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #FFFFFF }

.currStepBox { background-color: #CC0000; width:50%;}
.stepBox     { background-color: #F0F0F0; width:50%;}

/* Highlight Bar */
.highlight_bar { background-color: #FCF5E6; }

/* Highlight Bar Result*/
.highlight_bar_result { background-color: #003366; }

/* Input Area */
.input_area    { width: 100%; border-collapse: collapse; border-spacing: 0pt; background-color: #F0F0F0;}

/* Step Bar */
.step_bar    { background-color: #FFFFFF; text-align: right; }

/* Amend Bar */
.amend_bar    { background-color: #CCCCCC; }

.input_area_inner { text-align: left; padding: 2px 0px 2px 0px; border: none; clear:both;}


/* Points To Note */
.note_panel { background-color: #FCF5E6; border-top: solid #CC0000 1px; border-collapse: collapse; }


/* Info table */
div.info_table          { width: 100%; border-collapse: collapse; border-spacing: 0pt; }
div.info_table div.alt   { background-color: #F4F1DB; padding:1px;}
#field { float:left; width:60%; text-align:right; }
#value { float:left; width:30%; text-align:left; }
span.left {float:left; width:45%;}
span.left2 {float:left; width:45%; padding-left:2em;}
span.right {float:right; width:45%;}
#point	{float:left; width:2%;}
#detail {float:left; width:88%;}
#back 	{float: right;}


/* Mobile EBooking Info table */
div.mobile_ebooking_info_table          { width: 100%; border-collapse: collapse; border-spacing: 0pt; }
div.mobile_ebooking_info_table div.alt   { background-color: #F4F1DB; padding:1px;}
#mebk_field { float:left; width:65%; text-align:left; }
#mebk_value { float:left; width:30%; text-align:left;font-weight:bold;word-break:break-all;padding-left:0em;}
#mebk_field_ack { float:left; width:40%; text-align:right; }
#mebk_value_ack { float:left; width:50%; text-align:left;font-weight:bold;word-break:break-all;padding-left:0em;}

#mebk_point	{float:left; width:2%;}
#mebk_detail {float:left; width:88%;}
#mebk_back 	{float: right;}


/* Border table */
table.border_table tr.alt   { background-color: #F4F1DB; }
table.border_table          { width: 100%; }
table.border_table tr.odd   { background-color: #FCF5E6; }
table.border_table tr.even  { background-color: #FFFFFF; }
table.border_table th       { background-color: #F4F1DB; text-align: left; vertical-align: middle; }
table.border_table td       {                            text-align: left; vertical-align: middle; }

/* Border table */
table.border_table_valign_top tr.alt   { background-color: #F4F1DB; }
table.border_table_valign_top          { width: 100%; }
table.border_table_valign_top tr.odd   { background-color: #FCF5E6; }
table.border_table_valign_top tr.even  { background-color: #FFFFFF; }
table.border_table_valign_top th       { background-color: #F4F1DB; text-align: left; vertical-align: top; }
table.border_tabl_valign_tope td       {                            text-align: left; vertical-align: top; }


/* Button */
.buttons a {
	display: block;
	margin: 5px 0;
	padding: 0 0px;
	text-decoration: none;
	background: #003366;
	-webkit-border-radius: 10px;
	font-family: "Arial"; font-size: 0.85em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000;
}
.buttons a span {
	 padding:5px; display: block;	background: url('/mobile/list_arrow.png') right center no-repeat;
}


.panelBox    { padding: 5px 5px; background-color: #FCF5E6; font-family: "Arial"; font-size: 0.85em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000;border-width: 0px 0px 3px 0px; border-style: none none solid none ; border-color: #FFFFFF; clear:both;}

.panelBox span  {  padding:0px; }

.termField {float:left; width:8%; text-align:left;font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px;  }
.termDetail {float:left; width:82%; text-align:left;font-family: "Arial";    font-size: 0.95em; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; color: #000000; padding:5px;  }


.header {
	font-weight: bold;
	padding-top: 12px;
	text-decoration: underline
}


/* For accordion menu*/
.menu_list {	
	width: 100%;
}
.menu_body {
	display:none;
}

.textbox1 { font-family: "Arial"; font-size: 0.95em; width: 80px; }
.textbox1_error { font-family: "Arial"; font-size: 0.95em; width: 80px; border: 1px solid red; background-color: #FFFCE2;}

.mebk_textbox1 { font-family: "Arial"; font-size: 0.95em; width: 200px; }
.mebk_textbox1_error { font-family: "Arial"; font-size: 0.95em; width: 200px; border: 1px solid red; background-color: #FFFCE2;}

.combobox1 { font-family: "Arial"; font-size: 0.95em; width: 80px; }

.mebk_combobox_calendar { font-family: "Arial"; font-size: 0.95em; width: 200px; }
.mebk_combobox_timeslot { font-family: "Arial"; font-size: 0.95em; width: 80px; }

/* Input Area */
.mebk_address_area    { width: 100%; border-collapse: collapse; border-spacing: 0pt; background-color: #F0F0F0;font-weight: bold; text-align:center;}


/*
.iAMLoginBtn
{
  	background-color: #2b7367;
	border: 1px solid #2b7367;
  	border-radius: 1em;
  	color: #FFFFFF;
  	padding: 1em 1em 1em 1em;
  	cursor: pointer;
  	outline:none;
  	display: flex;
  	align-items: center;
  	justify-content: center;
}
.iAMLoginBtn:hover,.iAMLoginBtn:focus {
  
  background-color: #FFFFFF;
  border: 1px solid  #2b7367;
  border-radius: 1em;
  color: #2b7367;

}
.iAMLoginBtn .loginIcon
{
	background-image: url(../images/mygovhk/login/icon-dark-2x.png);
    background-size: 26px 35px;
    background-position: center center;
    background-repeat: no-repeat;
    margin-right: 1em;
    display: block;
    width: 26px;
    height: 35px;
}
.iAMLoginBtn:hover .loginIcon,.iAMLoginBtn:focus .loginIcon 
{
	background-image: url(../images/mygovhk/login/icon-light-2x.png);
}
.iAMHidden{
	display:none !important;
}

*/

.iAMLoginBtn
{
	background-color: #2b7367;
	border: none;
	color: #FFFFFF;
	padding: 4.375px 8.75px 4.375px 8.75px;
	cursor: pointer;
	outline:none;
	border-radius: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: 'Noto Sans SC', Arial, Helvetica, sans-serif;
	width: -moz-fit-content;
	width: fit-content;
	text-decoration:none;
	vertical-align: middle;	
 
}
.iAMLoginBtn:hover,.iAMLoginBtn:focus {
  background-color: #FFFFFF;
  border: 1px solid  #2b7367;
  color: #2b7367;
  text-decoration:none;

}

.iAMSmartButtontext {
	font-size: 16.2px;
	padding-left: 8.75px;
	overflow: hidden;
	white-space: nowrap;
	display: block;
	text-overflow: ellipsis;
}


.iAMHidden{
	display:none !important;
}

