@each $social-classname,$color-code in $social-colors {

  .branded {

    [class*=fa-#{$social-classname}] {
      background-color: $color-code;
    }
  }
}
@each $social-classname,$color-code in $social-colors {

  .branded-text {

    [class*=fa-#{$social-classname}] {
      color: $color-code;
    }
  }
}

// misc
.overflow-hidden {
  overflow: hidden !important;
}
.overflow-visible {
  overflow: visible !important;
}
.star-rating {
	padding: 0;
	margin: 0;
	list-style: none;

	li {
		display: inline-block;
		font-size: 1em;
		line-height: 1.5em;
		color: #ffcc00;
		letter-spacing: 0.1em;
		margin: 0;
  }
  &.square {

    li {
      display: inline-flex;
      width: 30px;
      height: 30px;
      align-items: center;
      justify-content: center;
      border-radius: 2px;
      font-size: 20px;
      color: #fff;
      background-color: #ff7a4b;
    }
    &.sm {

      li {
        width: 13px;
        height: 13px;
        font-size: 8px;
      }
    }
  }
}
.liquid-overlay-link {
  display: inline-block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  text-indent: -99999px;
}
.add-dropcap {

  &:first-letter {
    float: left;
    margin-right: 0.1em;
    font-size: 4em;
    line-height: 0.75em;
    font-weight: 700;
    color: #000;
  }
}
.fullwidth {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
.fullheight {
  min-height: 100vh;

  .is-ie & {
    height: 100vh; // to fix the alignment
  }
}
[data-hover3d=true] {
  
  [data-stacking-factor] {
    transition: none;
  }
}

.ld-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.perspective {
  perspective: 1800px;
}

.will-change {
  will-change: transform, opacity;
}

.transition-none {
  transition: none !important;
}