/**
 * A nice centered 2-column layout inspired by Joi Ito's web site
 *
 * @link http://joi.ito.com/
 * @link http://www.webmasterworld.com/forum83/6950.htm Make input have different width for submit buttons and text fields
 *
 * This single style sheet takes care of all media (screen, handheld, print, etc.)
 *
 * This style sheet has been checked against Mozilla Firefox version 1 and Microsoft Internet Explorer version 6.
 * You may have to split this file into several pieces to avoid side-effects on legacy browsers such as Netscape navigator 4.7, etc.
 *
 * Styles are ordered according to following list:
 * - standard HTML and XHTML tags are refined
 * - unique styles used for page layout
 * - other unique styles
 * - classes
 *
 * For contextual rules, uniqueness comes before classes.
 * This means that '#main_panel code' and '#main_panel a.article' are placed into the second section.
 * And 'p.menu_bar' is in the last section.
 *
 * Where applicable we have also mentioned the YACS codes related to styles.
 * You can find more information on YACS codes at codes/codes.php and related pages.
 *
 * @author Bernard Paques [email]bernard.paques@bigfoot.com[/email]
 * @license http://www.gnu.org/copyleft/lesser.txt GNU Lesser General Public License
 */

/**
 * standard tags - redefine behaviour of reference HTML and XHTML tags
 * to ensure that all browsers will be aligned
 */

a,
a code { /* basic link */
	text-decoration: none;
}

a:link,
a:link code { /* link displayed for the first time */
	color: #06F;
}

a:visited,
a:visited code { /* link that has been used at least once */
	color: #03c;
}

a:active,
a:active code { /* link at the moment it is clicked */
	color: #f00;
}

a:hover,
a:hover code { /* link below the mouse pointer */
	color: #f60;
}

a img { /* avoid borders around images used as links */
	border: none;
}

acronym { /* help in a popup -- [hint]...[/hint] */
	border-bottom: 1px dotted #ccc;
	cursor: help;
}

address { /* a author profile towards the end of the main panel -- see articles/view.php */
	display: block;
	color: #666666;
	font-weight: normal;
	line-height: 1.2em;
	background-color: #fff;
	margin: 6px 0 5px 0;
	padding: 6px;
	border: 1px solid #bfbfbf;
}

b { /* bold -- [b]...[/b] */
}

body { /* most elements will inherit some of these attributes */
	margin: 0px 0px 20px 0px;
	color: #56234B;
	background-color: #ffffff;
	font-family: Verdana, Arial, sans-serif;
	font-size: small;
	text-align: center; /* to make IE center everything */
}

* html body { /* align IE PC with other browsers */
	font-size: x-small;
}

blockquote { /* someone has been cited -- [quote]...[/quote] */
	border-left: 2px solid #bfbfbf;
	margin: 0;
	padding: 0 0 0 3px;
}

@media screen { /* not on printers */

	blockquote { /* prefix quotes with a nice image */
		padding-left: 25px;
		background: url('images/left_quote.gif') top left no-repeat;
		border: none;
	}

	blockquote .quote_prefix span { /* instead of the bare quote char */
		display: none;
	}
}

br { /* new line -- [nl] */
}

center { /* is this one deprecated? -- [center]...[/center] */
}

code { /* some code sample -- [code]...[/code] */
	font-family: 'Courier New', Courier, monospace;
	font-size: 1em;
}

del { /* deleted -- [deleted]...[/deleted] */
}

form { /* inline rendering for all browsers */
	margin: 0;
	padding: 0;
}

h1 { /* appears only once, with the page title */
	color: green;
	font-size: medium;
	font-weight: bold;
	margin: 0 0 4px 0;
	padding: 0;
	text-shadow: #999 2px 2px 2px;
}

* html h1 { /* align IE PC with other browsers */
	font-size: small;
}

h2 { /* appears in the main content panel, to introduce sections of the page -- [title]...[/title], [question]...[/question] */
	clear: left;
	color: green;
	font-weight: bold;
	font-size: small;
	font-style: normal;
	color: green;
	margin: 20px 0 2px 0;
	border: none;
	text-shadow: 1px 1px 2px #666;
	padding: 0;
}

* html h2 { /* align IE PC with other browsers */
	font-size: x-small;
}

h3 { /* a second level of heading in the main panel -- [subtitle]...[/subtitle] */
	color: green;
	font-weight: bold;
	font-size: x-small;
	font-style: normal;
	margin: 20px 0 2px 0;
	padding: 0 0 2px 0;
	text-shadow: none;
	border-bottom: 1px dotted #ccc;
}

* html h3 { /* align IE PC with other browsers */
	font-size: xx-small;
}

