/*
 * ----------------------------------------------------------------------------
 * 'keyfonics' style sheet for CSS2-capable browsers.
 *       Derived from the gumax skin by Paul Gu
 *
 * @Version 1.0.0
 * @Author Mark Stubbs, <mstubbs@keyfonics.com>
 * @License: GPL (http://www.gnu.org/copyleft/gpl.html)
 *
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License along
 * with this program; if not, write to the Free Software Foundation, Inc.,
 * 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
 * http://www.gnu.org/copyleft/gpl.html
 *
 * ---------------------------------------------------------------------------- */
body, td, th, input, textarea, pre, h1, h2, h3, h4, h5, h6 {
    color: #222;
}

body, td, th, input, textarea {
    font-family: 'Trebuchet MS', Verdana, Sans-serif, Arial, 'Times New Roman';
}

body {
    font-size: 12px;
    margin: 0;
    padding: 0;
    min-width: 740px;
    background: #5C9FCB none;
}

#keyfonics-rbox {
	margin-left: auto;
	margin-right: auto;
    width: 977px; /* width of the web page */
}

#keyfonics-page, #keyfonics-page-actions, #keyfonics-page-footer {
    max-width: 100% !important; /* need for Firefox */
    width: 100%; /* need for IE6 win */
    padding: 0;
    margin: 0 auto;
}

#keyfonics-page, #keyfonics-page-actions {
    background: #fff;
}

#keyfonics-page-footer {
    background: #fff;
}
/*
 * Don't display the Home title on Home page
 */
.page-Home .firstHeading {
    display: none;
}

div#keyfonics-p-login li#keyfonics-pt-userpage a {
    color: white;
    font-weight: bold;
}
/* Logo properties and style
 -----------------------------------------------------------------------------*/
#p-logo {
    display: none; /* disable default wiki logo */
}

#p-logo, #p-logo a, #p-logo a:hover {
    width: 180px;
    height: 72px;
}

#p-logo {
    z-index: 200;
    position: absolute; /*needed to use z-index */
    top: 0px;
    left: 15px; /* left margin of the logo, which is same as content margin */
    overflow: visible;
}

#p-logo h5 {
    display: none;
}

#p-logo a, #p-logo a:hover {
    display: block;
    background-repeat: no-repeat;
    background-position: 35% 50% !important;
    text-decoration: none;
}
/* Header Style
 -----------------------------------------------------------------------------*/
#keyfonics-header {
    position: relative;
    z-index: 100; /* make logo visible over content*/
    border: none;
    min-height: 45px; /* height of header */
    height: 45px; /* need for IE */
    margin: 0px auto;
    padding-bottom: 4px;
    background: #000000; /* header background */
}
/* --- keyfonics date time --- */
#keyfonics-p-date, #today {
    position: absolute;
    top: 25px; /* located at bottom right of header */
    left: 10px; /* located at bottom right of header, same as content margin */
    color: #999;
}
/* --- Login --- */
#keyfonics-p-login {
    background: none;
    margin-left: 0;
    padding-left: 0;
    text-transform: none;
}

#keyfonics-p-login {
    position: absolute;
    top: 0; /* located at bottom right of header */
    right: 0; /* located at bottom right of header, same as content margin */
    margin-top: 2px;
}

#keyfonics-p-login ul {
    position: relative;
    width: auto;
    list-style: none;
    z-index: 90; /* below the H1 */
    margin: 0 10px; /* left and right margin of the list */
}

#keyfonics-p-login li {
    position: relative;
    display: inline; /* display in line  */
    margin: 0;
    color: #777; /* color of "|" */
    font-size: 90%; /* font size of items */
}

#keyfonics-p-login li.active a {
    color: white;
    background-color: #6C6B6D;
}

#keyfonics-p-login ul li a {
    margin: 0;
    padding: 0 2px; /* margin betwen items */
}
/* --- Search --- */
#keyfonics-p-search {
    position: absolute;
    z-index: 3;
    right: 0; /* located at top right of header */
    top: 21px; /* located at top right of header */
		border: none;
}

