/*
Theme Name: CCC CRC 2023
Theme URI: https://copyright.com/
Author: Stephen Simon Interactive
Author URI: https://stephensimon.com
Description: CCC CRC 2023 is designed to take advantage of the new design tools introduced in WordPress 6.1.
Requires at least: 6.1
Tested up to: 6.2
Requires PHP: 5.6
Version: 1.0.1
Text Domain: ccc-crc-2023
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, wide-blocks, block-styles, accessibility-read
*/


/* Header Search */
.wp-site-blocks {
  padding-top: 0;
  padding-bottom: 0;
}

@media (max-width: 768px) {
  .wp-block-columns-reverse-mobile {
    flex-direction: column-reverse;
  }
}

#search-container {
  max-width: 806px;
}

@media (max-width: 869px) {
  #search-container {
    max-width: 806px;
    position: absolute;
    padding: 20px;
    top: -24px;
    left: -24px;
    right: -24px;
  }
}

.search-toggled #search-container {
  background: #E5F6FD;
}

@media (min-width: 870px) {
  .search-toggled #search-container {
    background: white;
  }

  #search-container {
    flex: 1;
    max-width: 100%;
    width: 100%;
  }
}

#site-search {
  margin-top: 0;
  max-width: none;
}

@media (min-width: 870px) {
  #site-search {
    margin-left: auto !important;
    margin-right: 0 !important;
  }
}

#searchAskInput {
  flex: 1;
}

#custom-search__input {
  background: #E5F6FD;
  display: flex;
  width: 100%;
}

@media (min-width: 870px) {
  #custom-search__input {
    box-shadow: inset 0 4px 4px rgba(15, 16, 36, 0.15);
    border-radius: 6px;
  }
}

#searchAskInput {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  padding: 0 1.125rem;
}

#searchAskInput:focus {
  outline: none;
}

@media (min-width: 870px) {
  #searchAskInput {
    border: 3px solid transparent;
    border-right: none;
    border-radius: 6px 0 0 6px;
    padding: 1.125rem;
  }

  #searchAskInput:focus {
    border-color: var(--wp--preset--color--sky);
    box-shadow: none;
  }
}

#searchAskButton {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0 6px 6px 0;
  color: #fff;
  border: none;
  padding: 0;
}

@media (min-width: 870px) {
  #searchAskButton {
    padding: 1rem;
  }
}

#searchAskButton svg {
  fill: var(--wp--preset--color--sapphire);
  height: 24px;
  width: 24px;
}

@media (min-width: 870px) {
  #searchAskButton {
    background: var(--wp--preset--color--sapphire);
  }

  #searchAskButton:hover,
  #searchAskButton:focus {
    background: var(--wp--preset--color--midnight);
  }

  #searchAskButton svg {
    fill: #ffffff;
    height: 32px;
    width: 32px;
  }
}

.site-header__search .custom-search {
  border: none;
  border-radius: 0;
  width: calc(100% - 32px);

  display: none;
  visibility: hidden;
}

@media screen and (min-width: 870px) {
  .site-header__search .custom-search {
    background: transparent;
    display: flex;
    visibility: visible;
    width: 100%;
  }
}

.search-toggled .custom-search {
  display: flex;
  visibility: visible;
}

.no-js .site-header__search {
  width: 100%;
}

@media screen and (min-width: 1024px) {
  .site-header__search {
    padding: 0;
    width: 100%;
  }
}

.site-header__search .search-field {
  border-radius: 0;
}

.site-header__search .search-field:focus,
.site-header__search .search-field:focus-within {
   background-color: white;
}

.search-form-container {
  max-width: 806px;
}

@media screen and (min-width: 870px) {
  .search-form-container {
    margin-left: auto;
  }
}

.search-toggled .search-form-container {
  background: #E5F6FD;
  display: flex;
  justify-content: space-between;
  padding: 0;
  z-index: 50;
  width: calc(100% - 24px);
}

@media screen and (min-width: 870px) {
  .search-toggled .search-form-container {
    background: transparent;
    border-radius: 5px;
    position: relative;
    right: 0;
    top: 0;
    width: 100%;
  }
}

@media screen and (min-width: 1024px) {
  .search-toggled .search-form-container {
    position: absolute;
  }
}

/* Search Toggle */
.header-branding-search {
  position: relative;

}
.search-toggle__icon--open {
  display: flex;
  align-items: center;
}
.search-toggle__icon--open .search-submit__icon {
  margin: auto;
}