hr { /* an ordinary horizontal rule --- [---], [___] */
	height: 0px;
	border-width: 1px;
	border-color: #888;
	border-style: none none dotted none;
}

i { /* italic -- [i]...[/i] */
}

img { /* a standard image */
	margin: 0;
	padding: 0;
}

input[type='password'],
input[type='text'] { /* ensure form fields fit in the layout */
	max-width: 300px;
}

* html input { /* ensure form fields fit in the layout, the ie case */
	max-width: expression(this.type=='text'? '300px' : 'auto');
}

ins { /* inserted -- [inserted]...[/inserted] */
}

li { /* avoid justification alignment */
	text-align: left;
}

marquee { /* horizontal scroller -- [scroller]...[/scroller] */
}

ol { /* a numbered list -- [list=1]...[/list], [list=a]...[/list], [list=A]...[/list], [list=i]...[/list], [list=I]...[/list] */
	margin: 0.5em 0 1em 1em;
	padding: 0 0 0 1em;
}

p { /* add a space after each paragraph */
	margin: 0 0 0.75em 0;
	padding: 0;
}

#footer_panel p { /* in the footer, make top and bottom spaces look equal */
	margin: 0 0 0.25em 0;
}

pre { /* a block of sample lines -- [php]...[/php], [snippet]...[/snippet] */
	font-family: 'Courier New', Courier, monospace;
	font-size: 0.9em;
	background-color: #f7f7f7;
	padding: 4px;
	border-right: 1px solid #888;
	border-bottom: 1px solid #888;
}

sub { /* shifted down -- [subscript]...[/subscript] */
}

sup { /* shifted up -- [superscript]...[/superscript] */
}

table { /* an ordinary table -- [table]...[/table] */
	border-spacing: 0;
	border-collapse: separate;
	border-bottom: 1px solid #bfbfbf;
	border-right: 1px solid #bfbfbf;
	max-width: 530px;
	margin: 0;
	padding: 0;
}

td { /* an ordinary cell */
	font-size: x-small;
	border-top: 1px solid #bfbfbf;
	border-left: 1px solid #bfbfbf;
	margin: 0;
	padding: 4px;
	vertical-align: top;
   text-align: left;
}

* html td { /* align IE PC with other browsers */
	font-size: xx-small;
}

textarea { /* ensure form fields fit in the layout */
	max-width: 400px;
}

th { /* an ordinary table header -- headers in [table]headers[body]content[/table] */
	font-size: x-small;
	text-align: left;
	border-top: 1px solid #bfbfbf;
	border-left: 1px solid #bfbfbf;
	margin: 0;
	padding: 4px;
	background-color: rgb(255, 255, 240);
}

* html th { /* align IE PC with other browsers */
	font-size: xx-small;
}

u { /* underlined -- [u]...[/u] */
}

ul { /* an ordinary list -- [list]...[/list] */
	margin: 0.5em 0 1em 1em;
	padding: 0 0 0 1em;
	list-style: square;
}

/**
 * layout elements - also add behaviour for related sub-elements where applicable
 */

#footer_panel { /* comes after everything */
	clear: both;
	margin: 60px 0 0 0;
	padding: 6px;
	color: #036;
	background: #e6e6e6;
	border: 1px solid #ccc;
	font-weight: normal;
	font-size: x-small;
	text-align: center;
}

* html #footer_panel { /* align IE PC with other browsers */
	font-size: xx-small;
}

@media print { /* do not print footer information */

	#footer_panel {
		display: none;
	}

}

#header_panel { /* comes before everything */
	background-image: url('images/cartouche13.jpg');
	text-align: left;
	padding: 0;
	margin: 0 0 7px 0;
	border-bottom: 2px ridge #B69430;
	height: 120px;
}

@media print { /* do not print heading information */

	#header_panel {
		display: none;
	}

}

@media screen { /* only on a wide screen */

	#main_panel { /* where the actual content is */
		float: left;
		width: 750px;
		margin: 0;
		padding: 0 0 0 4px;
		overflow: hidden;
		text-align: justify;
	}

	#main_panel a code { /* next rule do not impact links (eg, <code> in [toc]) */
		background-color: transparent;
	}

	#main_panel code { /* make code more visual */
		background-color: tansparent;
	}

	#main_panel pre code { /* use block attributes instead of in-line attributes */
		background-color: #f7f7f7;
		margin: 0;
		padding: 0;
	}

}

#side_panel { /* complementary information related to this page */
	float: right;
	width: 200px;
	overflow: hidden;
}

@media print { /* do not print complementary information */

	#side_panel {
		display: none;
	}

}

