.vueExpand > .expandHead {
  min-height: 2.1rem;
  background-color: #CCCCCC;
  display: flex;
  justify-content: space-between;
  align-content: center;
  align-items: center;
  padding: .5rem; }
  .vueExpand > .expandHead .expandButtons {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    align-content: center; }
    .vueExpand > .expandHead .expandButtons > * {
      margin: .2rem; }
    .vueExpand > .expandHead .expandButtons .expandCollapse {
      border: 1px solid #FFFFFF; }
      .vueExpand > .expandHead .expandButtons .expandCollapse > * {
        border: none;
        margin: -1px;
        padding: 0rem; }
      .vueExpand > .expandHead .expandButtons .expandCollapse > .vueExpand {
        animation: vueExpand 200ms forwards; }
      .vueExpand > .expandHead .expandButtons .expandCollapse > .vueCollapse {
        animation: vueCollapse 200ms reverse; }

.vueExpand > .expander-enter-active {
  animation: icon-fade-in 100ms ease-in; }

.vueExpand > .expander-leave-active {
  animation: icon-fade-in 100ms ease-in reverse; }

.vueExpand > .expandContent {
  width: 100%;
  min-height: 2.1rem; }

.vueExpand .expandTitle {
  color: #FFFFFF; }

.vueExpand .expand-head {
  background-color: #6bb5dd !important;
  color: #FFFFFF;
  background-position: 1rem center;
  padding-left: 3rem; }
  .vueExpand .expand-head.swatchA2BG {
    background-color: #1d82b9 !important; }
  .vueExpand .expand-head.swatchA5BG {
    background-color: #9bc9e1 !important; }
  .vueExpand .expand-head.icn {
    background-size: 1.2rem; }
    .vueExpand .expand-head.icn.water-meter {
      background-size: 1.7rem; }

.vueExpand.expand {
  margin-top: 1rem; }
  .vueExpand.expand .expand-head {
    background-color: #6bb5dd !important;
    color: #FFFFFF;
    background-position: 1rem center;
    padding-left: 3.5rem; }
    .vueExpand.expand .expand-head.swatchA2BG {
      background-color: #1d82b9 !important; }
    .vueExpand.expand .expand-head.swatchA5BG {
      background-color: #9bc9e1 !important; }
  .vueExpand.expand .expand-content {
    padding: 1rem; }

@keyframes vueExpand {
  100% {
    transform: rotate(-180deg); } }

@keyframes vueCollapse {
  100% {
    transform: rotate(-180deg); } }

@keyframes expander-fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }