/**

 * 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;

	cursor: pointer; /* help ie on folded boxes */

}



a:link,

a:link code { /* link displayed for the first time */

	color: #cc0033;

}





a:visited,

a:visited code { /* link that has been used at least once */

	color: #cc0000;

}



a:active,

a:active code { /* link at the moment it is clicked */

	color: #ff6699;

}



a:hover,

a:hover code { /* link below the mouse pointer */

	color: #ff6699;

}



a img { /* avoid borders around images used as links */

	border: none;

}



acronym { /* help in a popup -- [hint]...[/hint] */

	border-bottom: 1px dotted cc0033;

	cursor: help;

}



address { /* a author profile towards the end of the main panel -- see articles/view.php */

	display: block;

	color: #8a757a;

	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: #000;

	background-color: #fff;

	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: #000;

	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: #333;

	font-weight: bold;

	font-size: small;

	font-style: normal;

	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] */

	clear: left;

	color: #333;

	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 cc0033;

}



* 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;

}







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: #F3E9E9;

	padding: 4px;

	border-right: 1px solid #888;

	border-bottom: 1px solid #888;

	white-space: pre;

}



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-weight: normal;

	font-size: x-small;

	text-align: left;

	border-top: 1px solid #bfbfbf;

	border-left: 1px solid #bfbfbf;

	margin: 0;

	padding: 4px;

	color: cc0033;

	background-color: #cc0033;

}



* 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: cc0033;

	background: #ff6699;

	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: url('images/bandeaugrenier.jpg') top left no-repeat; /* AJAL : pour que le bandeau ne se répète pas au-dessus du side_panel */

	text-align: left;

	padding: 0;

	margin: 0px 0px 0px 0;

	border-bottom: 2px ridge #cc0033;

	height: 200px;

font-size: x-small;

}



@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;	/* AJAL : 200px de plus pour réutiliser l'espace du side_panel déplacé à droite */

		margin: 0;

		padding: 0 0 0 4px;

		overflow: hidden;

	}



	#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: #F3E9E9;

	}



	#main_panel pre code { /* use block attributes instead of in-line attributes */

		background-color: transparent;

		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: #8a757a;

	font-weight: normal;

	font-size: 8pt;

	line-height: 1.2em;

	background-color: #fff;

	margin: 0 0 5px 0;

	padding: 6px;

	border: 1px solid #cc0033;

}



#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: #cc0033;

	font-weight: bold;

	font-size: 8pt;

	text-align: left;

	margin: 5px 0 0 0;

	padding: 2px 0px 2px 4px;

	border-top: 1px solid #cc0033;

	border-left: 1px solid #cc0033;

	border-right: 1px solid #cc0033;

}



#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: 970px;		/* AJAL : 770px pour le main_panel et 200px pour le side_panel */

		background: cc0033 url('images/code_background.gif') repeat;

	}



}



/**

 * 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;

	}

}



#featured { /* the navigation box for statically featured pages -- index.php, sections/view.php */

}



#featured hr { /* simple rule between items */

	border-top: none;

	border-left: none;

	border-right: none;

	border-bottom: 1px dotted #447;

	height: 0px;

}



dl#featured.extra_box dd ul { /* the list of featured pages */

	margin: 0;

	padding: 0;

	list-style: 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 #cc0033;

	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 #cc0033;

	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 #cc0033;

	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 #cc0033;

	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 #cc0033;

	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 #cc0033;

	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: right;

	clear: right;

	margin: 0 0 0 15px;

	padding: 0;

	font-size: 8pt; /* we don't care to be not resized by IE */

	text-align: right;

        top: 240 px

}



#header_title { /* appears towards the top of the page -- see template script */

	color: transparent;

	font-size: 0pt; /* we don't care to be not resized by IE */

	font-weight: bold;

	margin: 20px 120px 4px 15px;

	padding: 0;

	float: left;



}



#header_title a { /* adapt the color to the backdrop image */

	color: transparent;

}



@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; /* we accept IE don't resize */

	font-weight: normal;

	text-shadow: none;

	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;

}



#tools img { /* towards bottom of the page -- see articles/view.php */

	margin-right: 4px; /* space between icons and labels */

}



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;

	}



	* html #main_panel a.article { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



.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;

}



table.calendar { /* add bottom and right borders to the table*/

	border-spacing: 0;

	border-collapse: separate;

	border-bottom: 1px solid #bfbfbf;

	border-right: 1px solid #bfbfbf;

	margin-bottom: 1em;

}



