html, body
  height: 100%

div#fancy_overlay
  position: fixed
  top: 0
  left: 0
  width: 100%
  height: 100%
  background-color: #666
  display: none
  z-index: 30

* html div#fancy_overlay
  position: absolute
  height: 580px

div
  &#fancy_wrap
    text-align: left

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

    div
      position: absolute
      top: 0
      left: 0
      width: 40px
      height: 480px
      background: transparent url('/images/fancybox/fancy_progress.png') no-repeat

  &#fancy_loading_overlay
    position: absolute
    background-color: #FFF
    z-index: 30

  &#fancy_loading_icon
    position: absolute
    background: url('/images/fancybox/fancy_loading.gif') no-repeat
    z-index: 35
    width: 16px
    height: 16px

  &#fancy_outer
    position: absolute
    top: 0
    left: 0
    z-index: 90
    padding: 18px 18px 33px 18px
    margin: 0
    overflow: hidden
    background: transparent
    display: none

  &#fancy_inner
    position: relative
    width: 100%
    height: 100%
    border: 1px solid #BBB
    background: #FFF

  &#fancy_content
    margin: 0
    z-index: 100
    position: absolute

  &#fancy_div
    background: #000
    color: #FFF
    height: 100%
    width: 100%
    z-index: 100


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


div#fancy_close
  position: absolute
  top: -12px
  right: -15px
  height: 30px
  width: 30px
  background: url('/images/fancybox/fancy_closebox.png') top left no-repeat
  cursor: pointer
  z-index: 181
  display: none


#fancy_frame
  position: relative
  width: 100%
  height: 100%
  display: none

#fancy_ajax
  width: 100%
  height: 100%
  overflow: auto

a
  &#fancy_left, &#fancy_right
    position: absolute
    bottom: 0px
    height: 100%
    width: 35%
    cursor: pointer
    z-index: 111
    display: none
    outline: none

  &#fancy_left
    left: 0px

  &#fancy_right
    right: 0px


span
  &.fancy_ico
    position: absolute
    top: 50%
    margin-top: -15px
    width: 30px
    height: 30px
    z-index: 112
    cursor: pointer
    display: block

  &#fancy_left_ico
    left: -9999px
    background: transparent url('/images/fancybox/fancy_left.png') no-repeat

  &#fancy_right_ico
    right: -9999px
    background: transparent url('/images/fancybox/fancy_right.png') no-repeat


a
  &#fancy_left:hover, &#fancy_right:hover
    visibility: visible

  &#fancy_left:hover span
    left: 20px

  &#fancy_right:hover span
    right: 20px


.fancy_bigIframe
  position: absolute
  top: 0
  left: 0
  width: 100%
  height: 100%
  background: transparent


div
  &#fancy_bg
    position: absolute
    top: 0
    left: 0
    width: 100%
    height: 100%
    z-index: 70
    border: 0
    padding: 0
    margin: 0

  &.fancy_bg
    position: absolute
    display: block
    z-index: 70
    border: 0
    padding: 0
    margin: 0

  &.fancy_bg_n
    top: -18px
    width: 100%
    height: 18px
    background: transparent url('/images/fancybox/fancy_shadow_n.png') repeat-x

  &.fancy_bg_ne
    top: -18px
    right: -13px
    width: 13px
    height: 18px
    background: transparent url('/images/fancybox/fancy_shadow_ne.png') no-repeat

  &.fancy_bg_e
    right: -13px
    height: 100%
    width: 13px
    background: transparent url('/images/fancybox/fancy_shadow_e.png') repeat-y

  &.fancy_bg_se
    bottom: -18px
    right: -13px
    width: 13px
    height: 18px
    background: transparent url('/images/fancybox/fancy_shadow_se.png') no-repeat

  &.fancy_bg_s
    bottom: -18px
    width: 100%
    height: 18px
    background: transparent url('/images/fancybox/fancy_shadow_s.png') repeat-x

  &.fancy_bg_sw
    bottom: -18px
    left: -13px
    width: 13px
    height: 18px
    background: transparent url('/images/fancybox/fancy_shadow_sw.png') no-repeat

  &.fancy_bg_w
    left: -13px
    height: 100%
    width: 13px
    background: transparent url('/images/fancybox/fancy_shadow_w.png') repeat-y

  &.fancy_bg_nw
    top: -18px
    left: -13px
    width: 13px
    height: 18px
    background: transparent url('/images/fancybox/fancy_shadow_nw.png') no-repeat

  &#fancy_title
    position: absolute
    bottom: -33px
    left: 0
    width: 100%
    z-index: 100
    display: none

    div
      color: #FFF
      font: bold 12px Arial
      padding-bottom: 3px

    table
      margin: 0 auto

      td
        padding: 0
        vertical-align: middle

td
  &#fancy_title_left
    height: 32px
    width: 15px
    background: transparent url(/images/fancybox/fancy_title_left.png) repeat-x

  &#fancy_title_main
    height: 32px
    background: transparent url(/images/fancybox/fancy_title_main.png) repeat-x

  &#fancy_title_right
    height: 32px
    width: 15px
    background: transparent url(/images/fancybox/fancy_title_right.png) repeat-x