/* start of CSS reset */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font,
img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd,
ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead,
tr, th, td {
	margin: 0; padding: 0; border: 0; outline: 0;
	font-weight: inherit; font-style: inherit; font-family: inherit; font-size: 100%;
	vertical-align: baseline;
}
/* remember to define focus styles! */

:focus { outline: 0;}
body { line-height:1; color: black;background: white;}
ol, ul {list-style: none;}

/* tables still need 'cellspacing="0"' in the markup */

table {border-collapse: separate;border-spacing: 0;}
caption, th, td {text-align: left;font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after { content: "";}
blockquote, q {quotes: "" "";}

/* end of CSS reset */

/* ========================================================================== */
/* === layout ============================================================== */
/* ========================================================================== */

/* center align content with 746px wide */
html {height:102%;}
body {text-align:center;}
td {vertical-align: top;}
strong {font-weight: bold;}
#wholepage {width:960px; position:relative; margin:1em auto; text-align:left;}

.form_main label, .form_block label, .form_main input, .form_block input
{display:block;float:left;margin-bottom:0.2em;}
.form_main label, .form_block label
{text-align:right;width:12em;padding-right:1em;}
.form_block label {width:4em;}
form br{clear:left;}
form.liaise input, form.liaise label {float: none;display:inline;vertical-align: middle;}

/* =branding */
#branding{
	position:relative;
	margin-top:0em;
	height:194px;
/*  border:1px solid #222;*/
}
#branding .blockTitle {display:none; overflow:hidden;}
div#brand_img {
  position:absolute; width:100%;
	margin-top:5em;
	/*margin-left:-1px;*/
	/*height:11em;*/
	height:130px;
	text-align:center;
}
div#brand_txt {position:absolute; top:1em; left:1em; }

/* =nav_main */
#nav_main {position:absolute; top:3em; width:100%;}
#nav_main div.blockTitle {display:none;}
#nav_main .blockContent {text-align:left; padding:0.5em;}
#nav_main .blockContent li {display:inline; padding:1em;}

/* =nav_sub */
#nav_sub {position:absolute; top:0em;right:0;}
#nav_sub div.blockTitle {display:none;}
#nav_sub .blockContent {padding:1em 0.5em; text-align:right;}
#nav_sub .blockContent li {display:inline; padding:1em;}

/* =nav_supp */
#nav_supp div.block {border:transparent;}
#nav_supp div.blockTitle {display:none;}
#nav_supp div.blockContent {margin-top:1em; padding:1em 0 1.5em;}
#nav_supp .blockContent li {display:inline; padding:1em;}

/* =content */
div.block{position:relative;}
div#content div.blockTitle {padding:0.6em 2em;}
div#content div.blockContent {padding:1em 2em;}
table#content_area {width:100%;}
table#content_area td {/*position:relative;*/}
table#content_area table td {/*position:relative;*/padding:0.2em 0.1em; letter-spacing:0.08em; line-height:1.35em;}
div#content {padding-top:3em;}
#content a.arrow {padding-left:0.5em;}
#content p {margin-top:1em;margin-bottom:1em;}

/* =content_main */
/*#content_main{margin-top:3em;}*/

/* =content_supp */
/*div#content_supp{margin-top:3em;}*/

/* =content_sub */
div#content_sub {position:relative; top:-2em; z-index:10; width:100%;}

/* =content display style */
.fullscreen {width:100%;}
.normalContentSub {width:22%;}
.normalContentMain {width:38%;}
.normalContentSupp {width:38%;}
.largeContentMain {width:50%;}
.largeContentSupp {width:49%;}
.extraContent {width:69%;}
.fullscreen, .normalContentSub, .normalContentMain, .normalContentSupp, .largeContentMain, .largeContentSupp, .extraContent {vertical-align:top;}

/* =site_info */
#site_info {text-align:center; padding:1em 0 3em;}

