/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* --- V2 bubble styles --- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

div.bubble {
	position: absolute;
	z-index: 100;
	top: 300px;
	left: 300px;	
	width: 240px;
}

div.bubble div.colourShell {
	padding: 0px 0px 0px 0px;
	color: #fff;	
}

div.bubble div.colourShell div.top {
	background-position: 0px 0px;
	height: 10px;
	overflow: hidden;
}

div.bubble div.colourShell div.content {
	padding: 0px 10px 0px 10px;
	background-color: #77e357;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	overflow: hidden;
}

div.bubble div.colourShell div.controls {
	padding-right: 10px;
	background-position: 0px -78px;	
	height: 22px;	
}

div.bubble div.colourShell div.tail {
	background-position: 0px -100px;	
	width: 29px;
	height: 13px;
	overflow: hidden;
}

/* --- drag bar --- */

div.bubble div.top span.dragbar {
	display: none;
}

div.editMode div.colourShell div.top {
	cursor: move;	
}

div.editMode div.colourShell div.top span.dragbar {
	display: block;
	height: 10px;
	background-image: url(../images/bubbleshell/dragbar.png);
	background-repeat: no-repeat;
	background-position: 0px -10px;
	overflow: hidden;
	cursor: move;
}

div.editMode div.colourShell div.top span.hover {
	background-position: 0px 0px;
}

/* --- text vs content --- */

div.bubble div.content div.view {
	display: block;
	padding-bottom: 5px;
}

div.bubble div.content div.view P {
	margin: 0px 0px 1em 0px;
}

div.bubble div.content div.view P.last {
	margin-bottom: 0px;
}

div.bubble div.content div.view A, div.bubble div.content div.view A:visited, div.bubble div.content div.view A:hover {
	color: white;
}

div.bubble div.content div.edit {
	display: none;
}

div.bubble div.content div.edit textarea {
	width: 100%;
	border: 1px solid #ccc;
	font-family: helvetica, Arial, Sans-Serif;
	font-size: 0.8em;
	height: 60px;
	overflow: auto;
}

div.bubble div.content div.edit textarea.disabled {
	background-color: #eee;
}

div.bubble div.content div.edit div {
	display: none;
}

div.bubble div.content div.edit input {
	border: 1px solid #ccc;
	font-family: helvetica, Arial, Sans-Serif;
	font-size: 1.4em;
	margin-bottom: 5px;
	padding: 2px;
	font-weight: bold;
	width: 212px;
}

div.bubble div.content div.edit input.prompt {
	color: #999;
}

div.bubble div.content div.edit input.hilight {
	background-color: #ff6;
	border-color: #666; 
	color: #000;
}

div.bubble div.content div.edit div span {
	display: block;
	font-weight: bold;
	padding-bottom: 2px;
}
div.bubble div.content div.edit div span span {
	font-weight: normal;
	display: inline;
}


/* ---------------------------------------------------------------------------------------- */
/* --- controls and related stuff --- */
/* ---------------------------------------------------------------------------------------- */
div.bubble div.colourShell div.controls p.userinfo {
	float: right;
	display: block;
}

div.bubble div.colourShell div.controls span.username {
	font-weight: bold;
}

div.bubble div.colourShell div.controls span.timestamp {
}

/* ---------------------------------------------------------------------------------------- */
/* --- buttons --- */
/* ---------------------------------------------------------------------------------------- */

div.bubble div.colourShell div.controls a.button {
	display: block;
	float: right;
	width: 20px;
	height: 20px;
	overflow: hidden;
	cursor: hand;
	background-image: url(../images/bubbleshell/buttons.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	display: none;
}

div.bubble div.colourShell div.controls a.yes {
	background-position: -40px 0px;
}
div.bubble div.colourShell div.controls a.yes:HOVER, 
div.bubble div.colourShell div.controls a.yes:FOCUS,
div.bubble div.colourShell div.controls a.yes:ACTIVE
 {
	background-position: -40px -20px !important;
}


div.bubble div.colourShell div.controls a.no {
	background-position: -20px 0px;
}
div.bubble div.colourShell div.controls a.no:HOVER, 
div.bubble div.colourShell div.controls a.no:FOCUS,
div.bubble div.colourShell div.controls a.no:ACTIVE
 {
	background-position: -20px -20px !important;
}

div.bubble div.colourShell div.controls a.colour {
	background-position: 0px 0px;
}
div.bubble div.colourShell div.controls a.colour:HOVER, 
div.bubble div.colourShell div.controls a.colour:FOCUS,
div.bubble div.colourShell div.controls a.colour:ACTIVE
 {
	background-position: 0px -20px !important;
}



.linkto {
	display: none;
	visibility: hidden;
	font-size: 0.1em;
}

/* ---------------------------------------------------------------------------------------- */
/* --- bubble modes --- */
/* ---------------------------------------------------------------------------------------- */

div.editMode div.contentView,
div.editMode div.colourShell div.controls span.username {
	display: none;
}

div.editMode div.content div.edit,
div.editMode div.colourShell div.controls a.yes,
div.editMode div.colourShell div.controls a.no,
div.editMode div.colourShell div.controls a.colour {
	display: block;
}

div.mouseOver div.colourShell div.controls a.linkto {
	display: block;
}

div.mouseOver {
	z-index: 99999;
}


/* ---------------------------------------------------------------------------------------- */
/* --- end of stylesheet --- */
/* ---------------------------------------------------------------------------------------- */