body{ font: 62.5% Verdana, sans-serif;background: transparent;}

span, legend, label { font-size: 10px;}

label { font-weight: bold; margin-top: 5px;}
input, textarea { border: 1px solid #A6C9E2;}
span.label { border: 0px; font-weight: bold; vertical-align: center;}
span.text { border: 0px;}
.xnd-date { width: 75px; }
/*

/*
 * Styles for relationdisplay	
*/
#existing-relations {font-size: 0.7em; width: 400px;}
#existing-relations div {margin: 2px; padding: 5px;}
#existing-relations div.related-category {background: lightblue; margin: 2px; padding: 5px; padding-right: 3px;}
#existing-relations div.related-article {display: block; background: lightblue; margin-bottom: 2px; margin-left: 15px; padding: 3px;}
#existing-relations div.related-article em {float: right;}

/* 
 * Related to description headers 
*/
#header-description {float: right;padding-right: 20px;}
#header-description img {margin-top: 3px;}
#header-description em {position:relative;top:5px;}

.ui-tabs .ui-tabs-panel {padding:0px 0px 0px 0px;}

/*
 * Spinner settings
*/
.ui-loader {display:none;left:50%;margin-left:-130px;opacity:0.85;padding:20px 30px;position:absolute;top:75px;width:200px;z-index:10;}
.ui-body-a {background:#222222;}
.ui-body-a {background:-moz-linear-gradient(center top , #666666, #222222) repeat scroll 0 0 #222222;border:1px solid #2A2A2A;color:#FFFFFF;font-weight:normal;text-shadow:0 1px 0 #000000;}
.ui-loader .ui-icon {background-color:transparent;display:block;height:35px;margin:0 auto;opacity:0.9;position:static;width:35px;}
.ui-icon-loading {-moz-border-radius:20px 20px 20px 20px;background-image:url("../images/ajax-loader.png") !important;height:40px;width:40px;}
.ui-loader h1 {font-size:15px;text-align:center;}

*	COMMON LAYOUT PANE FORMATTING
*/
.pane ,				/* outer pane class */
.ui-layout-pane {	/* inner pane class */
	background-color: #FFF;
	border: 1px solid #A6C9E2;
	padding: 0;/* alignment & padding is on the inner-divs */
	overflow: auto; /* will be auto-set to 'hidden' for any pane with a 'scrolling content div' */
}


/*
*	OUTER-LAYOUT PANE FORMATTING
*/

.pane-north .content ,
.pane-south .content {
	text-align: center;
}
.pane-north {
	border-bottom: none;
}
.pane-center {
	/* show off the inner-layout inside the outer-center-pane*/
	background-color: #F6F6F6;
	border: 1px solid #777;
	/*padding: 15px;*/ /* for outer layout */
}

/* inner divs inside Outer East/West panes */
.header { 
	border:0 none;
	color:white;
	border-bottom: 1px solid #777;
	font-weight: bold;
	line-height:1.3;
	text-align: center;
	padding: 2px 0 4px;
	position: relative;
	overflow: hidden;
	padding:0.5em 1.7em;
}

.subhead ,
.footer {
	background: #d6d6d6 url(../img/d6d6d6_40x100_textures_02_glass_80.png) 0 50% repeat-x;
	padding: 3px 10px;
	font-size: 1em;
	position: relative;
	overflow: hidden;
}
.footer  { border-top: 1px solid #777; }
.subhead { border-bottom: 1px solid #777; }
.content {
	padding: 10px;
	position: relative;
}



/* here */

	.fg-button { outline: 0; margin:0 4px 0 0; padding: .4em 1em; text-decoration:none !important; cursor:pointer; position: relative; text-align: center; zoom: 1; }
	.fg-button .ui-icon { position: absolute; top: 50%; margin-top: -8px; left: 50%; margin-left: -8px; }
	a.fg-button { float:left; }
			
	/* remove extra button width in IE */
	button.fg-button { width:auto; overflow:visible; }
			
	.fg-button-icon-left { padding-left: 2.1em; }
	.fg-button-icon-right { padding-right: 2.1em; }
	.fg-button-icon-left .ui-icon { right: auto; left: .2em; margin-left: 0; }
	.fg-button-icon-right .ui-icon { left: auto; right: .2em; margin-left: 0; }
			
	.fg-button-icon-solo { display:block; width:8px; text-indent: -9999px; }	 /* solo icon buttons must have block properties for the text-indent to work */	
			
	.fg-buttonset { float:left; }
	.fg-buttonset .fg-button { float: left; }
	.fg-buttonset-single .fg-button, 
	.fg-buttonset-multi .fg-button { margin-right: -1px;}
		
	.fg-toolbar { padding: .2em; margin: 0.3em 0 0;  }
	.fg-toolbar .fg-buttonset { margin-right:1.5em; padding-left: 1px; }
	.fg-toolbar .fg-button { font-size: 1em;  }

	.ui-fieldset { border: 1px solid #79b7e7; background: #f5f8f9 url(../images/ui-bg_inset-hard_100_f5f8f9_1x100.png) 50% 50% no-repeat; /*font-weight: bold; color: #e17009;*/ outline: none; }

/* gripper for resizable textareas */
div.grippie {background:#EEEEEE url(../images/grippie.png) no-repeat scroll center 2px;border-color:#DDDDDD;border-style:solid;border-width:0pt 1px 1px;cursor:s-resize;height:9px;overflow:hidden;}
.resizable-textarea textarea { display:block;margin-bottom:0pt;width:95%;height: 20%;}
/* style for tags */
SPAN.tagMatches {margin-left: 10px;}
SPAN.tagMatches SPAN {padding: 2px;margin-right: 4px;background-color: #0000AB;color: #fff;cursor: pointer;}

/* cupid green (inspired by okcupid.com)
*******************************************************************************/
button.cupid-green {
  background: #7fbf4d;
  background: -moz-linear-gradient(top, #7fbf4d 0%, #63a62f 100%);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7fbf4d), to(#63a62f));
  border: 1px solid #63a62f;
  border-bottom: 1px solid #5b992b;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: inset 0 1px 0 0 #96ca6d;
  -webkit-box-shadow: inset 0 1px 0 0 #96ca6d;
  box-shadow: inset 0 1px 0 0 #96ca6d;
  color: #fff;
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  font-size: 11px;
  font-weight: bold;
  line-height: 1;
  padding: 7px 0 8px 0;
  text-align: center;
  text-shadow: 0 -1px 0 #4c9021;
  width: 150px;
}

button.cupid-green:hover {
  background: #76b347;
  background: -moz-linear-gradient(top, #76b347 0%, #5e9e2e 100%);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#76b347), to(#5e9e2e));
  -moz-box-shadow: inset 0 1px 0 0 #8dbf67;
  -webkit-box-shadow: inset 0 1px 0 0 #8dbf67;
  box-shadow: inset 0 1px 0 0 #8dbf67;
  cursor: pointer;
}

button.cupid-green:active {
  border: 1px solid #5b992b;
  border-bottom: 1px solid #538c27;
  -moz-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eee;
  -webkit-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eee;
  box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eee;
}

/*
  Attribute selectors are used to differentiate the different types
  of input elements, but to support old browsers, you will have to
  add classes for each one. ".title" simply creates a large text
  field, this is purely for looks.
 */
input[type=text], input[type=password], input[type=url], input[type=email],
input.text, input.title,
textarea {
  background-color:#fff;
  border:1px solid #bbb;
  color:#000;
}
input[type=text]:focus, input[type=password]:focus, input[type=url]:focus, input[type=email]:focus,
input.text:focus, input.title:focus,
textarea:focus {
  border-color:#666;
}
select { background-color:#fff; border-width:1px; border-style:solid; }

input.text,
input.title { width: 300px; padding:5px; }
input.title { font-size:1.5em; }
textarea    { width: 390px; height: 250px; padding:5px; }

/* Success, info, notice and error/alert boxes
-------------------------------------------------------------- */

.error,
.alert,
.notice,
.success,
.info { padding: 0.8em; margin-bottom: 1em; border: 2px solid #ddd; }

.error, .alert { background: #fbe3e4; color: #8a1f11; border-color: #fbc2c4; }
.notice        { background: #fff6bf; color: #514721; border-color: #ffd324; }
.success       { background: #e6efc2; color: #264409; border-color: #c6d880; }
.info          { background: #d5edf8; color: #205791; border-color: #92cae4; }
.error a, .alert a { color: #8a1f11; }
.notice a          { color: #514721; }
.success a         { color: #264409; }
.info a            { color: #205791; }