.search-toggle__icon--open-label {
  font-size: 16px;
  padding-right: 9px;
}

@media screen and (max-width: 870px) {
  .search-toggle__icon--open-label {
    display: none !important;
    visibility: hidden !important;
  }
}

#toggle-search {
  background: transparent;
  border: none;
  -webkit-appearance: none;
  font-size: 16px;
  height: 42px;
  padding: 0;
  position: absolute;
  right: 24px;
  top: 20px;
  width: 42px;
  z-index: 60;
}

.no-js #toggle-search {
  display: none;
}

#toggle-search:hover,
#toggle-search:focus {
  background: transparent;
  color: var(--wp--preset--color--sky);
  outline: none;
}

#toggle-search .search-toggle__icon svg {
  fill: var(--wp--preset--color--midnight);
  height: 24px;
  width: 24px;
}

#toggle-search:hover .search-toggle__icon svg,
#toggle-search:focus .search-toggle__icon svg {
  fill: var(--wp--preset--color--slate);
}

.search-toggled #toggle-search {
  height: 24px;
  width: 24px;
  right: 24px;
  top: 23px;
}

@media screen and (min-width: 870px) {
  #toggle-search {
    display: none;
    visibility: hidden;
    height: 20px;
    top: -33px;
    right: 0;
    width: auto;
  }

  .search-toggled #toggle-search {
    top: -17px;
  }
}

.search-toggle-active .search-toggle__icon--open {
  display: none;
  visibility: hidden;
}

.search-toggle .search-toggle__icon--close {
  display: none;
  visibility: hidden;
}

.search-toggle-active .search-toggle__icon--close {
  display: block;
  visibility: visible;
}

/* Header banner */
.header-banner__content {
  padding-bottom: 1rem;
}

.header-banner__content p {
  max-width: 496px;
}

/* Resource columns */
@media (min-width: 600px) and (max-width: 1200px) {
  .resources-container__content .wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li {
    width: calc(50% - .625em);
  }
}

/* Post navigation */
.wp-block-query-pagination {
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.5rem;
  margin-block-start: 4.25rem;
}

.is-layout-flow .wp-block-query-pagination {
  margin-block-start: 4.25rem;
}

.wp-block-query-pagination-numbers .page-numbers {
  border-radius: 5px;
  color: var(--wp--preset--color--midnight);
  padding: 0.3rem .9rem;
}

.wp-block-query-pagination-numbers .page-numbers:hover,
.wp-block-query-pagination-numbers .page-numbers:focus {
  background: var(--wp--preset--color--sky-25);
}

.wp-block-query-pagination-numbers .page-numbers.current {
  background: var(--wp--preset--color--pumpkin);
  color: #FFFFFF;
}

.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
  color: var(--wp--preset--color--midnight);
}

.wp-block-query-pagination-previous::before,
.wp-block-query-pagination-next::after {
  background-repeat: no-repeat;
  /*background: var(--wp--preset--color--sky);
  -webkit-mask-size: contain;
  mask-size: contain;

  -webkit-mask-position: center;
  mask-position: center;

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;*/
  content: '';
  display: inline-block;
  height: 13px;
  width: 16px;
}

.wp-block-query-pagination-previous::before {
  /*-webkit-mask-image: url('assets/images/left-arrow.svg');
  mask-image: url('assets/images/left-arrow.svg');*/
  background-image: url('assets/images/left-arrow.svg');
  margin-right: 0.625rem;
}

.wp-block-query-pagination-next::after {
  /*-webkit-mask-image: url('assets/images/right-arrow.svg');
  mask-image: url('assets/images/right-arrow.svg');*/
  background-image: url('assets/images/right-arrow.svg');
  margin-left: 0.625rem;
}

/* Resource blocks */
.resource-block {
  background: #ffffff;
  border-radius: 5px;
  border: 2px solid #f7f9fa;
  box-shadow: 0px 8px 16px 0px rgba(71, 92, 109, 0.10), 0px 0px 1px 0px rgba(0, 0, 0, 0.05);
  height: 100%;
  max-width: 288px;
  min-height: 288px;
  padding: 0.625rem;
}

@media (max-width: 781px) {
  .resource-block {
    margin-left: auto;
    margin-right: auto;
  }
}

