/* ========================================================================
   =                                 Body                                 =
   ======================================================================== */

body {
  margin: 0;
  padding: 20px;
  background-color: #A3A4A8;
  font-family: Verdana, sans-serif;
  font-size: 12px;
  min-width: 850px;
}

td { /* Somehow, tables do no inherit the body's font size */
  font-size: 12px;
}

a img {
  border: none;
}

.nodisplay {  /* User for hiding things with JS */
  display: none;
}

.novisibility { /* User for hiding things with JS */
  visibility: hidden;
}

.clearer {
  clear: both;
  height: 0;
  line-height: 0;
  margin: 0;
  padding: 0;
  font-size: 0;
}

.small {
  font-size: 90%;
}

.red { color: red; }

.bold { font-weight: bold; }
.nobold { font-weight: normal; }

.floatleft { float: left; }
.floatright { float: right; }

a { text-decoration: none; color: #000; }
a:link { text-decoration: none; }
a:hover { text-decoration: underline; }

/* Most links in our site are not underlined. However, this makes links in the middle of text invisible.
Links that are in the middle of text should have this class */
a.underline {
  text-decoration: underline;
}

h1 {
  color: #525E78;
  font-size: 18px;
}

p.spacer { font-size: 0; height: 15px; }
tr.spacer {  height: 8px; }


/* ------------------------------------------------------------------------ */

#maincontent {
  margin: 0;
  background: #DCEFF8 url(../images/maincontent_bg.gif) top left repeat-x;
  padding: 10px 30px;
}

/* ------------------------------------------------------------------------ */

.floatingDiv {
  position: absolute;
  background-color: #7E7F81;
  padding: 10px 14px;
  color: white;
  font-size: 90%;
}

.floatingDiv a {
  color: white;
  float: right;
  margin-right: 10px;
}

.floatingDiv a.rightmost {
  margin-right: 14px;
}

.floatingDiv a:hover {
  color: black;
}

.floatingDiv input,
.floatingDiv select {
  display: block;
  margin: 4px 0;
  color: black;
  border: 3px solid #A7C5DD;
}

.floatingDiv h3{
  height: 6px;
  position: relative;
  top: 4px;
  background:  #CCE2EC url(../images/rainbow2.gif) top left repeat;
  margin: 0 -14px 0 -14px; /* compensate for padding */
}

/* ========================================================================
   =                    Regular Forms in their Tables                     =
   ======================================================================== */
   
form,
form td {
  color: #6A7378;
  padding-right: 15px;
}

form td.valign {
  vertical-align: top;
}

form input {
  border: 1px solid #666;
  margin-right: 10px;
}

form label { /* make radio options text black */
  color: #000;
}


form input.checkbox,
form input.radio {
  border: none;
}

form h2 {
  font-size: 13px;
  margin: 15px 0 5px 0;
}

.fielderror {
  padding-left: 20px;

  background: transparent url(../images/field_error.gif) top left no-repeat;
  color: #FB0E06;
}

.turing {
  border: 1px solid #000;
}
/* ========================================================================
   =                           Header/Footer                              =
   ======================================================================== */

#header {
  position: relative; /* Allow absolute positioning inside */
  height: 82px; /* 75px for blue degrade + 7px for rainbow */
  background: #CCE2EC url(../images/header_bg.gif) top left repeat-x;
  margin-top: 40px;
  margin-bottom: 2px;
}

#header #logo {
  position: absolute;
  top: -43px;
  left: -3px;
  z-index: 5;
}

#header #rainbow {
  position: absolute;
  left:0;
  top: 0;
  height: 7px;
  width: 100%;
  background:  #CCE2EC url(../images/rainbow.gif) top left repeat;
}

/* ------------------------------------ */
#header #headerRegister {
  float: right;
  margin: 22px 30px 0 0;
}

#header #headerRegister h1 {
  /* Replace "not a member yet" with image */
  font-size: 11px;
  text-indent: -5000px;
  width: 105px;
  height: 10px;
  background: url(../images/header_notamember.gif) top left no-repeat;
  /* position correctly */
  float: left;
  margin: 2px 0 0 0;
}

#header #headerRegister span {
  /* Show the arrow */
  width: 7px;
  height: 5px;
  background: url(../images/header_arrow.gif) top left no-repeat;
  /* position correctly */
  float: left;
  margin: 4px 4px 0 4px;
}

#header #headerRegister a {
  /* Replace "sign up" with image */
  font-size: 13px;
  text-indent: -5000px;
  width: 53px;
  height: 13px;
  background: url(../images/header_signup.gif) top left no-repeat;
  /* position correctly */
  float: left;
  margin: 0;
}

/* Do image underlining */
#header #headerRegister a:hover {
  text-decoration: none;
  background: url(../images/header_signup_ul.gif) top left no-repeat;
}

/* ------------------------------------ */

#header #frmLogin {
  padding: 0;
  margin: 0;
  position: absolute;
  bottom: 10px;
  right:102px;
}

#header #frmLogin input {
  border: 1px solid #666;
  font-size: 12px;
  margin-right: 10px;
}

#header #frmLogin #btnLogin {
  border: none;
  margin-right: 0;
  margin-left: -4px;
  /* Move the button down. I need to specify a negative bottom margin, because a top margin only
     increases the FORM height (because it's aligned to the bottom) */
  margin-bottom: -2px; 
}

#header #headerForgotPassword {
  display: block;
  position: absolute;
  right: 16px;
  bottom: 7px;
  font-size: 10px;
  width: 66px;
  
  color: #000;
  
}

/* ------------------------------------ */

#header #LoggedUserData {
  height: 43px;
  background: #A2C4D2 url(../images/header_usercard.jpg) 3px 2px no-repeat;
  float: right;

  margin-top: 20px;
  margin-right: 10px;
  min-width: 170px;
}

#header #LoggedUserData span {
  margin: 5px 10px 0 31px;
  display: block;
  
}

#header #LoggedUserData .separator {
  border-top: 1px solid #E2ECF0;
  margin: 2px 8px 0 4px;
}

#header #LoggedUserData .striped_section {
  background: transparent url(../images/header_bg_striped.gif) 0 0 repeat;
  border: none;
  margin: -3px 0 0 0;
  padding-bottom: 7px;
}

#header #LoggedUserData a {
  margin: 4px 0 0 31px;
  display: block;
  color: #000;
  font-size: 11px;
}

#header #LoggedUserData #headerLogout {
  font-size: 10px;
  color: #7E909A;
  margin: 0;
  padding-top: 3px;
  display: block;
  text-align: center;
  
}

#header #LoggedUserCredits {
  position: absolute;
  top: 45px;
  left: 10px;
  padding: 4px 10px;
  background-color: #AEC8D5;
  width: 350px;
}

#header #LoggedUserCredits .roundseparator {
  background: transparent url(../images/round_separator.gif) center left no-repeat;
  margin: 0 5px;
}

/* ------------------------------------------------------------------------ */

#secondHeader {
  position: relative;
  height: 61px; 
  background-color: #E9E9E9;
  margin: 0;
  padding: 0;
}

#secondHeader h1 {
  font-size: 15px;
  margin: 0 0 0 68px;
  padding-top: 34px;
  color: #525E78;
}


/* NOTE: These rules are duplicated for IE styling. Update the other stylesheet if you change this */
#secondHeader.myaccount { background: #E9E9E9 url(../images/secondheader_register.gif) 25px 6px no-repeat; }
#secondHeader.register {  background: #E9E9E9 url(../images/secondheader_register.gif) 25px 25px no-repeat; } /* Same as my account, but nonTabbed */
#secondHeader.financials { background: #E9E9E9 url(../images/secondheader_financials.gif) 30px 8px no-repeat; }
#secondHeader.financialsNonTabbed { background: #E9E9E9 url(../images/secondheader_financials.gif) 30px 26px no-repeat; } /* Same as my financials, but nonTabbed */
#secondHeader.assets { background: #E9E9E9 url(../images/secondheader_assets.gif) 22px 6px no-repeat; }
#secondHeader.pastorders {  background: #E9E9E9 url(../images/secondheader_pastorders.gif) 20px 6px no-repeat; }
#secondHeader.message { background: #E9E9E9 url(../images/secondheader_message.gif) 30px 25px no-repeat; }
#secondHeader.shoppingcart {  background: #E9E9E9 url(../images/secondheader_shoppingcart.gif) 22px 28px no-repeat; }

/* Different layout for second headers with tabs */

#secondHeader.tabbed h1 {
  padding-top: 14px;
  color: #525E78;
}


#secondHeader a { /* Shortcut links in second header */
  float: right;
  font-size: 11px;
  margin: 10px 10px 0 0;
}


/* ------------------------------------------------------------------------ */

#footer {
  margin-top: 10px;
  text-align: right;
  font-size: 10px;
  color: #fff;
}

