/* ABC-specific presentation, preserving the original colors and backgrounds. */
body {
  color: #000;
}
h1, h2, h3, a, a:link, .block-title, #name-and-slogan a {
  color: #000;
}
h2, h3.block-title, .block-title {
  font-weight: normal;
}
.region-toplinks {
  float: right;
  text-align: right;
  padding: 0 20px;
  margin: 0 0 9px;
}
[dir="rtl"] .region-toplinks {
  float: left;
  text-align: left;
}
.region-toplinks ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.region-toplinks li {
  display: inline-block;
  vertical-align: top;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}
.region-toplinks li a {
  position: relative;
  isolation: isolate;
  display: inline-block;
  padding: 4px 10px 8px;
  line-height: 1.3;
  vertical-align: top;
  margin: 0;
  font-size: 125%;
  border-bottom: none;
  color: #000;
}
.region-toplinks li a::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background-color: transparent;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 5px), 50% 100%, 0 calc(100% - 5px));
}
.region-toplinks li a:hover,
.region-toplinks li a:focus-visible,
.region-toplinks li a.is-active {
  color: var(--abc-top-menu-text, #fff);
  text-decoration: none;
}
.region-toplinks li a:hover::before,
.region-toplinks li a:focus-visible::before,
.region-toplinks li a.is-active::before {
  background-color: var(--abc-top-menu-background, transparent);
}
.region-toplinks li a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
.region-topreg {
  padding: 10px 20px;
}
.region-highlighted {
  border: 1px solid #ddd;
  background-color: rgba(238, 238, 238, .5);
}
.themed-block {
  border: 0;
  padding: 0;
}
.themed-block .block-content {
  border: 1px solid #ddd;
  padding: 10px;
  background-color: rgba(238, 238, 238, .5);
}
.rnd .block-content {
  border-radius: 5px;
}
.sitebrand {
  height: 32px;
}
.by, .by a, .by a:hover {
  color: #555;
}
.block ul {
  margin-top: 0;
  margin-bottom: 0;
}
.block ul.pure-paginator {
  padding: 1em 0;
}
ul.pure-paginator .is-active > .pure-button {
  box-shadow: inset 0 0 0 1px #000, inset 0 0 6px rgba(0, 0, 0, .2);
}
#submenu li a {
  color: #000;
  border: 1px solid #555;
  background: transparent;
}
#submenu li a:hover {
  background: #fff;
}

/*** COLORS ***/

/* Shipped gradients sampled from the original artwork. */
.bi1 {
  --abc-top-gradient: linear-gradient(to bottom,
      #f4cde6 0px,
      #f4cde6 44px,
      #f6d7eb 142px,
      #fceef5 290px,
      #fefdfe 434px);
  --abc-bottom-gradient: linear-gradient(to bottom,
      #fefdfe 0px,
      #fdf7fb 27px,
      #f7dbed 101px,
      #f5d3e9 130px,
      #f5d2e8 189px);
  --abc-background-edge: #f5d2e8;
}
.bi2 {
  --abc-top-gradient: linear-gradient(to bottom,
      #c6f6c1 0px,
      #c6f6c1 56px,
      #d4ffc7 186px,
      #d9ffcd 205px,
      #e0ffd3 245px,
      #f1ffe8 321px,
      #f8fff1 372px,
      #fbfff8 391px,
      #fffffd 434px);
  --abc-bottom-gradient: linear-gradient(to bottom,
      #fefffc 0px,
      #fdfffa 11px,
      #f8fff2 26px,
      #e0ffd3 74px,
      #d2fec6 101px,
      #c9f8c3 138px,
      #c9f8c3 189px);
  --abc-background-edge: #c9f8c3;
}
.bi3 {
  --abc-top-gradient: linear-gradient(to bottom,
      #f3f99d 0px,
      #f3f99d 36px,
      #f5faaa 117px,
      #fcfde1 314px,
      #fcfde1 326px,
      #fcfeeb 346px,
      #fdfeeb 365px,
      #fefef4 384px,
      #fefef4 407px,
      #fefffe 434px);
  --abc-bottom-gradient: linear-gradient(to bottom,
      #fefffa 0px,
      #fdfeee 27px,
      #f8fbc3 83px,
      #f5faae 118px,
      #f3f9a4 146px,
      #f3f9a4 189px);
  --abc-background-edge: #f3f9a4;
}
.bi4 {
  --abc-top-gradient: linear-gradient(to bottom,
      #d0e8f4 0px,
      #d0e8f4 56px,
      #d4eaf5 99px,
      #f6fbfd 344px,
      #fdfeff 434px);
  --abc-bottom-gradient: linear-gradient(to bottom,
      #fdfeff 0px,
      #f7fbfd 29px,
      #d5ebf6 125px,
      #d3eaf5 189px);
  --abc-background-edge: #d3eaf5;
}
.bi5 {
  --abc-top-gradient: linear-gradient(to bottom,
      #d0d0d0 0px,
      #d0d0d0 55px,
      #d6d6d6 112px,
      #f6f6f6 346px,
      #fefefe 434px);
  --abc-bottom-gradient: linear-gradient(to bottom,
      #fdfdfd 0px,
      #f5f5f5 36px,
      #d5d5d5 126px,
      #d3d3d3 189px);
  --abc-background-edge: #d3d3d3;
}
body:is(.bi1, .bi2, .bi3, .bi4, .bi5) {
  background-color: var(--abc-background-edge);
}
:is(.bi1, .bi2, .bi3, .bi4, .bi5) #bg1 {
  background: var(--abc-top-gradient) 0 0 / 100% 435px no-repeat;
}
:is(.bi1, .bi2, .bi3, .bi4, .bi5) #pgwpp {
  background: #fff var(--abc-bottom-gradient) 0 100% / 100% 190px no-repeat;
}
.bimg #bg2 {
  background-position: 50% 0;
  background-repeat: no-repeat;
}
.bgf #bg1,
.bgf #bg2 {
  background-attachment: fixed;
}

.bimg.bi1 #bg2 {
  background-image: url(../images/elements/top-pink.png);
}
.bimg.bi2 #bg2 {
  background-image: url(../images/elements/top-green.png);
}
.bimg.bi3 #bg2 {
  background-image: url(../images/elements/top-yellow.png);
}
.bimg.bi4 #bg2 {
  background-image: url(../images/elements/top-blue.png);
}
.bimg.bi5 #bg2 {
  background-image: url(../images/elements/top-bw.png);
}

/* Site name color */
.sn1 #name-and-slogan a {
  color: #c09; /* pink */
}
.sn2 #name-and-slogan a {
  color: #390; /* green */
}
.sn3 #name-and-slogan a {
  color: #f60; /* orange */
}
.sn4 #name-and-slogan a {
  color: #069; /* blue */
}
.sn5 #name-and-slogan a {
  color: #444; /* grey */
}

