/*
 Theme Name:   Twenty Twenty One Child Theme
 description:  A child theme of the Twenty Twenty Two default WordPress theme
 Author:       Do It For Me Websites Ltd.
 Template:     twentytwentyone
 Version:      1.0.1
*/

/* Default logo size from 2021 parent theme */
:root {
  /* Font Family */
  --global--font-primary: var(
    --font-headings,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    "Helvetica Neue",
    sans-serif
  );
  --global--font-secondary: var(
    --font-base,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    "Helvetica Neue",
    sans-serif
  );

  --global--spacing-vertical: 14px;
  --global--color-bg: #5b5b5b;
  --branding--color-link: white;
  --branding--title--font-family: "Times New Roman";
  --branding--description--font-family: "Times New Roman";
  --branding--description--font-size: var(--global--font-size-lg);
  --branding--title--font-size: var(--global--font-size-xl);
}
body {
  background-color: var(--global--color-bg);
}
.primary-navigation-open .menu-button-container,
.primary-navigation > .primary-menu-container {
  background-color: var(--global--color-bg);
}
/* .site-name {
  font-family: var(--branding--title--font-family);
  font-size: var(--global--font-size-lg);
  color: white;
} */
.site-title,
.site-description {
  color: var(--branding--color-link);
  text-align: center;
}
.site-description {
  margin: 20px 0;
}
.site-description a {
  color: var(--branding--color-link);
}
.site-header:not(.has-logo).has-title-and-tagline .site-branding {
  max-width: calc(100% - 10px);
  padding: 20px 0;
}
div.gutter {
  /* filter: blur(4px); */
  border: 1px solid #888;
  height: 40px;
  width: 100%;
  padding-top: 6px;
  margin-bottom: -12px;
  background-color: white;
  /* background-image: linear-gradient(
      to right,
      rgba(30, 30, 30, 0.5),
      rgba(30, 30, 30, 0.5)
    ),
    linear-gradient(to right, rgba(20, 20, 20, 0.2), rgba(20, 20, 20, 0.2));
  background-repeat: no-repeat;
  background-size: 100% 2px, 100% 6px;
  background-position: 0 8px, 0 26px;
  backdrop-filter: blur(8px); // This be the blur */
  /* background-image: linear-gradient(to right, #444, #444); */
}
.gutter-upr-seam {
  height: 1px;
  width: 100%;
  margin-top: 2px;
  background-image: linear-gradient(
    to right,
    rgba(30, 30, 30, 0.5),
    rgba(30, 30, 30, 0.5)
  );
  filter: blur(1px);
}
.gutter-lwr-seam {
  height: 8px;
  width: 100%;
  margin-top: 16px;
  background-image: linear-gradient(
    to right,
    rgba(30, 30, 30, 0.4),
    rgba(30, 30, 30, 0.4)
  );
  filter: blur(4px);
}
/* .site-title {
  color: var(--branding--color-link);
  font-family: var(--branding--title--font-family);
  font-size: var(--branding--title--font-size-mobile);
  letter-spacing: normal;
  text-transform: var(--branding--title--text-transform);
  line-height: var(--global--line-height-heading);
  margin-bottom: calc(var(--global--spacing-vertical) / 6);
} */
/* .site-description {
  color: currentColor;
  font-family: var(--branding--description--font-family);
  font-size: var(--branding--description--font-size);
  line-height: 1.4;
} */
.site-logo .custom-logo {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--branding--logo--max-width-mobile);
  max-height: var(--branding--logo--max-height-mobile);
}
.primary-navigation-open .menu-button-container,
.primary-navigation > .primary-menu-container {
  background-color: transparent;
}
ul > .menu-item > a {
  background-color: white;
  margin: 2px 0;
  padding: 4px;
  border: #aaa 2px solid;
}

.site-header {
  padding: 0;
  row-gap: 0;
}
.site-header,
.site-main,
.widget-area,
.site-footer {
  min-height: 60px;
}
.site-main {
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
}
div#primary,
div.entry-content {
  background-color: #efefef;
}
address {
  color: white;
}
address p {
  margin: 6px 0;
}
li.wp-block-post {
  background-color: #fff;
  padding: 20px;
  margin: 20px;
  max-width: 320px;
  -webkit-box-shadow: 5px 5px 8px 1px rgba(0, 0, 0, 0.18);
  box-shadow: 5px 5px 8px 1px rgba(0, 0, 0, 0.18);
}
.wp-block-table tbody {
  background-color: #fff;
}
.item.contact {
  padding: 20px;
}
.no-widgets .site-footer {
  margin-top: 0;
}
.site-footer > .site-info {
  border-top: none;
}
.powered-by a {
  text-decoration: none;
}
.powered-by a:hover {
  text-decoration: underline dotted #ccc;
}
.site-footer > .site-info .site-name {
  text-transform: none;
  font-size: var(--global--font-size-xl);
  color: white;
  font-family: var(--branding--title--font-family);
  margin: 24px 0 40px;
  line-height: 1.25;
}
.site-footer > .site-info a:link,
.site-footer > .site-info a:visited,
.site-footer > .site-info a:active {
  color: #ccc;
}
@media only screen and (min-width: 482px) {
  .site-logo .custom-logo {
    max-width: 400px;
    max-height: 200px;
  }
}
@media only screen and (min-width: 822px) {
  .site-footer > .site-info .privacy-policy,
  .site-footer > .site-info .powered-by {
    margin-top: -6px;
  }
}