/* Common Styles for Silkfair App & Custom Store */
/* common_white.css */
abbr, acronym {
  border-bottom:1px dotted;
  cursor:help;
}
/* hr */
hr {
  height:0px;
  border:1px solid #BCBCBC;
  border-width:0 0 1px;
}
/* Silkfair Button v2 */
.sf_button {height:23px; display:inline;}
.sf_button td {height:23px; font-size:9pt; font-weight:bold;}
.sf_button td.side {width:6px;}
/* left/right */
/* active */
.sf_button .active_left {background: url("../images/themes/blue/buttons/sf-active.gif") 0 0;}
.sf_button .active_right {background: url("../images/themes/blue/buttons/sf-active.gif") 6px 0;}
/* passive */
.sf_button .passive_left {background: url("../images/themes/blue/buttons/sf-passive.gif") 0 0;}
.sf_button .passive_right {background: url("../images/themes/blue/buttons/sf-passive.gif") 6px 0;}
/* disabled */
.sf_button .disabled_left {background: url("../images/themes/blue/buttons/sf-disabled.gif") 0 0;}
.sf_button .disabled_right {background: url("../images/themes/blue/buttons/sf-disabled.gif") 6px 0;}
/* body */
.sf_button .active {background-color: #D3E9EF; color:#246A8E;}

/* change to darker color font for button */
.sf_button .active a {color:#003366;}

.sf_button .passive {background-color: #D8D8D8; color:#666;}
.sf_button .passive a {color:#666;}
.sf_button .disabled {background: #D8D8D8 url("../images/themes/blue/buttons/button_dbg.gif"); color:#FFF;}
.sf_button .disabled a {color:#FFF;}

/* == Silkfair IMAGES == */
img.piccolo {width:33px; height:33px;}
img.mini    {width:50px; height:50px;}
img.thumb   {width:75px; height:75px;}
img.wide    {width:148px; height:111px;}

.userpic {
  float:left;
  margin-right:1em;
}
.userinfo {
  margin-top: 1em;
}

/* == Silkfair POOL-RATING == */
.rating {
  color: #333;
  font: 9pt Arial;
  font-weight: bold;
}
.silkfair_rating_shell {
  width:77px; height:21px;
  background: url("../images/rating/rating_shell.png") no-repeat;
}
.silkfair_rating_pool {
  margin-left:2px; margin-top:2px;
  height:16px;
  /* width will be variable */
  background: url("../images/rating/rating_pool.png") no-repeat;
}

/* == Silkfair POOL-RATING 2 == */
.silkfair_rating td {
  color: #333;
  font: 9pt Arial;
  font-weight: bold;
  vertical-align: middle;
}
.silkfair_rating .text {
  text-align:center;
}
.sf_rating td {
  background: url("../images/rating/sf_rating.png");
  height:21px;
}
td.sf_rating-left {
  width: 6px; background-position:0 0;
}
td.sf_rating-right {
  width: 6px; background-position:6px 0;
}
td.sf_rating-back {
  background-position:0 -21px;
  background-repeat:repeat-x;
}
td.sf_rating_shell {
  width:77px; height:21px;
  background: url("../images/rating/rating_shell.png") no-repeat;
}
.sf_rating_pool {
  margin-left:2px; margin-top:2px;
  height:16px;
  /* width will be variable */
  background: url("../images/rating/rating_pool.png") no-repeat;
}

/* Star Rating (box /mysilk/feedback/stars) */
.star-rating-bar {
  margin:4px 0;
}
.star-rating-bar div.stars {
  float:left;
}
.star-rating-bar div {
  float:right;
  margin:0 1.5em;
}

/* == Silkfair STAR-RATING (static small -- item/feedback/line-comments) == */
.ratingcell {
  height:20px;
  font-size:8pt;
  vertical-align: bottom;
}
.starcell {
  width:20px; height:20px;
  font-size: 8pt; /* for ALT */
  vertical-align: middle;
  text-align: center;
}
.star_active, .star_inactive {
  width:20px; height:20px;
  border-width: 0px;
}

/* == Silkfair STAR-RATING (interactive) == */
.star-rating{
  list-style:none;
  margin: 0px; padding:0px;
  width: 150px; height: 30px;
  position: relative;
  background: url("../images/star_rating.png") top left repeat-x;
}
.star-rating li{
  padding:0px; margin:0px;
  /**/
  float: left;
  /* */
  /*text-indent: -9000px;*/
  position: absolute;
}
.star-rating li a, .star-rating li span{
  display:block;
  width:30px; height: 30px;
  text-decoration: none;
  /*text-indent: -9000px;*/
  z-index: 20; position: absolute;
  padding: 0px;
}
.star-rating li a:hover{
  background: url("../images/star_rating.png") left center;
  z-index: 2;
  left: 0px;
  border:none;
}
.star-rating .one-star {left: 0px;}
.star-rating .one-star:hover {width:30px;}
.star-rating .two-stars {left:30px;}
.star-rating .two-stars:hover {width: 60px;}
.star-rating .three-stars {left: 60px;}
.star-rating .three-stars:hover {width: 90px;}
.star-rating .four-stars {left: 90px;}
.star-rating .four-stars:hover {width: 120px;}
.star-rating .five-stars {left: 120px;}
.star-rating .five-stars:hover {width: 150px;}
.star-rating li.current-rating {
  background: url("../images/star_rating.png") left bottom;
  position: absolute;
  height: 30px;
  display: block;
  /*text-indent: -9000px;*/
  z-index: 1;
}
.star-rating li.current-rating2{
  background: url("../images/star_rating.png") left center;
}
.rating_field {
  padding:0px 2px;
}

/* == ALERTS & Dialogs == */
.AlertContainer {
  margin:0px 10px;
  text-align:left;
}

#background {
  display:none;
  background-color: #fff;
  position:absolute;
  z-index:80000;
  width:100px;
  height:100px;
  top:0px;
  left:0px;
  opacity: 0.4;
  filter:alpha(opacity=40);
    -moz-opacity: 0.4;
  background-image:url("../images/tp.png");
}

#modalContainer {
  background-color:transparent;
  position:absolute;
  width:100%;
  height:100%;
  top:0px;
  left:0px;
  z-index:900000;
  background-image:url("../images/tp.png");
}

#modalBox {
  position:relative;
  display:block;
}

#alertBox {
  position:relative;
  width:300px;
  min-height:100px;
  margin-top:50px;
}

#modalContainer > #alertBox {
  position:fixed;
}
#AlertId .ok_button {background-image: url("../images/button_closebut.gif"); width:52px; height:20px; border:0px; background-color:white;  }

/* Popups common */
/* Popup outer sprite1 */
.pop_s {
  background: url("../images/silkblock/pop-sprite.gif") no-repeat;
}
.pop_s, .pop_s2 {
  font-size: 1px;/* IE */
}
._tl, ._tl div, ._bl {
  width:45px;
  height:9px;
}
._tr, ._tr div, ._br {
  width:11px;
  height:9px;
}
/* .corners */
.pop_s._tr {
  background-position: -45px 0;
}
.pop_s._bl {
  background-position: 0 -9px;
}
.pop_s._br {
  background-position: -45px -9px;
}
/* .borders */
.pop_s._l {
  background-position: -56px 0;
  background-repeat: repeat-y;
}
.pop_s._r {
  background-position: -101px 0;
  background-repeat: repeat-y;
}
/* Popup outer sprite2 */
.pop_s2 {
  background: url("../images/silkblock/pop-sprite2.gif") no-repeat;
}
#pipka {
  width:45px; height:20px;
}
.pop_s2._t {
  height:9px;/* for IE */
  background-position: 0 -22px;
  background-repeat: repeat-x;
}
.pop_s2._b {
  background-position: 0 -31px;
  background-repeat: repeat-x;
}
/* inside */
.pop-left {
  float:left;
  margin-right:.5em;
}
.pop-right, .x_button {
  float:right;
}

