.contact-summary {
  margin: 5px 10px;
  display: inline-block;
  vertical-align: top;
  
  h2, p {
    margin: 0;
  }
  .section {
    margin-bottom: 24px;
  }
  li {
    display: inline-block;
    margin-right: 1em;
  }
  .title {
    width: 275px;
    text-align: center;
    margin: 15px 0 10px;

    h2 {
      font-weight: bold;
    }
    h3 {
      margin: 1px 0 0;
      font-size: 21px;
      .user-link {
        color: inherit;
      }
    }
  }

  .profpic {
    position: relative;
    display: inline-block;
    .hexagon-275 {
      z-index: 10;
    }
    .hexTop, .hexBottom {
      outline: 5px solid #eee;
    }
  }

  .totem {
    position: relative;
    width: 275px;
    height: 318px;

    .corner {
      position: absolute;
      z-index: 5;
      display: block;
      width: 130px;
      height: 100px;
      background: #282C32;
      color: #2778E2;
      border-radius: 2px;
      font-family: @font-family-monospace;
      font-size: 21px;
      .corner-inner {
        position: absolute;
      }
      &:hover:after {
        content: attr(data-overlay);
        position: absolute;
        background: inherit;
        border-radius: 2px;
        width: 100%;
        font-family: @font-family-sans-serif;
        font-size: 15px;
      }
    }
    .topleft {
      top: 10px;
      left: 10px;
      .corner-inner {
        left: 9px;
        top: 4px;
      }
      &:hover:after {
        top: 0;
        left: 0;
        padding: 4px 6px 50px;
      }
    }
    .topright {
      top: 10px;
      right: 10px;
      .corner-inner {
        right: 11px;
        top: 4px;
      }
    }
    .botleft {
      bottom: 10px;
      left: 10px;
      .corner-inner {
        left: 9px;
        top: 68px;
      }
      &:hover:after {
        bottom: 0;
        left: 0;
        padding: 50px 6px 4px;
      }
    }
    .botright {
      bottom: 10px;
      right: 10px;
      .corner-inner {
        right: 11px;
        top: 68px;
      }
      &:hover:after {
        bottom: 0;
        right: 0;
        padding: 50px 6px 4px;
        text-align: right;
      }
    }
    .glyphicon {
      font-size: 12px;
      margin: 0 3px;
    }
  }

  .relations {
    margin: 0 0 0 10px;
    .user-hexagon {
      opacity: 1;
    }
  }
}