table.calendar caption,

table.calendar caption a { /* calendar caption */

	font-weight: normal;

	font-style: normal;

	color: #fff8ff;

	background-color: #cc0033;

	text-align: left;

	padding: 4px;

}



table.calendar td,

table.calendar th { /* add top and left borders to each cell */

	border-top: 1px solid #bfbfbf;

	border-left: 1px solid #bfbfbf;

	margin: 0;

	padding: 4px;

	vertical-align: top;

    text-align: left;

}



table.calendar td.spot {

	background-color: #f3e9e9;

	font-weight: bold;

}



@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;

	}



	* html #main_panel a.category { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



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;

}



table.collections { /* a list of downloadable files -- see collections/browse.php */

	border-spacing: 0;

	border: none;

}



table.collections a img {

	border: none;

}



table.collections td {

	border: none;

	margin: 0;

	padding: 0.3em 8px 0.3em 8px;

}



table.collections th {

	border: none;

	margin: 0;

	padding: 0.3em 8px 0.3em 8px;

}



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;

	overflow: hidden; /* kill oversized links */

}



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 0;

	padding: 1px 0 0.4em 0.7em;

	overflow: hidden; /* kill oversized links */

}



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;

	text-align: left;

	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;

	}



	* html #main_panel a.comment { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



@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 dd { /* the description below a download link -- see files/view.php */

	margin-left: 0;

}



dl.download dt { /* the link to download a file -- see files/view.php */

	margin-bottom: 1em;

	font-weight: bold;

}



@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;

	}



	* html #main_panel a.email { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



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;

	}



	* html #main_panel a.external { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



span#family { /* within section title -- see sections/view.php */

	font-weight: normal;

	font-size: 12px;

	font-style: normal;

	line-height: 12px;

	color: #66a;

}



.family,

.family a { /* to introduce several successive sections in a forum -- see sections/layout_sections_as_yabb.php */

	font-weight: normal;

	font-style: normal;

	color: #ddd;

	background-color: #cc0033;

	text-align: left;

	padding: 4px;

}



.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;

	}



	* html #main_panel a.file { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



.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;

}



table.form { /* a table used to present form fields */

	border: none;

}



table.form td {

	border: none;

	margin: 0;

	padding: 0.3em 0.5em 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 dd { /* body ofone gadget box */

	margin-left: 0;

}



dl.gadget_box dt { /* header of one gadget box */

	color: #333;

	font-weight: bold;

	font-size: x-small;

	font-style: normal;

	margin: 20px 0 0 0;

	padding: 0 0 3px 0;

	text-shadow: none;

	border: none;

}



dl.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%;

	line-height: 1.1em;

}



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: #Fffff;

	padding: 3px;

	font-family: Comic Sans MS;

	color: #8a757a;

}



.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;

}



dl.manual_comments { /* to list comments in a manual -- see comments/layout_comments_as_manual.php */

	margin: 0 1em 0 0;

	padding: 0;

}



dl.manual_comments dd { /* body of one note */

	margin: 0 0 1em 0;

	padding: 0.3em 1em 1em 1em;

}



dl.manual_comments dd.odd {

	border-left: 1px solid #daa;

	border-right: 1px solid #daa;

	border-bottom: 1px solid #daa;

}



dl.manual_comments dd.even {

	border-left: 1px solid #aaf;

	border-right: 1px solid #aaf;

	border-bottom: 1px solid #aaf;

}



dl.manual_comments dt { /* header of one note */

	margin: 1em 0 0 0;

	padding: 1em 1em 2px 1em;

}



dl.manual_comments dt.odd {

	border-top: 1px solid #daa;

	border-left: 1px solid #daa;

	border-right: 1px solid #daa;

}



dl.manual_comments dt.even {

	border-top: 1px solid #aaf;

	border-left: 1px solid #aaf;

	border-right: 1px solid #aaf;

}



.menu { /* a small inline menu, almost anywhere */

    display: inline;

    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;

    text-align: left;

	font-size: 7pt; /* not rezisable by IE PC */

}



.menu_bar { /* an horizontal menu of commands, below a section title */

	clear: left;

	font-size: 7pt; /* 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: 18px;

		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;

}



div.overlay { /* in lists, and before the main content of an article -- articles/view.php */

	padding: 0;

	margin: 0;

}