.resource-block:hover,
.resource-block:focus-within {
  border-color: var(--wp--preset--color--midnight);
  background: var(--wp--preset--color--sky-25) !important;
}

/* Resources Container */
@media (max-width: 781px) {
  .has-global-padding .resources-container .resources-container__content {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Section navigation */
.is-layout-flex .resources-container__sidebar {
  margin-left: calc(var(--wp--style--root--padding-left) * -1);
  margin-right: calc(var(--wp--style--root--padding-left) * -1);
}

@media (min-width: 782px) {
  .is-layout-flex .resources-container__sidebar {
    margin-left: 0;
    margin-right: 0;
  }
}

.section-navigation__label {
  color: var(--wp--preset--color--midnight);
  display: block;
  font-size: 1.1875rem;
  font-family: var(--wp--preset--font-family--soleil);
  font-weight: 500;
  line-height: 2rem;
  letter-spacing: -0.01188rem;
}

  @media screen and (min-width: 870px) {
    .section-navigation__label {
      font-size: 1.375rem;
      font-weight: 300;
    }
  }

.section-nav-toggle {
  background-color: #00A9E7;
  background: rgba(0, 169, 231, 0.25) url("data:image/svg+xml;utf8,<svg width='12' height='7' fill='%232C3E50' xmlns='http://www.w3.org/2000/svg'><path d='M11.7772 0.222628C11.6289 0.0741683 11.4531 0 11.2499 0H0.750056C0.546802 0 0.371088 0.0741683 0.222628 0.222628C0.0741683 0.371252 0 0.546966 0 0.750097C0 0.953188 0.0741683 1.1289 0.222628 1.2774L5.47257 6.52735C5.6212 6.67581 5.79691 6.75014 6 6.75014C6.20309 6.75014 6.37897 6.67581 6.52731 6.52735L11.7772 1.27736C11.9255 1.1289 12 0.953188 12 0.750056C12 0.546966 11.9255 0.371252 11.7772 0.222628Z'/></svg>") no-repeat 93% 50%;
  border-radius: 0;
  border: none;
  font-family: var(--wp--preset--font-family--soleil);
  font-size: 1.1875rem;
  font-weight: 500;
  color: #2C3E50;
  padding: 9px 36px 10px 16px;
  text-align: left;
  width: 100%;
}
 @media screen and (min-width: 870px) {
    #section-nav-button {
      display: none !important;
      visibility: hidden !important;
    }
}
 #section-navigation-container {
  position: relative;
}
 @media screen and (min-width: 870px) {
  #section-navigation-container nav {
      position: sticky;
      top: 48px;
    }
}
#section-nav {
  color: var(--wp--preset--color--midnight);
  list-style: none;
  padding: 0;
  font-size: 1.375rem;
  font-family: var(--wp--preset--font-family--soleil);
  font-weight: 600;
  line-height: 3.5rem;
  letter-spacing: -0.03125rem;
  margin-top: 0;
}
 @media screen and (max-width: 869px) {
    #section-nav {
      background: #FFFFFF;
      border: 1px solid #94A5A6;
      box-shadow: 0 0 1px rgba(48, 49, 51, 0.05), 0 8px 16px rgba(48, 49, 51, 0.1);
      border-radius: 5px;
      line-height: 2.222;
      margin-top: 0;
      padding: 13px 3px;
      position: absolute;
      width: 100%;
    }
}

#section-nav li {
  display: block;
  color: var(--wp--preset--color--midnight);
  font-family: var(--wp--preset--font-family--soleil);
  font-weight: normal;
  letter-spacing: -0.5px;
  padding: 9px 24px;
  position: relative;
}

 @media screen and (min-width: 870px) {
    #section-nav li {
      padding: 0;
    }
}

#section-nav a {
  display: block;
  text-decoration: none;
}

#section-nav a:hover,
#section-nav .current-menu-item a {
  color: var(--wp--preset--color--sapphire);
}