#keyfonics-p-search .keyfonics-pBody, #keyfonics-searchBody {
    background: none;
    position: relative;
    padding: 0;
    margin-right: 10px; /* right side margin of search, same as content margin */
    text-align: left;
    white-space: nowrap; /* for Opera */
}

#keyfonics-p-search form #searchInput, #pwdInput {
    font-size: 100%;
    width: 15em; /* text field width */
    text-align: left;
    vertical-align: middle;
    border: 1px solid #777; /* text field border style */
    background: #ccc; /* background color of the text field */
}

#keyfonics-header form #searchInput:hover, #keyfonics-header form #searchInput:focus, #pwdInput:hover, #pwdInput:focus {
    background: #fff;
}

#keyfonics-p-search form #searchGoButton, #keyfonics-p-search form #mw-searchButton {
    font-family: Verdana, Sans-serif, Arial;
    vertical-align: middle;
    background: #000; /* button background */
    color: #ccc; /* font color */
    border: 1px outset #777; /* border: 1px inset #777; */
    text-decoration: none;
}
/* Dynamic site logo style */
#keyfonics-site-logo, #keyfonics-site-logo a, #keyfonics-site-logo a:hover {
    height: 110px;
    min-height: 110px; /* height of header */
    display: block;
    background-repeat: no-repeat;
    text-decoration: none;
}

#keyfonics-site-logo {
    background: #2f2e2d;
    border-top: 1px solid #aaa;
    padding: 0;
    margin: 0px;
    position: relative;
}
/* main content and navigation style */
#keyfonics-content-body {
    padding: 0;
    margin: 0;
}

#keyfonics-content-body, #keyfonics-content-body-table {
    background: #fff; /* content background color */
    width: 100%;
		min-height: 220px;
}

#keyfonics-content-body-table {
    border-collapse: collapse;
    border: 1px solid #ddd;
    border-top: none;
}

table#keyfonics-content-body-table {
    table-layout: fixed; /* IE fix */
}

#keyfonics-content-body .keyfonics-content-left {
    vertical-align: top;
    width: 165px; /* navigation menu width */
}

#keyfonics-content-body .keyfonics-content-right { /* content width */
    vertical-align: top;
}
/*--- Navigation --- */
#keyfonics-p-navigation-wrapper {
}

#keyfonics-p-navigation {
    border: none;
    margin: 0;
    padding: 0;
		background-color: #F8F8F8;
    width: 100%;
}
/* Menu title style */
.keyfonics-portlet {
    border: 1px solid #AAAAAA;
}

.keyfonics-portlet h5 {
    background: #E0EAF1;
    border-bottom: none;
    color: #555;
    margin: 1px 1px 0px 1px;
		padding: 0.1em 0pt 0.2em 5px;
    text-transform: capitalize;
    font-size: 100%;
    font-weight: bold;
    font-family: Verdana, 'Trebuchet MS';
}

#keyfonics-p-navigation ul {
    margin: 0;
    padding: 0;
}

#keyfonics-p-navigation ul li {
    border-top: 1px solid #ddd;
    margin: 0;
    font-weight: bold; /* the font weight of '|' */
    font-size: 95%; /* the font size of the navigation menu: normal text */
    color: #7FBAFF; /* the font color of '|' */
    list-style-image: none;
    list-style: none;
}

#keyfonics-p-navigation ul li a {
    margin: 0;
    padding: 0 0 0 0.6em;
		width: 156px; /* IE */
    font-size: 11px; /* the font size of the navigation menu: link text */
    font-weight: normal;
    font-family: Verdana, 'Trebuchet MS';
}
/* Powerby & copyright --- */
#keyfonics-powerby-copyright {
    display: none;
}

#keyfonics-powerby-copyright ul {
    margin: 0;
    padding: 0;
}

#keyfonics-powerby-copyright ul li {
    list-style-image: none;
    list-style: none;
    margin-bottom: 0.2em;
}

#keyfonics-f-paulgublogicon img, #keyfonics-f-designedbyicon img {
    border: none;
}

#keyfonics-f-poweredbyico {
    /* border: 2px solid black; /* for testing */
    /* display: inline; /* minimum size of the div */
}

#keyfonics-f-copyrightico {
    /* display: inline; /* minimum size of the div */
}
/*
 * --- content style ---
 */
