/**
 * core styles generated by YACS
 *
 * This is a reference style sheet of YACS, and it may be automatically updated
 * on each new software release.
 *
 * To benefit from these styles out-of-the-box, insert a declaration at the very
 * beginning of own style sheet like this:
 *
 * @import url("../_reference/yacs.css");
 *
 * Else you can pick-up all or part of various sections of this library into
 * your own style sheet:
 *
 * - nicetitle links
 * - AJAX tabs
 * - AJAX threads
 * - AJAX users
 *
 * @author Bernard Paques [email]bernard.paques@bigfoot.com[/email]
 * @author Thierry Pinelli [ThierryP]
 * @reference
 * @license http://www.gnu.org/copyleft/lesser.txt GNU Lesser General Public License
 */

/**
 * scriptaculous autocomplete
 *
 * @link http://wiki.script.aculo.us/scriptaculous/show/Ajax.Autocompleter
 */
div.autocomplete,
#main_panel div.autocomplete {
	position:absolute;
	width:250px;
	background-color:white;
	border:1px solid #888;
	margin:0px;
	padding:0px;
}

div.autocomplete ul,
#main_panel div.autocomplete ul {
	list-style-type:none;
	margin:0px;
	padding:0px;
}

div.autocomplete ul li.selected,
#main_panel div.autocomplete ul li.selected {
	background-color: #ffb;
}

div.autocomplete ul li,
#main_panel div.autocomplete ul li {
	list-style-type:none;
	display:block;
	margin:0;
	padding:2px;
/*	height:32px; */
	cursor:pointer;
	background-image:none;
}

/**
 * forms with Ajax -- see forms/edit.php
 */

div.captured { /* some text provided in the form */
	border: 1px dotted #ddd;
	margin: 1em auto 1em 0;
	padding: 0.5em;
}

div.dropmarker { /* the horizontal line to track position during drag */
	height: 6px;
	width: 100px;
	border-top: 3px solid #666;
	color: #fff;
	z-index: 1000;
	margin: 0 0 30px 20px;
}

div.sortable {
	position: relative;
/*	border: 1px solid #ccc; */
	margin: 0.3em 0 0 0;
	padding: 0.5em 0 0.5em 0;
	width: 500px;
}

.sortable_hover {
	background-color: #edf6dd;
}

div#form_panel {
	position: relative;
}

div#form_panel h2,
div#form_panel h3 { /* align title with dragging handle */
	clear: none;
}

div#form_wrapper { /* the panel where fields are handled */
	margin-bottom: 2em;
	padding-bottom: 0.5em;
	minimum-height: 5em;
}

/**
 * on-demand toolbox
 */

div.properties { /* the properties sheet that appears on click */
	background-color: #eee;
	display: block;
	margin: 0;
	padding: 0.5em;
	/* do not use display: none here, else it would not appear on-demand */
}

span.onHoverLeft { /* the little handle on the left for sortable elements */
	cursor: move;
	display: block;
	float: left;
	padding: 0;
	visibility: hidden; /* changed in Yacs.mouseOver() and Yacs.mouseOut() */
}

span.onHoverRight { /* the toolbox on the right */
	display: block;
	float: right;
	padding: 0;
	visibility: hidden; /* changed in Yacs.mouseOver() and Yacs.mouseOut() */
}


 /**
 * modal box
 */

div#modal_centered { /* the centered container */
	position: absolute;
	top: 30%;	/* top and left will be adjusted dynamically through javascript */
	left: 30%;
	display: block;
	text-align: center;
	color: #444;
	background-color: #fff;
	border: 2px solid #888;
	margin: 0 auto;
	padding: 4px;
	z-index: 100;
}

div#modal_content div.boxButtons {
	margin-top: 0.5em;
	padding: 0.5em 0 0.3em 0;
	text-align: center;
}

div#modal_content h2.boxTitle {
	margin-top: 0;
	padding-top: 0;
}

div#modal_image_panel {
	padding: 6px;
}

div#modal_panel {	/* the grey overlay that sits behind the modal box */
	position: fixed;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	min-height: 100%;
	background: transparent url('overlay_background.png') repeat; /* transparent image generated at http://apps.everamber.com/alpha/ */
	text-align: center;
	z-index: 99; /* just below modal_centered */
}

/**
 * nicetitle links
 */

div.nicetitle {
	position: absolute;
	padding: 4px;
	top: 0px;
	left: 0px;
	color: white;
	font-size: 13px;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	width: 25em;
	max-width: 25em;
	font-weight: bold;
	background: url("nicetitle_background.png");
}
div.nicetitle p {
	margin: 0;
	padding: 0 3px;
	text-align: left;
}
div.nicetitle p.destination {
	font-size: 9px;
	text-align: left;
	padding-top: 3px;
}

