#deceased {
  display: flex;
  margin: -20px;
}

#deceased > div {
  flex-basis: calc((100% / 2) - 41px);
  margin: 20px;
}

@media (max-width: 767px) {
  #deceased {
    flex-wrap: wrap;
    margin: 0;
  }
  #deceased > div {
    flex-basis: 100%;
    margin: 0;
  }
}

#deceased .deceased-image img {
  width: 100%;
}

#deceased .image-placeholder {
  position: relative;
  padding-bottom: 150%;
  background: rgba(0, 0, 0, 0.1);
}

#deceased .image-placeholder .placeholder-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: rgba(0, 0, 0, 0.1);
  /* font-style: italic; */
  font-size: 50px;
  line-height: 50px;
}

/*** FORM ***/

#condolences_form {
}

.fieldgroup {
  display: flex;
  margin-bottom: 8px;
}

.fieldgroup label {
  flex-basis: 200px;
  display: block;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}

.fieldgroup .field {
  flex-basis: calc(100% - 200px);
  max-width: 400px;
  box-sizing: border-box;
  height: auto;
  display: block;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}

@media (max-width: 600px) {
  .fieldgroup {
    flex-wrap: wrap;
  }
  .fieldgroup .label,
  .fieldgroup .field {
    flex-basis: 100%;
  }
}

.fieldgroup textarea#message.field {
  resize: vertical;
}

.fieldgroup.checkbox-privacy {
  position: relative;
  padding-left: 25px;
}

.fieldgroup.checkbox-privacy > label {
  flex-basis: auto;
}

.fieldgroup.checkbox-privacy > input {
  position: absolute;
  left: 0px;
}

span.required {
  margin-left: 4px;
  font-size: 0.9em;
  line-height: inherit;
}

#send-condolence {
  margin-top: 16px;
  font-size: inherit;
}

#condolence-error {
  display: none;
  color: red;
  padding: 0 0 10px 3px;
  font-size: 11px;
  margin-top: -10px;
}
#condolence-succes {
  display: none;
  color: green;
  background: #c4f2c4;
  padding: 20px;
  font-weight: 500;
  text-align: center;
}

/*** MOURNING LETTER ***/

#deceased_mourning_letter img {
  max-width: 100%;
  margin-bottom: 20px;
}

/*** TABS ***/

#deceased_tabs_nav {
  margin-top: 40px;
  border-bottom: solid 2px rgba(0, 0, 0, 0.1);
}

#deceased_tabs_nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#deceased_tabs_nav ul li {
  display: inline-block;
  margin: 0;
  padding: 0;
}

#deceased_tabs_nav ul li span {
  color: inherit;
  cursor: pointer;
  line-height: 40px;
  display: inline-block;
  padding: 5px 20px;
  box-sizing: border-box;
}

#deceased_tabs_nav ul li:not(.active) span {
  opacity: 0.5;
}

#deceased_tabs_nav ul li.active span,
#deceased_tabs_nav ul li span:hover {
  opacity: 1;
  text-decoration: none;
  border-bottom: solid 2px;
  margin: 0;
  margin-bottom: -2px;
}

#deceased_tabs .tab_content {
  padding: 40px 0;
}

#deceased_tabs .tab_content:not(.active) {
  display: none;
}