/* --> Dialog() */
.bg_white, .light {
  background-color:#fff;
}
.border_pop {
  border: 1px solid #8FBB35;
}

/* == Silkfair: SILKFAIR POP-UPS == */
/* -- Main Column -- */
.bgcolor_b2 {
  background-color:#F1F0E5;
}
.ContentContainer {
  padding: 0px 10px;
}
#modalBox .ContentContainer {
  text-align: left;
  font-size:9pt;
}
.bg_popCaption {
  background-color:#EBF4D8; /* light-green pop-ups */
}
.bg_Caption {
  background-color:#1E5875;  /* navy-blue pop-ups */
}
.bg_Caption td {
  vertical-align:middle;
}
a.popCaptionLink, a.popCaptionLink:link, a.popCaptionLink:visited
{
  font-size:8pt; color:#fff;
  margin-right:7px;
}
.popCaptionBg {
  background: url("../images/map/map_bar.gif") repeat;
}
.popCaptionLogo {
  width:90px; height:34px;
  background-image: url("../images/logo_mini.gif");
}
.popSubheader {
  background-color:#2D8AB8;
  height:20px;
}
.popSubheader td, .popSubheader th {
  padding-left:6px; padding-right:6px; line-height: 13px;
  font-size:9pt;
  font-weight:bold;
  color: #FFF;
}
/* new for popup <h3> */
h3.popSubheader {
  background-color:#2D8AB8;
  color: #fff;
  font-size:9pt;
  font-weight:bold;
  margin: 3px 0;
  padding: 3px 6px;
  height:auto;
}

