SOURCE CODE: Uize.Widgets.Dialog.Css

.`shield` {
  position: absolute;
  display: none;
  background-color: #000;
  opacity: 0.1;
  filter: alpha(opacity=10);
  cursor: not-allowed;
  z-index: 1;
}

.`` {
  position: absolute;
  display: none;
  top: 100px;
  left: 200px;
  width: 300px;
  height: 300px;
  background: #000;
  padding: 0px;
  z-index: 2;
}

/*** dialog shadow ***/
  .`shadow`, .`shadow2`, .`shadow3`, .`shadow4` {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
  }

/*** dialog chrome ***/
  /*** title bar and status bar ***/
    .`bar` {
      position: absolute;
      left: 0px;
      width: 100%;
      height: 27px;
      text-align: center;
      font-size: 14px;
      font-family: Arial, Helvetica, Verdana;
      margin: -1px;
      background: #ccc repeat left top;
    }
    /*** title bar ***/
      .`titleBar` {
        top: -26px;
      }
      .`titleBar` .`title` {
        width: 100%;
        color: #000;
        text-shadow: -1px -1px 2px #eee, -1px 1px 2px #eee, 0 -1px 2px #eee, 0 1px 2px #eee;
        line-height: 22px;
        text-transform: uppercase;
        letter-spacing: 1px;
      }
      .`titleBar` .`closeButton` {
        display: block;
        position: absolute;
        right: 2px;
        bottom: 2px;
      }

    /*** dialog status bar ***/
      .`statusBar` {
        bottom: -26px;
      }
      .`statusBar` .`cancelButton`,
      .`statusBar` .`okButton`
      {
        display: block;
        position: absolute;
        bottom: 2px;
        min-width: 55px;
      }
      .`statusBar` .`cancelButton` {
        left: 2px;
      }
      .`statusBar` .`okButton` {
        right: 2px;
      }

  /*** dialog corners / edges ***/
    .`cornerEastWest`, .`cornerNorthSouth` {
      position: absolute;
      background: #ccc;
    }
    .`cornerEastWest` {
      height: 100%;
      width: 5px;
      top: 0px;
    }
    .`cornerNorthSouth` {
      position: absolute;
      width: 100%;
      height: 5px;
      left: 0px;
    }
    .`cornerCorner` {
      position: absolute;
      width: 31px;
      height: 31px;
      background: #ccc;
    }
    /*** edge positioning ***/
      .`edgeWest` {left: -5px;}
      .`edgeEast` {right: -5px;}
      .`edgeNorth` {top: -31px;}
      .`edgeSouth` {bottom: -31px;}

    /*** edge borders ***/
      .`edgeNorth`.`edgeWest` {border-top-left-radius: 3px;}
      .`edgeNorth`.`edgeEast` {border-top-right-radius: 3px;}
      .`edgeSouth`.`edgeWest` {border-bottom-left-radius: 3px;}
      .`edgeSouth`.`edgeEast` {border-bottom-right-radius: 3px;}

/*** contents ***/
  .`contents` {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: #fff;
    overflow: auto;
  }
  .`contents` h1 {
    font-size: 14px;
    margin: 0 5px;
    border-bottom: 1px solid #555;
  }
  .`contents` p {
    margin: 4px 4px 12px 4px;
  }