#footer a {
  color: #fff;
}

#footer a:visited {
  /*color: #ddd;*/
}

#footer a:hover {
  color: #ccc;
}

#footer ul {
  margin: 0;
  margin-bottom: 3px;
}
#footer ul li {
  display: inline;
  border-left: 1px solid #ccc;
  padding: 0 3px;

}

#footer ul li.first_li {
  border-left-style: none;
}

/* ========================================================================
   =                           Header Tabs                                =
   ======================================================================== */

#headertabs {
  height: 37px;
  position: relative; /* move up, to overlap with second header */
  bottom: 22px;
  margin-bottom: -22px; /* move rest of the content up too */
  
  font-size: 11px;
}

#headertabs ul {
  height: 22px;
  margin: 0 0 0 25px;
  padding: 0;
}

#headertabs ul li {
  display: block;
  float: left;

  height: 22px;
  margin: 0;
  background: #F5F5F5 url(../images/tabs_bg.gif) top left repeat-x;

  position: relative; /* Allow absolute positioning of children */
  color: #5A7292;

  margin-left: -1px; /* make tabs overlap, to avoid double border */
}

#headertabs ul li span { /*used for the left and right sides of tabs */
  display: block;
  width: 4px;
  height: 22px;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
}

#headertabs ul li span.left {
  background: #E6E6E6 url(../images/tabs_left.gif) top left no-repeat;
  left: 0;
}
#headertabs ul li span.right  {
  background: #E6E6E6 url(../images/tabs_right.gif) top left no-repeat;
  right: 0px; 
}

#headertabs ul li a {
  display: block; /* make link occupy full tab */
  padding: 6px 18px 0 18px; /* position text in tab */
  color: #5A7292;
}

/* ----------------------------------------------------------------------------*/
/* Selected Tab */

/* Change background images */
#headertabs ul li.selected { background: #B3D3E7 url(../images/tabs_selected_bg.gif) top left repeat-x; }
#headertabs ul li.selected span.left { background: #E6E6E6 url(../images/tabs_selected_left.gif) top left no-repeat; }
#headertabs ul li.selected span.right { background: #E6E6E6 url(../images/tabs_selected_right.gif) top left no-repeat; }

/* Text is a <p> instead of an <a> */
#headertabs ul li.selected p { 
  margin: 0;
  padding: 6px 18px 0 18px; /* position text in tab */
}

/* ----------------------------------------------------------------------------*/
/* Sub Tabs */

#headertabs #subtabs {
  height: 15px;
  background: #D7DFE9 url(../images/subtabs_bg.gif) top left repeat-x;
}

/* counter all the set styles */
#headertabs #subtabs ul {
  height: auto;
  padding: 0;
  margin-left: 25px;
  font-size: 10px;
}

#headertabs #subtabs ul li {
  display: inline;
  float: none;

  height: auto;
  background-color: transparent;
  background-image: none;
  position: static;
  margin: 10px 0 0 0;
  padding: 0 10px 1px 10px;
}

#headertabs #subtabs ul li span {
  display: inline;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  position: static;
}

#headertabs #subtabs ul li a {
  display: inline; /* make link occupy full tab */
  padding: 0;
}

/* ----------------------------------------------------------------------------*/
/* Selected SubTab */

/* Change background images */
#headertabs #subtabs ul li.selected { background: #73B4EA url(../images/subtabs_selected_bg.gif) top left repeat-x; }

/* ========================================================================
   =                          Main Page: Top Section                      =
   ======================================================================== */

#main_page #topsection,
#main_page #lightbox,
#main_page #shoppingcart,
#main_page #featuredpicture {
  height: 215px;
}

#main_page #lightbox,
#main_page #shoppingcart {
  width: 49.9%;  /* at 50%, the second div floats down in IE */
  background: #DCEFF8 url(../images/topsection_bg.gif) top left repeat-x;
}

#main_page #lightbox {
  float: left;
}

#main_page #shoppingcart {
  float: right;
}

#main_page #featuredpicture {
  background-color: #F5F5F6; 
  position: relative;
}

#main_page #featuredpicture a {
  position: absolute;
  display: block;
  width: 100%;
}

#main_page #featuredpicture img {
  display: block;
  margin: 0 auto;
}

#main_page #featuredpicture #secondColorBlender {
  height: 215px;
  background-color: #F5F5F6;
  position: absolute;
  right: 0;
  top: 0;
  width: 50%;
}

/* ========================================================================
   =                          Main Page: Lightbox                         =
   ======================================================================== */

/* The lightbox is made up of:
    - #lightbox
      - #lightboxtitle: shows the lightbox icon, and the "lightbox" title in an H1
      - #lightboxtoolbar: Contains the combo-box, the command links and the progress indicator
      - #lightboxcontainer: the container for the actual lightbox pictures
*/

/*-------------------------------------------------------------------*/

#main_page #lightbox #lightboxtitle {
  position: absolute; /* Take it out of the flow, so I can set a margin-top for lightboxcontainer */
  height: 49px;
  background: url(../images/lightbox_icon.gif) top left no-repeat;
  margin-top: 12px;
  margin-left: 15px;
}

#main_page #lightbox #lightboxtitle h1 { /* Replace "lightbox" with image */
  text-indent: -5000px;
  width: 64px;
  height: 15px;
  background: url(../images/lightbox_title.gif) top left no-repeat;
  margin-left: 58px;
}

/*-------------------------------------------------------------------*/

#main_page #lightbox #lightboxtoolbar {
  display: none;
  position: absolute; /* Take it out of the flow, so I can set a margin-top for lightboxcontainer */
  margin-left: 155px;
  margin-top: 25px;
}

#main_page #lightbox #lightboxtoolbar #ligthboxselect {
  width: 150px;
}

#main_page #lightbox #lightboxtoolbar #btnNewLightBox,
#main_page #lightbox #lightboxtoolbar #btnDeteleLightBox {
  position: absolute;
  font-size: 10px;
  padding-left: 2px;
  width: 90px;
  left: 155px;
}

#main_page #lightbox #lightboxtoolbar #btnNewLightBox {
  top:-4px;
}

#main_page #lightbox #lightboxtoolbar #btnDeteleLightBox {
  top:8px;
}


/* AJAX Progress Indicator for the lightbox */
#main_page #lightbox #lightboxindicator {
  visibility: hidden;
  position: absolute;
  top: 24px;
  right: 6px;
}


/*-------------------------------------------------------------------*/

#main_page #lightbox  #lightboxcontainer {
  margin-top: 55px;
  margin-left: 80px;
  position: relative; /* Allow pictures inside the div to be absolutely positioned (needed for Drag-Drop) */

  height: 160px;

  /* overflow: auto; Show Scrollbars */
  /* Safari didn't recognize this. We put overflow: auto in here, and moved this code to the "noSafari" section at the bottom */
  /*  overflow: hidden; overflow-y:scroll; overflow: -moz-scrollbars-vertical; */
  overflow: auto;
}

#main_page #lightbox  #lightboxcontainer #lightboxlegend {
  margin: 70px 0 0 70px;
  text-align: center;
  width: 200px;
}


/*-------------------------------------------------------------------*/

/* Popup div to enter new lightbox name */
#main_page #newLightbox {
  width: 158px;
  height: 56px;
  top: 200px;
  left: 170px;
  visibility: hidden;
}

/*-------------------------------------------------------------------*/

#main_page #lightbox  #lightboxcontainer .LightboxItem {
  width: 77px;
  height: 77px;
  margin: 2px 12px 2px 0;
  padding: 9px 0 0 15px; /* separate picture from borders, to make room for object type and trash can */
  float: left;
  position: relative; /* Allow elements inside to be absolutely positioned */
}

#main_page #lightbox  #lightboxcontainer .LightboxItem  h2 { /* Shows object type picture */
  position: absolute;
  top: 0;
  left: 6px;
  margin: 0;
  width: 18px;
  height: 18px;
  z-index: 1;
}

#main_page .LightboxItem  h2.PI {   background: transparent url(../images/lightbox_type_pi.gif) top left no-repeat; }
#main_page .LightboxItem  h2.PS {   background: transparent url(../images/lightbox_type_ps.gif) top left no-repeat; }
#main_page .LightboxItem  h2.VC {   background: transparent url(../images/lightbox_type_vc.gif) top left no-repeat; }
#main_page .LightboxItem  h2.SO {   background: transparent url(../images/lightbox_type_so.gif) top left no-repeat; }
#main_page .LightboxItem  h2.VI {   background: transparent url(../images/lightbox_type_vi.gif) top left no-repeat; }
#main_page .LightboxItem  h2.FL {   background: transparent url(../images/lightbox_type_fl.gif) top left no-repeat; }
#main_page .LightboxItem  h2.DD {   background: transparent url(../images/lightbox_type_3d.gif) top left no-repeat; }
#main_page .LightboxItem  h2.PP {   background: transparent url(../images/lightbox_type_pp.gif) top left no-repeat; }

