.container__info {
  cursor: default;
}

// each section of result
.container__top__hours-wasted > div {
  display: inline-block;
  position: relative;
  padding: 0 1%;
  cursor: default;
}

// separator :
.container__top__hours-wasted > div:before {
  content: ':';
  position: absolute;
  top: 8%;
  left: -10px;
  font-size: 4em;
  font-weight: 200;
}

// no separator for the first section
.container__top__hours-wasted div:first-child:before {
  content: '';
}

// thinner numbers
.numbers {
  font-family: 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 5em;
  font-weight: 100;
  display: block;
  margin-bottom: -$space / 1.5;
}

// less opacity for the description of the section (days, hours, minutes)
.description {
  opacity: .2;
  text-transform: uppercase;
}

// fixing animation wiggle browser issue
input, .container__top__hours-wasted {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
}

// TWITTER SHARING ICON

// sharing link
.sharing-link {
  text-decoration: none !important;
  display: block;
  width: 20%;
  min-width: 320px;
  margin: 0 auto;
  text-transform: uppercase;
  perspective: 150;
  @include transitions;
  @include hardware-acceleration;
}

// positions text
.sharing-link__text {
  margin: 0 -22px;
  display: inline-block;
  @include transitions;
}

// positions and styles icon
.sharing-link__icon {
  border: solid 7px $link;
  height: $space * 1.5;
  line-height: $space * 1.8;
  border-radius: $space * 2;
  display: inline-block;
  font-size: 1.8em;
  vertical-align: -15%;
  transform: scale(0);
  @include transitions;
}

// pixel-perfect arrangement of twitter icon
.sharing-link .icon-twitter:before {
  margin-left: 2px;
  padding-top: 1px;
  display: inline-block;
}

// on hover adds spacing between text for the icon (animates)
.sharing-link:hover > .sharing-link__icon {
  transform: scale(1);
  width: $space * 1.5;
  margin: 0 $space;
}

// on active simulates a button
.sharing-link:active > .sharing-link__icon {
  transform: scale(0.8);
  margin: 0 $space / 2;
}

// rotates left text inwards
.sharing-link:active > .sharing-link__text:first-of-type {
  transform: rotateY(65deg);
}

// rotates right text inwards
.sharing-link:active > .sharing-link__text:last-of-type {
  transform: rotateY(-65deg);
}
