/** General layout **/

img {
  display: block;
  max-width: 100%;
}
.paragraph-wrapper {
  position: relative;
  display: flex;
}
.paragraph {
  hyphens: auto;
  width: 100%;
  height: 100%;
}
.paragraph .paragraph-content {
  width: 100%; 
}
.paragraph p {
  margin: 0 0 1em 0;
}
.node--type-paragraphs-page h1 {
  padding: 1rem 5vw;
}
.paragraph:not(.no-padding):not(.side-padding-only) {
  padding: 3rem 5vw;
  box-sizing: border-box;
}
.paragraph.side-padding-only {
  padding: 0 5vw;
  box-sizing: border-box;
}

.paragraph.vertical-top .paragraph-content {
  align-self: flex-start;
}
.paragraph.vertical-middle .paragraph-content {
  align-self: center;
}
.paragraph.vertical-bottom .paragraph-content {
  align-self: flex-end;
}
.paragraph.vertical-stretch .paragraph-content {
  align-self: stretch;
}
.paragraph.vertical-top .paragraph {
  justify-content: flex-start;
}
.paragraph.vertical-middle .paragraph {
  justify-content: center;
}
.paragraph.vertical-bottom .paragraph {
  justify-content: flex-end;
}
.paragraph.vertical-stretch .paragraph {
  justify-content: center;
}

.paragraph h2 {
  margin: 0 0 1em 0; 
}

.field--name-field-qdos-paragraphs > .field__item {
  position: relative;
}

.multi-paragraph-edit-link,
.paragraphs-edit-links {
  position: absolute;
  top: 0;
  right: 0;
  display: none;
  padding: 5px;
  background: #ffffffdd;
  font-size: 0.8rem;
}
.multi-paragraph-edit-link {
  right: inherit;
  left: 0;
}
.paragraph .multi-paragraph-edit-link {
  top: 70px;
}

.nested-paragraph-wrapper {
  position: relative;
}

.multi-paragraph-edit-link a,
.paragraphs-edit-links a {
  color: #666!important;
  padding: 3px;
  display: block;
}
.field__item:hover > .multi-paragraph-edit-link,
.nested-paragraph-wrapper:hover > .multi-paragraph-edit-link,
.paragraph-wrapper:hover > .multi-paragraph-edit-link,
.paragraph-wrapper:hover > .paragraphs-edit-links,
.thumbnail:hover > .paragraphs-edit-links {
  display: block;
}
.page-title-centre h1,
.title-centre > h2,
.title-centre > .paragraph-content > h2,
.title-centre > .field--name-field-button,
.title-centre > .paragraph-content > .field--name-field-button {
  text-align: center;
}
.page-title-left h1,
.title-left > h2,
.title-left > .paragraph-content > h2,
.title-left > .field--name-field-button,
.title-left > .paragraph-content > .field--name-field-button {
  text-align: left;
}
.page-title-right h1,
.title-right > h2,
.title-right > .paragraph-content > h2,
.title-right > .field--name-field-button,
.title-right > .paragraph-content > .field--name-field-button {
  text-align: right;
}
.title-inline > h2,
.title-inline > .paragraph-content > h2,
.title-inline > .field--name-field-button,
.title-inline > .paragraph-content > .field--name-field-button {
  margin-top: 0;
}

no-break {
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid-column;
  display: table;
}

.paragraph--type--pull-out-text {
  font-size: 300%;
}
.paragraph--type--pull-out-text h2 {
  margin: 0.5em 0; 
}

.paragraph--type--four-up .paragraph:not(.no-padding) {
  padding: 3rem 2vw;
}
.paragraph--type--four-up .paragraph--type--pull-out-text {
  font-size: 150%; 
}

.thumbnail-title {
  position: absolute;
  bottom: 0;
  padding: 5px 10px;
  background: #333333aa;
  width: 100%;
  box-sizing: border-box;
  color: #fff;
  opacity: 0;
  transition: opacity linear 0.2s;
}
.thumbnail:hover .thumbnail-title {
  opacity: 1; 
}