:root {
  --main-bg-color: #ccccc0;
  --main-text-color: black;
  --main-title-color: red;
  --caption-bg-color: #ddb6c1;
}

body{
  background-color: var(--main-bg-color);
  color: var(--main-text-color);
  font-family: "Merriweather", serif;
}

.merriweather-light {
  font-family: "Merriweather", serif;
  font-weight: 300;
  font-style: normal;
}
.merriweather-regular {
  font-family: "Merriweather", serif;
  font-weight: 400;
  font-style: normal;
}
.merriweather-bold {
  font-family: "Merriweather", serif;
  font-weight: 700;
  font-style: normal;
}
.merriweather-black {
  font-family: "Merriweather", serif;
  font-weight: 900;
  font-style: normal;
}
.merriweather-light-italic {
  font-family: "Merriweather", serif;
  font-weight: 300;
  font-style: italic;
}
.merriweather-regular-italic {
  font-family: "Merriweather", serif;
  font-weight: 400;
  font-style: italic;
}
.merriweather-bold-italic {
  font-family: "Merriweather", serif;
  font-weight: 700;
  font-style: italic;
}
.merriweather-black-italic {
  font-family: "Merriweather", serif;
  font-weight: 900;
  font-style: italic;
}

a {
  color: var(--main-text-color);
  text-decoration: underline dashed;
  font-weight: bold;
}

h1.observations__title {
color: var(--main-title-color);
display: flex;
justify-content: center;
align-items: center;
padding-top: 20px;
}

.content_wrapper {
  width: fit-content;
  height: fit-content;
  margin: auto;
}

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

.consent {
  font-size: 1.2em;
  line-height: 2em;
  padding: 10%;
  text-align: center;
}

img {
margin: 20px;
}

.observation__fig {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: "Merriweather", serif;
}

.observation__widget {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.observation__fig--image {
  border: 5px dashed var(--main-title-color);
}

figcaption {
  background-color: var(--caption-bg-color);
  padding: 5px;
  border: solid, var(--main-text-color);
}

.observation__fig--name {
  font-size: 1.2em;
  line-height: 2em;
  margin: 20px;
}

.observation__fig--footer {
  margin: 20px;
}

img.observer__profile--avatar {
  display: flex;
  justify-content: center;
  align-items: center;
  border: dashed var(--main-text-color);
}