* {
  box-sizing: border-box;
}
.budget-icon {
    width: auto;
    height: 50%;
    text-align: center;
    display: block;
    margin: .5em auto;
}
.wrapper {
  margin: 0 auto 5em !important;
  max-width: 1000px;
}
.header-wrapper {
  margin: 5em auto 0 !important;
  max-width: 1000px;
}
.header {
  padding: 30px 30px 0;
  text-align: center;
}
.header__title {
  margin: 0;
  text-transform: uppercase;
  color: #cf8845;
  font-size: 3em;
  font-weight: 900;
  line-height: 1.1;
}
.header__subtitle {
  margin: 0;
  font-size: 1.75em;
  color: #6d6e70;
  font-family: 'canada-type-gibson',sans-serif;
  font-weight: 900;
  line-height: 1.1;
}

.cards {
  padding: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row wrap;
      flex-flow: row wrap;
}
.pane-bundle-expandingbox {
  margin: 10px;
  width: calc((100% / 3) - 20px);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.panels-ipe-editing .cards div.panels-ipe-portlet-wrapper, .panels-ipe .cards div.panels-ipe-portlet-wrapper{
	  width: calc((100% / 3) - 20px) !important;
		  margin: 10px;
}
.panels-ipe-editing .pane-bundle-expandingbox, .panels-ipe .cards div.panels-ipe-portlet-wrapper .pane-bundle-expandingbox {
	width: 100%;
		  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
	  margin: 0px;
}
.panels-ipe-editing.modal-open .panopoly-magic-preview .pane-bundle-expandingbox {
    max-width: 340px;
}
@media screen and (max-width: 991px) {
  .pane-bundle-expandingbox {
    width: calc((100% / 2) - 20px);
  }
.wrapper {
    margin: 2em auto;
}
}
@media screen and (max-width: 767px) {
  .pane-bundle-expandingbox {
    width: 100%;
	  max-width: 320px;
  }
.card__expander h1 {
    font-size: 2em;
}
}
.card .budget-icon, .card span {
  opacity: 0;
}
.card .card__expander span {
    opacity: 1 !important;
}
.card:hover .card__inner {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
.card:hover .budget-icon, .card:hover span {
  opacity: 1;
}
.card__inner {
  width: 100%;
  height: 240px;
  padding: 30px;
  position: relative;
  cursor: pointer;
  background-size: cover;
  font-weight: 900;
  color: #eceef1 !important;
  font-size: 1.75em !important;
  text-transform: uppercase;
  text-align: center;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.card__inner:after {
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.card__inner .fa {
  width: 100%;
  margin-top: .25em;
}
.card__expander {
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  background-color: #6d6e70;
  width: 100%;
  position: relative;
  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;
  color: #eceef1 !important;
  font-weight: 300 !important;
  font-size: 1.25em !important;
}
.card__expander p {
  color: #eceef1 !important;
  font-weight: 300 !important;
  font-size: 1.25em;
}
.card__expander .fa {
    font-size: 0.75em;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
}
.card.is-collapsed .card__inner:after {
  content: "";
  opacity: 0;
}
.card.is-collapsed .card__expander {
  max-height: 0;
  min-height: 0;
  overflow: hidden;
  margin-top: 0;
  opacity: 0;
}
.card.is-expanded .card__inner:after {
  content: "";
  opacity: 1;
  display: block;
  height: 0;
  width: 0;
  position: absolute;
  bottom: -20px;
  left: calc(50% - 15px);
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #6d6e70;
}
.card.is-expanded .card__inner .budget-icon, .card.is-expanded .card__inner span {
  opacity: 1;
}
.card.is-expanded .card__expander {
  max-height: 1000px;
  min-height: 200px;
  overflow: visible;
  margin-top: 20px;
  opacity: 1;
  padding: 20px;
}
.card.is-expanded:hover .card__inner {
  -webkit-transform: scale(1);
          transform: scale(1);
}
.card.is-inactive .card__inner {
  opacity: 0.5;
}
.card.is-expanded .card__inner {
  opacity: 1;
}
.card.is-inactive:hover .card__inner {
  -webkit-transform: scale(1);
          transform: scale(1);
}

@media screen and (min-width: 992px) {
.cards .pane-bundle-expandingbox:nth-of-type(3n+2) .card__expander, .panels-ipe .cards .panels-ipe-portlet-wrapper:nth-of-type(3n+2) .card__expander {
    margin-left: calc(-100% - 20px);
  }

 .cards .pane-bundle-expandingbox:nth-of-type(3n+3) .card__expander, .panels-ipe .cards .panels-ipe-portlet-wrapper:nth-of-type(3n+3) .card__expander {
    margin-left: calc(-200% - 40px);
  }

.cards .pane-bundle-expandingbox:nth-of-type(3n+4), .panels-ipe .cards .panels-ipe-portlet-wrapper:nth-of-type(3n+4) {
    clear: left;
  }

  .card__expander {
    width: calc(300% + 40px);
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.cards .pane-bundle-expandingbox:nth-of-type(2n+2) .card__expander, .panels-ipe .cards .panels-ipe-portlet-wrapper:nth-of-type(2n+2) .card__expander {
    margin-left: calc(-100% - 20px);
  }

.cards .pane-bundle-expandingbox:nth-of-type(2n+3), .panels-ipe .cards .panels-ipe-portlet-wrapper:nth-of-type(2n+3) {
    clear: left;
  }

  .card__expander {
    width: calc(200% + 20px);
  }
}