/*-------------------------------------------------------*/
/* Helper classes
/*-------------------------------------------------------*/
.clear { clear: both; }
.oh { overflow: hidden; }
.ov { overflow: visible; }
.relative { position: relative; }
.mobile section { background-attachment: scroll !important; }
.bg-dark { background-color: $bg-dark; }
.bg-light { background-color: $bg-light; }
.bg-white { background-color: #fff; }
.bg-color { background-color: $secondary-color; }
.white { color: #fff; }
.static { position: static; }
.block { display: block; }
.left { float: left; }
.right { float: right; }
.valign { position: absolute; top: 50%; @include transform (translateY(-50%)); }
.img-full-width { width: 100%; }
.uppercase { text-transform: uppercase; letter-spacing: 0.02em; }
.last { margin-bottom: 0 !important; }


/* Section Dark / Background Image
-------------------------------------------------------*/
.bg-color,
.bg-color-overlay,
.bg-dark-overlay,
.bg-gradient {
  .section-title,
  .statistic__number,
  .statistic__title {
    color: #fff;
  }  
}


/* Box Shadow
-------------------------------------------------------*/
.box-shadow {
  box-shadow: 0 1px 6px rgba(61, 65, 84, 0.15);
}

.box-shadow-large {
  box-shadow: 0 20px 40px rgba(61, 65, 84, 0.15);
}


/*-------------------------------------------------------*/
/* Hovers
/*-------------------------------------------------------*/
.hover-overlay {
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  background-color: rgba(0,0,0,.5);
  @include transition ( .3s cubic-bezier(0.43, 0.07, 0.61, 0.95));
}

.hover-trigger:hover .hover-overlay {
  opacity: 1;
  visibility: visible;
}


/* Hover Scale
-------------------------------------------------------*/
.hover-scale {
  overflow: hidden;
}

.hover-scale img {
  @include transition (.3s cubic-bezier(0.43, 0.07, 0.61, 0.95));
}

.hover-scale:hover img {
  @include transform (scale(1.1,1.1));
}



/* Gradients / Overlays
-------------------------------------------------------*/
.bg-gradient:before {
  content: "";
  top: 0;
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: .7;
  @include linear-gradient-from-bottom(#B939E5, #4C86E7);
}

.bg-dark-overlay:before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0,0,0,.8);
}

.bottom-gradient {
  position: absolute;
  width: 100%;
  height: 40%;
  bottom: 0;
  @include linear-gradient-from-bottom(rgba(#000, .75), transparent);
}

/* Section Dividers
-------------------------------------------------------*/
.top-divider {
  border-top: 1px solid $border-color;
}

.bottom-divider {
  border-bottom: 1px solid $border-color;
}