/* Overlay */
#shadowbox_overlay { visibility:hidden; position:absolute; display:block; margin:0; padding:0; top:0; left:0; z-index:1998; }

/* Container */
#shadowbox_container { position:fixed; height:0px; width:100%; margin:0; padding:0; top:0; left:0; z-index:1999; text-align:center; /* centers in quirks and IE */; }

/* Shadowbox */
#shadowbox { display:none; visibility:hidden; margin:0 auto; position:relative; font-family:'Lucida Grande',Tahoma,sans-serif; text-align:left; /* reset left alignment */; }

/* Title */
/*
HTML snapshot:
<div id="shadowbox_title">
 <div id="shadowbox_title_inner">Title Here</div>
</div>
*/
#shadowbox_title { height:25px; padding:0; overflow:hidden; }
#shadowbox_title_inner { height:16px; font-size:16px; line-height:16px; white-space:nowrap; padding:5px 0 4px 8px; color:#333; display:none; }

/* Body */
/*
HTML snapsnot:
<div id="shadowbox_body">
 <div id="shadowbox_body_inner">
  <img src="my_image.jpg"id="shadowbox_content"height="350"width="580">
 </div>
 <div id="shadowbox_loading">
  <img src="images/loading.gif"alt="loading"></div>
  <span><a href="javascript:Shadowbox.close(); ">Cancel</a></span>
 </div>
</div>
*/
#shadowbox_body { position:relative; overflow:hidden; margin:0; padding:0; border:0px solid #fff; background-color:none; }
#shadowbox_body_inner { position:relative; overflow:hidden; background-color:none; }
#shadowbox_loading { position:absolute; top:0; left:0; height:1000px; /* overflow:hidden will clip this */ width:100%; background-color:none; }
#shadowbox_loading img {float:left; display:none; margin:80px 0 0 150px; }
#shadowbox_loading span { display:none; float:left; margin-top:16px; font-size:10px; }
#shadowbox_loading span a, 
#shadowbox_loading span a:link, 
#shadowbox_loading span a:visited { color:#fff; }

#shadowbox_content.html {/* make html content scrollable */ height:100%; width:100%; overflow:auto; }

/* Toolbar */
/*
HTML snapshot:
<div id="shadowbox_toolbar">
 <div id="shadowbox_toolbar_inner">
  <div id="shadowbox_nav_close">
   <a href="javascript:Shadowbox.close(); "><span class="shortcut">C</span>lose</a>
  </div>
  <div id="shadowbox_nav_next">
   <a href="javascript:Shadowbox.next(); "><span class="shortcut">N</span>ext</a>
  </div>
  <div id="shadowbox_nav_previous">
   <a href="javascript:Shadowbox.previous(); "><span class="shortcut">P</span>revious</a>
  </div>
  <div id="shadowbox_counter">
   <a href="javascript:Shadowbox.change(0); ">1</a>
   <a href="javascript:Shadowbox.change(1); "class="shadowbox_counter_current">2</a>
   <a href="javascript:Shadowbox.change(2); ">3</a>
  </div>
 </div>
</div>
*/
#shadowbox_toolbar { margin:0; padding:0; height:20px; overflow:hidden; }
#shadowbox_toolbar_inner { height:20px; color:#333; }
#shadowbox_toolbar_inner div { padding-top:4px; padding-bottom:2px; font-size:10px; height:10px; line-height:10px; }
#shadowbox_toolbar_inner div span.shortcut { text-decoration:underline; font-weight:bold; }
#shadowbox_toolbar_inner div a { text-decoration:none; color:#333; font-size:10px; }
#shadowbox_nav_close, 
#shadowbox_nav_previous, 
#shadowbox_nav_next { display:none; float:right; padding-right:10px; }
#shadowbox_counter { display:none; float:left; padding-left:10px; }
#shadowbox_counter a { padding:0 4px 0 0; }
#shadowbox_counter a.shadowbox_counter_current { text-decoration:underline; font-weight:bold; }

/*_ Messages */
div.shadowbox_message { text-align:center; padding:10px; }
div.shadowbox_message a:link, 
div.shadowbox_message a:visited { text-decoration:none; color:#bed333; }
div.shadowbox_message a:hover, 
div.shadowbox_message a:focus { text-decoration:underline; }