Team:Johns Hopkins/fancyboxcss

From 2011.igem.org

/*

* FancyBox - jQuery Plugin
* Simple and fancy lightbox alternative
*
* Examples and documentation at: http://fancybox.net
* 
* Copyright (c) 2008 - 2010 Janis Skarnelis
* That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated.
* 
* Version: 1.3.4 (11/11/2010)
* Requires: jQuery v1.3+
*
* Dual licensed under the MIT and GPL licenses:
*   http://www.opensource.org/licenses/mit-license.php
*   http://www.gnu.org/licenses/gpl.html
*/

div#fancy_overlay { position:absolute; top: 0; left: 0; z-index: 90; width: 100%; background-color: #333; }

div#fancy_loading { position: absolute; height: 40px; width: 40px; cursor: pointer; display: none; overflow: hidden; background: transparent; z-index: 100; }

div#fancy_loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background: transparent url(Fancy_progress.png) no-repeat; }

div#fancy_close { position: absolute; top: -12px; right: -12px; height: 30px; width: 30px; background: transparent url(Fancy_closebox.png) ; cursor: pointer; z-index: 100; display: none; }

div#fancy_content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; margin: 0; z-index: 96; }

  1. fancy_frame {

position: relative; width: 100%; height: 100%; display: none; }

img#fancy_img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0; padding: 0; margin: 0; z-index: 92; }

div#fancy_title { position: absolute; bottom: -35px; left: 0; width: 100%; z-index: 100; display: none; }

div#fancy_title table { margin: 0 auto; }

div#fancy_title div { color: #FFF; font: bold 12px Arial; padding-bottom: 2px; }

td#fancy_title_left { height: 32px; width: 15px; background: transparent url(Fancy_title_left.png) repeat-x; }

td#fancy_title_main { height: 32px; background: transparent url(Fancy_title_main.png) repeat-x; }

td#fancy_title_right { height: 32px; width: 15px; background: transparent url(Fancy_title_right.png) repeat-x; }

div#fancy_outer { position: absolute;

   top: 0;
   left: 0;
   z-index: 90;
   padding: 18px 18px 58px 18px;
   margin: 0;
   overflow: hidden;
   background: transparent;
   display: none;

}

div#fancy_inner { position: relative; width:100%; height:100%; border: 1px solid #444; background: #FFF; }

a#fancy_left, a#fancy_right { position: absolute; bottom: 10px; height: 100%; width: 35%; cursor: pointer; background-image: url(data:image/gif;base64,AAAA); z-index: 100; }

a#fancy_left { left: 0px; }

a#fancy_right { right: 0px; }

a#fancy_left:hover { background: transparent url(Fancy_left.gif) no-repeat 0% 100%; }

a#fancy_right:hover { background: transparent url(Fancy_right.gif) no-repeat 100% 100%; }

  1. fancy_bigIframe, #fancy_freeIframe {

position:absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; }

div#fancy_bg { display: none; }

div.fancy_bg { position: absolute; display: block; z-index: 70; }

div.fancy_bg_n { top: -18px; width: 100%; height: 18px; background: transparent url(Fancy_shadow_n.png) repeat-x; }

div.fancy_bg_ne { top: -18px; right: -13px; width: 13px; height: 18px; background: transparent url(Fancy_shadow_ne.png) no-repeat; }

div.fancy_bg_e { right: -13px; height: 100%; width: 13px; background: transparent url(Fancy_shadow_e.png) repeat-y; }

div.fancy_bg_se { bottom: -18px; right: -13px; width: 13px; height: 18px; background: transparent url(Fancy_shadow_se.png) no-repeat; }

div.fancy_bg_s { bottom: -18px; width: 100%; height: 18px; background: transparent url(Fancy_shadow_s.png) repeat-x; }

div.fancy_bg_sw { bottom: -18px; left: -13px; width: 13px; height: 18px; background: transparent url(Fancy_shadow_sw.png) no-repeat; }

div.fancy_bg_w { left: -13px; height: 100%; width: 13px; background: transparent url(Fancy_shadow_w.png) repeat-y; }

div.fancy_bg_nw { top: -18px; left: -13px; width: 13px; height: 18px; background: transparent url(Fancy_shadow_nw.png) no-repeat; }