.viewer {
  padding: 20px 0;
  max-width: 80%;
  margin: auto;
}

.view-wrapper {
  margin: 4px;
  border: 4px solid rgb(1, 179, 228);
  /* border: 1px solid rgba(0, 0, 0, .03);
  box-shadow: 0 2px 2px rgba(0, 0, 0, .24),
    0 0 2px rgba(0, 0, 0, .12); */
}

.viewer-title {
  padding: 8px 20px;
  display: flex;
  justify-content: center;
  align-content: center;
  /* color: rgba(0, 0, 0, .54);
  background: rgba(0, 0, 0, .03); */
  /* variant:  */
  color: rgb(255, 255, 255);
  background: rgb(1, 179, 228);
}

.viewer-section {
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
}

.social {
  display: flex;
  flex-wrap: wrap;
  align-content: space-around;
}

h3>i {
  letter-spacing: 8px;
}