#main_page #lightbox  #lightboxcontainer .LightboxImage {
  display: block;
  border: none;
  cursor: pointer;
}

#main_page #lightbox  #lightboxcontainer .LightboxItem a { /* Remove link */
  display: block;
  text-indent: -5000px;
  position: absolute;
  top: 25px;
  left: 2px;
  width: 11px;
  height: 14px;
  background: transparent url(../images/trash.gif) top left no-repeat;
}

/* Remove underlining */
#main_page #lightbox  #lightboxcontainer .LightboxItem a:hover {
  text-decoration: none;
}


/* ========================================================================
   =                          Main Page: Shopping Cart                    =
   ======================================================================== */

/* The shopping cart is made up of:
    - #shoppingcart
      - #shoppingcarttitle: shows the SC icon, and the "Shopping Cart" title in an H1 and the progress indicator
      - #shoppingcartcontainer: the container for the actual line items
      - #shoppingcarttoolbar: Contains the checkout button, and the total price
*/


#main_page #shoppingcart #shoppingcarttitle {
  position: absolute; /* Take it out of the flow, so I can set a margin-top for lightboxcontainer */
  height: 49px;
  background: url(../images/shoppingcart_icon.gif) top left no-repeat;
  margin-top: 12px;
  margin-left: 15px;
  width: 200px;
}

#main_page #shoppingcart #shoppingcarttitle h1 { /* Replace "lightbox" with image */
  text-indent: -5000px;
  width: 106px;
  height: 15px;
  background: url(../images/shoppingcart_title.gif) top left no-repeat;
  margin-left: 58px;
}

/* AJAX Progress Indicator for the shopping cart */
#main_page #shoppingcart #shoppingcartindicator {
  visibility: hidden;
  position: absolute;
  top: 16px;
  right: 10px;
}

/*-------------------------------------------------------------------*/

#main_page #shoppingcart #shoppingcartcontainer {
  margin-top: 55px;
  margin-left: 80px;
  position: relative; /* Allow pictures inside the div to be absolutely positioned (needed for Drag-Drop) */

  height: 120px;

  overflow: auto; /* Show Scrollbars */
}

#main_page #shoppingcart #shoppingcartcontainer #shoppingcartlegend {
  margin: 45px 0 0 55px;
  text-align: center;
  width: 200px;
}

#main_page #shoppingcart #shoppingcartcontainer #sctable {
  width: 95%;
  margin: 0;
}

#main_page #shoppingcart #shoppingcartcontainer #sctable .assetType { width: 22px;}
#main_page #shoppingcart #shoppingcartcontainer #sctable .removeAsset { width: 11px;}
#main_page #shoppingcart #shoppingcartcontainer #sctable .assetTitle {
  padding-left: 3px;
}
#main_page #shoppingcart #shoppingcartcontainer #sctable .assetPrice {
  width: 75px;
  text-align: right;
  padding-right: 10px;
}

#main_page #shoppingcart #shoppingcartcontainer #sctable td {
  margin: 0;
  padding: 0;
  font-size: 10px;
}

#main_page #shoppingcart #shoppingcartcontainer #sctable .removeAsset a { /* Remove link */
  display: block;
  font-size: 0px;
  text-indent: -5000px;
  width: 11px;
  height: 14px;
  background: transparent url(../images/trash.gif) top left no-repeat;
}

/*-------------------------------------------------------------------*/

#main_page #shoppingcart #shoppingcarttoolbar {
  border: 1px solid #B2B3B7;
  position: absolute;
  bottom: 10px;
  right: 20px;
  width: 250px;
}

#main_page #shoppingcart #shoppingcarttoolbar #btnCheckOut {
  width: 170px;
  height: 20px;
  border: 0;
  border-right: 1px solid #B2B3B7;
  font-weight: bold;
  color: #838D92;
  background-color: #DFF0F9;

  float: left;
}

#main_page #shoppingcart #shoppingcarttoolbar #shoppingcarttotal {
  float: right;
  color: #838D92;
  padding: 3px 5px 0 0;

}

/* ========================================================================
   =                          Main Page: Search Bar                       =
   ======================================================================== */

/* The search bar has two modes:
    - Splash, when the first page is shown, showing the little icons on the left, and the search toolbar vertically centered.
    - Normal, where the search toolbar is on the top-left

    To switch between modes, divs: #searchbarsplash and #searchsplashtoolbarmover are shown/hidden
    To move the #searchtoolbar div down on splash, div #searchsplashtoolbarmover is used.
    On normal mode, the searchbar will be as tall as the keywords that are suggested.
*/

/* -------------------------------------------------------------------- */

#main_page #searchbar { /* Set the background and padding */
  margin-top: 3px;
  background: #EFEFF0 url(../images/searchbar_bg.gif) bottom left repeat-x;
  padding: 15px 20px 15px 10px;
}

/* -------------------------------------------------------------------- */

#main_page #searchbar #searchtoolbar {
  width: 495px;
  height: 22px;
  float: left;
}

/* Everythings floats inside the toolbar because Text Replacement techniques can only be used in blocks, not inlines. */
#main_page #searchbar #searchtoolbar span.searchtextsearch,
#main_page #searchbar #searchtoolbar span.searchtextfor { /* Replace texts with images */
  display: block;
  float: left;
  text-indent: -5000px;
  height: 11px;
  margin-top: 5px;
}

#main_page #searchbar #searchtoolbar span.searchtextsearch {
  width: 44px;
  background: url(../images/searchbar_title_search.gif) top left no-repeat;
}

#main_page #searchbar #searchtoolbar span.searchtextfor {
  width: 22px;
  background: url(../images/searchbar_title_for.gif) top left no-repeat;
}

/* Float form elements and separate them from other elements */
#main_page #searchbar #searchtoolbar #searchassettype,
#main_page #searchbar #searchtoolbar #searchtext,
#main_page #searchbar #searchtoolbar #btnSearch,
#main_page #searchbar #searchtoolbar #searchindicator {
  float: left;
  margin: 0 9px;
}

#main_page #searchbar #searchtoolbar #btnSearch {
  margin-left: 0;
  margin-top: -3px;
}

#main_page #searchbar #searchtoolbar #searchindicator {
  margin: 4px;
  visibility: hidden;
}


/* -------------------------------------------------------------------- */

#main_page #searchbar #searchbarsplash {
  float: left;
  width: 267px;
  height: 53px;
	background: transparent url(../searchbar_splash_icons.php) top left no-repeat;
	margin: 0px 25px 4px 25px;
}

#main_page #searchbar #searchbarsplash .searchbarsplashItem {
	display: block;
	float: left;
	height: 33px; width: 33px;
	margin: 10px 3px 0 2px;
	cursor: pointer;
}

#main_page #searchbar #searchtoolbar #searchsplashtoolbarmover {
  height: 17px;
}

/* -------------------------------------------------------------------- */

#main_page #searchbar #searchsuggestkeywords {
  font-size: 11px;
  margin-left: 510px;
  color: #75889A;
}


/* ========================================================================
   =                   Main Page: Search Results                          =
   ======================================================================== */

#main_page #searchresultscontainer { /* Container for results container, plus paging (this is the visible one)*/
  margin-top: 3px;
  background-color: #F5F5F6;
  border: 1px solid #F5F5F6; /* somehow, without this border, the div does not expand to contain its children */
  padding: 10px;
}

#main_page #searchresultscontainer h1 {
  margin: 0;
  font-size: 18px;
  font-weight: normal;
  color: #72889E;
}

#main_page #searchpaging {
  margin-top: 15px;
  border: 1px solid #F5F5F6; /* somehow, without this border, the parent div does not expand to contain its children */
}

/* Position half the text to the left, and half to the right */
#main_page #searchpaging #searchpagingresult {  float: left;  }
#main_page #searchpaging #searchpaginglinks  {  float: right; }

/* Separate numbers from each other */
#main_page #searchpaging #searchpaginglinks .pageNumber,
#main_page #searchpaging #searchpaginglinks .pageNumberCurrent,
#main_page #searchpaging #searchpaginglinks .separator {
  padding: 0 3px;
}

/* Set selected number to a different color */
#main_page #searchpaging #searchpaginglinks .pageNumberCurrent {
  color: #72889E;
}



#main_page #searchpaging #searchpaginglinks #searchprevtopdisabled,
#main_page #searchpaging #searchpaginglinks #searchnexttopdisabled  {
  color: #999;
  display: none;
}

/* -------------------------------------------------------------------- */

#main_page #searchresults { /* Container for results (invisible to the user) */
  float:left;
  position: relative; /* Allow pictures inside the div to be absolutely positioned (needed for Drag-Drop) */
  margin-top: 5px;
}

