/*header*/

.header{
}

.archive__text{
  padding: .75rem 1.5rem;

  text-align: center;

  color: var(--c-white);
  background-color: var(--c-old-red);

  font-size: var(--fs-s);
}

.archive__wrapper{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;

  padding: 1rem 0 1.25rem;
}

.archive__logo{
  width: 100%;
  max-width: 12rem;
  margin: 0 2rem;
  margin-bottom: -.75rem;
}

.archive__button{
  padding: .5rem 1rem;

  text-align: center;

  color: var(--c-white);
  border-radius: .5rem;
  background-color: #8688f9;

  font-size: var(--fs-m);
  line-height: var(--lh-s);
}

.archive__button:hover{
  color: var(--c-white);
}

/* nav */
.nav__list{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;

  padding: .75rem 1rem .5rem 1em;

  background-color: var(--c-old-gray-light);
}

@media(min-width: 54rem){
  .nav__list{
    justify-content: space-between;
  }
}

.nav__item{
  margin: .5rem;

  text-transform: uppercase;

  color: var(--c-text-primary);

  font-size: var(--fs-xxs);
  font-weight: 400;
  line-height: 1;
}

/* name_of_section */
.name_of_section{
  display: flex;
  justify-content: center;

  margin: 0 -1.5rem .5rem;
  padding: .6rem 1.75rem .5rem;

	text-transform: uppercase;

	color: var(--c-old-red);
  background-color: var(--c-old-gray-lighter);

	font-size: var(--fs-xxs);
  line-height: 1;
}

@media (min-width: 57rem) {
  .name_of_section {
    justify-content: flex-start;
  }
}