div.overlay p { /* one component of some overlay content */

	padding: 0;

	margin: 0;

}



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: 6px 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;

	}



	* html #main_panel a.script { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



.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 */

}



@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;

	}



	* html #main_panel a.section { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



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;

	}



	* html #main_panel a.server { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



@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;

	}



	* html #main_panel a.shortcut { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



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: cc0033;

	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;

	display: table-cell;

	margin-right: 8px;

	text-align: center;

	height:300px;	/* to align with actual thumbnail height set in configuration panel for skins */

	width: 260px;	/* to align with actual thumbnail width set in configuration panel for skins */

}



.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;

}



.tiny { /* smaller than .small -- [tiny]...[/tiny] */

	font-size: 7pt;

}



.toc_box { /* table of content -- [toc] */

	color: #8a757a;

	font-weight: normal;

	font-size: 8pt;

	line-height: 1.2em;

	background-color: #f3e9e9;

	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: #8a757a;

	font-weight: normal;

	font-size: 8pt;

	line-height: 1.2em;

	background-color: #f3e9e9;

	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;

}



#contextual_menu ul.tree { /* shape a tree of links -- see build_tree() in skins/skin_skeleton.php */

	list-style-type: none;

	margin: 0;

	padding: 0;

	font-family: arial, sans-serif;

	font-size: 10px;

	line-height: 14px;

}



#contextual_menu ul.tree ul { /* indent all levels, except level 1 */

	list-style-type: none;

	margin: 0;

	padding: 0;

	font-family: arial, sans-serif;

	font-size: 10px;

	line-height: 14px;

	background-image: url('icons/tree/vertical.gif');

	background-repeat: repeat-y;

	background-position: 0px 0px;

}



#contextual_menu ul.tree li { /* every branch of the tree */

	margin: 0;

	padding-top: 0;

}



#contextual_menu ul.tree_level_1 li { /* top-level branch of the tree is left-aligned */

	padding-left: 0;

}



#contextual_menu ul.tree_level_2 li,

#contextual_menu ul.tree_level_3 li,

#contextual_menu ul.tree_level_4 li,

#contextual_menu ul.tree_level_5 li { /* other levels are indented */

	padding-left: 14px;

	background-image: url('icons/tree/node.gif');

	background-repeat: no-repeat;

	background-position: 0px 0px;

}



#contextual_menu ul.tree_level_2 li.last,

#contextual_menu ul.tree_level_3 li.last,

#contextual_menu ul.tree_level_4 li.last,

#contextual_menu ul.tree_level_5 li.last { /* last item of a branch */

	background-image: url('icons/tree/last.gif');

	background-color: #fff; /* mask the default ul background --use the exact underlying background color */

	background-repeat: no-repeat;

	background-position: 0px 0px;

}



#contextual_menu ul.tree li a.below,

#contextual_menu ul.tree li a.close { /* focus is not here */

	padding-left: 16px;

	background: url('icons/tree/close.gif') top left no-repeat;

}



#contextual_menu ul.tree li a.current,

#contextual_menu ul.tree li a.open { /* item has the current focus */

	padding-left: 16px;

	background: url('icons/tree/open.gif') top left no-repeat;

}



@media screen { /* not on printers */



	.updated { /* flag modified pages -- [updated] -- see also .flag */

		padding-left: 31px;

		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;

	}



	* html #main_panel a.user { /* ie kills trailing rendering on long links */

		padding-right: 0px;

		background: none;

	}



}



table.wide { /* to introduce threads and comments -- see articles/layout_articles_as_jive.php */

	width: 100%;

	margin: 0px;

}



dl.wiki_comments { /* to list comments in a wiki -- see comments/layout_comments_as_wiki.php */

}



dl.wiki_comments dd { /* body of one note */

	margin: 0 0 2em 4px;

	padding: 0.5em 1em 0.5em 1em;

}



dl.wiki_comments dd.odd {

	border-left: 1px solid #daa;

}



dl.wiki_comments dd.even {

	border-left: 1px solid #aaf;

}



dl.wiki_comments dt { /* header of one note */

	margin: 0;

	padding: 0 0 2px 0;

	display: inline;

	margin-right: auto;

}



dl.wiki_comments dt.odd {

	border-bottom: 1px solid #daa;

}



dl.wiki_comments dt.even {

	border-bottom: 1px solid #aaf;

}



table.yabb { /* to introduce threads and comments -- see articles/layout_articles_as_yabb.php */

	width: 100%;

	margin: 0px;

}