/* =helper classes */
.adminEdit {position:absolute; top:.5em; right:.5em; padding:0.2em; border:1px solid #444;}

/* ========================================================================== */
/* === background and color ================================================ */
/* ========================================================================== */

body {background:#3e3e3e url(images/bl_mainbg.gif) repeat-x;}
/*body {background:#3e3e3e url(images/background.jpg);}*/
#wholepage {background:#000;}
/*#wholepage {background:#fff;}*/

/* =branding */
#branding{
/*  background:#600001 url(images/bg_head.jpg) bottom; */
/*  background:#600001;*/
	color:#555;
}
#brand_txt {color:#F8AF00;}

/* =nav_main */
#nav_main, #nav_main a {color:#E0DFC7;background:#713301;}

/* =nav_sub */
#nav_sub, #nav_sub a{color:#999;}

/* =nav_supp */
#nav_supp div.blockContent {background:url(images/footer.jpg) top;}
#nav_supp, #nav_supp div.blockContent, #nav_supp div.blockContent a
{color:#C09464;}

/* =content */
#content {background:#640000; color:#929292;}
#content a{color:#F8AF00;}
#content h1,#content h2, #content h3, #content h4, #content h5 {color:#C12715;}
#content h2.white
{color:#ffffff;
font:16px/24px tahoma;
letter-spacing:0.1em;
}
/*#content .block {border:1px solid #2A2A2A;}*/
/*#content td {border:1px solid #2A2A2A;}*/
#content a.arrow {background:url(images/a.gif) no-repeat left center;}
#content .blockTitle {background:#2A2A2A url(images/blockTitleBar.gif) repeat-x 0 -30%; color:#C12715; border-left:1px solid #000;}
#content .blockContent {background:transparent; color:#999;}
table#content_area {background:#1b1b1b; /*border-top:2px solid #000;*/}

td.fullscreen, td.normalContentSub, td.normalContentMain, td.normalContentSupp, td.largeContentMain, td.largeContentSupp, td.extraContent {border:1px solid #2A2A2A; }

/* =content_main */
table td#content_main {background: #1b1b1b url(images/boxes_left.gif) no-repeat left bottom;}

/* =content_supp */
/* =content_sub */
table td#content_sub
{background: #202020 url(images/boxes_right.gif) no-repeat right bottom;}

/* =site_info */
#site_info, #site_info a {background:#202020;color:#555}

input, textarea, select
{background:#393939; color:#fff; border:1px solid #929292;}
input[type=hidden], input[type=checkbox], input[type=radio] {border:none;}

td#content_sub, #content_sub .blockContent {background:transparent;}

/* helper classes */
.odd {background:#111;}
.even {background:#333;}
tr.head td{color:#F8AF00;}
/*td.head {color:#ccc;}*/
/* ========================================================================== */
/* === Typographical ======================================================== */
/* ========================================================================== */

/* default typographical style */
input, textarea, select, #content, #site_info, #nav_sub, #branding, #nav_main, #nav_supp, #content h3, #content h4, #content h5 {font:13px/16px tahoma;}
#content h1, #content h2 {font:16px/40px tahoma;}
#content h1, #content h3 {font-weight:bold;}
#content p {line-height:1.6;}

/* =branding */
div#brand_txt {font-weight:bold;}

/* =nav_main */
#nav_main, #nav_supp {text-align:center; text-transform: uppercase;}
#nav_main {font-weight:bold;}
#nav_main .blockContent a {text-decoration: none;}
#nav_main .blockContent a:hover {text-decoration: underline;}

/* =nav_sub */
#nav_supp .blockContent a {text-decoration: none;}

/* =nav_supp */
/* =content */
#content .blockTitle, #content h1 {font-weight:bold;}
#content a:hover {text-decoration:none;}

/* =content_main */
/* =content_supp */
/* =content_sub */
/* =site_info */

.title {font:16px/32px tahoma;}

/* ========================================================================== */
/* === XOOPS MODULE SPECIFIC STYLES ========================================= */
/* ========================================================================== */
.xoopspartners_style a, .xlanguage_style a {text-decoration: none;}
.liaise .odd, .liaise .even {background:#222;}

.xoopspoll li:hover {background:#333 url(/sitea/modules/xoopspoll/images/vote.png) no-repeat scroll center right; color:#eee;}
.xoopspoll li span em {font-weight:bold; font-size:1.2em; line-height:1.3em;color:#F8AF00;}

/* ========================================================================== */
/* === STYLES FOR SPECIAL EFFECTS =========================================== */
/* ========================================================================== */

/* CSS  for external links*/
.external{
  background: transparent url(images/external.png) no-repeat right center;
  padding-right:13px; text-align:center;
}

/* effect for debaser module */
.pan_frame
{
  background:none;
  overflow:hidden;
  position:absolute;
  top:0px;      left:0px;
  width: 160px; height:128px;
  display: none;
}

a:hover .pan_frame
{
  display: inline;
/*  background:url(/sitea/themes/cbnhk_color/images/play.png) no-repeat;*/
  background:url(images/play.png) no-repeat;
/*  overflow:hidden;
  position:absolute;
  top:0px;
  left:0px;
  width: 160px;
  height:128px;*/
}

/* ========================================================================== */
/* === STYLES FOR SPECIAL EFFECTS = tabs ==================================== */
/* ========================================================================== */

/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}

/* Skin */
.ui-tabs-nav, .ui-tabs-panel {
    font-family: "Trebuchet MS", Trebuchet, Verdana, Helvetica, Arial, sans-serif;
    font-size: 12px;
}
.ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.ui-tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
    min-width: 84px; /* be nice to Opera */
}
.ui-tabs-nav a, .ui-tabs-nav a span {
    display: block;
    padding: 0 10px;
    /*background: url(images/tab.png) no-repeat;*/
}
.ui-tabs-nav a {
    margin: 1px 0 0; /* position: relative makes opacity fail for disabled tab in IE */
    padding-left: 0;
    /*color: #27537a;*/
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */
    outline: 0; /* prevent dotted border in Firefox */
}
.ui-tabs-nav .ui-tabs-selected a {
    position: relative;
    top: 1px;
    z-index: 2;
    margin-top: 0;
    /*color: #000;*/
}
.ui-tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}
*>.ui-tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
.ui-tabs-nav .ui-tabs-selected a span {
    padding-bottom: 1px;
}
.ui-tabs-nav .ui-tabs-selected a, .ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active {
    background-position: 100% -150px;
}
.ui-tabs-nav a, .ui-tabs-nav .ui-tabs-disabled a:hover, .ui-tabs-nav .ui-tabs-disabled a:focus, .ui-tabs-nav .ui-tabs-disabled a:active {
    background-position: 100% -100px;
}
.ui-tabs-nav .ui-tabs-selected a span, .ui-tabs-nav a:hover span, .ui-tabs-nav a:focus span, .ui-tabs-nav a:active span {
    background-position: 0 -50px;
}
.ui-tabs-nav a span, .ui-tabs-nav .ui-tabs-disabled a:hover span, .ui-tabs-nav .ui-tabs-disabled a:focus span, .ui-tabs-nav .ui-tabs-disabled a:active span {
    background-position: 0 0;
}
.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-unselect a:hover, .ui-tabs-nav .ui-tabs-unselect a:focus, .ui-tabs-nav .ui-tabs-unselect a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.ui-tabs-disabled {
    opacity: .4;
    filter: alpha(opacity=40);
}
.ui-tabs-panel {
    /*border-top: 1px solid #97a5b0;*/
    /*padding: 1em 8px;*/
    /* background: #fff;  declare background color for container to avoid distorted fonts in IE while fading */
}
.ui-tabs-loading em {
    padding: 0 0 0 20px;
    background: url(images/loading.gif) no-repeat 0 50%;
}

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html .ui-tabs-nav  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}