#content {
    border: 1px solid #aaa;
    background: #fff;
    margin: 0;
    padding: 0px 15px 10px 15px; /* margin of the main content */
    /* position: relative !important;  */
    position: static; /* need for IE positioning problem */
    z-index: 2;
    clear: both;
    color: black;
    line-height: 1.4em; /* value other than 'normal' needed for WinIE */
    overflow-x: visible; /* need for Firefox, extreme long string :( */
}
/*
 * --- content page title format ---
 */
#content .firstHeading {
    font-size: 150%;
    color: #3687C3;
    font-weight: bolder;
    padding: 1em 0 .2em 0; /* position of the title */
    border: none; /* No border for page title */
    text-transform: capitalize;
}

#bodyContent {
    width: 100%;
}
/*
 * --- AJax search style ---
 */
div#searchTargetContainer {
    left: 0px;
    top: 0px;
    width: 100%;
    background: white;
    overflow-x: visible; /* need for Firefox, extreme long string :( */
    word-wrap: break-word; /* need for IE, extreme long string :( */
}

div#searchTarget {
    padding: 10px;
    margin: 5px;
    background: #fefefe;
    border: solid 1px #FFCC00;
}

div#searchTarget h2 {
    padding-top: 1em;
    margin-bottom: .5em;
}

div#searchTarget a {
    position: relative;
    z-index: 300; /* fix the hide link button */
}

#keyfonics {
    clear: both;
    overflow: hidden;
    white-space: nowrap;
    border-collapse: collapse;
}
/*
 * --- table of content styles ---
 */
#toc, .toc, .mw-warning {
    position: absolute;
    top: 400px;
    left: 17px;
    width: 165px;
    font-size: 11px;
    background-color:#F8F8F8;
    padding: 0px;
    border-collapse: collapse;
}

#toc h2, .toc h2 {
    font-size: 12px;
    border: none;
    margin: 0; /* fix toc top margin */
    display: inline; /* display the hide/show link after Contents */
}

#toc #toctitle, .toc #toctitle, #toc .toctitle, .toc .toctitle {
    font-family: Verdana, 'Trebuchet MS';
    text-align: left;
    color: #555555;
    background-color: #E0EAF1;
    padding: 0.1em 0pt 0.2em 5px;
}

#toc #toctitle h2, .toc #toctitle h2, #toc .toctitle h2, .toc .toctitle h2 {
    color: #555555;
}

#toc ul, .toc ul {
    font-family: Verdana, 'Trebuchet MS';
    list-style-type: none;
    list-style-image: none;
    margin: 0;
    padding: 0;
    text-align: left;
}

#toc ul ul, .toc ul ul {
		margin: 0pt 0pt 0pt 8px;
}

#toc:hover li.toclevel-1 a, .toc:hover li.toclevel-1 a {
	width:400px;
}

li.toclevel-1 a {
    display: block;
		width: 146px;
    overflow: hidden;
    font-weight: normal;
		height: 1.6em;
		white-space:nowrap;
   	text-overflow:ellipsis;
}

li.toclevel-1 a span.toctext {
	color: #606060;
	margin-top: 4px;
	font-weight: bold;
}

li.toclevel-1 a:hover {
    text-decoration: none;
    background-color: #DBE9F3;
}

li.toclevel-2 a {
	width: 136px;
}

li.toclevel-2 a span.toctext {
	color: #808080;
	font-weight: normal;
}

li.toclevel-3 a {
	width: 125px;
}

#toc ul li {
	margin-top: 3px;
}

#toc ul ul li {
    margin: 0px;
    border-top: 1px solid #dddddd;
}

#toc span.tocnumber, #toctitle span.toctoggle {
    display: none;
}

#toc .tocindent {
    margin-left: 1em;
}

#toc .tocline {
    margin-bottom: 0;
}

#toc p {
    margin: 0
}

#toc .editsection {
    margin-top: .3em;
    font-size: 90%;
}
/*
 * --- body content ---
 */
h1, h2 {
    padding: .3em 0;
    border-bottom: 3px solid #ccc;
}