#main_page #searchresults .searchresult {
  float: left;
  width: 132px;
  height: 162px;
  background: transparent url(../images/searchresult_bg.gif) top left no-repeat;
  margin: 5px;
  color: #50698C;
  font-size: 11px;
  text-align: center;
}

#main_page #searchresults .searchresult a {
  color: #50698C;
}


/* This container is necessary to make all images 110px high and wide,
to align the titles below. If we set size to the <img> tag, the picture gets stretched */
#main_page #searchresults .searchresultimagecontainer {
  width: 110px;
  height: 110px;
  margin: 10px auto 10px auto;
  position: relative; /* Allow child elements absolute positioning */
}

#main_page #searchresults .searchresultimagecontainer .searchresultimage
{
  margin: 0 auto;
  display: block;
  cursor: pointer;
}

#main_page #searchresults .searchresultimagecontainer h2 { /* Shows object type picture */
  position: absolute;
  top: -5px;
  left: -5px;
  margin: 0;
  width: 25px;
  height: 25px;
  z-index: 1;
}

#main_page .searchresultimagecontainer h2.PI {   background: transparent url(../images/searchresult_type_pi.gif) top left no-repeat; }
#main_page .searchresultimagecontainer h2.PS {   background: transparent url(../images/searchresult_type_ps.gif) top left no-repeat; }
#main_page .searchresultimagecontainer h2.VC {   background: transparent url(../images/searchresult_type_vc.gif) top left no-repeat; }
#main_page .searchresultimagecontainer h2.SO {   background: transparent url(../images/searchresult_type_so.gif) top left no-repeat; }
#main_page .searchresultimagecontainer h2.VI {   background: transparent url(../images/searchresult_type_vi.gif) top left no-repeat; }
#main_page .searchresultimagecontainer h2.FL {   background: transparent url(../images/searchresult_type_fl.gif) top left no-repeat; }
#main_page .searchresultimagecontainer h2.DD {   background: transparent url(../images/searchresult_type_3d.gif) top left no-repeat; }
#main_page .searchresultimagecontainer h2.PP {   background: transparent url(../images/searchresult_type_pp.gif) top left no-repeat; }

#main_page #searchresults #PrevPageSearchResult,
#main_page #searchresults #NextPageSearchResult {
  cursor: pointer;
}

#main_page #searchresults #PrevPageSearchResult a,
#main_page #searchresults #NextPageSearchResult a {
  display: block;
  width: 100px;
  height: 30px;
  margin: 45px auto 0 auto;
  
  padding-top: 45px;
  text-align: center;
  font-size: 11px;
}

#main_page #searchresults #PrevPageSearchResult a { background: transparent url(../images/searchresult_prev.gif) top center no-repeat; }
#main_page #searchresults #NextPageSearchResult a { background: transparent url(../images/searchresult_next.gif) top center no-repeat; }

/* -------------------------------------------------------------------- */

#main_page #searchresultscontainer #noresults {
  background: #CFE6F1 url(../images/centersmalldiv_bg.gif) top left repeat-x;
  margin: 0 auto 20px auto;
  padding: 15px 10px;
  width: 550px;
  
  color: #738596;
}

#main_page #searchresultscontainer #noresults h3 {
  color: white;
  font-size: 13px;
  font-weight: bold;
  margin: 0;
}


/* ========================================================================
   =                   Main Page: Splash Bottom Content                   =
   ======================================================================== */
   
#main_page #splashbottomcontent {
  margin-top: 3px;
  background-color: #F5F5F6;
  padding: 20px;
}

/* ========================================================================
   =                     Main Page: Overlay Box                           =
   ======================================================================== */

#overlaybg {
  background-image: url(../images/overlay.png);
	position : absolute;
	top : 0;
	left : 0;
  width : 100%;
  z-index: 90;
}

#main_page #overlaybox {
/*	background-image: url(../images/overlaybox_bg.png);*/
  background-color:  #8A8C8E;
	padding: 10px;
	width: 670px;
}

#main_page #overlaybox .rainbow {
  position: relative;
  top: 10px;
  background:  #CCE2EC url(../images/rainbow2.gif) top left repeat;
  height: 6px;
  margin: 0 -10px 0 -10px; /* compensate for padding */
}

#main_page #overlaybox #btnDetailsClose {
  float: right;
  margin-right: -7px;
}

/* -------------------------------------------------------------------- */

#main_page #overlaybox #leftColumn {
  float: left;
  width: 424px;
}

#main_page #overlaybox #rightColumn {
  float: left;
  width: 225px;
  padding: 0 0 0 15px;
  font-size: 10px;
}

/* -------------------------------------------------------------------- */

#main_page #overlaybox #leftColumn #overlayImageZone { /* set striped background */
  padding: 12px;
  width: 400px;
  background: transparent url(../images/overlay_striped.gif) top left repeat;
}

#main_page #overlaybox #leftColumn #overlayImageZone #imgContainer,
#main_page #overlaybox #leftColumn #overlayImageZone #ZoomerFlashContainer,
#main_page #overlaybox #leftColumn #overlayImageZone #PlayerFlashContainer {
  width: 400px;
}

#main_page #overlaybox #leftColumn #overlayImageZone #imgContainer img {
  display: block;
  margin: 0 auto;
}
/* -------------------------------------------------------------------- */
#main_page #overlaybox #leftColumn #divThumbs {
  margin-top: 8px;
}

#main_page #overlaybox #leftColumn #divThumbs img {
  display: block;
  margin: 3px;
  float: left;
  cursor: pointer;
  border: 1px solid black;
}

/* -------------------------------------------------------------------- */

#main_page #overlaybox #leftColumn #aDetailsZoom,
#main_page #overlaybox #leftColumn #aDetailsCloseZoom {
  text-align: center;
  color: #fff;
  display: block;
  float: left;
  padding-top: 35px;
  width: 85px;
  margin-top: 8px;
  font-size: 10px;
  background: transparent url(../images/overlay_zoom.gif) top center no-repeat;
}

#main_page #overlaybox #leftColumn #spanZoomExplanation {
	display: block;
	text-align: center;
  float: left;
	width: 230px;
	margin-left: 42px;
	margin-top: 14px;
	color: white;
}

#main_page #overlaybox #leftColumn #assetPrev,
#main_page #overlaybox #leftColumn #assetNext {
  text-align: center;
  color: #fff;
  display: block;
  float: right;
  padding-top: 35px;
  width: 55px;
  margin-top: 8px;
  font-size: 10px;
}

#main_page #overlaybox #leftColumn #assetPrev {
  background: transparent url(../images/overlay_prev.gif) top center no-repeat;
}

#main_page #overlaybox #leftColumn #assetNext {
  background: transparent url(../images/overlay_next.gif) top center no-repeat;
}
/* -------------------------------------------------------------------- */

#main_page #overlaybox #assetIcon {
  float: left;
}

#main_page #overlaybox #assetTitles {
  float: left;
  margin: 0 0 10px 5px;
  width: 185px;
}

#main_page #overlaybox #rightColumn h1 {
  color: #fff;
  font-weight: normal;
  font-size: 15px;
  margin: 0;
}

#main_page #overlaybox #rightColumn h2 {
  color: #fff;
  font-weight: normal;
  font-size: 10px;
  margin: 0;
}

#main_page #overlaybox #rightColumn h2#lblAuthor {
  cursor: pointer;
  text-decoration: underline;
}

/* -------------------------------------------------------------------- */

#main_page #overlaybox #rightColumn h3 {
  font-weight: normal;
  font-size: 10px;
  margin: 0 0 2px 0;
  border-bottom: 1px dotted black;
  width: 210px;
}

#main_page #overlaybox #rightColumn #textGeneralData {
  color: #CFCFD1;
}
#main_page #overlaybox #rightColumn #txtFiles {
  margin-top: 8px;
  color: #CFCFD1;
}

#main_page #overlaybox #rightColumn #textGeneralData h3,
#main_page #overlaybox #rightColumn #txtFiles h3 {
  border-bottom-color: #CFCFD1;
}

#main_page #overlaybox #rightColumn #overlayboxKeyWords {
  color: #3E3F41;
}

#main_page #overlaybox #rightColumn #overlayboxKeyWords span {
  cursor: pointer;
  text-decoration: underline; 
}

#main_page #overlaybox #rightColumn #txtLongDesc {
  margin-bottom: 8px;
}

#main_page #overlaybox #rightColumn #overlayboxKeyWords h3 {
  border-bottom-color: #303135;
}


#main_page #overlaybox #rightColumn #txtFiles ul {
  margin: 0;
  padding: 0 0 0 12px;
}

/* -------------------------------------------------------------------- */


#main_page #overlaybox #rightColumn #detailcontrols {
  margin-top: 40px;
  text-align: center;
}