#side_panel dl { /* actually, a box on the side panel */
	margin: 0;
	padding: 0;
}

#side_panel dl dd { /* body of one side box */
	color: #666666;
	font-weight: normal;
	font-size: 8pt;
	line-height: 1.2em;
	background-color: #fff;
	margin: 0 0 5px 0;
	padding: 6px;
	border: 1px solid #CDC3CE;
}

#side_panel dl dd ul { /* a list in a side box */
	margin: 0 0 0 0.5em;
	padding: 0 0 0 1em; /* ok under IE, too much under firefox... */
	list-style-type: disc;
}

#side_panel dl dd ul li { /* space between links in a side box */
	margin: 0 0 3px 0;
	padding: 0;
}

#side_panel dt { /* used for titles of various boxes */
	color: #fff;
	background-color: #CDC3CE;
	font-weight: bold;
	font-size: 8pt;
	text-align: left;
	margin: 5px 0 0 0;
	padding: 2px 0px 2px 4px;
	border-top: 1px solid #CDC3CE;
	border-left: 1px solid #CDC3CE;
	border-right: 1px solid #CDC3CE;
}

#wrapper { /* compensate for center alignment in outside container */
	text-align: left;
}

@media screen { /* on large screen */

	#wrapper { /* limit the horizontal size of everything, and center it in the page */
		margin-right: auto;
		margin-left: auto;
		padding: 0px;
		width: 1024px;
		background: white;
	}

}

/**
 * unique elements - may appear in one or several pages
 */

dl#categories dd ul { /* categories related to an article, on page side -- articles/view.php */
	margin: 0;
	padding: 0;
	list-style: none;
}

dl#categories dd ul li { /* space between links */
	margin: 0 0 4px 0;
	padding: 0;
}

p#crumbs { /* path to this page -- see template script */
	font-size: 7pt; /* we accept IE don't resize */
	padding: 0;
	margin: 0 0 20px 0;
}

@media print { /* do not print context information */
	p#crumbs {
		display: none;
	}
}

/* two gadget boxes per row -- look at index.php and sections/view.php  */

dl#gadget_1.gadget_box dd { /* content of gadget box #1 */
	border-top: 2px solid #CDC3CE;
	padding: 3px 0 0 0;
}

dl#gadget_1.gadget_box dt { /* header of gadget box #1 */
}

dl#gadget_2.gadget_box dd { /* content of gadget box #2 */
	border-right: 2px solid #CDC3CE;
	padding: 0 3px 0 0;
}

dl#gadget_2.gadget_box dt { /* header of gadget box #2 */
}

dl#gadget_3.gadget_box { /* new line for gadget box #3 */
	clear: left;
}

dl#gadget_3.gadget_box dd { /* content of gadget box #3 */
	border-left: 2px solid #CDC3CE;
	padding: 0 0 0 3px;
}

dl#gadget_3.gadget_box dt { /* header of gadget box #3 */
}

dl#gadget_4.gadget_box dd { /* content of gadget box #4 */
	border-bottom: 2px solid #CDC3CE;
	padding: 0 0 5px 0;
}

dl#gadget_4.gadget_box dt { /* header of gadget box #4 */
}

dl#gadget_5.gadget_box { /* new line for gadget box #5 */
	clear: left;
}

dl#gadget_5.gadget_box dd { /* content of gadget box #5 */
	border-left: 2px solid #CDC3CE;
	padding: 0 0 0 3px;
}

dl#gadget_5.gadget_box dt { /* header of gadget box #5 */
}

dl#gadget_6.gadget_box dd { /* content of gadget box #6 */
	border-bottom: 2px solid #CDC3CE;
	padding: 0 0 5px 0;
}

dl#gadget_6.gadget_box dt { /* header of gadget box #6 */
}

#gadgets_prefix { /* comes before gadget boxes */
	clear: left; /* align properly after site map, if any */
	margin: 0;
	padding: 0;
}

#gadgets_suffix { /* comes after gadget boxes */
	clear: left; /* compensate for left-floated boxes */
	margin: 0; /* ignored by firefox anyway */
	padding: 0 0 2em 0; /* make some room after gadget boxes */
}

#header_slogan { /* appears towards the top of the page -- see template script */
	float: left;
	clear: left;
	margin: 0 0 0 15px;
	padding: 0;
	font-size: 12pt; /* we don't care to be not resized by IE */
	color: white;
	font-weight: bold;
	text-align: left;
}

#header_title { /* appears towards the top of the page -- see template script */
   color: #B33521;
	font-family: Verdana;
	font-size: 18pt; /* we don't care to be not resized by IE */
	font-weight: strong;
	margin: 45px 0 4px 15px;
	padding: 0;
	float: left;
}