ul {
    margin: .3em 0 0 1.5em;
    list-style-image: url(arrow.png);
}

li {
    margin-left: .5em;
    margin-bottom: .1em;
    padding: 0; /* margin between bullet and content */
}

#editform {
    width: 100%; /* prevent overflow in IE when editing */
}

textarea {
    font-size: 100%;
    width: 99%; /* fix the textarea oversize in IE */
    padding: 5px 0 0 5px;
    margin: 0;
    border: 1px solid #3399FF;
}

pre {
    white-space: pre; /* CSS2 */
    white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -hp-pre-wrap; /* HP printers */
    white-space: -o-pre-wrap; /* Opera 7 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: pre-wrap; /* CSS 2.1 */
    white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
    word-wrap: break-word; /* IE */
    font-family: 'Courier New', Courier, monospace;
    overflow-x: auto; /* need for Firefox, extreme long string :( */
    padding: 1em 2em;
    border: 1px dotted #5C9FCB;
    color: black;
    background: #F4F4F4;
    line-height: 1.5em;
}

.visualClear {
    clear: both;
}

.errorbox, .successbox {
    margin-top: .2em;
    margin-bottom: 1em;
}

#contentSub, #contentSub2 {
    font-size: 90%;
    line-height: 1.2em;
    margin: 0.5em 0 1.4em 0;
    color: #7d7d7d;
    width: auto;
}

.backToTop {
    /* border: 1px solid #aaa; /* for testing */
    /* float: right; */
    /* width: 45px; */
    /* background: transparent url('images/top.gif') center left no-repeat ; */
    /* margin: .6em 0 0 0; */
}

.backToTop a, .backToTop a:hover {
    display: block;
    width: 45px;
    text-decoration: none;
}

table {
    /* border-collapse: collapse; */
}
/* edit section
 -----------------------------------------------------------------------------*/
* html div.editsection {
    font-size: 90%;
}

.editsection {
    font-size: 90%;
    margin-top: 2px;
    /* padding-left: 16px; */
    /* background: transparent url('edit.png') center left no-repeat ; */
}
/* category style
 -----------------------------------------------------------------------------*/
#catlinks {
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    padding: .3em;
    margin-top: 1em;
    clear: both;
}

#catlinks p, .catlinks {
    margin: 0;
    padding: 0;
}
/* content action
 -----------------------------------------------------------------------------*/
/*
 * --- content actions  ---
 */
#keyfonics-page-actions {
}

#keyfonics-content-actions {
    border: 1px solid #bbb;
    border-top: none;
    background: #ddd;
    margin-left: 169px;
    margin-right: 3px;
}

* html #keyfonics-content-actions {
    /* margin-left:  170px; /* IE hack */
}

#keyfonics-content-actions {
    text-align: right;
    height: 1.5em; /* need for IE win */
    font-size: 100%; /* font size of content actions */
    padding: 2px 20px;
    /* padding-left:  167px; /**/
}

#keyfonics-content-actions ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#keyfonics-content-actions li {
    display: inline; /* display in line */
    overflow: visible;
    color: #777; /* the font color of '|' */
    margin: 0 -2px; /* This gets rid of gap between li */
    padding: 0;
    list-style: none;
}

#keyfonics-content-actions ul li a {
    padding: 3px 7px; /* padding of the menu item */
}
/* Page footer
 -----------------------------------------------------------------------------*/
#keyfonics-page-footer {
    /* border:  1px solid #000; /* for testing */
}

#keyfonics-page-footer {
    text-align: right;
}

#keyfonics-page-footer li {
    display: inline;
    margin: 0;
}

#keyfonics-personal-tools, #keyfonics-personal-tools ul li, #keyfonics-footer, #keyfonics-footer ul li, #keyfonics-f-message, #keyfonics-f-message ul li {
    font-size: 90%; /* font size of page footer */
}

#keyfonics-personal-tools, #keyfonics-footer {
    padding-right: 20px;
}

#keyfonics-personal-tools {
    margin: 0;
    padding-top: .7em;
    padding-bottom: .2em;
}

#keyfonics-personal-tools ul {
    list-style: none;
    margin: 0;
}

