:root {
  --faq-border:1px solid var(--black);
  --faq-transition:all .3s ease;
}

.node--type-faq .faq-intro {
  margin-bottom:30px;
}

/* adds appropriate spacing between <hr> and FAQ on FAQ nodes */
.node--type-faq > div.text-formatted hr {
  margin:30px 0;
}

.faq-container {
  background-color:var(--white);
  outline:var(--faq-border);
}

.node--type-faq .faq-container details {
  margin:0;
  border:none;
  border-bottom:var(--faq-border);
}

.node--type-faq .faq-container:last-of-type details {
  border-bottom:none;
}

.faq-container details summary {
  background-color:var(--white);
  transition:var(--faq-transition);
  gap:15px;
  padding:0;
  position:relative;
  list-style:none;
}

.faq-container details summary:focus-visible {
  outline:none;
}

.faq-container details[open] summary {
  border-bottom:var(--faq-border);
  background-color:var(--cutler);
}

.mod-page-container[style^="background: #00694E; "] .faq-container details[open] summary {
  background-color:var(--under-the-elms);
}

/* removes default user agent marker */
.faq-container details summary::marker {
  content:none;
}

/* removes default user agent marker for Safari on MacOS and iOS  */
.faq-container details summary::-webkit-details-marker {
  display:none;
}

/* start +/- icon and animation */
.faq-container details summary .faq-question,
.faq-container details summary .faq-icon {
  display:block;
}

.faq-container details summary .faq-question {
  font-family:var(--text-sans);
  color:var(--black) !important;
  font-weight:700;
  font-size:20px;
  line-height:130%;
  padding:25px 95px 25px 25px;
  text-decoration:underline;
  text-underline-offset:5px;
  text-decoration-color:transparent;
  transition:var(--faq-transition);
}

.faq-container details summary:hover .faq-question,
.faq-container details summary:focus-visible .faq-question {
  text-decoration-color:currentColor;
  background-color:#EAEAEA;
}

.faq-container details[open] summary:focus-visible .faq-question {
  background-color:var(--cutler);
}

.mod-page-container[style^="background: #00694E; "] .faq-container details[open] summary:focus-visible .faq-question {
  background-color:var(--under-the-elms);
}

.faq-container details[open] summary .faq-question {
  color:var(--white) !important;
}

.faq-container details[open] summary:hover .faq-question {
  background-color:var(--cutler);
}

.mod-page-container[style^="background: #00694E; "] .faq-container details[open] summary:hover .faq-question {
  background-color:var(--under-the-elms);
}

.faq-container details summary .faq-icon-container {
  border-left:var(--faq-border);
  height:100%;
  background-color:var(--white);
  position:absolute;
  right:0;
  top:0;
  width:70px;
  transition:var(--faq-transition);
}

.faq-container details summary:hover .faq-icon-container,
.faq-container details summary:focus-visible .faq-icon-container {
  background-color:#EAEAEA;
}

.faq-container details[open] summary .faq-icon-container {
  background-color:#EAEAEA;
  height:calc(100% + 1px);
}

.faq-container details summary .faq-icon {
  position: absolute;
  cursor: pointer;
  width:100%;
  height:100%;
  margin:0 auto;
  top:50%;
  transform:translateY(-50%);
}

.faq-container details[open] .faq-icon:before {
  -webkit-transform: translatey(-50%) rotate(-90deg);
  transform: translatey(-50%) rotate(-90deg);
  opacity: 0;
}

.faq-container details[open] .faq-icon:after {
  -webkit-transform: translatey(-50%) rotate(0);
  transform: translatey(-50%) rotate(0);
}

.faq-container .faq-icon:before,
.faq-container .faq-icon:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: calc(50% - 10px);
  -webkit-transition:var(--faq-transition);
  transition: var(--faq-transition);
  width: 20px;
  height: 3px;
  background-color:var(--black);
}

.faq-container .faq-icon:before {
  -webkit-transform: translatey(-50%);
  transform: translatey(-50%);
}

.faq-container .faq-icon:after {
  -webkit-transform: translatey(-50%) rotate(90deg);
  transform: translatey(-50%) rotate(90deg);
}
/* end +/- icon and animation */

.faq-container details .faq-answer {
  padding:25px 95px 25px 25px;
  position:relative;
}

.faq-container details .faq-answer:after {
  content:"";
  width:70px;
  height:100%;
  position:absolute;
  right:0;
  top:0;
  background-color:var(--white);
  border-left:var(--faq-border);
  transition:var(--faq-transition);
}

.faq-container details[open] .faq-answer:after {
  background-color:#EAEAEA;
}

.faq-container details .faq-answer > p:first-of-type {
  margin-top:0;
}

.faq-container details .faq-answer *:not(.button, thead th) {
  width:inherit;
  color:var(--black) !important;
}

.faq-container details .faq-answer a:not(.button),
.faq-container details .faq-answer a:not(.button) strong {
  color:var(--cutler) !important;
}

.faq-container details .faq-answer a:not(.button):hover,
.faq-container details .faq-answer a:not(.button):hover strong {
  text-decoration:none;
}

.faq-container details .faq-answer a:not(.button):focus,
.faq-container details .faq-answer a:not(.button):focus strong {
  color:var(--white) !important;
}

#ouws_content #middle .faq-container details .faq-answer a.button.white {
  border:2px solid var(--cutler);
  color:var(--cutler);
}

#ouws_content #middle .faq-container details .faq-answer a.button.white:hover,
#ouws_content #middle .faq-container details .faq-answer a.button.white:focus {
  background:var(--cutler);
  color:var(--white) !important;
}

#ouws_content #middle .faq-container details .faq-answer a.button.white:focus {
  background:var(--under-the-elms);
  color:var(--white) !important;
  border-color:var(--white);
}

#ouws_content #middle .faq-container details .faq-answer a.button.white:focus:after {
  color:var(--white) !important;
}

.faq-container details .faq-answer table thead th {
  background:var(--light-gray);
  color:var(--under-the-elms);
  border:1px solid var(--white);
}