/*
Abbreviations:
- fd: From Design. (This is an exact value directly measured in the design file provided by the web designer.)
*/
:root {
  --gap: 16px;
}

.std-book-link {
  display: grid;
  height: 16rem;
  column-gap: var(--gap);
  grid-template-columns: 16rem 1fr;
  grid-template-rows: auto 1fr;
}
.std-book-link > .img {
  grid-row: 1/3;
}

.std-button.-withicon > .text {
  display: block;
}

.std-interactive.-search > .icon {
  display: block;
  height: 1em;
}

.site-section-beginners > .std-layout > .std-layout.-links {
  background: no-repeat url("barney-transparent.svg") right/contain;
}
.site-section-beginners > .std-layout > .std-layout.-links > .item {
  width: 80%;
}

.site-social-networks > .std-layout > .button {
  --gap: inherit;
}

.vertical-section {
  flex-direction: row;
  justify-content: center;
}