#keyfonics-personal-tools li {
    display: inline;
    margin: 0;
    overflow: visible;
    color: #aaa; /* the font color of '|' */
}

#keyfonics-personal-tools ul li a {
    padding: 0 2px; /* padding of the menu item */
}
/*
 * --- keyfonics-footer ---
 */
#keyfonics-footer {
    clear: both;
    border: 0; /* 1px solid #999; */
    padding-top: .1em;
    padding-bottom: 1.1em;
}

#keyfonics-footer ul {
    list-style: none;
    margin: 0;
}

#keyfonics-footer li {
    display: inline;
    margin: 0;
    white-space: nowrap;
    color: #aaa; /* the font color of '|' */
}

#keyfonics-footer ul li a {
    padding: 0 2px; /* padding of the menu item */
}

#keyfonics-f-message {
    padding: 0 2px .2em 2px;
}
/* breadcrumbs
 -----------------------------------------------------------------------------*/
div.breadcrumbs {
    border: solid #FFCC00 1px;
    padding: 3px 5px 5px 5px;
    background: #FFF5CF;
    margin: 5px 0px 10px 0px;
}

div.breadcrumbs a.breadcrumbs {
    text-decoration: none;
}

div.breadcrumbs span.breadcrumbs {
    font-weight: bold;
}
/* Special:Specialpages
 -----------------------------------------------------------------------------*/
#allmessagestable { /* system message table fix */
    table-layout: fixed;
    width: 100%;
    max-width: 100%;
    margin-top: 20px;
}

#allmessagestable.left td {
    width: 30%;
}

table.imagelist, table.TablePager { /* image list table fix */
    /* table-layout: fixed; /**/
    width: 100%;
    max-width: 100%;
    margin-top: 0.3em;
}

.TablePager td, .TablePager th {
    border: 1px solid #777777;
}

.imagelist td, .imagelist th {
    white-space: normal;
}
/* remove line wrapping for TablePager_col_links */
.imagelist .TablePager_col_links {
    white-space: nowrap;
}

table.gallery { /* file gallery fix */
    margin: 2px 0;
    padding: 2px 0;
}

div.gallerybox {
    margin: 2px 1px;
    width: 125px;
}

div.gallerybox div.thumb {
    margin: 2px 0;
}

div.gallerybox img {
    /*width: 110px; /**/
}
/* Random HTML Style
 -----------------------------------------------------------------------------*/
hr {
    height: 1px;
    color: #aaa;
    background-color: #aaa;
    border: 0;
    margin: .2em 0 .2em 0;
}

input
[ type = "submit" ] {
    font-weight: bold;
}
/* for margin between paragraphs */
.cc {
    font-size: 10%;
    padding: 0.2em 0 0.2em 0;
    margin: 0;
}
/*-------------------------------------
 <div class="cc">&nbsp;</div>
 -------------------------------------*/
/*
 * Force Opera / Moz / Netscape
 * to display an _IN_active vertical scrollbar
 * (like IE).
 */
html {
    overflow-y: scroll;
}
/* -----------------------------------------------------------
 -- make a few corners round --
 only supported by moz/firefox/other gecko browsers for now
 -----------------------------------------------------------
 */
div.breadcrumbs {
    -moz-border-radius-topleft: 0.5em;
    -moz-border-radius-topright: 0.5em;
    -moz-border-radius-bottomleft: 0.5em;
    -moz-border-radius-bottomright: 0.5em;
}
/* IE/Mac fixes
 -----------------------------------------------------------------------------*/
/* fix for position of image inside table */
table {
    /* position: none !important;  /* positioning, except IE */
    /* position: relative;         /* positioning for IE */
}
/* the positioning of preferences */
/* float/negative margin brokenness */
* html #preferences {
    width: 90%;
}
/* login form fix */
div#userloginForm form, form#userlogin2 {
    width: 500px;
}
/* Google Map
 -----------------------------------------------------------------------------*/
#google_maps_show_link, #google_maps_toggle_link {
    /* border:  1px solid #CC0033; /* for testing */
    font-size: 120%;
    display: inline;
    float: right;
    padding: 0 0 2px 0;
}
/* The end
 -----------------------------------------------------------------------------*/