.modal-body {
  display: flex;
  flex-Flow: wrap row;
  height: 555px;
  transition: height 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.modal-body.short {
  height: 255px;
}
.modal-body.medium {
  height: 375px;
}
.modal-body .modal-graph {
  flex-basis: 40%;
  display: flex;
  align-items: flex-start;
}
.modal-body .modal-graph .canvas-container {
  flex-basis: 50%;
  margin: 0 5px;
}
.modal-body .modal-graph .stat-box {
  color: #fff;
  padding: 5px 15px;
  border-radius: 2px;
}
.modal-body .modal-graph .stat-box:not(:last-child) {
  margin-bottom: 3px;
}
.modal-body .modal-graph .stat-box.opened-label {
  background-color: #5CB85C;
}
.modal-body .modal-graph .stat-box.clicked-label {
  background-color: #EC6702;
}
.modal-body .modal-graph .stat-box.not-opened-label {
  background-color: #5BC0DE;
}
.modal-body .modal-graph .stat-box.dropouts-label {
  background-color: #E4E9EA;
  color: #EC6702;
}
.modal-body .modal-stats {
  flex-basis: 55%;
  margin-left: 10px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.modal-body .modal-stats .modal-stat-row {
  display: flex;
  height: 30px;
  padding: 2.5px 0;
  justify-content: space-between;
  width: 100%;
}
.modal-body .modal-stats .modal-stat-row:not(:last-child) {
  border-bottom: 1px solid #EFEFEF;
}
.modal-body .modal-stats .modal-stat-row .label-text.label-text-trigger .unsubscribed-list-trigger {
  color: #EC6702;
  font-weight: bold;
  text-decoration: underline;
}
.modal-body .modal-stats .modal-stat-row .label-text.label-text-trigger .unsubscribed-list-trigger:hover {
  cursor: pointer;
  text-decoration: none;
}
.modal-body .modal-stats .modal-stat-row .label-text.label-text-trigger .info-link {
  width: 20px;
  height: 20px;
  font-size: 14.5px;
  border-radius: 50%;
  margin: 2px 0 0 4px;
  color: #fff;
  background: #cdcbcb;
  cursor: default;
  display: inline-block;
  text-align: center;
}
.modal-body .modal-stats .modal-stat-row .label-text.label-text-trigger .info-link:before {
  content: '?';
  font-weight: bold;
}
.modal-body .unsubscribed-list {
  height: 120px;
  width: 100%;
}
.modal-body .unsubscribed-list ul {
  height: 105px;
  overflow-y: auto;
}
.modal-body .link-performance {
  margin-top: 15px;
  flex-basis: 100%;
  height: 300px;
  overflow-y: auto;
}
.modal-body .link-performance h5 {
  margin: 0;
  padding: 0;
}
.modal-body .link-performance .link-headings,
.modal-body .link-performance .link-row {
  padding: 7px 0;
  border-bottom: 1px solid #EFEFEF;
}
.modal-body .link-performance > .link-headings {
  display: flex;
  justify-content: space-between;
}
.modal-body .link-performance > .link-headings .headings-url {
  flex-basis: 71%;
}
.modal-body .link-performance > .link-headings .headings-recipient {
  flex-basis: 17%;
}
.modal-body .link-performance > .link-headings .headings-clicks {
  flex-basis: 8%;
}
.modal-body .link-performance .link-row {
  display: flex;
  justify-content: space-between;
}
.modal-body .link-performance .link-row .link-rank {
  flex-basis: 6%;
}
.modal-body .link-performance .link-row .link-string {
  flex-basis: 65%;
}
.modal-body .link-performance .link-row .link-unique {
  flex-basis: 6%;
}
.modal-body .link-performance .link-row .link-unique-rate {
  flex-basis: 11%;
}
.modal-body .link-performance .link-row .link-total {
  flex-basis: 8%;
}