#modal {
  background-color: rgba(0, 0, 0, 0.25);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  z-index: 999999; }
  #modal:empty {
    display: none; }
  #modal > article {
    border: 1px solid #d6d6d6;
    border-radius: 3px;
    left: calc(50% - 150px);
    position: absolute;
    right: 100px;
    top: calc(50% - 75px);
    width: 360px; }
    #modal > article .actions {
      background: white;
      border-top: 1px solid #eaeaea;
      text-align: center; }
      #modal > article .actions a {
        cursor: pointer; }
    #modal > article > div > h3, #modal > article > form > div > h3 {
      font-weight: 500;
      margin: 10px 0 10px 10px; }
      #modal > article > div > h3:after, #modal > article > form > div > h3:after {
        content: ' :'; }
    #modal > article > div > p, #modal > article > form > div > p {
      line-height: 1.4em;
      padding: 10px; }
    #modal > article > div > ul:not(.actions), #modal > article > form > div > ul:not(.actions) {
      margin: 10px 0;
      padding-left: 10px; }
      #modal > article > div > ul:not(.actions) > li, #modal > article > form > div > ul:not(.actions) > li {
        display: list-item;
        line-height: 1.4em;
        list-style-position: inside; }
    #modal > article > header {
      border: none;
      border-bottom: 1px solid #eaeaea; }