/* breakpoints */
.challenge-container {
  margin-top: 20px;
  margin-bottom: 20px;
}

@media only screen and (min-width: 1024px) {
  .challenge-container {
    margin-top: 45px;
    margin-bottom: 45px;
  }
}

.challenge-container-component {
  margin-top: 18px;
}

.challenge-container-component > .component-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative;
}

@media only screen and (min-width: 1024px) {
  .challenge-container-component > .component-content {
    margin: 0 auto;
    width: -webkit-calc((100% / 12) * 9);
    width: calc((100% / 12) * 9);
  }
}

@media only screen and (max-width: 639px) {
  .challenge-container-component > .component-content {
    max-width: 290px;
    margin: 0 auto !important;
    padding-bottom: 0px;
  }
  .challenge-container-component > .component-content div:nth-child(2),
  .challenge-container-component > .component-content .facet-dropdown.region {
    display: block;
    width: 100%;
    text-align: center;
  }
  .challenge-container-component > .component-content .facet-dropdown.industry .facet-dropdown-select {
    width: 120px;
  }
  .challenge-container-component > .component-content .facet-dropdown.industry + .challenge-text {
    margin-right: 1ch;
  }
  .challenge-container-component > .component-content .facet-dropdown.application {
    margin-left: 0;
  }
  .challenge-container-component > .component-content .facet-dropdown.application .facet-dropdown-select {
    width: 150px;
  }
  .challenge-container-component > .component-content .challenge-text + .component {
    margin: 0 0 0 2ch;
  }
}

@media only screen and (max-width: 767px) {
  .challenge-container-component > .component-content {
    max-width: 90%;
  }
  .challenge-container-component > .component-content .challenge-text + .component {
    margin: 0 2ch 0 2ch;
  }
}

.challenge-container-component .challenge-text {
  display: inline-block;
  width: auto;
  margin: 0;
}

.challenge-container-component .challenge-text > .component-content,
.challenge-container-component .challenge-text > .component-content p {
  color: #0084cb;
  font-size: 2rem;
  line-height: 40px;
}

@media only screen and (min-width: 768px) {
  .challenge-container-component .challenge-text > .component-content,
  .challenge-container-component .challenge-text > .component-content p {
    font-size: 4rem;
  }
}

.challenge-container-component .challenge-text + .component {
  margin: 0 3ch;
}

.challenge-container-component .facet-dropdown {
  display: inline-block;
  padding: 0px 0 0px;
  max-width: initial;
  width: auto;
  border: none;
}

.challenge-container-component .facet-dropdown .facet-heading {
  display: none;
}

@media only screen and (max-width: 639px) {
  .challenge-container-component .component.container {
    width: 100%;
  }
}

.challenge-container-component .component.container > .component-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 639px) {
  .challenge-container-component .component.container > .component-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

@media only screen and (min-width: 640px) {
  .challenge-container-component .component.container > .component-content {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 30px;
  }
}

@media only screen and (max-width: 639px) {
  .challenge-container-component .component.link {
    width: 100%;
    margin: 30px 0 20px;
    text-align: center;
  }
  .challenge-container-component .component.link + .component.link {
    margin-top: 0;
  }
  .challenge-container-component .component.link .btn-primary {
    margin: 0 auto;
  }
}

@media only screen and (min-width: 640px) {
  .challenge-container-component .component.link {
    margin-right: 10px;
  }
  .challenge-container-component .component.link + .component.link {
    margin-right: 0;
    margin-left: 10px;
  }
  .challenge-container-component .component.link .btn {
    min-width: 220px;
  }
  .challenge-container-component .component.link .btn-primary {
    color: white;
    text-decoration: none;
    -webkit-transition: color .2s ease-out .2s;
    transition: color .2s ease-out .2s;
  }
  .challenge-container-component .component.link .btn-primary:before {
    z-index: -1;
  }
  .challenge-container-component .component.link .btn-primary:hover {
    color: #065594;
    -webkit-transition: color .2s ease-in;
    transition: color .2s ease-in;
  }
}