﻿* {
    margin: 0; 
    padding: 0; 
    outline: 0;/**/
}

html,body {

	height: 100%; /* needed for container min-height */
	font-family: Tahoma, Helvetica, sans-serif;
	font-size: 12px;

}

html {overflow-y: scroll;/*overflow: -moz-scrollbars-vertical;*/}
/*body{overflow: -moz-scrollbars-vertical; overflow-y:scrool;}*/
table {
    border-spacing: 0px;
    border-collapse: collapse;
}

* {padding:0;margin:0;}
html, body {height:100%}


.mfxClientNotification {padding-bottom:1em !important;}

.loginTable {
    margin: 50px -2px 0; 
    width:170px;
}

.divRssContainer{
	overflow:auto;
}

.divRssContainer h2 {
	font-size:120%;
	margin-bottom:1em;
}

.divRssContainer p 
{
	margin-bottom:1em;
	margin-top:0.5em;
}

.divRssContainer dt
{
	font-weight:bold;
}

.divRssContainer dd
{
	margin-bottom:1em;
	margin-left:1.2em;
}

.divRssContainer blockquote
{
	margin-left:1em;
	margin-top:1.2em;
	margin-bottom:1.2em;
}

.loginTable td {
    padding: 1px;
}

ul.ulNavBar {
	width:220px !important;
}

input.buddySearch{
	background:transparent url(images/icn_find.gif) no-repeat scroll right center;
	border:1px solid #6C92B0;/* .ownerScrap.border */
	display:block;
	font-size:11px;
	height:17px;
	margin-bottom:2px;/*6px;*/
	margin-left:3px;
	margin-top:1px;/*3px;*/
	width:96%;
	color:#cccccc;
	padding-top:2px;
	padding-left:2px;
}
input.buddySearch.focused{
	color:#000000;
}

.buddy {
	
}

/* translation */
#TranslationDialogContainer{
	padding:20px;padding-top:5px;font-size:90%;
	width:435px;
	/*background:yellow;*/
	padding-bottom: 0 !important;
}

#TranslationDialogContainer p, #TranslationDialogContainer h2 {
	margin-bottom:1em;	
} 

#TranslationDialogContainer .question .formButton {
	float:right;
}

#TranslationDialogContainer .question {
	clear:both;
	line-height:2em;
}

#TranslationDialogContainer .question strong {
	position:relative;
	top:1px;
	float: left;
}

#TranslationDialogContainer .phrase {
	font-size: 150%;
	margin-left: 1em;
	margin-bottom: 0;
}

#TranslationDialogContainer .usageExample {

}

#TranslationDialogContainer blockquote {
	margin-left: 2em;
	margin-bottom: 1em;
}

#TranslationDialogContainer dl {
	border-bottom: 1px #dddddd solid;
	margin-left: 1px;
	clear: both;
}

#TranslationDialogContainer dd {
	margin-left: 3em;
	margin-bottom: 1em;
}

#TranslationDialogContainer .actionButton
{
	float:right;
}

#SubmitTranslationButton
{
	margin-right: 13px
}

#TranslatorOptions {
	border-bottom: 1px solid;
	margin-bottom: 1em;
}

#TranslatorOptions .floated
{
	float:left;
	width:100px;
	width:260px;
}

#TranslationDialogContainer .phraselist {
		float:left;
		width: 432px;
		_width: 430px;
		_margin-left:0;
		_margin-right:0;
		_padding-left:0;
		_padding-right:0;
}

#TranslationDialogContainer .phraselist dd a
{
	_position:relative;
	_left:15px;
}

#TranslationDialogContainer .defaultTranslationText 
{
	color: #cccccc;
}

#TranslationDialogContainer .hover {
	background: #dadada;
}

#TranslationDialogContainer #DefaultPhraseContainer {
	border-bottom: 1px #ffffff solid; /* fixes a render bug in Firefox 3.x */
}

#TranslationDialogContainer .phraselist dt {
	width: 270px;
	float: left;
	padding-left:10px;
	padding-top: 6px;

}