#main_page #overlaybox #rightColumn #detailcontrols a {
  color: #fff;
  display: block;
  float: left;
  padding-top: 35px;
  width: 90px;
}

#main_page #overlaybox #rightColumn #detailcontrols #aDetailsAddToSC {
  background: transparent url(../images/overlay_shoppingcart.gif) top center no-repeat;
}

#main_page #overlaybox #rightColumn #detailcontrols #aDetailsAddToLB {
  background: transparent url(../images/overlay_lightbox.gif) top center no-repeat;
  margin-left: 10px;
  margin-right: 2px;
  padding-right: 12px;
  border-right: 1px solid white;
}

/* -------------------------------------------------------------------- */

/* Popup div to select which lightbox to add to */
#main_page #overlayLBSelect {
  width: 158px;
  height: 56px;
  top: 0px;
  left: 00px;
  visibility: hidden;
}

#main_page #overlayLBSelect select {
  width: 144px;
}

/* ========================================================================
   =                            Login Page                                =
   ======================================================================== */

#login .TDrememberme {
  padding-top: 15px;
  padding-left: 50px;
}

#login .TDrememberme input{
  padding-top: 4px;
}

#login table {
  margin-bottom: -10px;
}

#login table #submit {
  margin-left: 20px;
  width: 60px;
}

/* ========================================================================
   =                        Checkout   & Withdraw                         =
   ======================================================================== */

#checkout .CheckoutTable {
  border-collapse: collapse;
  margin: 10px 0 40px 0;
}

#checkout .CheckoutTable .TableHeaderRow {
  font-weight: bold;
}

#checkout .CheckoutTable td {
  padding: 8px 10px 8px 5px;
}

#checkout .CheckoutTable .TableHeaderRow td {
  border-bottom: 2px solid #94CBED;
  margin: 0;
}

#checkout .CheckoutTable td.price {
  text-align: right;
  padding-right: 20px;
}

#checkout .CheckoutTable td.ThumbContainer {
}

#checkout .CheckoutTable td.ThumbContainer div {
  width: 100px;
  position: relative; /* Allow absolute positioning of children. For some reason, applying this rule to the TD directly didn't work, so I added this div */
}

#checkout .CheckoutTable td.ThumbContainer  img {
  display: block;
  margin-left: 14px;
  margin-top: 6px;
}


#checkout .CheckoutTable td.ThumbContainer a.remove { /* Remove link */
  display: block;
  position: absolute;
  left: 0px;
  top: 25px;
  font-size: 0px;
  text-indent: -5000px;
  width: 11px;
  height: 14px;
  background: transparent url(../images/trash.gif) top left no-repeat;
}

#checkout .CheckoutTable td.ThumbContainer  h2 {
  position: absolute;
  top: -6px;
  left: 2px;
  margin: 0;
  width: 18px;
  height: 18px;
  z-index: 10;
}

#checkout .CheckoutTable td.ThumbContainer  h2.PI {   background: transparent url(../images/lightbox_type_pi.gif) top left no-repeat; }
#checkout .CheckoutTable td.ThumbContainer  h2.PS {   background: transparent url(../images/lightbox_type_ps.gif) top left no-repeat; }
#checkout .CheckoutTable td.ThumbContainer  h2.VC {   background: transparent url(../images/lightbox_type_vc.gif) top left no-repeat; }
#checkout .CheckoutTable td.ThumbContainer  h2.SO {   background: transparent url(../images/lightbox_type_so.gif) top left no-repeat; }
#checkout .CheckoutTable td.ThumbContainer  h2.VI {   background: transparent url(../images/lightbox_type_vi.gif) top left no-repeat; }
#checkout .CheckoutTable td.ThumbContainer  h2.FL {   background: transparent url(../images/lightbox_type_fl.gif) top left no-repeat; }
#checkout .CheckoutTable td.ThumbContainer  h2.DD {   background: transparent url(../images/lightbox_type_3d.gif) top left no-repeat; }
#checkout .CheckoutTable td.ThumbContainer  h2.PP {   background: transparent url(../images/lightbox_type_pp.gif) top left no-repeat; }

#checkout .CheckoutTable .TitleCol {
  width: 150px;
}

#checkout .CheckoutTable .TotalRow {
  font-weight: bold;
  background-color: #ADD4E7;
}

#checkout .CheckoutTable .TotalRow td {
  padding-top: 5px;
  padding-bottom: 5px;
}

#checkout .CheckoutTable .TotalRow td.TotalTitle {
  padding-left: 25px;
}

#checkout #ShoppingCartContents { float: left; }

#checkout #BuyerAgreement {
  float: left;
  margin-left: 30px;
}

#checkout #BuyerAgreement textarea{
  display: block;
  margin: 20px 0 0 0;
}


#checkout #BuyerAgreement label{
  padding-bottom: 4px;
}

/* -------------------------------------------------------------------- */

#withdrawal #EarningsSummaryTitle {
  margin-top: 0;
}


#withdrawal #EarningsSummary {
  width: 260px;
  margin: 20px 80px 20px 20px;
  float: left;
}

#withdrawal #EarningsSummary .TotalLine td {
  border-bottom: 2px solid #94CBED;
  padding: 4px 0;
}

#withdrawal #EarningsSummary .label {
  padding-right: 2px;
  margin-right: 4px;
}

#withdrawal #EarningsSummary .amount {
  padding-left: 12px;
  padding-right: 5px;
}

#withdrawal #WithdrawMethodTitle {
  margin-top: 20px;
  width: 320px;
  float: left;
}

#withdrawal #WithdrawMethod {
  margin: 0 0 20px 0;
  background: #CFE6F1 url(../images/centersmalldiv_bg.gif) top left repeat-x;
  padding: 15px;
  width: 320px;
  float: left;
}

#withdrawal #WithdrawMethod .method {
  margin-bottom: 5px;
}


#withdrawal #WithdrawMethod #WithdrawMethodSubmit {
  margin-top: 5px;
  margin-left: 30px;
}


/* ========================================================================
   =                                My Assets                             =
   ======================================================================== */

#myassets h1 {
  border-bottom: 2px solid #8CC7E9;
  font-size: 14px;

  height: 22px;
  padding-top: 25px;

  padding-left: 45px;
}

#myassets h1.Preuploaded { background: transparent url(../images/myassets_preuploaded.gif) top left no-repeat; }
#myassets h1.Pending { background: transparent url(../images/myassets_pending.gif) top left no-repeat; }
#myassets h1.Approved { background: transparent url(../images/myassets_approved.gif) top left no-repeat; }
#myassets h1.Unadvisable { background: transparent url(../images/myassets_unadvisable.gif) top left no-repeat; }
#myassets h1.Rejected { background: transparent url(../images/myassets_rejected.gif) top left no-repeat; }

/* counter the rules i just added for the H1 in secondheader */
#myassets #secondHeader h1 {
  border: none;
  font-size: 15px;
  height: auto;
  padding-top: 14px; /* use the value in #secondHeader.tabbed, because myassets is always tabbed*/
  padding-left: 0;
}

#myassets h2 {
  color: #525E78;
  font-size: 13px;
  margin: 5px 0 10px 25px;
}

#myassets .AssetsContainer {
  margin-left: 45px;
}

#myassets .myAsset {
  float: left;
  position: relative;
  margin: 4px 8px;

  width: 110px;
  height: 140px;

  font-size: 9px;
  text-align: center;

}

#myassets .myAsset .myAssetImageContainer {
  width: 110px;
  margin-bottom: 5px;
}

#myassets .myAsset .myAssetImageContainer a {
  display: block;
}

#myassets .myAsset .myAssetImageContainer a img {
  display: block;
  margin: 0 auto;
}

#myassets .myAsset h2 { /* Shows object type picture */
  position: absolute;
  top: -8px;
  left: -8px;
  margin: 0;
  width: 25px;
  height: 25px;
  z-index: 1;
}

#myassets .myAsset h2.PI {   background: transparent url(../images/searchresult_type_pi.gif) top left no-repeat; }
#myassets .myAsset h2.PS {   background: transparent url(../images/searchresult_type_ps.gif) top left no-repeat; }
#myassets .myAsset h2.VC {   background: transparent url(../images/searchresult_type_vc.gif) top left no-repeat; }
#myassets .myAsset h2.SO {   background: transparent url(../images/searchresult_type_so.gif) top left no-repeat; }
#myassets .myAsset h2.VI {   background: transparent url(../images/searchresult_type_vi.gif) top left no-repeat; }
#myassets .myAsset h2.FL {   background: transparent url(../images/searchresult_type_fl.gif) top left no-repeat; }
#myassets .myAsset h2.DD {   background: transparent url(../images/searchresult_type_3d.gif) top left no-repeat; }
#myassets .myAsset h2.PP {   background: transparent url(../images/searchresult_type_pp.gif) top left no-repeat; }