.popTableLine td {
  padding-left:6px; padding-right:6px;
  font-size:9pt;
  color:#000;
  line-height: 15px;
}

.popupHeader {
  margin-bottom:8px;
  margin-left:2px;
  font-size:8pt;
  line-height:18px;
}

.popupHeaderTitle {
  font-size:13pt;
  color:#2B82AE;
}

.popupContentContainer {
  padding:8px 8px 0px 8px; 
}
.popup-content {
  margin:5px;
  padding-top:1px;
}

/* for MiddleMenu from _middle_menu.rhtml (popup_divs, popup_info_divs) */
.popup_divs{
  position:absolute;
  width:300px;
  height:200px;
  z-index:1;
}
.popup_info_divs{
  position:absolute;
  width:512px;
  height:110px;
  z-index:1;    
}

/* -- other from popups -- */
.sortheader {
  background-color:#2D8AB8;
  height:20px;
}
.sortheader td, .sortheader th {
  font-size:8pt;
  font-weight:bold;
  color: #fff;
  padding-left:6px;
  padding-right:6px;
}
.sortheader a {
  color:#fff;
  text-decoration: underline;
}
.sortheader a:hover {
  text-decoration: none;
}
/* outdated styles, but still in use */
.content, .content td {
  color: #1E2015;
  font: 9pt Arial;
}
.content td {
  vertical-align:middle;
}
.content td.b {
  font-weight:bold;
}
.content1 {
  color: #1E2015;
  font: 10pt Arial;
  margin: 3px 3px 5px 6px;
  padding: 3px 6px 6px 3px; 
}
.contentheader1, .contentheader2 {
  color: #3399CC;
  font-weight: bold;
  line-height: 22px;
}
.contentheader1 {
  font: 1.2em Arial;
}
.contentheader2 {
  font: 1em Arial;
}

/* tables for forms */
table.form_box, div.form_box {
  margin-top:1em;
  padding: 3px 7px;
}

table.form_box td {
  vertical-align:top;
}

td.label, .form_box td.label {
  width:120px;
  font-weight:bold;
}

div.colorCell {
  width:26px; height:26px;
  border:1px solid #000;
}
div.colorCell_middle {
  width: 40px; height: 40px;
  border: 1px solid #000;
}
div.colorCell_small {
  width: 10px; height: 10px;
  border: 1px solid #000;
}

/* PopUp styles ARE COMMON for production app and Custom Store */
div.item_photos {margin:5px 10px 0 0;float:left;width:330px}
div.item_videos {margin:5px 0 0 5px;float:left;width:160px}

/* ..Uploads */
.file_cell {
  width:75px;
  float:left;
  margin-right:4px;z-index:5;
}
.upload_button {
  background: url(../images/upload.gif);
  width:75px;
  height:75px;
}
.swf-wrapper:hover .upload_button {
  background-position: 0 -75px;
}
.swf-wrapper:active .upload_button {
  background-position: 0 -150px;
}

/* -- BBCODES FORM -- */
#helpbox {width:400px; height:20px; font-size:8pt; color:#D6D3B6;}