#TranslationDialogContainer .phraselist dd {
	width: 125px;
	float: right;
	margin-left: 0;
	margin-right: 10px;
	text-align: right;
	padding-top:6px;
}

#TranslationDialogContainer .alternateExample p {
	padding-left: 10px;
}

#TranslationDialogContainer .alternateExample dd a 
{
}

#TranslationDialogContainer .alternateExample {
	border:1px solid;
	padding:0;
}

#TranslationDialogContainer .usageExample
{
	margin-left: 18px;
	margin-top: 10px;
}

#TranslationDialogContainer .usageExample a,  #TranslationDialogContainer .question a, #TranslationDialogContainer .phraselist dt a, #TranslationDialogContainer .alternateExample dt a, #TranslationDialogContainer .alternateExample p a{
	color: #0000cc;
}

#TranslationDialogContainer  .usageExample a:hover, #TranslationDialogContainer .question a:hover, #TranslationDialogContainer .phraselist dt a:hover, #TranslationDialogContainer .alternateExample dt a:hover, #TranslationDialogContainer .alternateExample p a:hover {
	color: #000000;
}

#TranslationDialogContainer .formLoading{
	position: static;
	xmargin: 5% 45%;
}


#TranslationDialogContainer .phraseSeparator {
	clear:both;
	margin-bottom:2px;
}

.clearAll {
	clear: both;
}

/* buddylist */
#buddyList.size1 .divBuddyName {width:138px}
#buddyList.size2 .divBuddyName {width:168px}
#buddyList.size3 .divBuddyName {width:198px}
#buddyList.size4 .divBuddyName {width:243px}
#buddyList.size5 .divBuddyName {width:348px}

#MiniDisclaimer
{
font-size:9px;
padding-bottom:4px;
padding-left:4px;
padding-right:4px;
padding-top:4px;
position:absolute;
right:-2px;
text-align:right;
top:-9px;
width:319px;	
}

* html #MiniDisclaimer{right:120px;}

#MiniDisclaimer a {
color:#000000
}

/* Beta Feedback link
*********************************************************************/
	/* Test this in IE6/7/8 FF and Opera when you change something, 
	 * any slight change may affect footer positioning and create a vertical scroll bar.
	 * MAKE SURE YOU TEST ALL TARGET BROWSERS. v.o.:2009-06-10
	 */
	 
	/* Modern browsers  */
		#mainBetaFeedback{
			display:block;
			height:15px;
			background:transparent url(images/betaFeedBackBg.png) repeat scroll 0 0;
			padding-top:13px !important;
			padding-bottom:1px !important;
			position:relative;
			bottom:12px;
		}

		#mainBetaFeedback a{
			color:#ffffff !important;
			text-decoration:underline !important;
			padding-left:10px;
		}
		
		#mainBetaFeedback a:hover {text-decoration:none}

	/* ie7-only (not including IE8) */
		html>body #mainBetaFeedback
		{
			*position:absolute;
			*top: -14px !important;
		}		
		
	/* ie6 and below */
		* html #mainBetaFeedback {
			position:absolute;
			top: -14px !important;
		}


/* Layout
*********************************************************************/
div#container {
	margin: 0 auto; /* center, not in IE5 */
	min-height: 100%; /* real browsers */
}

* html div#container {
	height: 100%; /* IE6: treaded as min-height*/
}

#footer {
	height:20px;
	padding-top:10px;
	margin-top:-40px !important;
}

html>body #footer /*v.o. IE7-only hack */
{
	*margin-top:-54px !important;
}

html>body #bottomMenuBar { /*v.o. IE7-only hack. */
	*position:relative; 
	*top:15px !important;
}

#frmAvatar {
	filter: alpha(opacity=0);
	opacity: 0;
	-moz-opacity: 0;
	-khtml-opacity: 0;
	position:absolute;
	left:-9999999;	
}

* html div#bottomLine /* I hate IE6! */
{
	height:17px !important;
	font-size:1px;
	padding:0;margin:0;
}

div#header {/*Todo: height:15%;(firefox)*/
    /*height:15%;*/
    min-height:10px;
    
}