@media screen and (min-width: 870px) {
   #section-nav a,
   #section-nav .menu-item-has-children .section-navigation__subnav-toggle {
    background: url("data:image/svg+xml;utf8,<svg width='7' height='12' fill='inherit' xmlns='http://www.w3.org/2000/svg'><path d='M0.71289 0.866942L0.712891 11.7093C0.712891 12.2223 1.33245 12.4837 1.70032 12.1158L7.12147 6.69469C7.34413 6.47203 7.34413 6.10417 7.12147 5.88142L1.70032 0.460258C1.33245 0.0924911 0.71289 0.353868 0.71289 0.866942Z'/></svg>") no-repeat 98% 50%;
    padding-right: 12px;
  }

  #section-nav .menu-item-has-children {
    background: url("data:image/svg+xml;utf8,<svg width='12' height='7' fill='inherit' xmlns='http://www.w3.org/2000/svg'><path d='M11.7772 0.222628C11.6289 0.0741683 11.4531 0 11.2499 0H0.750056C0.546802 0 0.371088 0.0741683 0.222628 0.222628C0.0741683 0.371252 0 0.546966 0 0.750097C0 0.953188 0.0741683 1.1289 0.222628 1.2774L5.47257 6.52735C5.6212 6.67581 5.79691 6.75014 6 6.75014C6.20309 6.75014 6.37897 6.67581 6.52731 6.52735L11.7772 1.27736C11.9255 1.1289 12 0.953188 12 0.750056C12 0.546966 11.9255 0.371252 11.7772 0.222628Z'/></svg>") no-repeat 98% 1.75rem;
  }

  #section-nav .menu-item-has-children .section-navigation__subnav-toggle.toggled,
  #section-nav .menu-item-has-children:hover .section-navigation__subnav-toggle.toggled {
    background: url("data:image/svg+xml;utf8,<svg width='12' height='7' fill='%23005FB4' xmlns='http://www.w3.org/2000/svg'><path d='M11.7772 0.222628C11.6289 0.0741683 11.4531 0 11.2499 0H0.750056C0.546802 0 0.371088 0.0741683 0.222628 0.222628C0.0741683 0.371252 0 0.546966 0 0.750097C0 0.953188 0.0741683 1.1289 0.222628 1.2774L5.47257 6.52735C5.6212 6.67581 5.79691 6.75014 6 6.75014C6.20309 6.75014 6.37897 6.67581 6.52731 6.52735L11.7772 1.27736C11.9255 1.1289 12 0.953188 12 0.750056C12 0.546966 11.9255 0.371252 11.7772 0.222628Z'/></svg>") no-repeat 98% 1.75rem;
  }

  #section-nav.section-nav--collapsible .menu-item-has-children {
    background: none;
  }

  #section-nav a:hover,
  #section-nav .current-menu-item a,
  #section-nav .menu-item-has-children:hover .section-navigation__subnav-toggle {
    background: url("data:image/svg+xml;utf8,<svg width='7' height='12' fill='%23005FB4' xmlns='http://www.w3.org/2000/svg'><path d='M0.71289 0.866942L0.712891 11.7093C0.712891 12.2223 1.33245 12.4837 1.70032 12.1158L7.12147 6.69469C7.34413 6.47203 7.34413 6.10417 7.12147 5.88142L1.70032 0.460258C1.33245 0.0924911 0.71289 0.353868 0.71289 0.866942Z'/></svg>") no-repeat 98% 50%;
    color: var(--wp--preset--color--sapphire);
  }

  #section-nav .menu-item-has-children .section-navigation__subnav-toggle,
  #section-nav .menu-item-has-children:hover .section-navigation__subnav-toggle {
    background-position: 87% 50%;
  }
}

#section-nav ul {
  list-style: none;
  margin-left: 1.0625rem;
  padding: 0;
}
#section-nav nav:not(.section-nav--expanded) ul {
  display: none;
}
#section-nav .current_page_item ul,
#section-nav .current-menu-item ul {
  display: block;
}
#section-nav li li {
  letter-spacing: -0.2px;
  padding: 0;
}

#section-nav ul a {
  background: none;
  color: var(--wp--preset--color--midnight);
  font-size: 1.25rem;
  font-weight: 300;
}
#section-nav ul a:focus,
#section-nav ul a:hover {
  background: none;
  color: var(--wp--preset--color--sapphire);
  font-weight: 300;
}

#section-nav ul .current-menu-item a {
  background: none;
  color: var(--wp--preset--color--pumpkin);
  font-weight: 600;
}

#section-nav {
  display: none;
  visibility: hidden;
}
.section-nav-toggled #section-nav {
  display: block !important;
  visibility: visible !important;
  z-index: 50;
}
 @media screen and (min-width: 870px) {
    #section-nav {
      display: block !important;
      visibility: visible !important;
    }
}

.section-navigation__subnav-toggle {
  display: none !important;
  visibility: hidden !important;
}