#myassets .myAsset .remove { /* Remove link */
  display: block;
  float: left;
  text-indent: -5000px;
  width: 11px;
  height: 14px;
  background: transparent url(../images/trash.gif) top left no-repeat;
}

#myassets .myAsset a.remove:hover { /* Avoid ugly underlining */
  text-decoration: none;
}


#myassets #UploadForm {
  margin-left: 26px;
  margin-bottom: 30px;
}


/* ========================================================================
   =                             Past Orders                              =
   ======================================================================== */

#pastorders h2 {
  border-bottom: 2px solid #8CC7E9;
  font-size: 15px;
  color: #525E78;

  margin-top: 40px;
  padding-bottom: 4px;
  margin-left: 40px;
  position: relative;

}

#pastorders h2 a {
  display: block;
  color: #525E78;
}
#pastorders h2 a:hover {
  text-decoration: none;
}

#pastorders h2 a img.collapse{
  position: absolute;
  top: 0;
  left: -25px;
}

#pastorders h2 span{
  position: absolute;
  right: 0;
  bottom: 2px;
  font-size: 13px;
}

/* -------------------------------------------------------------------- */

#pastorders .ShoppingCartLine {
  margin: 30px 0 30px 60px;
  border: 1px solid transparent; /* This border is necessary because without it, strangely, layout in Firefox is destroyed */
}

#pastorders .ShoppingCartLine .imageContainer {
  position: relative;
  width: 140px;
  float: left;
  font-size: 11px;
}


#pastorders .ShoppingCartLine .imageContainer h2 { /* Shows object type picture */
  border: none;
  position: absolute;
  top: -8px;
  left: -8px;
  margin: 0;
  width: 25px;
  height: 25px;
  z-index: 1;
}

#pastorders .ShoppingCartLine .imageContainer h2.PI {   background: transparent url(../images/searchresult_type_pi.gif) top left no-repeat; }
#pastorders .ShoppingCartLine .imageContainer h2.PS {   background: transparent url(../images/searchresult_type_ps.gif) top left no-repeat; }
#pastorders .ShoppingCartLine .imageContainer h2.VC {   background: transparent url(../images/searchresult_type_vc.gif) top left no-repeat; }
#pastorders .ShoppingCartLine .imageContainer h2.SO {   background: transparent url(../images/searchresult_type_so.gif) top left no-repeat; }
#pastorders .ShoppingCartLine .imageContainer h2.VI {   background: transparent url(../images/searchresult_type_vi.gif) top left no-repeat; }
#pastorders .ShoppingCartLine .imageContainer h2.FL {   background: transparent url(../images/searchresult_type_fl.gif) top left no-repeat; }
#pastorders .ShoppingCartLine .imageContainer h2.DD {   background: transparent url(../images/searchresult_type_3d.gif) top left no-repeat; }
#pastorders .ShoppingCartLine .imageContainer h2.PP {   background: transparent url(../images/searchresult_type_pp.gif) top left no-repeat; }

#pastorders .ShoppingCartLine .imageContainer img {
  display: block;
  margin-bottom: 4px;
}

/* -------------------------------------------------------------------- */

#pastorders .ShoppingCartLine .files {
  float: left;
}

#pastorders .ShoppingCartLine .files p {
  margin: 0;
  font-weight: bold;
}

#pastorders .ShoppingCartLine .files ul {
  margin: 0;
  padding-left: 20px;
}

#pastorders .ShoppingCartLine .files li {
  margin: 10px 0;
}

#pastorders .ShoppingCartLine .files li a {
  margin-right: 12px;
}

#pastorders .ShoppingCartLine .files li span {
  margin-right: 25px;
  font-style: italic;
}

/* ========================================================================
   =                             Asset Edit                               =
   ======================================================================== */

#assetEdit {
  color: #5A7294;
}

#assetEdit h2 {
  border-bottom: 2px solid #8CC7E9;
  font-size: 15px;
  color: #525E78;

  margin-top: 10px;
  padding-bottom: 4px;
  margin-left: 0px;
  position: relative;
}

#assetEdit h2 img { /* Progress Indicators */
  position: relative;
  margin-top: -10px; /* Avoid making the H2 taller */
  top: 2px;
  margin-left: 5px;
}


#assetEdit h2 input {
  position: absolute;
  right: 0px;
  font-size: 11px;
}

#assetEdit h2 span.comment {
  font-weight: normal;
  font-size: 11px;
}

/* HR's are used as section separators */
#assetEdit hr {
  font-size: 0;
  height: 8px;
  visibility: hidden;
}

/*--------------------------------------------------------------------*/

#assetEdit #assetData {
  position: relative; /* allow absolute positioning of Help Div */
}

#assetEdit #assetData #leftColumn {
  float: left;
  width: 424px;
}

#assetEdit #assetData #rightColumn {
  float: left;
  width: 350px;
  margin-left: 15px;
  font-size: 10px;
}


#assetEdit #assetData #assetImageZone { /* set striped background */
  padding: 12px;
  width: 400px;
  background: transparent url(../images/overlay_striped.gif) top left repeat;
}

#assetEdit #assetData #assetImageZone #imgContainer,
#assetEdit #assetData #assetImageZone #ZoomerFlashContainer,
#assetEdit #assetData #assetImageZone #PlayerFlashContainer {
  width: 400px;
}

#assetEdit #assetData #assetImageZone #PlayerFlashContainer {
  margin-top: 15px;
}

#assetEdit #assetData #assetImageZone #imgContainer img {
  display: block;
  margin: 0 auto;
}


#assetEdit #assetData #assetImageZone #MoveWatermarkLinks {
  margin-top: 10px;
}

#assetEdit #assetData #assetImageZone #MoveWatermarkLinks h3 {
  margin-top: 5px;
  color: black;
  font-size: 14px;
  float: left;
  margin-right: 10px;
}

#assetEdit #assetData #assetImageZone #MoveWatermarkLinks .MoveWatermark {
  float: left;
  width: 30px;
  height: 30px;
  text-indent: -3000px;
  font-size: 10px;
  font-weight: bold;
  margin-right: 12px;
  color: white;
}

#assetEdit #assetData #assetImageZone #MoveWatermarkLinks a.MoveWatermark:hover {
  text-decoration: none;
}

#assetEdit #assetData #assetImageZone #MoveWatermarkLinks #MoveWatermarkHigh { background: transparent url(../images/assetedit_watermark_high.gif) top left no-repeat; }
#assetEdit #assetData #assetImageZone #MoveWatermarkLinks #MoveWatermarkCenter { background: transparent url(../images/assetedit_watermark_center.gif) top left no-repeat; }
#assetEdit #assetData #assetImageZone #MoveWatermarkLinks #MoveWatermarkLow { background: transparent url(../images/assetedit_watermark_low.gif) top left no-repeat; }


#assetEdit #assetData #tblData {
}

#assetEdit #assetData #tblData h2 { /* Shows object type picture */
  position: static; /* Reset the relative position set to all H2 in this page */
  border: none;
  float: left;
  margin: 0;
  padding: 8px 0 0 30px;
  width: 25px;
  height: 25px;
  font-size: 10px;
  font-weight: normal;
}

#assetEdit #assetData #tblData h2.PI {   background: transparent url(../images/searchresult_type_pi.gif) top left no-repeat; }
#assetEdit #assetData #tblData h2.PS {   background: transparent url(../images/searchresult_type_ps.gif) top left no-repeat; }
#assetEdit #assetData #tblData h2.VC {   background: transparent url(../images/searchresult_type_vc.gif) top left no-repeat; }
#assetEdit #assetData #tblData h2.SO {   background: transparent url(../images/searchresult_type_so.gif) top left no-repeat; }
#assetEdit #assetData #tblData h2.VI {   background: transparent url(../images/searchresult_type_vi.gif) top left no-repeat; }
#assetEdit #assetData #tblData h2.FL {   background: transparent url(../images/searchresult_type_fl.gif) top left no-repeat; }
#assetEdit #assetData #tblData h2.DD {   background: transparent url(../images/searchresult_type_3d.gif) top left no-repeat; }
#assetEdit #assetData #tblData h2.PP {   background: transparent url(../images/searchresult_type_pp.gif) top left no-repeat; }

#assetEdit #assetData #tblData td {
  padding: 2px;
  font-size: 11px;
}

#assetEdit #assetData #tblData td.label {
  font-size: 10px;
  font-weight: bold;
  width: 90px;
}


#assetEdit #assetData #tblData td input {
  font-size: 10px;
}

#assetEdit #assetData #tblData td textarea {
  font-size: 11px;
}

#assetEdit #btnSaveContainer {
  text-align: center;
}

#assetEdit #btnSaveData1 {
  width: 80px;
  margin-right: 10px;
}

#assetEdit #btnSaveData2 {
  width: 120px;
  margin: 10px 10px 0 0;
}


/*--------------------------------------------------------------------*/

