/**
* Style rules for the MessageBuffer
*/

/**
* the body defaults
*/
body {
margin-left: 8px;
margin-right: 8px;
}

/**
* The table column formats
*/

div.Message {
padding-bottom: 8px;
clear: both;
display: block;
padding-left: 8px;
}

div.Message:first-child {
padding-top: 0px;
}

div.Message:last-child {
padding-bottom: 0px;
}

div.BubbleSelf {

-moz-border-radius: 8px;
border-style: solid;
border-width: 1px;

margin-left: 0px;
margin-right: 0px;
vertical-align: middle;
padding: 4px 8px;

display: inline-block;
width: 616px;
min-height: 56px;
/* overflow: hidden; this bugs mouse events. see bug #123077 */
}

div.BubbleOther {

-moz-border-radius: 8px;
border-style: solid;
border-width: 1px;

margin-left: 70px;
margin-right: 0px;
vertical-align: middle;
padding: 4px 8px;

display: inline-block;
width: 616px;
min-height: 56px;
/* overflow: hidden; this bugs mouse events. see bug #123077 */
}

div.BubbleSpacer {
padding: 0px;
margin: 0px;
vertical-align: middle;
display: table-cell;
width: 664px;
max-width: 664px;
height: 52px;
}

div.BubbleSelfClicked {
-moz-border-radius: 8px;
border-style: solid;
border-width: 1px;

margin-left: 0px;
margin-right: 0px;
vertical-align: middle;
padding: 4px 8px;

display: inline-block;
width: 616px;
min-height: 56px;
/* overflow: hidden; this bugs mouse events. see bug #123077 */
}


div.BubbleOtherClicked {
-moz-border-radius: 8px;
border-style: solid;
border-width: 1px;
text-shadow: 0.1em 0.1em #000;

vertical-align: middle;
padding: 4px 8px;
margin-left: 70px;

display: inline-block;
width: 616px;
min-height: 56px;
/* overflow: hidden; this bugs mouse events. see bug #123077 */
}

/**
* Others' Avatars
*
* This needs a "drop down" shadow, but no idea if that can be done
*Adele: please note that this drop down shadow might be subjected to change
*I've talked about it with Vilja who's in charge of address book layout
*and we might change it so that it's a double border colour to indicate
*that the avatar is clickable. drop shawdow doesn't seem to work with
*dark backgrounds unless it's a light colour drop shadow.
*PLEASE tell me if it's difficult to implement the drop shadow.
* Looks like drop shadow is dropped from ui specs. And bug 139130 made me
*remove the space for it anyway.
*/

div.Avatar {
width: 64px;
display: inline-block;
vertical-align: middle;
}

.MessageAvatar {
width: 64px;
height:64px;
outline-style: solid;
outline-width: 1px;
-moz-outline-radius: 6px;
}

img.MessagePresence {
vertical-align: middle;
width: 16px;
height: 16px;
}

/**
* the Name field
*/
span.MessageNameField {
word-wrap: break-word;
vertical-align: middle;
}

/**
* the Text field
*/
span.MessageText {
text-align: left;
vertical-align: middle;
word-wrap: break-word;
}

/**
* the TimeStamp default rules
*/
div.MessageRight {
float: right;
padding-left: 16px;
white-space: nowrap;
text-align: right;
display: inline-block;
}

img.MessageBusinessCardImg {
vertical-align: middle;
padding-right: 4px;
}

img.MessageStatusImg {
vertical-align: middle;
padding-right: 8px;
}

.MessagingWidgetsSmiley {
height: 24px;
width: 24px;
}