/**
 * horizontal tabs generated by Skin::build_tabs()
 *
 * @see skins/skin_skeleton.php
 * @link http://www.dynamicdrive.com/style/csslibrary/item/shade-image-tabs-menu/P30/
 */

div#tabs_bar {
	position: relative;
	margin: 2em 0 1em 0;
	padding: 0 0 0 1em;
	line-height: 1.8em; /* to avoid tabs superposition */
	width: 80%; /* room on the right for avatars, etc. */
	border-bottom: 1px solid #c0c0c0;
}

div#tabs_bar ul {
	font-size: 12px;
	font-weight: bold;
	list-style-type: none;
	text-align: left; /* change to left, center, or right to align the menu as desired */
	margin: 1px 0 0 0;
	padding: 3px 0;
}

div#tabs_bar ul li {
	display: inline;
	margin: 0;
	padding: 0;
}

div#tabs_bar ul li a {
	text-decoration: none;
	padding: 3px 7px;
	margin-right: 3px;
	border: 1px solid #c0c0c0;
	border-bottom: none;
}

div#tabs_bar ul li.tab-background a {
	color: #2d2b2b;
	background: white url("ajax_tab_bg.gif") top left repeat-x;
}

div#tabs_bar ul li.tab-foreground a {
	color: #0066CC;
	background: white url("ajax_tab_bg_active.gif") top left repeat-x;
	border-bottom: 1px solid #fff;
}

div#tabs_panels {
	width: auto;
	padding: 0;
	margin: 1em 0 0 0;
	min-height: 300px;
	overflow: auto;
}

div#tabs_panels div.panel-foreground {
	display: block;
}

div#tabs_panels div.panel-background {
	display: none;
}

/**
 * styles for threads, used in articles/view_as_thread.php
 *
 * @see articles/view_as_thread.php
 */

div#thread_wrapper { /* around text and input field */
	position: relative;
	max-width: 700px; /* limit the width */
	margin: 1em 0;
	padding: 0 0 6px 6px;
}

div#thread_wrapper textarea#contribution { /* the main input field */
	width: 98%;
	margin: 0;
	padding: 3px;
	background-color: #eee;
	overflow: auto; /* add a vertical scroller if required */
	border: 1px dotted #aaa;
}

div#thread_wrapper button#submit { /* the submit button */
	cursor: pointer;
}

div#thread_files_panel {
	margin: 0;
	padding: 0;
}

div#thread_text_panel { /* where successive contributions are displayed */
	margin: 0 0 0.5em 0;
	padding: 0;
	height: 350px; /* ensure the input field is always visible */
	max-height: 350px;
	overflow: auto; /* add a vertical scroller if required */
	border: 1px dotted #ccc;
	background-color: #fcfcfc;
}

div#thread_text_panel dl dd { /* one contribution */
	margin: 0;
	padding: 0.3em 0.6em 0.3em 0.6em;
	text-align: left;
}

div#thread_text_panel dl dd.thread_me { /* one of my own contribution */
	border-top: 1px solid #d5d5d5;
	background-color: #ffffe5;
}

div#thread_text_panel dl dd.thread_other { /* one contribution from another surfer */
	background: transparent url("row_bg.gif") repeat-x;
}

div#thread_text_panel dl dt { /* contributor details */
	clear: both;	/* because of stacked rows */
	float: left;
/*	width: 120px; */
	margin: 0;
	padding: 0.3em 1em 0.3em 0.6em;
	text-align: left;
}

div#thread_text_panel dl dt.thread_me { /* my details */
}

div#thread_text_panel dl dt.thread_other { /* details about other contributor */
}

/**
 * styles used for locked threads
 */

dl.comments dd { /* comment content */
	margin: 0 0 1em 15px;
	padding: 0.6em;
	border-bottom: 1px solid #aaa;
	border-right: 1px solid #aaa;
	background-color: #E5DDCD;
}

dl.comments dt { /* poster name */
	font-size: 0.7em;
	margin: 0;
	padding: 0.3em 0.3em 10px 0.3em;
	background: transparent url("comment_dt_bg.gif") bottom left no-repeat;
}

dl.comments dd .details { /* some details in comments */
	font-size: 0.7em;
	color: #888;
}

/**
 * users and their presence
 */

div#extra_panel ul.compact li a.idle { /* user is present, yet idle */
	color: #888;
}