/*!
 * ===========================
 * Author: Steve Gotthardt
 * Created: 8/2024
 * ===========================
 */

@keyframes grab {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-5deg);
  }
}
@keyframes release {
  0% {
    transform: rotate(-5deg);
  }
  20% {
    transform: rotate(2.5deg);
  }
  40% {
    transform: rotate(-1.25deg);
  }
  60% {
    transform: rotate(0.75deg);
  }
  80% {
    transform: rotate(-0.375deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

/* ================ Page Headers ================ */
.title-block__content {
  background:transparent;
}
.title-block__content::before {
  display:none;
}

/* ================ Job Listing Cards ================ */
ul.item-list--jobsearch {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
  grid-gap: 48px;
}
ul.item-list--jobsearch li.item-list__item {
  min-height: 0 !important;
  height: 100%;
  width: 100%;
  font-size: 1rem;
  line-height: 1.6;
  border-radius: 0 25px;
  overflow: hidden;
  transition: all 0.15s ease-out;
}
ul.item-list--jobsearch li.item-list__item:hover,
ul.item-list--jobsearch li.item-list__item:focus {
  margin: -0.15rem 0.15rem 0.15rem -0.15rem;
}
ul.item-list--jobsearch li.item-list__item .item-list__link {
  height: 100%;
}
ul.item-list--jobsearch li.item-list__item .job-item__content,
ul.item-list--jobsearch li.item-list__item .job-item__content .item-list__title,
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__location,
ul.item-list--jobsearch li.item-list__item .job-item__content .item-list__date,
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__organization {
  font-size: 1rem;
  line-height: 1.6;
}
ul.item-list--jobsearch li.item-list__item .job-item__content,
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__location,
ul.item-list--jobsearch li.item-list__item .job-item__content .item-list__date,
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__organization {
  color: #262626;
}
ul.item-list--jobsearch li.item-list__item .job-item__content {
  padding: 54px 35px 30px;
  display: grid;
  align-items: start;
  grid-template-columns: 1fr auto;
  grid-template-areas: "featured featured" "title logo" "organization logo" "location logo" "date logo" "misc logo";
  grid-column-gap: 12px;
}
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__title {
  font-size: 1.5rem;
  line-height: 1.3;
  font-weight: 600;
  margin-top: 0;
  grid-area: title;
}
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__title::before {
  content: "";
  width: 100%;
  height: 32px;
  top: 0;
  left: 0;
  position: absolute;
  display: inline-block;
  background-color: #f6f6f6;
  z-index: -1;
}
ul.item-list--jobsearch
  li.item-list__item:hover
  .job-item__content
  .item-list__title,
ul.item-list--jobsearch
  li.item-list__item:focus
  .job-item__content
  .item-list__title {
  color: #0072c6;
}
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__title
  + div,
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__organization
  + div {
  grid-area: location;
}
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__organization {
  grid-area: organization;
}
ul.item-list--jobsearch li.item-list__item .job-item__content .item-list__date,
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__date
  + p {
  font-size: 0.9rem;
  color: #757575;
  font-style: italic;
  grid-area: misc;
}
ul.item-list--jobsearch li.item-list__item .job-item__content .item-list__date {
  margin-top: 6px;
  grid-area: date;
}
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__media {
  margin: 0;
  grid-area: logo;
  justify-self: end;
  width: 100%;
  max-width: 100px;
}
ul.item-list--jobsearch
  li.item-list__item
  .job-item__content
  .item-list__featured {
  background-color: #FEEEE1;
  margin: -54px -35px 24px -35px !important;
  padding: 0.25rem 1rem;
  color: #A75706;
  grid-area: featured;
}
ul.item-list--jobsearch li.item-list__item .job-item__content i:not(.fa-star) {
  padding: 0;
  width: 18px;
  text-align: center;
}
ul.item-list--jobsearch li.item-list__item .job-item__content .space-b-100 {
  margin: 0 !important;
}

/* ================ Career Center Resource Cards ================ */
.resource-container,
.resource-thumbnails {
  display: grid;
}
.resource-thumbnails {
  margin: 3rem 0;
  grid-gap: 48px;
  align-items: stretch;
}
@media screen and (min-width: 768px) {
  .resource-thumbnails {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 1200px) {
  .resource-thumbnails {
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 24px;
  }
}
.resource-image-container,
.resource-thumbnail-container {
  position: relative;
  width: 100%;
  padding: 0;
}
.resource-thumbnail-container > div,
.resource-thumbnail-container > div div {
  height: 100%;
}
@media screen and (min-width: 1200px) {
  .resource-thumbnail-container:nth-of-type(1) {
    margin-top: -2rem;
  }
  .resource-thumbnail-container:nth-of-type(2) {
    margin-top: 2.5rem;
  }
  .resource-thumbnail-container:nth-of-type(3) {
    margin-top: -1rem;
  }
  .resource-thumbnail-container:nth-of-type(4) {
    margin-top: 1rem;
  }
  .resource-thumbnail-container > div,
  .resource-thumbnail-container > div div {
    height: auto;
  }
}
.resource-image-container::before,
.resource-thumbnail-container:before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: block;
  background-color: #444;
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 2;
}
.resource-image-container::after,
.resource-thumbnail-container:after {
  content: "";
  width: 25px;
  height: 25px;
  border-radius: 50%;
  display: block;
  background-color: white;
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translate(-50%, 0);
  box-shadow: inset 5px 5px 10px 0 rgba(0, 0, 0, 0.2);
  z-index: 1;
}
.resource-thumbnail-container:after {
  background-color: #2A9DCB;
}
.resource-image-container img,
.resource-thumbnail-container a.resource-thumbnail {
  background-color: white;
  transform-origin: top center;
  animation-name: release;
  animation-duration: 1s;
  box-shadow: 5px 5px 10px 0 rgba(0, 0, 0, 0.2);
  padding: 1rem;
  height: 100%;
  display: block;
}
.resource-image-container img:hover,
.resource-thumbnail-container a.resource-thumbnail:hover {
  animation-name: grab;
  animation-duration: 1s;
  transform: rotate(-5deg);
}
.resource-thumbnail-container a.resource-thumbnail:hover,
.resource-thumbnail-container a.resource-thumbnail:focus {
  text-decoration:none;
}
.resource-thumbnail-container a.resource-thumbnail:hover h3,
.resource-thumbnail-container a.resource-thumbnail:focus h3 {
  color:#0072c6;
  text-decoration:underline;
}
.resource-thumbnail-container a.resource-thumbnail {
  padding: 1rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #444;
}
.resource-thumbnail-container a.resource-thumbnail h3 {
  font-family: "Barlow Semi Condensed", "Roboto", Helvetica, Arial, sans-serif;
  font-size: 1.5rem;
  line-height: 1.3;
  font-weight: 600;
  color: #444;
  margin: 1.25rem 1rem 0;
}
.resource-thumbnail-container a.resource-thumbnail p {
  margin: 0.5rem 1rem;
}
.resource-text-container {
  width: 100%;
}
.resource-text-container h3 {
  display: none;
}
.resource-text-container ul {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0 0;
}
.resource-text-container ul li .pill {
  display: none;
}
.resource-text-container ul li .resource-icon {
  width: 24px;
  color: #2a9dcb;
  text-align: center;
}
.resource-text-container ul li.space-b-050 {
  margin-bottom: 6px !important;
}
@media screen and (min-width: 768px) {
  .resource-container {
    grid-template-columns: 1fr 2fr;
    grid-column-gap: 48px;
  }
  .resource-image-container {
    width: 100%;
    padding: 0;
  }
}

/* ================ Main Landing Page ================ */
.career-resource-center-container,
.about-foundation-container {
  padding: 5rem 2rem;
  position: relative;
}
.career-resource-center-container::before,
.about-foundation-container::before {
  content: "";
  width: 0;
  height: 0;
  border: 1rem solid #777;
  border-top-color: white;
  position: absolute;
  top: 1rem;
  left: 50%;
  transform: translate(-50%, -50%);
}
.career-resource-center-container::before {
  border: 1rem solid #2A9DCB;
  border-top-color: white;
}
.about-foundation-container::before {
  border: 1rem solid white;
  border-top-color: #2A9DCB;
}
@media screen and (min-width: 1200px) {
  .career-resource-center-container::before,
  .about-foundation-container::before {
    border-width: 1.5rem;
    top: 1.5rem;
  }
}
.about-foundation-container h4,
.about-foundation-container p {
  max-width: 90ch;
  margin-left: auto;
  margin-right: auto;
}
.about-foundation-container h4 {
  font-family: "Barlow Semi Condensed", "Roboto", Helvetica, Arial, sans-serif;
  font-size: 2rem;
  line-height: 1.2;
}
.career-resource-center-container,
.career-resource-center-container h2 {
  color: white;
}
.career-resource-center-container h2 {
  font-size: 2.9rem;
}
.career-resource-center-container {
  background-color: #2A9DCB;
}
.career-resource-center-header {
  margin: 0;
}
@media screen and (min-width: 768px) {
  .career-resource-center-header .crc-header {
    text-align: end;
    border-right: 2px solid rgba(255, 255, 255, 0.3);
    padding-right: 2rem;
    padding: 2rem;
    align-self: center;
  }
  .career-resource-center-header .crc-subheader {
    padding-left: 2rem;
    align-self: stretch;
    display: flex;
    align-items: center;
  }
}

/* ================ Job Listings Page ================ */
.filter-container {
  background-color: #d4ebf5;
  padding: 48px 24px 24px;
  margin-top: 3rem;
}
@media screen and (min-width: 768px) {
  .filter-container {
    padding-left: 48px;
    padding-right: 48px;
  }
}
@media screen and (min-width: 960px) {
  .filter-container {
    margin-top: 0;
  }
}
.filter-container .card__title {
  text-align: center;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 1rem;
}
.filter-container .card__title .icon {
  display: block;
  font-size: 2rem;
  line-height: 1;
}
.filter-container select {
  border: 0;
  padding: 0.75rem 1rem;
  margin: 0 auto 1rem;
  border-radius: 5px;
  background-color: white;
  max-width: 400px;
}
@media screen and (min-width: 768px) {
  .filter-container select {
    margin-bottom: 0;
  }
}
.filter-container select:hover,
.filter-container select:focus {
  cursor: pointer;
}
.filter-container .clear-button-container a {
  font-size: 0.9rem;
  font-weight: 600;
}

/* ================ Individual Job Page ================ */
.job-info .grid {
  display: block;
}
.job-info .grid .grid__unit {
  color: #757575;
}
.job-info .grid .grid__unit .large {
  font-size: 100%;
}
.job-sidebar .card {
  text-align: center;
}
.job-sidebar > div:not(:first-of-type) .card {
  border-top: none;
}
.job-sidebar .card .card__body:not(:has(*)) {
  display: none;
}

/* ================ For Employers Page ================ */
.job-rates-table tr th,
.job-rates-table tr td {
  text-align: center;
  vertical-align: middle;
}
.job-rates-table th {
  font-family: "Roboto", Helvetica, Arial, sans-serif;
  font-size: inherit;
  line-height: inherit;
}
.job-rates-table tr td:first-of-type {
  text-align: start;
}