/* Node title color */
.nt1 .page-title,
.nt1 .node > header h2 a {
  color: #c09; /* pink */
}
.nt2 .page-title,
.nt2 .node > header h2 a {
  color: #390; /* green */
}
.nt3 .page-title,
.nt3 .node > header h2 a {
  color: #f60; /* orange */
}
.nt4 .page-title,
.nt4 .node > header h2 a {
  color: #069; /* blue */
}
.nt5 .page-title,
.nt5 .node > header h2 a {
  color: #444; /* grey */
}

/* Menu item color */
.mb1 .pure-menu-link {
  background: #c09;
  color: #fff;
} /* pink */
.mb2 .pure-menu-link {
  background: #390;
  color: #fff;
} /* green */
.mb3 .pure-menu-link {
  background: #f60;
  color: #fff;
} /* orange */
.mb4 .pure-menu-link {
  background: #069;
  color: #fff;
} /* blue */
.mb5 .pure-menu-link {
  background: #025099;
  color: #fff;
} /* dark blue */
.mb6 .pure-menu-link {
  background: #767e82;
  color: #fff;
} /* light grey */
.mb7 .pure-menu-link {
  background: #666;
  color: #fff;
} /* grey */
.mb8 .pure-menu-link {
  background: #444;
  color: #fff;
} /* dark grey */
.mb9 .pure-menu-link {
  background: #333;
  color: #fff;
} /* black */

/* Menu item rollover color */
.mr1 #menu .pure-menu-link:hover,
.mr1 #menu .pure-menu-link:focus {
  background: #c09 !important;
} /* pink */
.mr2 #menu .pure-menu-link:hover,
.mr2 #menu .pure-menu-link:focus {
  background: #390 !important;
} /* green */
.mr3 #menu .pure-menu-link:hover,
.mr3 #menu .pure-menu-link:focus {
  background: #f60 !important;
} /* orange */
.mr4 #menu .pure-menu-link:hover,
.mr4 #menu .pure-menu-link:focus {
  background: #069 !important;
} /* blue */
.mr5 #menu .pure-menu-link:hover,
.mr5 #menu .pure-menu-link:focus {
  background: #025099 !important;
} /* dark blue */
.mr6 #menu .pure-menu-link:hover,
.mr6 #menu .pure-menu-link:focus {
  background: #767e82 !important;
} /* light grey */
.mr7 #menu .pure-menu-link:hover,
.mr7 #menu .pure-menu-link:focus {
  background: #666 !important;
} /* grey */
.mr8 #menu .pure-menu-link:hover,
.mr8 #menu .pure-menu-link:focus {
  background: #444 !important;
} /* dark grey */
.mr9 #menu .pure-menu-link:hover,
.mr9 #menu .pure-menu-link:focus {
  background: #333 !important;
} /* black */

