﻿/* --- View --- */

#uxArticleView { line-height: 1.8em; }

#uxArticleView dfn { border-bottom: dotted 1px; cursor: help; }

#uxArticleView h1 { font-size: 1.4em; line-height: 26px; margin-bottom: 1em; }
#uxArticleView .description img { float: left; margin-right: 1em; margin-bottom: 1em; border: dashed 1px #7FDCFE; padding: 1px; }
#uxArticleView ul.actionPanel { position: relative; clear: left; width: 436px; height: 22px; margin-bottom: 0.4em; text-align: left; border: solid 1px #CBCBCB; background-color: #F8F8F8; padding: 0.2em 0.6em; }
#uxArticleView .actionPanel li { float: left; }
#uxArticleView .actionPanel a { text-decoration: none; color: #595959; display: block; }
#uxArticleView .actionPanel a:hover { text-decoration: underline; }

#uxArticleView .actionPanel a.sendMessage { background: url(images/sendMessage.gif) no-repeat right 70%; padding-right: 24px;}
#uxArticleView .actionPanel a.printMe { background: url(images/printMe.gif) no-repeat right 80%; padding-right: 16px;}
#uxArticleView .actionPanel a.sendFriend { background: url(images/send2friend.gif) no-repeat right 60%; padding-right: 16px;}
#uxArticleView .actionPanel a.addMyFavorite { background: url(images/add2Fav.gif) no-repeat right 70%; padding-right: 16px;}

#uxArticleView .googleAds {float:left; margin-bottom:10px; margin-left:-10px; .margin-left:0px; .margin-right:-6px;}

#uxArticleView dt.from { color: #A45466; }
#uxArticleView dt { display:inline; font-weight: bold; }
#uxArticleView dd { color: #595959; display:inline; }
#uxArticleView dd a { color: #595959; text-decoration: none; }
#uxArticleView dd a:hover { text-decoration: underline; }

#uxArticleView .description { padding-bottom: 1em; position: relative; width: 100%; }
#uxArticleView #ArticleContent { width: 100%; overflow-x: auto; }
#uxArticleView #ArticleContent strong { font-weight: bold; }

#uxArticleViewExtra { line-height: 1.8em; }

#uxArticleViewExtra dt { float: right; clear: right; font-weight: bold; }
#uxArticleViewExtra dd { float: right; color: #0274FD; }

#uxArticleViewExtra dl.alt dt { float: right; clear: right; font-weight: bold; }
#uxArticleViewExtra dl.alt dd { float: left;clear: left; padding-left: 30%; width:100px; text-align:left; color: #595959; }

#uxArticleViewExtra ul.grade li { cursor: pointer; float: left; padding: 0 0.3em; line-height:1.4em; margin-right: 0.2em; background-color: red; color: White; }

#uxArticleViewExtra .stars div { background: url('bgImages/star.jpg') repeat-x left 50%; float: left;}
#uxArticleViewExtra .stars .s0 { width: 60px; background: none; }

#uxArticleViewExtra .stars .s1 { width: 6px; }
#uxArticleViewExtra .stars .s2 { width: 12px; }

#uxArticleViewExtra .stars .s3 { width: 18px; }
#uxArticleViewExtra .stars .s4 { width: 24px; }

#uxArticleViewExtra .stars .s5 { width: 30px; }
#uxArticleViewExtra .stars .s6 { width: 36px; }

#uxArticleViewExtra .stars .s7 { width: 42px; }
#uxArticleViewExtra .stars .s8 { width: 48px; }

#uxArticleViewExtra .stars .s9 { width: 54px; }
#uxArticleViewExtra .stars .s10 { width: 60px; }

#uxArticleViewExtra .adText { cursor: pointer; font-size: 16px; font-weight: bold; text-align: center; }

/* --- List --- */

.MArticleList .noResults {font-size: 16px; font-weight: bold;}
.MArticleList div.noResults {float: left; margin-left: 1em; text-align: center;}
.MArticleList p.noResults {padding: 3em;}
.MArticleList p.noResultsP {padding: 3em; text-align:center;}

.MArticleList { background: url(bgImages/dottedSides.gif) repeat-y center top; padding-right: 11px; width: 731px; position: relative; padding-top: 52px; padding-bottom: 16px; float: right; }
.MArticleList .header { position: absolute; left: -2px; top: 0px; background:url(bgImages/header.jpg) no-repeat left top;height:37px;width: 745px; }
.MArticleList .header h2 { width: 734px; padding-top: 13px; padding-right: 11px; font-size: 14px; }
.MArticleList .header div { position: absolute; left: 19px; top: 13px; font-size: 13px; font-weight: bold; }
.MArticleList .header div a { color: gray; text-decoration: none; }
.MArticleList .header div a:hover { text-decoration: underline; }
.MArticleList .header div .mbSort a:hover { text-decoration: underline; }
.MArticleList .footer { position: absolute; right: 1px; bottom: 6px; background:url(bgImages/footer.jpg) no-repeat 2px top;height:11px;width: 745px; }

.MArticleList .content ul { width: 100%; position: relative; float: right; }
.MArticleList .content li { float: right; width:159px; height:150px; margin-right: 10px; margin-bottom: 10px; padding: 4px; padding-top: 17px; position: relative; }
.MArticleList .content li.blue      { background:url('bgImages/video-b.jpg') no-repeat; }
.MArticleList .content li.orange    { background:url('bgImages/video-o.jpg') no-repeat; }

.MArticleList .content li img { width: 159px; height: 108px; border: none 0px; }
.MArticleList .content li a { display: block; color:#9B4857; text-decoration: none; }
.MArticleList .content li a strong { font-weight:bold; font-size:12px; line-height: 12px; margin-top: 2px; padding-right: 17px; display: block;}
.MArticleList .content span { font-size: 11px; line-height: 12px; }
.MArticleList .content span.category { display: block; padding-right: 17px; }
.MArticleList .content span.watchCount { float: right; padding: 8px 17px 0px 0px; width: 80px; }
.MArticleList .content span.grade { float: right; padding-top: 8px; }

.MArticleList .header div ul                {}
.MArticleList .header div ul li             {float: left;  color:#626362}
.MArticleList .header div ul li a           {color:#626362; text-decoration:none display: block;}
.MArticleList .header div ul li a:hover     {text-decoration:none}
.MArticleList .header div ul li a.Current   {font-weight:bold; text-decoration: underline;}

.MArticleList div.paging { width: 100%; text-align: center; padding: 0.4em 0px; clear: both; font-size: 14px; margin-bottom: 3px;}
.MArticleList div.paging a { background-color: #BACCD0; text-decoration: none; color: #000; padding: 2px 0px; border: solid 1px #626362; }
.MArticleList div.paging a:hover { background-color: #626362; color: #FFF; padding: 2px 0px; border: solid 1px #BACCD0; }
.MArticleList div.paging span { background-color: #626362; color: #FFF; padding: 2px 0px; border: solid 1px #BACCD0; }
    