#assetEdit #assetData #UserNotification {
  color: red;
}
/*--------------------------------------------------------------------*/

#assetEdit #assetData #statusDiv {
  width: 410px;
  margin-top: 15px;
  padding-right: 10px;
  font-size: 11px;
}

#assetEdit #assetData #statusDiv h1 {
  border-bottom: 2px solid #8CC7E9;
  font-size: 15px;
  color: #525E78;
  margin: 0;
  padding-bottom: 4px;
}

#assetEdit #assetData #statusDiv h2 {
  border: none;
  position: static; /* Reset the relative position set to all H2 in this page */
  font-size: 14px;

  margin-top: 10px;
  margin-bottom: 2px;

  height: 22px;

  padding-top: 11px;
  background: transparent url(../images/myassets_preuploaded.gif) 0 -15px no-repeat; /* Set default image and size. Overriden later*/
  
  padding-left: 45px;
}

#assetEdit #assetData #statusDiv #statusPreUploaded h2 { padding-top: 25px; background-image: url(../images/myassets_preuploaded.gif); background-position: 0 0;}
#assetEdit #assetData #statusDiv #statusPending h2 {  background-image: url(../images/myassets_pending.gif); }
#assetEdit #assetData #statusDiv #statusRetire h2,
#assetEdit #assetData #statusDiv #statusPutBack h2 { background-image: url(../images/myassets_approved.gif); }
#assetEdit #assetData #statusDiv #statusSellersPass h2,
#assetEdit #assetData #statusDiv #statusUnSellersPass h2 { background-image: url(../images/myassets_unadvisable.gif); }
#assetEdit #assetData #statusDiv #statusRejected h2 { background-image: url(../images/myassets_rejected.gif); }
#assetEdit #assetData #statusDiv #statusApprove h2 { background-image: url(../images/myassets_pending.gif); }

#assetEdit #assetData #statusDiv input { /* Action buttons */
  display: block;
  margin-left: 40px;
  font-size: 10px;
}

/*--------------------------------------------------------------------*/

#assetEdit #assetData #statusDiv #statusApprove input { /* Approval Action buttons */
  display: inline;
  margin-left: 0;
}

#assetEdit #assetData #statusDiv #statusApprove ul {
  padding-left: 30px;
}

#assetEdit #assetData #statusDiv #statusApprove ul li {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #98A5C1;
}
/*--------------------------------------------------------------------*/

#assetEdit #sectionFiles,
#assetEdit #sectionReleases {
  float: left;
  width: 48%;
  position: relative; /* allow absolute positioning of Help Div */
}

#assetEdit #sectionReleases {
  float: right;
}

#assetEdit #sectionPictures,
#assetEdit #sectionPreview,
#assetEdit #sectionSelectablePictures {
  float: left;
  width: 100%;
  position: relative; /* allow absolute positioning of Help Div */
}

#assetEdit #sectionReleases .remove,
#assetEdit #sectionFiles .remove,
#assetEdit #sectionPreview .remove { /* Remove link */
  display: block;
  text-indent: -5000px;
  width: 11px;
  height: 14px;
  background: transparent url(../images/trash.gif) top left no-repeat;
   margin-right: 5px;
}

#assetEdit #sectionFiles td a,
#assetEdit #sectionReleases td a {
  color: #5A7294;
  text-decoration: underline;
}

#assetEdit #sectionReleases td a.remove,
#assetEdit #sectionFiles td a.remove,
#assetEdit #sectionReleases td a.remove:hover,
#assetEdit #sectionFiles td a.remove:hover,
#assetEdit #sectionPreview a.remove,
#assetEdit #sectionPreview a.remove:hover{
  text-decoration: none; /* avoid ugly underlining */
}

#assetEdit #sectionReleases .samplerelease {
  float: right;
  margin-right: 10px;
  font-size: 10px;
  position: relative;
  bottom: 7px;
}
#assetEdit #sectionReleases .samplerelease a {
  color: #5A7294;
}

/*--------------------------------------------------------------------*/

#assetEdit #sectionKeywords {
  position: relative; /* allow absolute positioning of Help Div */
}
  
#assetEdit #sectionKeywords #KeywordLeftContainer {
  float: left;
  margin-left: 15px;
}

#assetEdit #sectionKeywords #KWText { /* textbox width */
  width: 274px;
}

#assetEdit #sectionKeywords input {
  font-size: 10px;
}

#assetEdit #sectionKeywords #divKeyWordsList {
  border: 1px solid #98A5C1;
  width: 350px;
  height: 84px;
  margin-top: 5px;
  padding: 8px;

  /* Safari didn't recognize this. We put overflow: auto in here, and moved this code to the "noSafari" section at the bottom */
  /*  overflow: hidden; overflow-y:scroll; overflow: -moz-scrollbars-vertical; */
  overflow: auto;

}

#assetEdit #sectionKeywords #divKeyWordsList .keyword {
  width: 110px;
  display: block;
  float: left;
  margin: 2px 0;
}

#assetEdit #sectionKeywords #divKeyWordsList .keyword .remove,
#assetEdit #sectionPictures .picture .remove { /* Remove link */
  display: block;
  float: left;
  text-indent: -5000px;
  width: 11px;
  height: 14px;
  background: transparent url(../images/trash.gif) top left no-repeat;
  margin-right: 10px;
}

#assetEdit #sectionPictures .picture a.remove:hover,
#assetEdit #sectionKeywords #divKeyWordsList .keyword a.remove:hover {
  text-decoration: none; /* avoid ugly underlining */
}

#assetEdit #sectionKeywords #KeywordTips,
#assetEdit #sectionKeywords #KeywordMinimum {
  float: left;
  width: 300px;
  margin-left: 30px;
  margin-top: 25px;
}


/*--------------------------------------------------------------------*/

#assetEdit #sectionPictures .picture,
#assetEdit #sectionSelectablePictures .picture{
  float: left;
  width: 120px;
  height: 130px;
  margin: 6px;
}

#assetEdit #sectionSelectablePictures .picture{ /* center the SetMainPicture link */
  text-align:  center;
}

#assetEdit #sectionPictures .picture img,
#assetEdit #sectionSelectablePictures .picture img {
  display: block;
  margin: 0 auto;
  margin-bottom: 5px;
}


#assetEdit #sectionPictures .picture img.selected,
#assetEdit #sectionSelectablePictures .picture img.selected {
  border: 3px solid #607894;
}

#assetEdit #sectionPictures .picture a.setMainLink,
#assetEdit #sectionSelectablePictures .picture a.setMainLink {
  font-size: 9px;
}

/*--------------------------------------------------------------------*/

#assetEdit #sectionPreview #BottomPreviewFlashContainer {
  width: 150px;
  border: 3px solid #607894;
  margin-bottom: 4px;
}

/*--------------------------------------------------------------------*/


#assetEdit #files_addFileDialog {
  background-color:  #8A8C8E;
	padding: 10px;
	width: 420px;
	position: absolute;
	z-index: 20;
}

#assetEdit #files_addFileDialog #iFrameFileUpload {
  width: 420px;
  border: none;
}

/* Since I Can't style the contents of the iFrames in here, the stylesheets for those are in the head of assetedit_upload_form.php itself */

#assetEdit #files_addFileDialog .rainbow {
  position: relative;
  top: 10px;
  background:  #CCE2EC url(../images/rainbow2.gif) top left repeat;
  height: 6px;
  margin: 0 -10px 0 -10px; /* compensate for padding */
  font-size: 0;
}

/*--------------------------------------------------------------------*/

/* Hide all the light bulbs until Tony has written up the texts */
#assetEdit h2 .help {
}

#assetEdit .helpDiv {
  background-color:  #8A8C8E;
	padding: 20px;
	position: absolute;
	left: 10px;
	top: 10px;
	z-index: 100;
	cursor: pointer;
	color: white;
}

#assetEdit #HelpFiles { width: 500px; left: 70px; top: -30px;}
#assetEdit #HelpRelease { width: 350px; left: 10px; top: -10px; }
#assetEdit #HelpDetails { width: 500px; left: 80px; top: 30px; }
#assetEdit #HelpKeywords { width: 400px; left: 120px; top: -20px; }
#assetEdit #HelpPictures { width: 500px; left: 120px; top: 30px;}
#assetEdit #HelpPreview { width: 500px; left: 120px; top: 30px; }
#assetEdit #HelpSelPic { width: 500px; left: 120px; top: 30px; }

#assetEdit .helpDiv .helpDivClose {
  position: absolute;
  right: 10px;
  top: 10px;
}

#assetEdit .helpDiv .rainbow {
  position: relative;
  top: 20px;
  background:  #CCE2EC url(../images/rainbow2.gif) top left repeat;
  height: 6px;
  margin: 0 -20px 0 -20px; /* compensate for padding */
  font-size: 0;
}

