/*Contains any common function to modify the tables, which can then be imported and applied per sub style.
    eg, for the email table may want to show lines, so can import the below to apply show-lines() just for item-container.email*/
a.button.glow:not(.glow-disabled) {
  transition: all 0.3s;
  -moz-box-shadow: rgba(51, 176, 220, 0.5) 0 0 5px;
  -webkit-box-shadow: rgba(51, 176, 220, 0.5) 0 0 5px;
  box-shadow: rgba(51, 176, 220, 0.5) 0 0 5px;
  animation: glowPulse 2s infinite;
}
.attention-arrow {
  font-size: 1.5em;
  width: 40px;
  height: 45px;
  position: absolute;
  background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 81%, rgba(255, 255, 255, 0) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 81%, rgba(255, 255, 255, 0) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #ffffff 0%, #ffffff 81%, rgba(255, 255, 255, 0) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  padding: 10px;
  -moz-animation: bounce 2s infinite;
  -webkit-animation: bounce 2s infinite;
  animation: bounce 2s infinite;
}
.attention-arrow::before {
  font-family: 'Linearicons';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e93c";
  color: #006330;
  font-weight: 900;
  margin-bottom: 5px;
}
@-moz-keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    -moz-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -moz-transform: translateX(-30px);
    transform: translateX(-30px);
  }
  60% {
    -moz-transform: translateX(-15px);
    transform: translateX(-15px);
  }
}
@-webkit-keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }
  60% {
    -webkit-transform: translateX(-15px);
    transform: translateX(-15px);
  }
}
@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -moz-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  60% {
    -moz-transform: translateX(-5px);
    -ms-transform: translateX(-5px);
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
}
@-webkit-keyframes glowPulse {
  0% {
    -webkit-box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0.5);
  }
  50% {
    -webkit-box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0.5);
  }
}
@keyframes glowPulse {
  0% {
    -moz-box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0.5);
    box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0.5);
  }
  50% {
    -moz-box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0);
    box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0);
  }
  100% {
    -moz-box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0.5);
    box-shadow: 0 0 5px 5px rgba(51, 176, 220, 0.5);
  }
}
.main-content.complete {
  text-align: center;
}
.main-content.complete .lnr.page-icon {
  font-size: 12em;
  font-weight: 300;
  padding: 30px;
  display: block;
  color: #9ea5ab;
}
.main-content.complete h3 {
  max-width: 820px;
  margin: 15px auto;
}