/**
 * Styling for the persistent links at the bottom of each csr page.
 */

/* Section wrapper */
#csr-persistent-links {
  /* One column on mobile */
  display: grid;
  border-top: 1px solid #212121;
  column-gap: 21px;
  row-gap: 21px;
  grid-template: auto / auto;
  margin-top: 40px;
  padding-top: 20px;
}
#csr-persistent-links svg {
  /* Hide icons on mobile only */
  display: none;
}
@media(min-width: 768px) {
  #csr-persistent-links {
    /* Four columns on tablet & desktop. */
    grid-template: auto / 1fr 1fr 1fr;
  }
  #csr-persistent-links svg {
    display: block;
  }
}
@media(min-width: 768px) {
  #csr-persistent-links {
    /* 4-columns on tablet/desktop */
    grid-template: auto / 1fr 1fr 1fr 1fr;
  }
}

/* Light blue background for each link wrapper */
.csr-doc-link {
  background-color: #D0D9E2;
  text-align: center;
}

/* Each link box is an anchor is it's all hoverable */
a.csa-blue-doc-link {
  align-self: start;
  display: block;
  font-family: var(--heading-font-family);
  font-size: 1.8rem;
  font-weight: 700px;
  padding: 10px 15px;
}

/* SVG icon */
.csa-blue-doc-link svg {
  display: block;
  margin-bottom: 10px;
  margin: auto;
  max-height: 65px;
}
svg {
  /* Fixes an svg blowout bug in safari. */
  max-width: 100%;
}

.button-secondary {
  color: #fff;
  background-color: #369;
  border-color: #003b78;
  appearance: none;
  /* -webkit-font-smoothing: antialiased; */
  /* background-color: #ffc20e; */
  /* border-radius: 0; */
  /* border: 1px solid #e4aa00; */
  /* color: #212121; */
  cursor: pointer;
  display: inline-block;
  /* font-family: var(--base-font-family); */
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.2;
  padding: 1.1rem 3rem;
  text-decoration: none;
  /* -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none; */
  /* user-select: none; */
  vertical-align: middle;
  white-space: normal;
  text-align: center;
}
