.foo { }
/****************************************************************************************************/
/* The contents of this file are subject to the nopCommerce Public License Version 1.0 ("License"); you may not use this file except in compliance with the License.
/* You may obtain a copy of the License at  http://www.nopCommerce.com/License.aspx. 
/* 
/* Software distributed under the License is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. 
/* See the License for the specific language governing rights and limitations under the License.
/* 
/* The Original Code is nopCommerce.
/* The Initial Developer of the Original Code is NopSolutions.
/* All Rights Reserved.
/* 
/* Contributor(s): RetroViz Design. 
/****************************************************************************************************/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	SEARCH PAGE
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.searchPanel { margin-bottom: 15px; padding: 20px 100px; }
.searchPanel .title { padding: 10px 10px 5px 0px; font-weight: bold; text-transform: uppercase; clear: both; }
.searchPanel .searchInput { border: 1px solid rgb(232, 230, 210); padding: 10px; }
.searchPanel .searchResults { padding-top: 10px; }
.searchPanel .searchResults .result { font-weight: bold; color: #555; }
.searchResults .ProductGrid { width: 100%; margin: 0 auto; }
.searchResults .ProductGrid .ProductItem { float: left; width: 175px; height: 240px; }
.searchResults .pager { padding: 15px 0px; text-align: center; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	CONTACT US FORM
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.contactform h4 { color: #FF9900; font-size: 16px; margin: 0px; padding-bottom: 5px; border-bottom: dashed 1px #eee; margin-bottom: 5px; }
.contactform .htmlcontent { margin: 10px 0; }
.contactform .htmlcontent p { margin: 0px; padding: 0px; }
.contactform .button { text-align: right; }
.contactform .sendEmail { margin-top: 10px; }
.contactform .contactform { }

.contactchina { margin-bottom: 50px; }
.contact_title { color: #FF9900; font-size: 15px; margin-bottom: 10px; }
.contact_title span { font-size: 10px; color: #555; margin-left: 10px; }
.contact-src { float: left; width: 30%; }
.contact-address { float: right; width: 70%; text-align: left; padding-top: 5px; }
.contact-address p { text-align: left; }
.contact-address p img { vertical-align: middle; }
.sendEmail .TableContainer .ItemValue input { width: 300px; }
.sendEmail .colbutton { text-align: left; padding-top: 10px; }
.sendEmail .colbutton a { background-image: url(/images/submit.gif); background-repeat: no-repeat; height: 26px; width: 106px; display: block; }
.contact-address label { float: left; width: 100px; font-weight: bold; }
.contact-address .content { float: left; padding: 0px; margin: 0px; width: 360px; }
.contact-address .content .bold { color: #FF9900; font-weight: bold; }
.sendEmail input, .sendEmail textarea { width: 250px; margin-bottom: 5px; }
.contact-address .clear { height: 25px; }
.sendEmail .TableContainer ul.infos li { color: green; font-size: 11px; }
.sendEmail .TableContainer ul.infos li span { margin-right: 1px; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	BREADCRUMB
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.breadcrumb { float: left; padding: 0px; margin: 10px 0px 10px 5px; }
.breadcrumb a { text-decoration: none; color: #3A4045; margin-right: 5px; }
.breadcrumb b { margin: 0 5px; font-weight: normal; }
.breadcrumb a:hover { text-decoration: underline; }

div.breadcrumbs { overflow: hidden; margin: 10px 0px 10px 0px; padding: 0; height: 30px; line-height: 30px; border: 1px solid #eee; -webkit-border-radius: 3px; -moz-border-radius: 3px; }
div.breadcrumbs a, div.breadcrumbs em, div.breadcrumbs span { float: left; overflow: hidden; height: 30px; padding: 0 8px; font-style: normal; }
div.breadcrumbs span { background: url(images/bg-breadcrumb.png) no-repeat left center; overflow: hidden; padding: 0 0 0 10px; width: 0px; filter: alpha(opacity=40); opacity: 0.4; }


/* ----------- Pagination: Digg Style --------- */
.pagination-digg li { border: 0; margin: 0; padding: 0; font-size: 11px; list-style: none; /* savers */ float: left; }
.pagination-digg a { border: solid 1px #9aafe5; margin-right: 2px; }
.pagination-digg .previous-off, .pagination-digg .next-off { border: solid 1px #DEDEDE; color: #888888; display: block; float: left; font-weight: bold; margin-right: 2px; padding: 3px 4px; }
.pagination-digg .next a, .pagination-digg .previous a { font-weight: bold; }
.pagination-digg .active { background: #2e6ab1; color: #FFFFFF; font-weight: bold; display: block; float: left; padding: 4px 10px; /* savers */ margin-right: 2px; }
.pagination-digg a:link, .pagination-digg a:visited { color: #0e509e; display: block; float: left; padding: 3px 8px; text-decoration: none; }
.pagination-digg a:hover { background-color:#2e6ab1; color:#fff; }

/* ------------- Pagination: Flickr -----------	*/
.pagination-flickr li { border: 0; margin: 0; padding: 0; font-size: 11px; list-style: none; /* savers */ float: left; }
.pagination-flickr a { border: solid 1px #DDDDDD; margin-right: 2px; }
.pagination-flickr .previous-off, .pagination-flickr .next-off { color: #666666; display: block; float: left; font-weight: bold; padding: 3px 4px; }
.pagination-flickr .next a, .pagination-flickr .previous a { font-weight: bold; border: solid 1px #FFFFFF; }
.pagination-flickr .active { color: #ff0084; font-weight: bold; display: block; float: left; padding: 4px 6px; }
.pagination-flickr a:link, .pagination-flickr a:visited { color: #0063e3; display: block; float: left; padding: 3px 6px; text-decoration: none; }
.pagination-flickr a:hover { border: solid 1px #666666; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	NEWS LIST
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.newsitems { padding: 0 5px; }
.newsitems .item { border-bottom: dashed 1px #C4C6C8; margin-bottom: 5px; padding-bottom: 5px; }
.newsitems .newsDate { color: #9a9a9a; display: block; }
.newsitems a.newsTitle { text-decoration: none; font-size: 13px; }
.newsitems a.newsTitle:hover { text-decoration: underline; }
.newsitems .newsDetails { margin: 5px 0px; color: #aaa; }
.newsitems .newsReadMore { font-weight: bold; text-decoration: none; color: #3664A5; background-color: inherit; }
.vbox-content .rss { text-align: right; padding-right: 5px; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	NEWS DETAILS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.newsitem { margin: 20px auto; width: 760px; }
.newsitem .title { padding: 10px 10px 10px 0px; font-weight: bold; position: relative; border-bottom: 1px solid #ddd; color: #E97400; }
.newsitem .title span { position: absolute; right: 10px; font-size: 10px; font-style: italic; }
.newsitem .newsDate { color: #9a9a9a; font-style: italic; }
.newsitem .newsbody { margin: 0; padding: 10px 0; }
.newsComments { margin-bottom: 15px; padding-bottom: 5px; padding-left: 0; }
.newsComments .title { padding: 10px 10px 10px 0px; font-weight: bold; text-transform: uppercase; }
.newsComments .newComment { margin: 0; padding: 0; }
.newsComments .newComment td.leaveTitle { padding: 0px 10px 10px 0px; font-weight: bold; color: #3a3a3a; }
.newsComments .newComment td { vertical-align: top; }
.newsComments .commentList { border-top: solid 1px #e3e3e3; margin-top: 10px; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	NEWS COMMENTS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.newscomment { border-bottom: solid 1px #E3E3E3; }

.newscomment .commentinfo { width: 170px; float: left; padding: 5px; height: 100%; border-right: solid 1px #F3F3F3; }

.newscomment .commentinfo .userinfo { padding-top: 5px; }

.newscomment .commentinfo .userinfo a.username { font-weight: bold; margin-bottom: 5px; }

.newscomment .commentinfo .userinfo span.username { font-weight: bold; margin-bottom: 5px; }

.newscomment .commentinfo .userinfo .avatar { margin: 5px 0 5px 0; }

.newscomment .commentinfo .userinfo .userstats { font-size: 0.9em; text-align: left; font-weight: bold; color: #555; }

.newscomment .commentinfo .userinfo .userstats .statvalue { font-weight: normal; }

.newscomment .commentcontent { margin-left: 180px; border-left: solid 1px #F3F3F3; }

.newscomment .commentcontent .commenttime { font-weight: bold; line-height: 20px; padding: 3px; background: #e3f3f3; }

.newscomment .commentcontent .commenttime .statvalue { font-weight: normal; }

.newscomment .commentcontent .commenttitle { padding: 3px; font-weight: bold; }

.newscomment .commentcontent .commentbody { padding: 3px; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	BLOG LIST

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.blog { margin-bottom: 15px; padding-bottom: 5px; padding-left: 0; }

.blog .title { padding: 10px 0px 1px 0px; margin: 0 5px 10px 5px; font-weight: bold; text-transform: uppercase; clear: both; font-size: 1.1em; border-bottom: solid 1px #C4C6C8; }

.blogposts .post .blogDate { color: #9a9a9a; font-style: italic; }

.blogposts .post a.blogTitle { color: #444; text-decoration: none; font-size: 1.2em; }

.blogposts .post a.blogTitle:Hover { text-decoration: underline; }

.blog .blogposts { margin: 0px 5px 0 5px; padding: 0; }

.blog .blogposts .post { border-bottom: dashed 1px #C4C6C8; margin-bottom: 10px; padding-bottom: 10px; }

.blog .blogposts .blogBody { margin-top: 10px; margin-bottom: 10px; }

.blog .blogposts .blogDetails { font-weight: bold; text-decoration: none; color: #3664A5; background-color: inherit; }



/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	BLOG DETAILS

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.blogpost { margin-bottom: 15px; padding-bottom: 5px; padding-left: 0; }

.blogpost .title { padding: 10px 10px 10px 0px; font-weight: bold; text-transform: uppercase; font-size: 1.1em; }

.blogpost .postDate { color: #9a9a9a; font-style: italic; }

.blogpost .postbody { margin: 0; padding: 0; }

.blogComments { margin-bottom: 15px; padding-bottom: 5px; padding-left: 0; }

.blogComments .title { padding: 10px 10px 10px 0px; font-weight: bold; text-transform: uppercase; }

.blogComments .newComment { margin: 0; padding: 0; }

.blogComments .newComment td { vertical-align: top; }

.blogComments .newComment td.leaveTitle { padding: 0px 10px 10px 0px; font-weight: bold; }

.blogComments .commentList { margin: 10px 0 0 0; padding: 0; font-size: 11px; color: #555D65; background-color: inherit; }

.blogComments .commentList { border-top: solid 1px #e3e3e3; margin-top: 10px; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	BLOG COMMENTS

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.blogcomment { border-bottom: solid 1px #E3E3E3; }
.blogcomment .commentinfo { width: 170px; float: left; padding: 5px; height: 100%; border-right: solid 1px #F3F3F3; }
.blogcomment .commentinfo .userinfo { padding-top: 5px; }
.blogcomment .commentinfo .userinfo a.username { font-weight: bold; margin-bottom: 5px; }
.blogcomment .commentinfo .userinfo span.username { font-weight: bold; margin-bottom: 5px; }
.blogcomment .commentinfo .userinfo .avatar { margin: 5px 0 5px 0; }
.blogcomment .commentinfo .userinfo .userstats { font-size: 0.9em; text-align: left; font-weight: bold; color: #555; }
.blogcomment .commentinfo .userinfo .userstats .statvalue { font-weight: normal; }
.blogcomment .commentcontent { margin-left: 180px; border-left: solid 1px #F3F3F3; }
.blogcomment .commentcontent .commenttime { font-weight: bold; line-height: 20px; padding: 3px; background: #e3f3f3; }
.blogcomment .commentcontent .commenttime .statvalue { font-weight: normal; }
.blogcomment .commentcontent .commentbody { padding: 3px; }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	POLLS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.pollBlock { padding: 10px 0px 0px 10px; }
.pollTakePoll, .pollResults { margin-top: 10px; }
.pollResults .tblpollresult tr td { height: 50px; }
.pollResults table tr td p { margin: 0px; padding: 0px; }
.pollDisplayText { font-weight: bold; font-size: 12px; color: Maroon; }
.pollTotalVotes { font-style: italic; font-weight: bold; color: Green; }
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	EMAIL A FRIEND PAGE
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.emailafriendBox { margin-bottom: 15px; padding: 0px; }
.emailafriendBox .title { padding: 10px 10px 5px 0px; font-weight: bold; clear: both; }
.emailafriendBox .sendEmail { border: 1px solid rgb(232, 230, 210); margin-top: 10px; padding: 0 0 10px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; }
.emailafriendBox .sendEmail .product { font-weight: bold; }
.emailafriendBox .sendEmail .description { font-style: italic; }
.emailafriendBox .sendEmail .confirm { font-weight: bold; }
.emailafriendBox .sendEmail td { vertical-align: top; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	RATING

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.ratingStar { font-size: 0pt; width: 14px; height: 14px; margin: 0px; padding: 0px; cursor: pointer; display: block; background-repeat: no-repeat; }
.filledRatingStar { background-image: url(Images/rating/FilledStar.gif); }
.emptyRatingStar { background-image: url(Images/rating/EmptyStar.gif); }
.savedRatingStar { background-image: url(Images/rating/SavedStar.gif); }


/*--Main Image Preview--*/
.main_image { width: 390px; height: 300px; float: left; background: #333; position: relative; overflow: hidden; color: #fff; }
.main_image img { width: 100%; }
.main_image h2 { margin: 0px; padding: 0px; }
.main_image p { font-size: 1.2em; padding: 10px; margin: 0; line-height: 1.6em; }

.main_image .block { width: 100%; background: #111; border-top: 1px solid #000; }
.main_image a.show { background-position: left bottom; }


.image_thumb { float: left; width: 150px; background: #f0f0f0; border-right: 1px solid #fff; border-top: 1px solid #ccc; }
.image_thumb img { border: 1px solid #ccc; padding: 5px; background: #fff; float: left; }
.image_thumb ul { margin: 0; padding: 0; list-style: none; }
.image_thumb ul li { background: #f0f0f0 url(images/nav_a.gif) repeat-x; float: left; width: 100%; border-bottom: 1px solid #ccc; border-top: 1px solid #fff; border-right: 1px solid #ccc; height: 48px; }
.image_thumb ul li.hover { background: #ddd; cursor: pointer; }
.image_thumb ul li.active { background: #fff; cursor: default; }
html .image_thumb ul li h2 { font-size: 12px; margin: 0; padding: 0; }
.image_thumb ul li .block { float: left; padding: 0; }


/*topic page style sheets*/
.htmlcontent-header { border-bottom: solid 1px #ccc; position: relative; color: #E97400; }
.htmlcontent-header span { position: absolute; right: 0px; font-size: 10px; font-style: italic; }
.htmlcontent-body p { line-height: 20px; margin: 0px; padding: 0px; margin-bottom: 5px; }


/*best sellers*/
.bestsellers { padding: 3px; }
.bestsellers li.left { float: left; width: 70px; }
.bestsellers li.right { float: right; width: 90px; }
.bestsellers li.clear { padding-top: 10px; border-bottom: dotted 1px #aaa; margin-bottom: 10px; }


/*topic items*/
.topiccontent{ margin:20px auto;padding-bottom:5px;width:86%;}
.topiccontent .htmlcontent-header{ padding:5px 0; margin-bottom:5px;}