/* The help divs appear behind other things contained by other "section divs",
 so I need the section divs to have descending z-indexes */
#assetEdit #sectionFiles { z-index: 8; }
#assetEdit #sectionReleases { z-index: 7;}
#assetEdit #assetData {z-index: 6; }
#assetEdit #sectionKeywords { z-index: 5; }
#assetEdit #sectionPictures { z-index: 4; }
#assetEdit #sectionPreview { z-index: 3; }
#assetEdit #sectionSelectablePictures { z-index: 2; }

/* ========================================================================
   =                             My Account                               =
   ======================================================================== */

#myaccount #maincontent,
#myaccount #maincontent a {
  color: #5B7397;
}

#myaccount #maincontent #leftColumn,
#myaccount #maincontent #rightColumn {
  width: 255px;
  float: left;
}

#myaccount #maincontent #rightColumn {
  margin-left: 20px;
}

#myaccount #maincontent div {
  width: 250px;
  padding-left: 15px;
  margin-bottom: 10px;
}

#myaccount #maincontent p {
  margin: 0;
}

#myaccount #maincontent h2 {
  font-size: 14px;
  border: 1px solid #ACB1B4;
  padding: 2px 10px;
  margin: 0 0 5px -15px;
}

#myaccount #maincontent a{
  display: block;
  margin: 4px 0;
}

#myaccount #maincontent #uploader ul li {
}

#myaccount #maincontent #uploader ul li a{
  display: inline;
  margin: 0;
}


#myaccount #maincontent .forumtopics,
#myaccount #maincontent .forumtopics a {
  font-size: 10px;
}


#myaccount #maincontent #mostdownloaded,
#myaccount #maincontent #lastuploaded {
  padding: 0;
}

#myaccount #maincontent #mostdownloaded h2,
#myaccount #maincontent #lastuploaded h2 {
  margin-left: 0;
}

#myaccount #maincontent #mostdownloaded .topDownload,
#myaccount #maincontent #lastuploaded .lastUpload {
  float: left;
  width: 120px;
  height: 150px;

  padding: 0;
  font-size: 9px;
  text-align: center;
}

#myaccount #maincontent #mostdownloaded .topDownload .topDownloadImageContainer,
#myaccount #maincontent #lastuploaded .lastUpload .lastUploadImageContainer {
  padding: 0;
  margin: 0 auto;
  width: 110px;
  margin-bottom: 5px;
}

#myaccount #maincontent #mostdownloaded .topDownload span,
#myaccount #maincontent #lastuploaded .lastUpload span {
  display: block;
}

#myaccount #maincontent #mostdownloaded .topDownload .topDownloadImageContainer img,
#myaccount #maincontent #lastuploaded .lastUpload .topDownloadImageContainer img {
  display: block;
  margin: 0 auto;
}


/* ========================================================================
   =                            Financials                                =
   ======================================================================== */
#financials h2 {
  font-size: 15px;
  color: #525E78;
}

#financials h3 {
  font-size: 13px;
  color: #525E78;
  margin-left: 20px;
  margin-top: 20px;
}

#financials table {
  border-collapse: collapse;
  margin: 0 0 40px 0;
}

#financials table thead {
  font-weight: bold;
}

#financials table td,
#financials table th {
  padding: 3px 10px 2px 5px;
}

#financials table td a {
  text-decoration: underline;
}

#financials table thead th {
  text-align: left;
  border-bottom: 2px solid #94CBED;
  margin: 0;
}

#financials table thead th.detail {
  width: 300px;
}


#financials table td.price {
  text-align: right;
  padding-right: 20px;
}


#financials table .TotalRow {
  font-weight: bold;
  background-color: #ADD4E7;
}

#financials table .TotalRow td {
  padding-top: 5px;
  padding-bottom: 5px;
}

#financials table .TotalRow td.TotalTitle {
  text-align: right;
}

#financials .summary {
  display: block;
  margin-left: 20px;
  font-weight: bold;
}


#financials .assetSale {
  float: left;
  width: 120px;
  height: 160px;
  margin: 6px;
  font-size: 9px;
  border: 1px solid #98A5C1;
}

#financials .assetSale img {
  display: block;
  margin: 5px auto;
}

#financials .assetSale span {
  display: block;
  text-align: center;
}

/* ========================================================================
   =                            Admin Panel                               =
   ======================================================================== */

.adminpage h1 {
  color: #525E78;
  font-size: 16px;
  margin-top: 15px;
}

.adminpage h2 {
  color: #525E78;
  font-size: 14px;
  margin-top: 20px;
}
.adminpage li {
  margin: 10px 0;
}

.adminpage .tabletitle {
  background: #EFEFF0 url(../images/searchbar_bg.gif) bottom left repeat-x;
  font-weight: bold;
}

.adminpage tr.spacer { height: 15px; }
.adminpage tr.spacer td { font-size: 0; }

.adminpage .subtotal {
  background: #DFDFDF;
  font-weight: bold;
  margin-bottom: 10px;
}
.adminpage .subtotal td { font-size: 11px; }

.adminpage .total {
  background: #BFBFBF;
  font-weight: bold;
}

.adminpage .listrow {
  background-color:  #CCE2EC;
}

.adminpage .listrow.dark {
  background-color: #A2C4D2;
}

.adminpage .red { color: red; }

form,
form td {
  color: #000;
}
/* ========================================================================
   =                              Other Pages                             =
   ======================================================================== */
   
/* Pages with a small colored div in the middle that shows information */

#centersmalldiv {
  background: #CFE6F1 url(../images/centersmalldiv_bg.gif) top left repeat-x;
  margin: 40px auto;
  padding: 20px 30px;
  text-align: center;
}

/* NOTE: These rules are duplicated for IE styling. Update the other stylesheet if you change this */
#centersmalldiv.messagediv { width: 400px; } /* changed this name from .message, because two rules collapsed in IE's style */
#centersmalldiv.paypal { width: 400px; }
#centersmalldiv.paypalreceipt { width: 600px; }
#centersmalldiv.error { width: 500px; }
#centersmalldiv.creditcard { width: 500px; }
#centersmalldiv.currentbracket { width: 400px; }

#centersmalldiv.confirmation,
#centersmalldiv.forgotpassword,
#centersmalldiv.NotEnoughEarnings {
  width: 560px;
  text-align: left;
}

#centersmalldiv.login {
  width: 490px;
  text-align: left;
}


#centersmalldiv.AssetCreateIncomplete { width: 350px; } /* changed this name from .message, because two rules collapsed in IE's style */


#centersmalldiv.AssetCreateIncomplete table {
  margin-top: 10px;
  width: 100%;
}
#centersmalldiv.AssetCreateIncomplete table td,
#centersmalldiv.AssetCreateIncomplete span {
  text-align: left;
}

/* -------------------------------------------------------------------- */

/* Payment & Withdraw Method Div */

#PaymentMethod {
  background: #CFE6F1 url(../images/centersmalldiv_bg.gif) top left repeat-x;
  padding: 15px;
  margin-bottom: 10px;
  position: relative;
}

#PaymentMethod .method {
  margin-bottom: 5px;
}

#PaymentMethod #paymentCCFields {
  margin-left: 45px;
  margin-top: 5px;
}

#PaymentMethod #paymentCCFields select {
  margin: 0;
}

#PaymentMethod #PaymentMethodSubmit {
  display: block;
  margin: 20px 0 0 180px;
  width: 120px;
}


/* -------------------------------------------------------------------- */
/* Text Only pages (like the one with the explanation on CVV */

#textonly h1 {
  color: #525E78;
  font-size: 16px;
  margin-top: 15px;
}

#textonly h2 {
  color: #525E78;
  font-size: 14px;
  margin-top: 10px;
}

/* -------------------------------------------------------------------- */
/* Uploader Fee  */

/* Separate bracket options */
#UploaderFee .bracketOption {
  margin-bottom: 10px;
  margin-left: 30px;
}

#UploaderFee .bracketValidDate {
  color: #6A7378;
}

/* -------------------------------------------------------------------- */


/* ========================================================================
   =                           Safari Exclusion                           =
   ======================================================================== */
/* NOTE: All rules below this point are NOT READ BY Safari!!! */
/* This section MUST BE at the end of the file */

/* This is the rule that makes the hack. Everything after this rule is not read by Safari */
body { margin: 0; ! } 

/* Safari does not recognize overflow-y:scroll; or overflow: -moz-scrollbars-vertical;, so we put overflow: auto in the rule
     and we override it here, which safari can not see */
#main_page #lightbox  #lightboxcontainer {
  overflow: hidden;
  overflow-y:scroll; overflow: -moz-scrollbars-vertical;
}
#assetEdit #sectionKeywords #divKeyWordsList {
  overflow: hidden;
  overflow-y:scroll;
  overflow: -moz-scrollbars-vertical;
}