/*********************************
kobudo.fi
ver 1	The whole year of 2007
Jukka Paasonen
paazio.nanbudo.fi
*********************************/
* { margin: 0; padding: 0; font-family: Verdana, Arial, sans-serif; font-size: 12px; color: Black; border: none; }
body, input, textarea, select, area { background-color: #FFFFFF; color: Black; }
/* http://meyerweb.com/eric/thoughts/2004/09/15/emreallyem-undoing-htmlcss */
area, base, basefont, head, meta, script, style, title, noembed, noscript, param { display: none; }
ul, menu, dir { display: block; list-style-type: circle; text-align: left; margin: 6px; }
p { clear: both; }
p, h1, h2, h3 { margin: 5px; padding: 5px; display: block; }
h1, h2, h3 { font-weight: bold; clear: both; border-bottom: 2px solid #D1D1D1; }
a { text-decoration: none; color: Black; }
a:hover { text-decoration: underline; color: #FF1D06; }
ol { margin: 10px; list-style: decimal inside none; }
ul { margin: 10px; list-style: circle inside none; }
li { margin: 6px; }
h1 { font-size: 17px; }
h2 { font-size: 15px; }
h3 { font-size: 14px; }
hr { background-color: #FF1D06; }
option { padding: 1px; }
img { border: none; padding: 0; margin: 0 1px; }
img.thickbox { padding: 3px; }
textarea { height: 100px; }
textarea.editor { height: 260px; }
input, textarea, select, div.wym_box { width: 500px; border: 1px solid #708090; margin: 2px; padding: 2px; }
input[type="hidden"] { visibility: hidden; height: 0; width: 0; display: none; }
input[type="checkbox"], input[type="radio"], .tick { width: 20px; border: none; float: left; }
input[type="submit"], input[type="button"], button, .button { width: auto; border: 1px solid Black; vertical-align: middle; text-align: center; background-color: #A9A9A9; display: block; color: Black; margin: 2px; padding: 2px 8px; }
input[type="submit"]:hover, input[type="button"]:hover, button:hover, .button:hover { background-color: #FF1D06; }
input[type="file"] { display: block; margin: 2px; float: none; }
table { width: 95%; margin: 0 auto; border-collapse: collapse; }
tr td { background-color: White; vertical-align: text-top; }
tr.odd td { background-color: #A9A9A9; }
tr.over td { background-color: #FFDAB9; }
th { text-align: left; border-bottom: 1px solid Black; cursor: pointer; }
th, td { padding: 3px; }
label { clear: both; display: block; padding: 10px; }
label > b { font-weight: bold; text-align: right; float: left; width: 120px; }
label > span { margin: 0px; margin-left: 10px; font-weight: normal; display: inline; float: left; }
/* Named classes 
addnew is the class for the link on top of the content area, which is shown
when users are logged in or some other occations.
*/
.addnew { width: 95%; border: 1px dashed #2E8B57; }
.addnew a { display: block; width: 100%; background-color: transparent; color: Black; }
.addnew a:hover { background-color: #DDF3E7; text-decoration: none; color: Black; }
span.dates { float: left; margin: 0 1em; }
.button:hover { text-decoration: none; color: Black; }
/*
As the name states, the error styled paragrah is shown when an error occurs, even a minor one.
*/
p.error { border: 1px dashed #FF1D06; padding: 4px; background-color: #FFDAB9; background-image: url(../img/icons/exclamation.png); width: 95%; }
p.error,
p.add,
p.asterisk,
p.smile,
p.rainbow,
p.accept,
p.disconnect,
p.bug { padding-left: 20px; background-position: left; background-repeat: no-repeat; margin-bottom: 16px; }
p.add { background-image: url(../img/icons/add.png); }
p.asterisk { background-image: url(../img/icons/asterisk_orange.png); }
p.smile { background-image: url(../img/icons/emoticon_smile.png); }
p.rainbow { background-image: url(../img/icons/rainbow.png); }
p.accept { background-image: url(../img/icons/accept.png); }
p.disconnect { background-image: url(../img/icons/disconnect.png); }
p.bug { background-image: url(../img/icons/bug.png); }
/*
stat are the are shown below each content.
It presents the times and editor of that content.
*/
.stat { margin: 10px; }
.stat, .stat a { font-size: smaller; font-style: italic; }
.stat a { font-weight: bold; padding: 5px 0; color: #2E8B57; }
.stat a:hover { background-color: #DDF3E7; text-decoration: none; color: Black; }
.w16 { width: 16px; }
.w40 { width: 40px; }
.w80 { width: 80px; }
.w100 { width: 100px; }
.w120 { width: 120px; }
.w140 { width: 140px; }
.w200 { width: 200px; }
.h16 { height: 16px; }
.h100 { height: 100px; }
.h200 { height: 200px; }
.clear { clear: both; padding-top: 10px; }
.left { float: left; }
.right { float: right; }
.marked { background-color: #FEFF24; }
.results { font-size: small; }
.nonpublished { color: #FF1D06; }
p.latest { border: 1px solid White; width: 750px; }
p.latest:hover { border: 1px solid #D1D1D1; }
p.latest a { margin-left: 20px; }
.stuff { margin-top: 10px; margin-bottom: 10px; }
/** Structure related DIV soup builders **/
#wrapper { position: absolute; left: 50%; width: 795px; margin-left: -398px; }
#container { float: left; overflow: hidden; width: 100%; border: none; margin: 0; padding: 0; }
#loginform { border: 1px solid #D2B48C; padding: 4px; margin: 2px; }
/** The main container in the middle **/
#main { overflow: visible; float: left; border: none; margin-bottom: -1000px; padding-bottom: 1000px; width: 772px; margin-left: 5px; margin-right: 5px; padding-left: 0; padding-right: 0; }
#copyright a:hover img { outline: none; }
label.error { width: auto; color: #FF1D06; }
#header { width: 795px; height: 260px; background-image: url("../img/header256.gif"); background-repeat: no-repeat; margin: 0; padding: 0; }
#bottom { height: 6px; width: 795px; }
#bottom .clear { background: url(../img/line_bottom.gif) top center no-repeat; margin: 0; padding: 0; }
/* ID areas */
#lefty, #righty { float: left; margin: 0; padding: 0; margin-bottom: -5000px; padding-bottom: 5000px; border: none; }
#lefty { background: url(../img/line_left.gif) top center repeat-y; width: 7px; }
#righty { background: url(../img/line_right.gif) top center no-repeat; width: 6px; }
/* Secondary menu */
#redlist { margin-left: 20px; display: block; padding: 10px; width: 200px; list-style-type: none; }
#redlist a { width: 100%; height: 100%; display: block; border: 1px solid White; }
#redimg { float: right; position: relative; margin-right: 16px; border: 4px solid #FF1D06; }
#uploader { border: 1px solid Black; }
#copyright { margin: 0; padding: 0; width: 250px; height: 70px; vertical-align: bottom; background-color: transparent; background-image: url(../img/copyrightbg.gif); background-position: right; background-repeat: no-repeat; display: block; clear: both; float: left; }
#copyright p { margin: 10px; margin-left: 0px; margin-bottom: 2px; }
#copyright img, #copyright a { margin: 0; border: none; }
#copyright a:hover { border: none; outline: none; }
/** Those hidden minisets. All are divs **/
#newcategory { width: 300px; height: 95px; z-index: 551; visibility: hidden; left: -500em; display: none; position: absolute; text-align: center; }
#commentor { width: 410px; height: 255px; z-index: 400; position: absolute; text-align: center; }
#commentor img, #commentor p { display: block; }
#commentor button { clear: left; }
#flagchanger { width: 100%; z-index: 351; display: block; text-align: center; clear: both; margin: 10px; padding: 6px; }
#flagchanger ul { list-style: none; display: inline; }
#flagchanger li { list-style: none; display: inline; }
/** Drop down menu begins **/
#menu { margin: 0; padding: 0; height: 35px; width: 100%; background-image: url(../img/line_menu.gif); background-repeat: no-repeat; vertical-align: middle; background-color: transparent; color: Black; text-align: left; background-position: bottom; z-index: 362; }
#menu ul { margin: 0; padding: 0; list-style: none; float: left; width: 100%; font-family: Verdana, Arial, sans-serif; display: block; height: 30px; z-index: 363; }
#menu ul li { background-color: transparent; background: url(../img/menu_mid.gif) no-repeat bottom right; float: left; display: inline; border: none; position: relative; text-align: left; height: auto; margin: 0; padding-top: 8px; width: 96px; z-index: 364; }
#menu a { font-size: 10px; font-weight: bold; text-decoration: none; height: 20px; width: 100%; vertical-align: middle; text-align: center; margin: 0; padding: 0; color: Black; background-color: transparent; display: block; z-index: 365; border: none; /* float: left; messes opera and partly firefox */ }
#menu ul ul li a { width: 160px; text-align: left; padding-left: 20px; }
#menu a img { text-align: left; vertical-align: middle; height: 18px; border: none; }
#menu ul a:hover{ cursor: pointer; z-index: 363; }
#menu ul ul { padding: 0; margin: 0; z-index: 364; visibility: hidden; left: -500em; display: none; position: absolute; top: auto; background-repeat: no-repeat; background-color: White; border: none; width: 180px; height: 100%; }
#menu ul li ul li, #redlist li { padding: 0; margin: 0; height: 20px; display: block; text-align: left; width: 100%; background-color: White; border: 1px solid #D1D1D1; background-image: none; }
#menu ul li ul a:hover, #redlist a:hover { border: 1px solid #FF1D06; }
#menu ul li:hover ul, #menu ul li a:hover ul { visibility: visible; left: 0; display: block; }
#menu ul li a:hover, #redlist li a:hover { font-size: 10px; font-weight: bold; text-decoration: none; }
/** Drop down menu ends **/
#menu li#search { display: inline; width: 140px; background: none; }
#menu li#search input { display: inline; padding: 0; margin: 0; background: none; float: left; }
#menu li#search p { width: 100%; padding: 0; margin: 0; }
#menu #s { width: 120px; }
#redlist li { margin: 2px; }
#debug { clear: both; position: relative; }
#debug, #debug pre { margin: 4px; border: 1px dashed Black; font-family: monospace; font-size: 11px; display: block; background-color: #F63EF4; color: Black; }
.clearfix div { padding: 2px; }
/* 
A hack to display floated items within the content container
http://www.positioniseverything.net/easyclearing.html
*/
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
/* End hide from IE-mac */
/* cluetip global */
#cluetip-close img { border: 0; }
#cluetip-title #cluetip-close { float: right; position: relative; }
#cluetip-waitimage { width: 16px; height: 16px; position: absolute; background-image: url("../img/roller-loader.gif"); }
/***************************************
   =cluetipClass: 'default' 
-------------------------------------- */
.cluetip-default { background-color: White; }
.cluetip-default #cluetip-outer { position: relative; margin: 0; background-color: White; border: 1px solid #FF1D06; }
.cluetip-default h3#cluetip-title { margin: 0 0 5px; padding: 8px 10px 4px; font-size: 1.1em; font-weight: bold; background-color: #FF1D06; color: Black; border: none; }
.cluetip-default #cluetip-title a { color: Black; font-size: 0.95em; }
.cluetip-default #cluetip-inner { padding: 10px; }
.cluetip-default div#cluetip-close { text-align: right; margin: 0px 5px 5px; color: #900; }
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window { font: 12px Arial, Helvetica, sans-serif; color: #32080E; }
#TB_secondLine { font: 10px Arial, Helvetica, sans-serif; color: #666666; }
#TB_window a:link { color: #666666; }
#TB_window a:visited { color: #666666; }
#TB_window a:hover { color: #000; }
#TB_window a:active { color: #666666; }
#TB_window a:focus{ color: #666666; }
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay { position: fixed; z-index: 1000; top: 0px; left: 0px; background-color: #000; filter: alpha(opacity=75); -moz-opacity: 0.75; opacity: 0.75; height: 100%; width: 100%; }
* html #TB_overlay { /* ie6 hack */ position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); }
#TB_window { position: fixed; background: #ffffff; z-index: 1002; color: #000000; display: none; border: 4px solid #525252; text-align: left; top: 50%; left: 50%; }
* html #TB_window { /* ie6 hack */ position: absolute; margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px'); }
#TB_window img#TB_Image { display: block; margin: 15px 0 0 15px; border-right: 1px solid #FF1D06; border-bottom: 1px solid #FF1D06; border-top: 1px solid #FF1D06; border-left: 1px solid #FF1D06; }
#TB_caption{ height: 25px; padding: 7px 30px 10px 25px; float: left; }
#TB_closeWindow{ height: 25px; padding: 11px 25px 10px 0; float: right; }
#TB_closeAjaxWindow{ padding: 7px 10px 5px 0; margin-bottom: 1px; text-align: right; float: right; }
#TB_ajaxWindowTitle{ float: left; padding: 7px 0 5px 10px; margin-bottom: 1px; }
#TB_title{ background-color: #D2B48C; height: 27px; }
#TB_ajaxContent{ clear: both; padding: 2px 15px 15px 15px; overflow: auto; text-align: left; line-height: 1.4em; }
#TB_ajaxContent.TB_modal{ padding: 15px; }
#TB_ajaxContent p{ padding: 5px 0px 5px 0px; }
#TB_load{ position: fixed; display: none; height: 13px; width: 208px; z-index: 1003; top: 50%; left: 50%; margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */ }
* html #TB_load { /* ie6 hack */ position: absolute; margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px'); }
#TB_HideSelect{ z-index: 999; position: fixed; top: 0; left: 0; background-color: #fff; border: none; filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0; height: 100%; width: 100%; }
* html #TB_HideSelect { /* ie6 hack */ position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); }
#TB_iframeContent{ clear: both; border: none; margin-bottom: -1px; margin-top: 1px; _margin-bottom: 1px; }
/* autocomplete styles */
.ac_results { padding: 0px; border: 1px solid WindowFrame; background-color: Window; overflow: hidden; z-index: 99999; }
.ac_results ul { width: 100%; list-style-position: outside; list-style: none; padding: 0; margin: 0; }
.ac_results li { margin: 0px; padding: 2px 5px; cursor: default; display: block; width: 100%; font: menu; font-size: 12px; overflow: hidden; }
.ac_loading { background: Window url('../img/indicator.gif') right center no-repeat; }
.ac_over { background-color: Highlight; color: HighlightText; }
.ac_moreItems { text-align: center; background-color: InactiveCaption; color: InactiveCaptionText; margin: 0px; padding: 0px 5px; cursor: default; display: block; width: 100%; font: bold menu 12px; overflow: hidden; -moz-user-select: none; -khtml-user-select: none; }
/* Main Style Sheet for jQuery UI date picker */
#datepicker_div, .datepicker_inline { font-family: Arial, Helvetica, sans-serif; font-size: 14px; padding: 0; margin: 0; background: #ddd; width: 185px; }
#datepicker_div { display: none; border: 1px solid #777; z-index: 410; /*must have*/ }
.datepicker_inline { float: left; display: block; border: 0; }
.datepicker_dialog { padding: 5px !important; border: 4px ridge #ddd !important; }
button.datepicker_trigger { width: 25px; }
img.datepicker_trigger { margin: 2px; vertical-align: middle; }
.datepicker_prompt { float: left; padding: 2px; background: #ddd; color: #000; }
* html .datepicker_prompt { width: 185px; }
.datepicker_control, .datepicker_links, .datepicker_header, .datepicker { clear: both; float: left; width: 100%; color: #fff; }
.datepicker_control { background: #400; padding: 2px 0px; }
.datepicker_links { background: #000; padding: 2px 0px; }
.datepicker_control, .datepicker_links { font-weight: bold; font-size: 80%; letter-spacing: 1px; }
.datepicker_links label { /* disabled links */ padding: 2px 5px; color: #888; }
.datepicker_clear, .datepicker_prev { float: left; width: 34%; }
.datepicker_current { float: left; width: 30%; text-align: center; }
.datepicker_close, .datepicker_next { float: right; width: 34%; text-align: right; }
.datepicker_header { padding: 1px 0 3px; background: #A9A9A9; text-align: center; font-weight: bold; height: 1.3em; }
.datepicker_header select { background: #A9A9A9; color: #fff; border: 0px; font-weight: bold; width: auto; margin: 0; padding: 0; }
.datepicker { background: #ccc; text-align: center; font-size: 100%; }
.datepicker a { display: block; width: 100%; }
.datepicker_titleRow { background: #000000; }
.datepicker_daysRow { background: #eee; color: #666; }
.datepicker_weekCol { background: #777; color: #fff; }
.datepicker_daysCell { color: #000; border: 1px solid #ddd; }
.datepicker_daysCell a{ display: block; }
.datepicker_weekEndCell { background: #ddd; }
.datepicker_daysCellOver { background: #fff; border: 1px solid #777; }
.datepicker_unselectable { color: #888; }
.datepicker_today { background: #fcc !important; }
.datepicker_currentDay { background: #FF1D06 !important; }
.datepicker_status { background: #ddd; width: 100%; font-size: 80%; text-align: center; }
/* ________ Datepicker Links _______
** Reset link properties and then override them with !important */
#datepicker_div a, .datepicker_inline a { cursor: pointer; margin: 0; padding: 0; background: none; color: #000; }
.datepicker_inline .datepicker_links a { padding: 0 5px !important; }
.datepicker_control a, .datepicker_links a { padding: 2px 5px !important; color: #eee !important; }
.datepicker_titleRow a { color: #010101 !important; }
.datepicker_control a:hover { background: #fdd !important; color: #333 !important; }
.datepicker_links a:hover, .datepicker_titleRow a:hover { background: #ddd !important; color: #333 !important; }
/* ___________ MULTIPLE MONTHS _________*/
.datepicker_multi .datepicker { border: 1px solid #777; }
.datepicker_oneMonth { float: left; width: 185px; }
.datepicker_newRow { clear: left; }
/* ___________ IE6 IFRAME FIX ________ */
.datepicker_cover { display: none; /*sorry for IE5*/ display: block; /*sorry for IE5*/ position: absolute; /*must have*/ z-index: -1; /*must have*/ filter: mask(); /*must have*/ top: -4px; /*must have*/ left: -4px; /*must have*/ width: 200px; /*must have*/ height: 200px; /*must have*/ }
/* WYMeditor */
/* PARA: Date */
.date p /* p */ { color: #ccf; /* background-color: #ff9; border: 2px solid #ee9; */ }
/* PARA: Hidden note */
.hidden-note p /* p[@class!="important"] */ { display: none; /* color: #999; border: 2px solid #ccc; */ }
/* PARA: Important */
.important p /* p[@class!="hidden-note"] */ { color: red; font-weight: bold; /* color: red; font-weight: bold; border: 2px solid red; */ }
/* IMAGE: Border */
.border img /* img */ { border: 1px solid #ccc; /* border: 4px solid #ccc; */ }
/* LIST: Special */
.special ul,
.special ol /* ul,ol */ { color: green; /* background-color: #fc9; border: 2px solid red; */ }
/* /WYMeditor */
div.gvIIContainer { position: relative; padding: 10px 0 10px 10px; }
.gvIIContainer .gvIIImgContainer img{ margin-left: 0; margin-top: 0; }
div.gvIIAltText{ position: absolute; right: 0; top: 0; background: #000; border: 1px solid #fff; color: #fff; padding: 5px; }
.gvIIContainer .gvIIImgContainer{ height: 385px; position: relative; overflow: hidden; margin-bottom: 10px; }
.gvIIContainer .gvIIImgContainer .gvIILoader{ background: url("../img/roller-loader.gif") no-repeat center center; width: 16px; height: 16px; display: none; }
.gvIIContainer .gvIIHolder{ position: relative; height: 207px; overflow: auto; }
.gvIIContainer .gvIIHolder .gvIIArrow{ }
.gvIIContainer .gvIIHolder div.gvIIItem { float: left; height: 55px; width: 72px; border: 5px solid #fff; margin: 2px; position: relative; overflow: hidden; border: 1px solid #FF1D06; padding: 0px; }
.gvIIContainer .gvIIHolder .gvIIItem .gvIIFlash{ background: #fff; position: absolute; top: 0; left: 0; height: 55px; width: 72px; cursor: pointer; }
.gvIIContainer .gvIIHolder .gvIIItem img{ position: absolute; top: 0; left: 0; padding: 0; margin: 0; margin-left: 0; margin-top: 0; border: none; cursor: pointer; }