:root {

	/* Spacing */

	--container-width: 1140px;
	--container-width-narrow: 880px;
	--vertical-spacing: 120px;
	--gap: 20px;
	--gap-xs: calc(var(--gap) / 4);
	--gap-sm: calc(var(--gap) / 2);
	--gap-md: calc(var(--gap) * 2);
	--gap-lg: calc(var(--gap) * 4);

	/* Colors */

	--base-color: #444;
	--primary-color: #425b76; {# blue #}
	--primary-color-hover: #000;
	--secondary-color: #C1282D; {# red #}
	--secondary-color-hover: #000;
	--tertiary-color: #002857; {# dark blue #}
	--tertiary-color-hover: #000;

	--black: #000;
	--dark-gray: #444;
	--light-gray: #f5f5f5;
	--white: #fff;

}

.mt-xl {
  margin-top: calc(var(--gap)*2)!important;
}

.mb-xl {
  margin-bottom: calc(var(--gap)*2)!important;
}

.mb-md {
  margin-bottom: var(--gap)!important;
}

.resources-3 .hide {
  display: none !important;
}

.resources-3 section {
  padding: 60px 0;
}

/* Filtering */

.resources-3__filtering {
  padding: 20px;
  background-color: var(--light-gray);
}
.resources-3__form {
  display: grid;
  grid-gap: var(--gap);
}
.resources-3__form label {
  display: block;
  font-weight: 400;
  margin-bottom: 5px;
}
.resources-3__form select {
  margin-bottom: 0;
}
@media (min-width: 768px) {
  .resources-3__form {
    grid-template-columns: 1fr 1fr;
  }
  .resources-3__form select {
    margin-bottom: initial;
  }
}

/* Resources */

.resources-3__resources {
  display: grid;
  grid-gap: var(--gap-md);
}
.resources-3__resource {
  padding: 40px;
  background-color: var(--light-gray);
}
.resources-3__resource-image {
  width: 100%;
}
@media (min-width: 576px) {
  .resources-3__resource {
    display: grid;
    grid-template-columns: 35% 1fr;
    grid-gap: var(--gap-md);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
}
@media (min-width: 768px) {
  .resources-3__form {
    grid-template-columns: 1fr 1fr;
  }
  .resources-3__form select {
    margin-bottom: initial;
  }
  .resources-3__resources {
    grid-template-columns: 1fr 1fr;
  }
  .resources-3__resource {
    grid-template-columns: auto;
  }
}
@media (min-width: 992px) {
  .resources-3__resource {
    grid-template-columns: 35% 1fr;
  }
}

/* Load More */

.resources-3__load-more {
  text-align: center;
}