/* First menu item color */
.fb1 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #c09;
} /* pink */
.fb2 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #390;
} /* green */
.fb3 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #f60;
} /* orange */
.fb4 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #069;
} /* blue */
.fb5 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #025099;
} /* dark blue */
.fb6 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #767e82;
} /* light grey */
.fb7 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #666;
} /* grey */
.fb8 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #444;
} /* dark grey */
.fb9 .primary-nav__menu--level-1 > li:first-child > .primary-nav__menu-link--level-1 {
  background: #333;
} /* black */

/* Last menu item color */
.lb1 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #c09;
} /* pink */
.lb2 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #390;
} /* green */
.lb3 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #f60;
} /* orange */
.lb4 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #069;
} /* blue */
.lb5 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #025099;
} /* dark blue */
.lb6 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #767e82;
} /* light grey */
.lb7 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #666;
} /* grey */
.lb8 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #444;
} /* dark grey */
.lb9 .primary-nav__menu--level-1 > li:last-child > .primary-nav__menu-link--level-1 {
  background: #333;
} /* black */

/* Top links use their selected color normally and grey on hover or active. */
.tr1 {
  --abc-top-menu-background: #c09;
  --abc-top-menu-text: #fff;
}
.tr2 {
  --abc-top-menu-background: #390;
  --abc-top-menu-text: #fff;
}
.tr3 {
  --abc-top-menu-background: #f60;
  --abc-top-menu-text: #fff;
}
.tr4 {
  --abc-top-menu-background: #069;
  --abc-top-menu-text: #fff;
}
.tr5 {
  --abc-top-menu-background: #444;
  --abc-top-menu-text: #fff;
}

/* Titles and block title lines share the same inherited color. */
.block-title {
  color: var(--abc-block-title, #000);
}
/* Block title colors */
.bt1 {
  --abc-block-title: #c09;
} /* pink */
.bt2 {
  --abc-block-title: #390;
} /* green */
.bt3 {
  --abc-block-title: #f60;
} /* orange */
.bt4 {
  --abc-block-title: #069;
} /* blue */
.bt5 {
  --abc-block-title: #444;
} /* grey */

.bt6 .region-user1,
.bt6 .region-user8,
.bt6 #sidebar-left .block-wrapper:nth-child(4),
.bt6 #sidebar-left .block-wrapper:nth-child(8),
.bt6 #sidebar-right .block-wrapper:nth-child(1),
.bt6 #sidebar-right .block-wrapper:nth-child(5) {
  --abc-block-title: #069; /* blue */
}
.bt6 .region-user2,
.bt6 .region-user6,
.bt6 #sidebar-left .block-wrapper:nth-child(2),
.bt6 #sidebar-left .block-wrapper:nth-child(6),
.bt6 #sidebar-right .block-wrapper:nth-child(2),
.bt6 #sidebar-right .block-wrapper:nth-child(6) {
  --abc-block-title: #390; /* green */
}
.bt6 .region-user3,
.bt6 .region-user5,
.bt6 #sidebar-left .block-wrapper:nth-child(1),
.bt6 #sidebar-left .block-wrapper:nth-child(5),
.bt6 #sidebar-right .block-wrapper:nth-child(3),
.bt6 #sidebar-right .block-wrapper:nth-child(7) {
  --abc-block-title: #c09; /* pink */
}
.bt6 .region-user4,
.bt6 .region-user7,
.bt6 #sidebar-left .block-wrapper:nth-child(3),
.bt6 #sidebar-left .block-wrapper:nth-child(7),
.bt6 #sidebar-right .block-wrapper:nth-child(4),
.bt6 #sidebar-right .block-wrapper:nth-child(8) {
  --abc-block-title: #f60; /* orange */
}

/*** MEDIA SCREENS (35.5, 48 & 64em) ***/

@media (max-width: 64em) {
  @media screen {
    #toplinks {
      display: none;
    }
  }

  /* Retain the shared responsive layout and original ABC mobile menu colors. */
  .pure-menu-link {
    background: none !important;
    color: #000 !important;
  }
  .pure-menu-link:hover, .pure-menu-link:focus {
    background: #e6e6e6 !important;
  }
  .pure-menu-children .pure-menu-link {
    margin: 0;
    box-shadow: none;
  }
  .abc-submenu-toggle {
    color: #000;
  }
}

@media (width > 64em) {
  #name-and-slogan, .logoimg {
    padding: 20px;
  }
  .pure-menu-link {
    margin: 2px 0 4px;
    background: #fff;
  }
  .pure-menu-children .pure-menu-link {
    margin: 0 4px 4px 0;
    box-shadow: 4px 4px 4px #888;
  }
  [dir="rtl"] .pure-menu-children .pure-menu-link {
    margin: 0 0 4px 4px;
  }
}