@import mixins

.esphinx.ui

&.modal
  position: absolute
  top: 0
  bottom: 0
  left: 0
  right: 0

  .mask
    top: 0
    bottom: 0
    left: 0
    right: 0
    background-color: black
    opacity: 0.3

  section
    +shadow(gray, 3px, 3px, 2px)
    background: white
    height: initial
    width: initial
    position: fixed !important
    //alterou a centralização da imagem oO
    //z-index: 1

    header
      padding: 5px 10px

      .actions

        display: inline-block

        a
          color: #ccc
          font-weight: bold
          font-size: 20px
          text-decoration: none

          &.close-button

            &:before
              content: "×"

          &.hide-button
            margin-left: 5px

            &:before
              content: "−"

          &.close-button,
          &.hide-button
            &:hover
              cursor: pointer
              color: #999

    .main
      margin: 0
      text-align: left