/* == FEEDBACKS == */
.FeedbackCommentsContainer {
  padding: 0px 7px 7px 9px;
}
.FeedbackComment {
  padding: 4px;
  background-color:#F0F1E1;
  border:1px solid #CCCBC7; /* #CCCBC7; #bb0000; */
}
.ChildNodesContainer {
  padding:4px;
}
.FeedbackCommentChild {
  border:1px solid #CCCBC7; /* #CCCBC7; #bb0000; */
  padding:2px;
  margin:2px 0px;
}
td.FeedbackTreeCorner {
  width:10px;
  border-left:1px solid #4AAFE3;
  border-bottom:1px solid #4AAFE3;
}
td.FeedbackTreeLine {
  border-left:1px solid #4AAFE3;
}
.toggleLeft {
  width:10px;
}
.td_user, .td_date, .td_item {
  width:80px
}
/* Floats */
.f_left {
  width:49%;
  float:left;
}
.f_right {
  width:49%;
  float:right;
}
.clear {
  clear:both;
}
/* Item Feedback */
#item_qcomments {
  float:left;
  margin:10px 15px 5px 8px;
}
#item_post_comment {
  float:left;
  margin:8px 15px 4px 8px;
}
#item_comments_filter {
  float:left;
  margin:8px 12px 0 0;
  width:145px;
}
#item_comments_header {
  clear:both;
  padding:8px 5px;
}
.item_comments_pagination {
  padding:8px 5px;
}

/* Static Star Rating */
.rating-stars {margin:0; padding:0;}
.rating-stars li {
  float:left; list-style-type: none;
  width:20px; height:20px; margin:0; padding:0;
  background: url("../images/themes/white/rating/stars-small.png");
}
.rating-stars li.star-active {
  background-position: 0 0;
}
.rating-stars li.star-inactive {
  background-position: 0 20px;
}
.rating-stars li.rating-word {
  background:transparent;
}
.rating-stars li.rating-word div {
  font-weight: bold; font-size: 8pt;
  padding:2px 5px;
}

/* Forums */
#forum-description {
  width: 70%;
}
#forum-controls {
  width: auto;
  margin-top:1em;
}
#forum_search_controls {
  width:100%;
}
table#forum_search_controls td {
  vertical-align: middle;
}
/* Forum Search/filter */
#search-left {
  float:left;
}
#search-right, .search-paginator {
  float:right;
}
#search-filter {
  float:left;
  margin-right:20px;
}
.search-paginator input.per_page {
  height:auto;
}
/* UserPic */
#enlargement {
  padding:2px;
  position:absolute;
  visibility: hidden;
  border: 1px solid #666;
  background:#fff;
  background-repeat: no-repeat;
}
#closeenlargement {
  background-color:#333;
  font: 8pt Arial;
  font-weight: bold;
  line-height:20px;
  text-align:right;
  height: 20px;
  padding-right:5px;
}
#closeenlargement a {
  color:#fff;
}
/* ..Thread  */
#thread_container .f_left, #thread_container .f_right,
#thread_title, #thread_email {
  width:auto;
}
#line_forum_posts {
  margin-bottom: 10px;
}
#thread_email {
  margin-top:1.25em;
}
.forum-thread {
  padding:5px 0 2px;
  font:9pt/18px Arial;
}
.forum-thread.top {
  border-top:1px solid #D6D3B6;
}
.forum-thread .user {
  float:left;
  width:155px;
  padding:5px;
}
.forum-thread .pic {
  float:left;
  width:55px;
}
.forum-thread .body {
  margin-left:170px;
  padding-right:45px;
}

/* ..Posts */
#forum-posts {
  margin:2px 0 5px;
  border:1px solid #D6D3B6;
  border-width:1px 0;
}
.post-footer {
  margin:5px 0 3px;
  font-size:.95em;
  line-height:1em;
}
.post-sign {
  float:left;
}
.post-controls {
  float:right;
  width:125px;
  text-align:right;
}

/* ..Thread & Post */
.sign-updated, .sign-store {
  text-align: left;
}

/* Forum & Blog BB Codes */
blockquote {
  padding-left:5px;
  border-left:4px solid #D6D3B6; /* same as "content divider" */
}

pre {
  width: 530px; overflow: auto; white-space: pre;
  padding: 0px 5px;
  background-color:#F3F9FC;      /* same as #MiddleMenu */
}

/* Auto Footer (ticket #1922)*/
#footer-copy-auto {
  text-align:center;
  padding: 10px 20px;
  display:block !important;
}

/* text etc. */
.warn, .red {
  color:#CC3A0F;
}

/* borders */
.borderA, .borderB {
  border:1px solid #CCC;
}