#header_title a { /* adapt the color to the backdrop image */
	color: #B33521;
}
#header_title a:hover { /* about to click */
	color: #B33521;
	text-decoration: none;
}

@media screen { /* for the home page, only on large screens -- index.php */

	#home_center { /* a centered article at the home page, in layout: newspaper */
		border-left: 1px dotted #bfbfbf;
		margin: 0 0 1em 0.5em;
	   padding: 0 0 0 0.5em;
	   float: left;
	   width: 170px;
	}

	#home_east { /* the rightmost article at the home page, in layouts: boxesandarrows, newspaper */
		border-left: 1px dotted #bfbfbf;
		margin: 0 0 1em 0.5em;
	   padding: 0 0 0 0.5em;
	   float: left;
	   width: 170px; /* wider with boxesandarrows than with newspaper */
	}

	#home_north { /* the most new article at the home page, in layouts: daily, newspaper, slashdot */
	    border: 1px solid #fa0;
	    margin: 0.5em 0 0.5em 0;
	    padding: 0 0.5em;
	    width: 530px;
	}

	#home_north h2 { /* space above title to be partly delegated to the containing div */
	    margin-top: 0.5em;
	}

	#home_north .date { /* space above date to be partly delegated to the containing div */
	    margin-top: 0.5em;
	}

	#home_north div.section_box { /* limit bottom space */
	    margin: 0;
	    padding: 0 0.5em;
	}

	#home_west { /* the leftmost article at the home page, in layouts: boxesandarrows, newspaper */
		margin: 0 0 1em 0;
	    padding: 0;
	    float: left;
	    width: 165px; /* wider with boxesandarrows than with newspaper */
	}

	#home_south h3 { /* titles within home_east, home_center and home_west, for layout: newspaper */
		margin-top: 0;
		border: none;
		font-weight: bold;
		font-style: normal;
		font-size: small;
	}

	* html #home_south h3 { /* align IE PC with other browsers */
		font-size: x-small;
	}

}

dl#neighbours dd ul { /* navigation commands on page side -- articles/view.php */
	margin: 0;
	padding: 0;
	list-style: none;
}

dl#neighbours dd ul li { /* space between links */
	margin: 0 0 4px 0;
	padding: 0;
}

dl#news { /* the navigation box for static news -- index.php, sections/view.php */
}

dl#news dd ul { /* the list of news */
	margin: 0;
	padding: 0;
	list-style: none;
}

dl#news hr { /* simple rule between items */
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: 1px dotted #447;
	height: 0px;
}

p#page_menu { /* an horizontal menu of commands below page title -- see template script */
	font-size: 7pt;
	color: #f7f7f7;
	font-weight: normal;
	text-shadow: none;
	text-align: left;/* we accept IE don't resize */
	margin: 5px 0 0 0;
	padding: 2px 0px 2px 4px;
	border-top: 1px solid #D6CCBD;
	border-left: 1px solid #D6CCBD;
	border-right: 1px solid #D6CCBD;
	border-bottom: 1px solid #D6CCBD;
	margin: 0 0 10px 0;
	padding: 0;
}

@media print { /* do not print the page menu */
	p#page_menu {
		display: none;
	}
}

dl#rotating_news dd { /* the navigation box for rotating news -- index.php, sections/view.php */
	height: 15em; /* should be taller than longer element */
	overflow: hidden; /* strip the tail, if any */
	width: auto;
}

dl#rotating_news dd hr { /* items are displayed one at a time, and the separator is useless */
	display: none;
}

dl#rotating_news dd ul { /* the actual list of news */
	margin: 0;
	padding: 0;
	list-style: none;
}

#scrolling_news div.scroller_outside { /* the navigation box for scrolling news -- index.php, sections/view.php */
	height: 200px; /* the height of the scrolling area */
}

#scrolling_news hr { /* separate items */
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: 1px dotted #447;
	height: 0px;
}

dl#scrolling_news dd ul { /* a list with no bullet */
	margin: 0;
	padding: 0;
	list-style: none;
}

#sections a.section { /* a link to a section, in some site map -- index.php, sections/index.php, sections/view.php */
	font-weight: bold;
}

dl#user_menu dd ul { /* commands that apply to this user -- see template script */
	margin: 0;
	padding: 0;
	list-style: none;
}

/**
 * styles by classes
 */