div#content {
	/*padding:1em 1em 1em; bottom padding for footer */
}

div#main {
	width:728px;
	margin: 6% auto;
	margin-bottom:15px;
}

/*#divToolbarItemsContainer {display:none;}*/


/*********************************************************************/

/* Helpful Classes 
*********************************************************************/
.hide {
    display : none;
}

.show {
    display : block;
}

.width100 { 
    width: 100%; 
}

.width75 { 
    width: 75%; 
}

.width50 { 
    width: 50%; 
}

.floatLeft { 
    float: left !important; 
}

.floatRight { 
    float: right !important; 
}

.clearBoth {
    clear: both;
}

.alignLeft { 
    text-align: left; 
}

.alignRight { 
    text-align: right; 
}
.alignCenter { 
    text-align: center; 
}
.smallBold {
    font-weight: bold;
    font-size: 11px; 
}
.smallItalic {
    font-style: italic;
    font-size: 11px; 
}

.boldText {
    font-weight: bold;
}
.normalText { 
    font-size: 12px; 
}
.smallText { 
    font-size: 11px; 
}
.xsmallText { 
    font-size: 10px; 
}
.xxsmallText { 
    font-size: 9px; 
}
.largeText { 
    font-size: 14px; 
}
.xlargeText { 
    font-size: 16px; 
}
.xxlargeText { 
    font-size: 19px; 
}
.xxxlargeText { 
    font-size: 21px; 
}
.whiteText {
    color: #fff;
}
.blackText {
    color: #000;
}
.grayText {
    color: #666;
}
.blueText {
    color: #8DBAE6;
}
.redText {
    color: #F00;
}
.xnarrow
{
    width:60px;
}
.narrow
{
    width:90px;
}
.normalwide
{
    width:150px;
}
.wide
{
    width:200px;
}
.xwide
{
    width:250px;
}
.mLeft5
{
	margin-left:5px;
}
.mLeft10
{
	margin-left:10px;
}

.disabled {
	display:block;
	float:left;
	background-color:#EDEDED;
	border:solid 1px #DBDBDB;	
	margin-right:2px;
	_margin-right:0px;
	padding: 2px;
	width:146px;
}

.signupInfoIcon{
	background: transparent url('images/info.png') no-repeat;
	_background: transparent;
	_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://themes.messengerfx.com/Themes/images/info.png', sizingMethod='scale');
	float:left;
	margin:3px;
	width:32px;
	height:32px;
}


/* Fix
**************************************************/
.pngzIndexFix {
	position:relative;
	z-index:1;	
}


/* Rounded Dialog
************************************************/

.bRound *, .rOverlay div { background: #000; border-color: #000; }
.wRound *, .wOverlay  { background: #fff; border-color: #fff; }

.rOverlay {
	position: absolute;
	z-index: 0;

	filter: alpha(opacity=40);
	opacity: 0.4;
	-moz-opacity: 0.4;
	-khtml-opacity: 0.4;
	
}

.round { display: block; }
.round * { display: block; height: 1px; overflow: hidden; font-size: 0; }
.round1 { padding: 0 1px; margin: 0 3px; }
.round2 { padding: 0 1px; margin: 0 1px; }
.round3 { margin: 0 1px; }
.round1, .round2, .round3, .round4, .round5 {
	border-width: 0 1px;
	border-style: solid;
}


/* Rounded Dialog End
************************************************/

/* ScreenShot glider */
div.scroller { 
	/* modify width and height of scrolling section if necessary	*/		
	width: 230px; 
	height: 75px;
	overflow: hidden;
	border:0px solid #cccccc;
}
	div.scroller div.section {
		/* modify width and height of each section as needed (should match the size of the scroller window)	*/		
		width:230px;
		height:75px;
		overflow:hidden;
		float:left;
		padding:10px 8px;		
	}
	div.scroller div.content {
		width: 10000px;
	}
	img.screenshot1,img.screenshot2,img.screenshot3,img.screenshot4{
		width:100px;
		height:57px;	
	}