*{margin:0px;padding:0px}


form { margin: 0px; padding: 0px; }

input, select, option, textarea {
    font-family: "Tahoma";
    font-size: 12px;
    margin-right: 3px;
    padding-left: 2px;
    padding-right: 2px;
}
select { padding-right: 0; padding-left: 0; }
option { margin-right: 2px; }

label { cursor: pointer; vertical-align: middle; margin-right: 15px; }
input, select { vertical-align: middle; }
ul, ol, li { margin: 0px; padding: 0px; text-align: left; }

input.number, option.number { text-align: right; }

span.required { color: red; margin-left: 0px; margin-right: 4px; font-weight: bold; }
.required .label { color: red; }

.hidden-textbox, .hidden-textbox-right {
    background: transparent;
    border: none;
    text-decoration: none;
    text-align: center;
}
.hidden-textbox-right { text-align: right; padding-right: 4px; }

img { border: 0px; }

td, th { padding: 0px; }


body { margin: 0; padding:0; color: #333; font-size: 12px; line-height:16px; font-family:Tahoma, Arial; background:#FFFFFF url(graphics/bg-body.gif) repeat-x top; }

a { color:#0D509F; text-decoration:none; }
a:hover { text-decoration:underline; }

p { padding: 0 10px 5px 10px; }

h1 { font-family: "Myriad Pro", "Trebuchet MS", Arial; margin:0; padding:10px 0 0 10px; text-transform:uppercase; font-size:18px; line-height: 18px; color:#10639a; }
h4 { font-size: 12px; font-weight: bold; }

.reef_title { color: #0B488A; font-size: larger; font-weight: bold; border-bottom: 1px solid #48688F; margin-bottom: 5px; } /* 0A3C78 */
.reef_title:before { content: "reef "; font-weight: bold; color: #B61820; } /* #9B000C; } */

.sidebar_block { padding: 10px; margin-bottom: 10px; }

.blog_block { padding: 0px; margin-bottom: 25px; }
.blog_title, .sub_title { color: #555; font-size: larger; font-weight: bold; border-bottom: 1px solid #888; }
.blog_info { margin-bottom: 10px; }
.blog_info .writer { font-weight: bold; margin-right: 2px; }
.blog_info .datetime { font-weight: normal; }
.blog_hot { border: 1px solid #DDD; background: #F6F6F6; padding: 10px; }
.blog_hot .blog_title { color: #0B488A; border-bottom: 1px solid #577DAA; }
.blog_hot .writer { color: #577DAA; }

.cms_block { padding: 0; margin: 10px 40px 0px; border: 1px solid #DDD; }
.detail_block { padding: 0; margin: 10px 0px; }
.cms_title { color: #0B488A; font-size: larger; font-weight: bold; border-bottom: 1px solid #48688F; }
.cms_form { padding-top: 10px; }
.cms_table { padding: 10px 40px 0; }
.cms_images { margin: 10px 0px; padding: 10px;}
.cms_icon { margin: 0 3px; }
.cms_icon img { vertical-align: middle;}
.action_icon_title { margin: -3px 3px; float: right; }
.action_title { float: right; font-weight: normal; }

.simple_block { padding: 0px 0; margin-bottom: 0px; }
.simple_title { color: #0B488A; font-size: larger; height: auto; font-weight: bold; border-bottom: 1px solid #48688F; }
/* .detail { font-size: larger; } */
.detail .writer, .detail .datetime { float: right; margin-right: 5px; }
.writer, .datetime { color: #777; }

.bar_link { padding: 5px; }
.page_current { padding-left: 5px; font-weight: bold; }
.page_link { padding-left: 5px; }

.wrapper {
margin-top: 0pt;
margin-right: auto;
margin-left: auto;
width: 92%;
background:transparent;
}

#content {
background-color:transparent;
margin-top:0px;
margin-bottom:0px;
padding:10px;
border-bottom: 0px solid #eaeaea;
}

#col_sidebar { background:#FFF url(graphics/bg-sidebar.gif) repeat-y left; padding-left: 10px; width: 270px; }
#col_main { padding: 10px 10px; margin: 0 290px 0 0; }

#col_cms_menu { padding: 0px; width: 200px; }
#col_cms_main { background:#FFF url(graphics/bg-sidebar.gif) repeat-y left; padding: 10px 20px; margin: 0 0px 0 0px; }

#col_cms_menu ul, #col_sidebar ul {
  margin: 1em 0 1em 0.5em;
  padding: 0;
}

#col_cms_menu ul ul, #col_sidebar ul ul { margin: 0.2em 0 0.8em 0.5em; padding-left: 0.8em; }

#col_cms_menu ul li, #col_sidebar ul li {
  margin: 0 0 0 1.5em;
}

#col_cms_menu ul ul li, #col_sidebar ul ul li {
  margin: 0 0 0 1.5em;
}

#band_header { background: #DDD; height: 20px; }
#header {
width: 100%; height: 62px;
background: transparent;
margin-right: auto;
margin-left: auto;
}

#header .logo {
float:left;
margin-top:30px;
padding-top:0px;
padding-left:0px;
margin-left: 15px;
border: none;
}

#flag_lang { float: right; margin-top: 47px; margin-right: 40px; }
.icon_lang { margin: 0 2px; }

#band_footer { background: #DDD; height: 5px; }
#footer {
clear: both; width: 100%;
margin-right: auto;
margin-bottom:0px;
margin-left: auto;
padding:5px;
background-color:transparent;
text-align:center;
}

#footer p {
font-weight: normal;
color: #5b5b5b;
padding-top: 5px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 10px;
text-align: center;

}

/* Component */
img.icon_preview { vertical-align: middle; margin: auto 2px; }
.img_preview { position: absolute; z-index: 2; padding: 4px; border: 1px solid #DDD; background: white; }
.img_thumbnail { padding: 4px; margin: 2px 0; border: 1px solid #DDD; background: #F6F6F6; }
.img_detail { padding: 5px; margin: 0 10px 10px 0; border: 0px solid #DDD; background: #F0F0F0; float: left; }
.thumbnail_cms { width: 180px; height: 220px; float: left; display: inline; margin: 10px 0 0 10px; text-align: center; }
.thumbnail_photo { width: 180px; height: 200px; float: left; display: inline; margin: 10px 0 0 10px; text-align: center; }
.thumbnail_front { margin: 10px auto 0; }

.avatar_news { border: 1px solid #DDD; margin: 0px 20px 10px 0; float: right; }

.message { text-align: left; padding: 20px; width: 400px; margin: 100px auto auto 250px; border: 1px dashed #DDD; background: #F6F6F6; }

span.required { color: red; margin-left: 0px; margin-right: 4px; font-weight: bold; vertical-align: middle; }
span.failed { color: red; margin-left: 0px; margin-right: 4px; font-weight: normal; }
span.success { color: green; margin-left: 0px; margin-right: 4px; font-weight: normal; }

.gbook_left { background: url('graphics/icon-quote_open.gif') no-repeat top right; width: 100px; }
.gbook_right { background: url('graphics/icon-quote_close.gif') no-repeat top left; width: 100px; }
.gbook_content { vertical-align: top; padding: 10px 10px 0; }
.gbook_info { text-align: right; padding: 5px 10px; }

/* Form Layout */
.link_icon { margin: auto 0px; }
.link_icon img { vertical-align: middle; border: none; }

table.result_table, table.form_table, table.detail_table {
    width: 100%;
    padding: 0px;
}
.form_table, .detail_table { border: none; }
.label_group { padding: 2px 10px; color: #BBB; font-weight: bold; }
.close_data_group { border-bottom: 1px solid #DDD; }

.head_col, .head_col_small, .head_table, .head_row, .head_row_top {
    padding: 3px 5px;
    font: bold 12px Tahoma;
}

.field_name { vertical-align: middle; margin: auto 5px; font: bold 12px Tahoma; }
.result_table .field_name { vertical-align: baseline; }

.head_col_small {
    font-size: 11px;
}

.data {
    padding: 3px 5px;
    font: normal 12px Tahoma;
    line-height: 16px;
    color: #333;
}
.text_left { text-align: left;}
.text_right { text-align: right;}
.text_center { text-align: center;}

.data_choice { padding: 5px 5px 3px 0px; }
.input_remark { vertical-align: middle; }
.data_choice input { margin-top: 0px; margin-left: 10px; }
.data_choice img.icon_status { margin: -2px 2px 0; }
.separator_row {
    padding: 0px;
    height: 8px;
}
.separator_col { padding: 0px; }

.head_col, .head_col_small, .head_table { text-align: center; }
.head_row, .head_row_top, .field_name { text-align: right; }
.data_left, .section_table { text-align: left; }
.head_row_top, .field_name_top { vertical-align: top; padding-top: 4px; }
.result_table .head_row_top { padding-top: 3px; }
.layout .head_row_top { vertical-align: top; border: 1px solid white; }

table.layout { border: none; padding: 0px; }
table.layout .data { border: 1px solid white; padding: 4px 5px; }

/* Form Color */

.head_col, .head_col_small, .head_table, .head_row, .head_row_top, .data, .separator_row, .separator_col, .head_block {
    border: 1px solid white;
    background: transparent;
}
.head_col, .head_col_small, .head_table, .paginate, .head_block {background-color: #F8F8F8;}
.cms_images .paginate { border-top: 1px solid #DDD}

.head_col, .head_col_small, .head_table, .head_row, .head_row_top, .field_name { color: #444; }
.form_table input, .form_table select, .form_table option, .form_table textarea { color: #333; }

.result_table { border-top: 1px solid #DDD; border-right: 1px solid #DDD; }
.result_table .head_col, .result_table .head_col_small, .result_table .head_table, .result_table .head_row, .result_table .head_row_top,
.result_table .data, .result_table .separator_row, .result_table .separator_col
{ border-left: 1px solid #DDD; border-bottom: 1px solid #DDD; }

.button_toggle { margin: auto 10px;}
div.datagroup { margin: 0 0 20px; background: #FFF; }
div.form div.field {margin-bottom: 0px; padding-left: 10px; background: #FFF;}
div.form div.fields { margin-top: 4px; }
div.form div.label { width: 120px; padding: 4px 0px; float: left; display: inline; background: transparent;}
div.form div.label_group {font-size: 13px; padding: 0px 6px 4px; background: #EEE; font-weight: bold; vertical-align: top; }
div.form div.input { float: left; display: inline; background: transparent; padding: 4px 0; }
div.form div.submit { padding-top: 3px; background: transparent; padding-left: 10px;}
div.form div.input.button { }
div.form div.input.chained_select select{ margin-right: 5px; }
div.form div.input textarea {width: 95%;}
div.form div.input.info {}
div.form div.input.radio label {vertical-align: middle; padding-top: 3px; margin-right: 10px;}
div.form div.input.checkbox label {vertical-align: middle; padding-top: 0px; margin-right: 10px;}
div.form div.input.radio input, div.form div.input.checkbox input {vertical-align: middle; margin-left: -3px;}
div.form div.input input[type=radio], div.form div.input input[type=checkbox] { margin-left: 0px;}		/* Firefox only */


/* block content */
.block { float: left; display: inline; background: transparent; }
.block p, .block .hd1 { padding: 0 10px 0 20px; margin: 1em auto; }
.block .hd1 { color: #0B488A; font-weight: bold; }
.block .hdc { color: #FC8A2C; font-weight: bold; margin-left: 1em; }
.block img { vertical-align: middle; }
.img_bd img { margin: 10px; padding: 4px; border: 1px #DDD solid; background: white; }
.img_icon img { margin: 0; padding: 0; border: none; }
.img_simple { text-align: center; }
.img_dashed { text-align: center; }
.img_dashed img { margin: 10px; padding: 0px; border: 1px #666 dashed; }
.img_nobd { text-align: center; }
.img_nobd img { margin: 10px 0; padding: 0; border: none; background: white; }
.p_simple { padding: 0; }
.p_indent { text-indent: 0; }
.p_indent p:first-letter { padding-left: 2em; }      /* fix IE bug of text-indent which right margin will be calculated as if it is over the margin, while it is not */
.list_simple p:first-letter { padding-left: 2em; }
.p_indent .hd1 { text-indent: 0; }
.p_indent .hdc { text-indent: 0; }
.list_simple { }
.list_simple ul { margin: auto 1em auto 3em; }
.list_simple ol { margin: auto 1em auto 3em; }
.list_simple li { margin: 1em auto; }
.hdc { margin-top: 2ex; }

.h_row { vertical-align: top; }
.t_hanging { text-indent: 0; }
.t_hanging { margin: 1em auto 1em 4em; }          /* put these classes in a div containing the table to fix IE bug that it will unable to calculate correct table width */
.h_wfull .t_hanging { margin: auto .1em; }
.t_hanging .h_key { font-weight: bold; }
.h_keyright .h_key { text-align: right; padding-right: 1em; }
.h_row ul li { margin: 0 0 0 15px; }
.t_table { margin: 1em auto 1em 4em; }

.h_simple { }
.h_simple td.h_row { padding: .1em 0; }
.h_multiline { }
.h_multiline td.h_row { padding: .3em 0; }
.h_simple p:first-letter { padding-left: 2em; }     /* split to fix IE bug that unstable apply this setting page-to-page */
.h_multiline p:first-letter { padding-left: 2em; }
.t_simple p:first-letter { padding-left: 2em; }

.wysiwyg_body_normal { padding:5px; color: #333; font-size: 12px; line-height:16px; font-family:Tahoma, Arial; background:#FFFFFF; }