div.rightMenuArea {
direction: ltr;
}

#jsddm
{	margin: 0;
	padding: 0;
        margin-right: 10px;

}

	#jsddm li
	{	float: right;
		list-style: none;
		font: 12px Arial;
        background:url(../images/menu_border.jpg) center left no-repeat;
        height: 33px;
        line-height: 32px;
        direction: rtl;
		text-align: center;
		position: relative;
		padding-left: 15px;
		padding-right: 15px;
}
#jsddm li.nobg {
background: none;
}

	#jsddm li a
	{	display: block;
		color:#dbdbdb;
		white-space: nowrap;
        height: 33px;
        text-decoration: none;
        direction: rtl;
		font-size: 14px;
		font-weight: bold;
}

	#jsddm li a:hover	{ 	 }

		#jsddm li ul
		{	margin: 0;
			padding: 0;
			position: absolute;
			right: 0px;
            margin-right: 0px;
            margin-top: 1px;
			visibility: hidden;
            width: 180px;
            background: #fafbfd;
            padding-bottom: 5px;
            z-index: 99;
}

			#jsddm li ul li
			{
								float: left;
                                display: inline; /* I don't like it, but IE7 will only work this way... */
                                width: 180px;
                                height: 24px;
                                border-bottom: 1px dotted #ccc;
                                line-height: 24px;
                                background: none;
                                text-indent: 15px;
                                text-align: right;
                                padding-left: 0px;
                                padding-right: 0px;
                        }

			#jsddm li ul li:hover {
				float: left;
                                display: inline; /* I don't like it, but IE7 will only work this way... */
                                width: 180px;
                                background: #ccc;
}

			#jsddm li ul li a
			{	width: 180px;
				height: 24px;
				color: #586a6e;
				display: block;

}