.section-navigation__subnav-toggle {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  position: absolute;
  right: 0;
  top: 0;
}

@media screen and (min-width: 870px) {
  .section-navigation__subnav-toggle {
    display: block !important;
    cursor: pointer;
    height: 50px;
    visibility: visible !important;
    width: 50px;
  }
}

@media screen and (min-width: 870px) {
  .section-nav--collapsible .section-nav__submenu {
    display: none;
  }

  .section-nav--collapsible .section-nav__submenu.toggled {
    display: block;
  }
}

/* Solution Title */
.solution-parent-title {
  margin-top: 0;
  margin-bottom: 1rem;
}

.solution-parent-title,
.solution-child-title {
  color: var(--wp--preset--color--oxford-blue);
  font-family: var(--wp--preset--font-family--soleil);
  font-size: 2rem;
  font-weight: 600;
  line-height: 2.5rem;
  letter-spacing: -0.03125rem;
}

.solution-parent-title__icon > img,
.solution-parent-title svg {
  height: auto;
  margin-right: 9px;
  vertical-align: middle;
  width: 48px;
}

.solution-child-title {
  font-weight: 300;
}

/* Legal */
 @media screen and (min-width: 870px) {
   .site-footer-legal {
    font-size: 0.6875rem;
    max-width: 392px;
  }
}

/* Footer menu */
#menu-footer-policies {
  font-size: 1rem;
  margin-left: 0 !important;
  list-style: none;
  margin-bottom: 30px;
  padding: 0;
}

@media screen and (min-width: 768px) {
  #menu-footer-policies {
    line-height: 1.2;
    max-width: 480px;
  }
}

#menu-footer-policies .menu-link {
  display: block;
}

@media screen and (min-width: 768px) {
  #menu-footer-policies .menu-link {
    display: inline-block;
  }
  #menu-footer-policies .menu-link:not(:last-child):not(:nth-child(4)):after {
    content: " | ";
    color: var(--wp--preset--color--oxford-slate);
    padding-right: 7px;
  }
}
#menu-footer-policies .menu-link a {
  color: var(--wp--preset--color--oxford-slate);
}

/* Learn More */
.learn-more {
  background: url(assets/images/learn-more-bg@2x.png) 50% no-repeat;
  background-size: cover;
}

.learn-more-block {
  border: 2px solid #ffffff;
  border-radius: 6px;
  box-shadow: 0px 4px 8px 0px rgba(15, 16, 36, 0.05);
}

.learn-more-block--single-link {
  position: relative;
}

.logged-in .learn-more-block--single-link:hover,
.logged-in .learn-more-block--single-link:focus-within {
  border-color: var(--wp--preset--color--midnight);
  background: var(--wp--preset--color--sky-25) !important;
}

.logged-in .learn-more-block--single-link:hover .learn-more__title,
.logged-in .learn-more-block--single-link:focus-within .learn-more__title {
  text-decoration: underline;
}

.learn-more__link a {
  display: flex;
  align-items: center;
  text-decoration: none;
}

.learn-more-block--single-link a::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
}

.learn-more__link a:hover {
  text-decoration: underline;
}

.learn-more__link a img {
  margin-left: .625rem;
}

.rounded-image {
  border-radius: 6px;
}

/* Popup */
.white-popup-block {
  background: #FFF;
  padding: 20px 30px;
  text-align: left;
  max-width: 650px;
  margin: 40px auto;
  position: relative
}

.white-popup-block .tml-field-wrap br {
  display: none;
}

.white-popup-block .tml {
  font-size: 1rem;
}

/* TML */
.tml-field {
  background: #E5F6FD;
  border: none;
  width: 100%;
  box-shadow: inset 0 4px 4px rgba(15, 16, 36, 0.15);
  border-radius: 6px;
  padding: 1.125rem;
}

.tml-button {
  -webkit-appearance: none;
  appearance: none;
  background: var(--wp--preset--color--sapphire);
  border: none;
  color: #ffffff;
  padding: 1.125rem;
}

.tml-button:hover,
.tml-button:focus {
  background: var(--wp--preset--color--midnight);
}

.tml-rememberme-wrap {
  display: flex;
}

.tml-links {
  list-style: none;
  padding-left: 0;
}

@media (min-width: 600px) {
  .tml-links li {
    display: inline;
  }
  .tml-links li + li:before {
    content: " | ";
    padding: 0 10px;
  }
}