@media screen { /* not on printers */

	#main_panel a.article { /* the image near a link to an article -- [article=id], [article=id, label] */
		padding-right: 13px;
		background: url('icons/document.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

.author_box { /* a user profile, towards the beginning of an article */
	float: right;
	padding: 2px;
	border: 1px dotted #888;
}

img.avatar { /* an image representing a member -- do not float it! */
	margin: 4px; /* some space around the image */
}

p.away { /* not visible for ordinary browsers -- accessibility tweak */
	position: absolute;
	left: -999px;
	width: 990px;
}

.big { /* bigger than default, but smaller than .huge -- [big]...[/big] */
	font-size: 2em;
	line-height: 1.1em;
}

.button { /* a link that mimic a form button -- [button]url[/button], [button=label]url[/button] */
	border-color: #dcdcdc #696969 #696969 #dcdcdc;
	border-style: solid;
	border-width: 2px;
	text-align: center;
	padding: 4px;
	line-height: 2;
}

a.button,
a:visited.button {
	background-color: #c0c0c0;
    color: #202020;
	text-decoration: none;
}

a:active.button { /* click on button */
	background-color: #cfcfcf;
    color: #202040;
	border-color: #696969 #dcdcdc #a9a9a9 #696969;
}

a:hover.button { /* hover a button */
	background-color: #cfcfcf;
    color: #202040;
}

@media screen { /* not on printers */

	#main_panel a.category { /* the image near a link to a category -- [category=id], [category=id, label] */
		padding-right: 16px;
		background: url('icons/section.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

p.caution { /* a warning paragraph -- [caution]...[/caution] -- see also CAUTION_FLAG in skins/skin_skeleton.php */
}

.center_image { /* an image in the middle of the page [image=xx, center] */
	clear: both;
	text-align: center;
}

.center_image p { /* its caption */
	text-align: center;
	font-size: 7pt;
	padding-top: 0;
	margin-top: 0;
}

dl.column { /* one single column -- index.php */
    margin: 1em 8px 8px 0;
    padding: 0;
}

dl.column dd { /* column actual content */
	margin: 0 0 1em 2em;
	padding: 0 0 0 0;
}

dl.column dd,
dl.column dd a.category,
dl.column dd .details,
dl.column dd a.section { /* make content look larger in single column */
	font-size: 107%;
}

dl.column dd p,
dl.column dd ul { /* vertical margins within a box */
	margin-top: 0.2em;
	margin-bottom: 0.2em;
}

dl.column dt { /* the image aside the column */
	clear: left;
	border: 0;
	margin: 0;
	padding: 2px 0 2px 0;
}

dl.column dt img { /* align the image */
	margin: 0;
	padding: 0;
}

dl.column_1,
dl.column_2 { /* left or right column out of two -- index.php, sections/index.php, sections/view.php, categories/index.php, etc. */
    margin: 0 8px 8px 0;
    padding: 0;
    width: 260px;
    float: left;
}

dl.column_1 dd,
dl.column_2 dd { /* column actual content */
	margin: 0 0 1em 37px;
	padding: 1px 0 0.4em 0.7em;
	border: dotted 1px #D6CCBD;
}

dl.column_1 dd p,
dl.column_1 dd ul,
dl.column_2 dd p,
dl.column_2 dd ul { /* space around content elements */
	margin-top: 0.2em;
	margin-bottom: 0.2em;
}

dl.column_1 dt,
dl.column_2 dt { /* the image aside the column */
	clear: left;
	float: left;
	width: 40px;
	text-align: center;
	border: 0;
	margin: 0;
	padding: 2px 0 2px 0;
}

dl.column_1 dt img,
dl.column_2 dt img { /* align the image */
	margin: 0;
	padding: 0;
}

.comic { /* use a special font -- [style=comic]...[/style] */
	font-family: 'Comic Sans MS', cursive;
}

@media screen { /* not on printers */

	#main_panel a.comment { /* the image near a link to a comment -- [comment=id], [comment=id, label] */
		padding-right: 17px;
		background: url('icons/news.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

@media screen { /* not on printers */

	div.comment div {	/* some blog comment -- comments/layout_comments_as_daily.php */
		margin-left: 1em;
	}

}

.cursive { /* use a cursive font -- [style=cursive]...[/style] */
	font-family: cursive;
}

p.date { /* date of a post, above its title -- articles/layout_articles_as_daily.php & skins/layout_articles_as_daily.php */
	color: #666;
	font-weight: normal;
	font-size: x-small;
	font-style: italic;
	margin: 1em 0 10px 0;
	padding: 3px 0 2px 0;
	border-bottom: 1px solid #666;
	text-align: left;
}

table.decorated { /* a 2-column table, with images on the left -- [decorated]...[/decorated] */
	border-spacing: 0;
	border: none;
}

table.decorated td {
	border: none;
	margin: 0;
	padding: 0.3em 8px 0.3em 8px;
}

table.decorated td img { /* align the decorating image with decorated text */
	margin-top: 6px;
}

.details { /* a set of details */
	font-size: 7pt;
	color: #888; /* less contrasted than regular text */
}

.details a { /* faded into text */
	font-weight: normal;
	color: #666;
}

p.details { /* stick to previous and next elements */
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
}

dl.download dt p { /* the image to download a package -- see files/view.php */
	text-align: center;
	float: left;
	margin: 0 2em 2em 0;
}

@media screen { /* not on printers */

	.draft { /* signal draft pages with a neat image */
		padding-right: 10px;
		margin-right: 2px;
		background: url('icons/to_publish.gif') right no-repeat;
	}

	.draft span { /* mask default text */
		display: none;
	}

}

@media screen { /* not on printers */

	#main_panel a.email { /* the image near a link to an email address -- [email]address[/email], [email=label]address[/email] */
		padding-right: 18px;
		background: url('icons/mailto.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

div.error { /* report on abnormal conditions */
	color: red;
}

div.even { /* stacked with div.odd */
	padding: 0.5em 0;
}

@media screen { /* not on printers */

	.expired { /* display a neat image to flag expired pages */
		padding-right: 16px;
		margin-right: 2px;
		background: url('icons/expired.gif') right no-repeat;
	}

	.expired span { /* mask default text */
		display: none;
	}
}

@media screen { /* not on printers */

	#main_panel a.external { /* the image near an external link -- [link]href[/link], [link=label]href[/link] */
		padding-right: 15px;
		background: url('icons/link.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

.fantasy { /* various rendering, you have been warned -- [style=fantasy]...[/style] */
	font-family: fantasy;
}

@media screen { /* not on printers */

	#main_panel a.file { /* the image near a link to view file details -- [file=id], [file=id, label] */
		padding-right: 15px;
		background: url('icons/download.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

.flag { /* compact meta-information -- [flag]foo bar[/flag], but also [new], [popular], [updated] -- see also .new, .popular, .updated */
	color: red;
	font-size: 6pt; /* we don't care to be not resized by IE */
}

div.folder_body { /* the body of an unfolded box -- [folder]...[/folder] */
	border-left: 1px solid #bfbfbf;
	padding: 3px 0 0.3em 1em;
	margin-left: 4px; /* right below the folding image */
}

a.folder_header { /* not an ordinary link */
	font-weight: bold;
}

a.folder_header:hover { /* make it visually clickable */
	cursor: pointer;
}

table.form { /* a table used to present form fields */
	border: none;
}

table.form td {
	border: none;
	margin: 0;
	padding: 0.3em 0 0.5em 0;
}

dl.gadget_box { /* container of one gadget box -- also see #gadget_1, etc. -- from index.php, sections/view.php */
    margin: 0 8px 8px 0;
    padding: 0;
    width: 260px;
    float: left;
}

dl.gadget_box dt { /* header of one gadget box */
	color: #333;
	font-weight: bold;
	font-size: 13px;
	color: green;
	font-style: normal;
	margin: 20px 0 0 0;
	padding: 0 0 3px 0;
	text-shadow: none;
	border: none;
}

div.gadget_box ul.compact { /* a list of articles in a gadget box */
	font-size: 10px;
}

table.grid td { /* a table where cells have borders */
	/* nothing to do here, with this skin all tables have a grid */
}

.hide { /* text readers will show it */
	display: none;
}

.highlight1 { /* to locate words looked for, following a search request */
	background-color: #80FF80;
}

.highlight2 {
	background-color: #8080FF;
}

.highlight3 {
	background-color: #FF8080;
}

.huge { /* bigger than .big -- [huge]...[/huge] */
	font-size: 250%;
}

img.icon { /* main image of an article, or of some section -- $context[page_image'], handled in template script */
	margin: 6px;
}

br.images_prefix { /* before a set of thumbnails, to align them correctly -- [images] */
	clear: left;
}

br.images_suffix { /* after a set of thumbnails, to align following text properly -- [/images] */
	clear: left;
}

.indent { /* shift to the right -- [indent]...[/indent] */
	margin: 0.3em 0 0.5em 3em;
}

.introduction { /* before the main content of an article -- articles/view.php, sections/view.php, categories/view.php */
	background-color: #f7f7f7;
	padding: 3px;
}

.left_image { /* an image floated to the left -- [image=xx, left] */
	float: left;
	margin-right: 8px;
	text-align: center;
}

.left_image p { /* its caption */
	text-align: center;
	font-size: 7pt;
	padding-top: 0;
	margin-top: 0;
}

.menu { /* a small inline menu, almost anywhere */
    display: inline;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    text-align: center;
	 font-size: 12pt; /* not resizable by IE PC */
}

.menu_bar { /* an horizontal menu of commands, below a section title */
	clear: center;
	font-size: 9pt; /* we accept IE don't resize */
	font-weight: normal;
	text-shadow: none;
	margin: 4px 0 10px 0;
	padding: 0;
}

.my_style { /* featured in help pages -- [style=my_style] -- codes/basic.php */
	color: blue;
}

table.neighbours { /* previous and next links -- articles/view.php */
	clear: both;
	border: none;
}

table.neighbours td {
	border: none;
	margin: 0;
	padding: 1em 0;
}

@media screen { /* not on printers */

	.new { /* display a neat image as a flag -- [new] -- see also .flag */
		padding-right: 31px;
		margin-right: 2px;
		background: url('icons/new.gif') right no-repeat;
	}

	.new span { /* mask default text */
		display: none;
	}
}

@media screen { /* not on printers */
	#main_panel a.next { /* shortcut to next page -- [next=id], [next=id, label] */
	}
}

p.note { /* a noticeable paragraph -- [note]...[/note] -- see also NOTICE_FLAG in skins/skin_skeleton.php */
}

div.odd { /* stacked with div.even */
	padding: 0.5em 0;
}

#main_panel td.odd { /* one row out of two, but only in the main panel */
	background-color: #fff8ff;
}

dl.poll { /* layout poll results */
    margin: 1em 8px 8px 0;
    padding: 0;
}

dl.poll dd { /* horizontal bar for one answer */
	white-space: nowrap; /* to replace <nobr> */
	margin: 0 0 1em 2em;
	padding: 0 0 0 0;
}

dl.poll dt { /* label of one answer */
	clear: left;
	border: 0;
	margin: 0;
	padding: 2px 3px 2px 0;
	float: left;
    width: 110px;
}

@media screen { /* not on printers */

	.popular { /* display a neat image as a flag -- [popular] -- see also .flag */
		padding-right: 24px;
		margin-right: 2px;
		background: url('icons/popular.gif') right no-repeat;
	}

	.popular span {	/* mask default text */
		display: none;
	}

}

@media screen { /* not on printers */
	#main_panel a.previous { /* shortcut to previous page -- [previous=id], [previous=id, label] */
	}
}

@media screen { /* not on printers */

	.private { /* display a neat image to flag private items */
		padding-right: 15px;
		background: url('icons/private.png') right no-repeat;
	}

	.private span { /* mask text */
		display: none;
	}

}

@media screen { /* not on printers */

	.restricted { /* display a neat image to flag restricted items */
		padding-right: 15px;
		background: url('icons/restricted.png') right no-repeat;
	}

	.restricted span { /* mask text */
		display: none;
	}

}

.right { /* flushed to the right -- [right] */
	text-align: right;
}

.right_image { /* an image floated to the rift -- [image=xx, right] */
	float: right;
	margin-left: 8px;
	text-align: center;
}

.right_image p { /* its caption */
	text-align: center;
	font-size: 7pt;
	padding-top: 0;
	margin-top: 0;
}

.sans-serif { /* use a sans-serif font -- [style=sans-serif]...[/style] */
	font-family: sans-serif;
}

@media screen { /* not on printers */

	#main_panel a.script { /* the image near a link to a phpDoc page -- [script]path/script.php[/script] */
		padding-right: 14px;
		background: url('icons/server.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

.scroller_inside { /* the internal div of a scroller */
	position: relative;
}

.scroller_outside { /* the external div of a scroller */
	overflow: hidden; /* strip the tail, if any */
	position: relative; /* let the inside scroller work correctly */
/*	width: 185px;  /* the width of the scrolling area */
/*	height: 200px; /* the height of the scrolling area */
/*	clip: rect(0 185 200 0); /* combined width and height */
}
#tabs { /* the global navigation bar -- see template script */
	position: absolute;
	top: 84px;
	right: 150px;
	margin: 0; /* need for IE Mac */
	padding: 0;
}

#tabs,
#tabs a { /* text appearance in tabs */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	color: white; /* see #tabs li a span */
}

#tabs ul { /* position tabs */
	width: auto;
	margin: 0;
	padding: 0;
	list-style: none;
	z-index: 90;
}

#tabs li {
	display:inline;
	margin:0 2px 0 0;
	padding:0;
}

#tabs li a { /* tab top left corner */
	margin:0 1px 0 0;
	padding: 0 0 0 10px;
	text-decoration:none;
	float: left;
}

#tabs li a span { /* tab top right corner */
	float: left;
	display: block;
	padding: 5px 3px 4px 0;
	color: white;
	text-decoration: none;
}

#tabs li a:hover { /* change tab background on hovering */
	background-position: 0% -22px;
	color: #B33521;
	text-decoration: none;
	cursor: pointer; /* else ie 6 is lost */
}

#tabs li a:hover span { /* change tab background on hovering */
	background-position: 100% -22px;
	color: #B33521;
	text-decoration: none;
}
@media screen { /* not on printers */

	#main_panel a.section { /* the image near a link to a section -- [section=id], [section=id, label] */
		padding-right: 16px;
		background: url('icons/section.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

div.section_box { /* components of the main content */
	clear: left;
	margin: 0;
	padding: 0 0 2em 0;
}

.serif { /* use a serif font -- [style=serif]...[/style] */
	font-family: serif;
}

@media screen { /* not on printers */

	#main_panel a.server { /* the image near a link to a server profile -- [server=id], [server=id, label] */
		padding-right: 14px;
		background: url('icons/server.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

@media screen { /* not on printers */

	#main_panel a.shortcut { /* the image near a local link */
		padding-right: 15px;
		background: url('icons/shortcut.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}

div.sidebar_box { /* somewhere in the main panel -- [sidebar]...[/sidebar] */
	float: left;
	min-width: 10em;
	max-width: 20em;
	margin: 0.5em 1em 0.3em 0;
}

div.sidebar_box div { /* body of one sidebar box */
	background-color: #fff;
	color: #666;
	font-weight: normal;
	font-size: 8pt;
	text-align: left;
	margin: 0;
	padding: 2px;
	border: 1px solid #bfbfbf;
}

div.sidebar_box h3 { /* header of one sidebar box -- the 'foo bar' of [sidebar=foo bar]...[/sidebar] */
	background-color: #ccc;
	color: #666;
	font-weight: normal;
	font-size: 8pt;
	text-align: center;
	margin: 0;
	padding: 2px 2px 0px 2px;
	border-top: 1px solid #bfbfbf;
	border-left: 1px solid #bfbfbf;
	border-right: 1px solid #bfbfbf;
}

.small { /* smaller than default, but larger than .tiny -- [small]...[/small] */
	font-size: 7pt;
}

td.sorted { /* for tables handled through javascript -- see tables/sort.js */
	background-color: #f0f0f0;
}

th.sorted {
	background-color: #c4c0c4;
}

tr.odd td.sorted {
	background-color: #F4F0F4;
}

.thumbnail_image { /* float thumbnails to align them */
	float: left;
	margin-right: 8px;
	text-align: center;
}

.thumbnail_image a img { /* no border around clickable images */
	border: none;
}

.thumbnail_image p { /* caption */
	text-align: center;
	font-size: 7pt;
	padding-top: 0;
	margin-top: 0;
	width: 80px;	/* to align with actual thumbnail size set in configuration panel for skins */
}

.tiny { /* smaller than .small -- [tiny]...[/tiny] */
	font-size: 7pt;
}

.toc_box { /* table of content -- [toc] */
	color: #666666;
	font-weight: normal;
	font-size: 8pt;
	line-height: 1.2em;
	background-color: #eee;
	margin: 6px 0 5px 0;
	padding: 6px;
	border: 1px solid #bfbfbf;
}

#main_panel div.toc_box ul { /* first level of the toc */
	margin: 0;
	padding: 0;
	list-style: none;
}

#main_panel div.toc_box ul ul { /* second level of the toc */
	margin-left: 1.5em;
	padding: 0;
	list-style: square;
}

.toq_box { /* table of questions -- [toq] */
	color: #666666;
	font-weight: normal;
	font-size: 8pt;
	line-height: 1.2em;
	background-color: #eee;
	margin: 6px 0 5px 0;
	padding: 6px;
	border: 1px solid #bfbfbf;
}

#main_panel div.toq_box ul { /* a list of questions */
	margin-top: 0;
	margin-bottom: 0;
	list-style: square;
}

@media screen { /* not on printers */

	.updated { /* flag modified pages -- [updated] -- see also .flag */
		padding-left: 60px;
		margin-left: 2px;
		background: url('icons/updated.gif') left no-repeat;
	}

	.updated span { /* mask default text */
		display: none;
	}

}

@media screen { /* not on printers */

	#main_panel a.user { /* the image near a link to a user profile -- [user=id], [user=id, label] */
		padding-right: 15px;
		background: url('icons/zoom.png') right no-repeat;
		white-space: nowrap; /* because of IE rendering bug on link wrapping */
	}

}