.resources {
  position: relative;
  z-index: 20;
  height: 100%;
  display: none;
  font-size: 1rem; }
  .header__menu .resources {
    display: -ms-flexbox;
    display: flex; }
  @media (min-width: 55em) {
    .resources {
      display: -ms-flexbox;
      display: flex; } }

.resources__btn {
  color: #FFF;
  font-size: 1rem;
  text-decoration: none;
  text-transform: uppercase;
  background-color: transparent;
  border: 0;
  width: 100%;
  padding: 1rem 0.5rem;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  transition: background-color 0.3s ease-in-out; }
  .resources__btn.js-resource-menu-open {
    background-color: #000;
    transition: background-color 0.3s ease-in-out; }
  .resources__btn .resources__arrow svg {
    transition: transform 0.3s ease-in-out;
    width: 19px;
    margin-left: 10px; }
  .resources__btn .resources__arrow.js-rotate svg {
    transform: rotate(180deg); }
  .kss-item__example .resources__btn {
    background-color: rgba(0, 0, 0, 0.85); }
    .kss-item__example .resources__btn.js-resource-menu-open {
      background-color: #000; }

.resources__links {
  background-color: #000;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%; }

.resources__links-list {
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  width: 100%;
  padding: 0 1rem;
  transition: visibility 0.3s ease-in-out, opacity 0.3s ease-in-out, max-height 0.3s ease-in-out, padding 0.3s ease-in-out; }
  .js-resource-menu-open .resources__links-list {
    max-height: 100%;
    opacity: 1;
    visibility: visible;
    padding: 1rem 1rem 0; }
    @media (min-width: 55em) {
      .js-resource-menu-open .resources__links-list {
        padding: 1rem; } }

.resource__list-item a {
  display: block;
  padding: 0.5rem 0;
  color: #FFF;
  text-decoration: none; }
  .header__mobile .resource__list-item a {
    text-transform: capitalize;
    text-decoration: underline; }

.resources__mobile-header {
  display: none;
  color: #FFF;
  font-size: 1rem;
  text-decoration: none;
  padding: 1rem 1rem 0;
  text-transform: uppercase;
  transition: padding 0.3s ease-in-out; }
  .header__mobile .resources__mobile-header {
    display: block; }

.header__mobile .resources__container {
  border: 2px solid #FFF;
  border-left: 0;
  border-right: 0;
  padding: 0.5rem 0 1.5rem 3.75rem;
  margin: 1.5rem 0;
  width: 100%;
  display: block; }

.resources__container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content; }
  .resources__container div#block-personas {
    -ms-flex-order: 2;
    order: 2; }
  .resources__container .resources__label {
    width: 170px; }
  .resources__container .site-search__container {
    -ms-flex-order: 1;
    order: 1;
    margin-left: auto; }
