/****** Utilities *******/
.fancy-link-white {
  color: #FFF !important;
  border-bottom: 1px solid #FFF;
  text-decoration: none !important;
}
.fancy-link-white:hover {
  border-bottom: 3px solid #FFF !important;
  font-weight: bold;
}

.article a.fancy-link {
  color: #492365 !important;
}

.article a.fancy-link:hover {
  background-color: initial !important;
}

.article a.fancy-link:visited {
  color: #492365;
}

.headCheck {
  width: 87px;
}

.showcase-html-section {
  padding-top: 0;
}

.showcase-html-section .columns {
  padding: 2em;
}
@media only screen and (max-width: 767px) {
  .showcase-html-section .columns {
    padding: 1em;
  }
}

.article {
  padding-top: 130px !important;
}

.article:before {
  position: absolute;
  left: 50%;
  margin-left: -52px;
  top: 1em;
}

.button {
  width: 100%;
  max-width: 100%;
}

.page-title-space {
  text-align: center;
}
.page-title-space__text {
  font-size: 1.1em;
}

.next-step > .row {
  display: flex;
}
@media only screen and (max-width: 768px) {
  .next-step > .row {
    flex-direction: column;
  }
}

.aside .button {
  width: 100%;
}

.aside h3 {
  background-color: #575047;
  color: #fff;
}

.button {
  background-color: #575047;
  border: 1px solid #fff;
}

.article:before {
  content: url(https://www.weber.edu/wsuimages/Admissions/site-files/graphics/whats-next/pencil-in-circle-new.svg);
  width: 87px;
}

.step1 {
  background-color: #ece9ef;
  position: relative;
}

.step1 .aside, .step1 .aside h3 {
  background-color: #492365;
  color: #fff;
}

.step1 .button {
  background-color: #492365;
  border: 1px solid #fff;
  color: #fff !important;
}
.step1 .button:hover {
  background-color: #8446ac;
  text-decoration: underline;
}

.step1 .article:before {
  content: url(https://www.weber.edu/wsuimages/Admissions/site-files/graphics/whats-next/pencil-in-circle-new.svg);
}

.email-icon {
  width: 50px;
}

.step2 {
  background-color: #eeedec;
  position: relative;
}

.step2 .aside, .step2 .aside h3 {
  background-color: #005c49;
  color: #fff;
}

.step2 .button {
  background-color: #e5eeec;
  border: 1px solid #fff;
  color: #575047 !important;
}
.step2 .button:hover {
  background-color: #ccdedb;
  text-decoration: underline;
}

.step2 .article:before {
  content: url(https://www.weber.edu/wsuimages/Admissions/site-files/graphics/whats-next/dollar-in-circle-new-green.svg);
}

.step3 {
  background-color: #eaeff4;
  position: relative;
}

.step3 .aside, .step3 .aside h3 {
  background-color: #346094;
  color: #fff;
}

.step3 .button {
  background-color: #eaeff4;
  border: 1px solid #fff;
  color: #575047 !important;
}
.step3 .button:hover {
  background-color: #d6dfea;
  text-decoration: underline;
}

.step3 .article:before {
  content: url(https://www.weber.edu/wsuimages/Admissions/site-files/graphics/whats-next/compass-in-circle-new-blue.svg);
}

/*.step5 {
  background-color:#d8d2e9;
  position:relative;
}
.step5 .aside, .step5 .aside h3 {
  background-color:#6f57a5;
  color:#fff;
}
.step5 .button {
  background-color:#b7abd2;
  border:1px solid #fff;
  color:#575047!important;
}
.step5 .article:before {
  content: url(https://www.weber.edu/wsuimages/GetIntoWeber/whatsnext/images/step5Icon.png);
}*/
.step6 {
  background-color: #ece9ef;
  position: relative;
}

.step6 .aside, .step6 .aside h3, .step6 .aside h4 {
  background-color: #58277b;
  color: #fff;
}

.step6 .button {
  background-color: #492365;
  border: 1px solid #fff;
  color: #fff !important;
}
.step6 .button:hover {
  background-color: #8446ac;
  text-decoration: underline;
}

.step6 .article:before {
  content: url(https://www.weber.edu/wsuimages/Admissions/site-files/graphics/whats-next/laptop-in-circle-purple.svg);
}

/********************NAV GUIDE****************/
.nav-guide {
  margin-bottom: 30px;
}

.page-menu-item {
  padding: 15px;
}

.page-menu-item-img {
  margin-bottom: 20px;
}

.page-menu-item img {
  max-width: 64px;
}

.page-menu-item p {
  margin-bottom: 0;
}

.nav-blocks {
  display: flex;
  justify-content: center;
}

.nav-blocks div {
  text-align: center;
  border-radius: 10px;
}

#menu-item-step1 {
  background-color: #ece9ef;
  border: 3px solid #492365;
  transition: background-color 0.3s ease;
}

#menu-item-step1:hover {
  background-color: #dbd3e0;
  color: #FFF !important;
  cursor: pointer;
}

#menu-item-step2 {
  background-color: #e5eeec;
  border: 3px solid #005c49;
  transition: background-color 0.3s ease;
}

#menu-item-step2:hover {
  background-color: #ccdedb;
  cursor: pointer;
}

#menu-item-step3 {
  background-color: #eaeff4;
  border: 3px solid #346094;
  transition: background-color 0.3s ease;
}

#menu-item-step3:hover {
  background-color: #d6dfea;
  cursor: pointer;
}

.orientation-portal-image {
  width: 300px;
}

@media screen and (max-width: 640px) {
  .nav-blocks {
    flex-direction: column;
  }
}
@media screen and (max-width: 1025px) {
  .aside {
    width: initial;
    margin: 1em 0;
  }
}
@media screen and (min-width: 641px) {
  .menu-content {
    padding: 4em 8em 2em 8em;
  }
}
@media screen and (min-width: 481px) {
  .article {
    padding-left: 175px !important;
    padding-top: 1em !important;
  }

  .article:before {
    left: 2em;
    margin-left: 0;
  }

  .button {
    width: 320px;
  }
}
