/* 2.3 Devices ======================================================= */
.iphone,
.iphone-x,
.ipad {
  border: 1px solid #d9e2ef;
  margin: 0 auto;
  position: relative;
}

.iphone:before, .iphone:after,
.iphone-x:before,
.iphone-x:after,
.ipad:before,
.ipad:after {
  content: "";
  position: absolute;
}

.iphone:before,
.iphone-x:before,
.ipad:before {
  width: 45px;
  height: 4px;
  left: 0;
  right: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  border-radius: 30px;
}

.iphone:after,
.iphone-x:after,
.ipad:after {
  left: 50%;
  width: 8px;
  height: 8px;
  -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.03);
          box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.03);
  display: block;
  border-radius: 50%;
}

.iphone .screen,
.iphone-x .screen,
.ipad .screen {
  margin: 0 auto;
  overflow: hidden;
}

.iphone .screen img,
.iphone-x .screen img,
.ipad .screen img {
  max-width: 100%;
}

.iphone,
.ipad {
  background: #ffffff;
  max-width: 255px;
  border-radius: 36px;
  padding: 55px 0;
  -webkit-box-shadow: inset 0 4px 10px 1px #ffffff, inset 0 0 6px 0 rgba(66, 77, 86, 0.5), 0 2px 0 #aeb5bb, 0 20px 50px -25px rgba(0, 0, 0, 0.5);
          box-shadow: inset 0 4px 10px 1px #ffffff, inset 0 0 6px 0 rgba(66, 77, 86, 0.5), 0 2px 0 #aeb5bb, 0 20px 50px -25px rgba(0, 0, 0, 0.5);
  /* speaker */
  /* camera */
}

.iphone:before,
.ipad:before {
  background: #e3e8eb;
  margin: -25px auto 0;
}

.iphone:after,
.ipad:after {
  top: 30px;
  margin-left: -45px;
  background: #e3e8eb;
}

.iphone .screen,
.ipad .screen {
  width: 90%;
}

.iphone .screen img,
.ipad .screen img {
  -webkit-box-shadow: 0 0 0 1px rgba(0, 17, 53, 0.16);
          box-shadow: 0 0 0 1px rgba(0, 17, 53, 0.16);
}

.iphone .button,
.ipad .button {
  -webkit-box-shadow: 0 0 1px 2px #e3e8eb inset;
          box-shadow: 0 0 1px 2px #e3e8eb inset;
  border: 1px solid #d9e2ef;
  border-radius: 50%;
  bottom: 1.75%;
  height: 0;
  padding-top: 36px;
  width: 36px;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.iphone.small,
.ipad.small {
  max-width: 185px;
  border-radius: 26px;
  padding: 45px 0;
}

.iphone.small:before,
.ipad.small:before {
  width: 35px;
}

.iphone.small:after,
.ipad.small:after {
  top: 20px;
}

.iphone.small .button,
.ipad.small .button {
  width: 28px;
  padding-top: 28px;
  margin-left: -8px;
}

.iphone.landscape,
.ipad.landscape {
  padding: 1rem 3rem;
}

.iphone.landscape:before, .iphone.landscape:after,
.ipad.landscape:before,
.ipad.landscape:after {
  left: 16%;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.iphone.landscape .button,
.ipad.landscape .button {
  left: 100%;
  margin-left: -50px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.ipad:before {
  content: none;
}

.ipad.portrait:after {
  margin-left: 0;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.iphone-x {
  background: #131d2d;
  max-width: 243.75px;
  border-radius: 26px;
  padding: 9.75px;
  -webkit-box-shadow: inset 0 0 6px 0 rgba(66, 77, 86, 0.5), 0 1px 0 #aeb5bb, 0 20px 50px -25px rgba(0, 0, 0, 0.5);
          box-shadow: inset 0 0 6px 0 rgba(66, 77, 86, 0.5), 0 1px 0 #aeb5bb, 0 20px 50px -25px rgba(0, 0, 0, 0.5);
  /* speaker */
  /* camera */
}

.iphone-x:before, .iphone-x:after {
  background-color: #1c2b43;
  z-index: 1;
}

.iphone-x:before {
  margin: 0 auto;
}

.iphone-x:after {
  top: 8px;
  margin-left: 33px;
}

.iphone-x .screen {
  border-radius: 13px;
}

.iphone-x .screen img {
  -webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.015);
          box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.015);
}

.iphone-x .notch {
  position: absolute;
  border-radius: 13px;
  width: 135.85px;
  height: 22.75px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background-color: #131d2d;
  top: 0;
  left: 50%;
}

.iphone-x.light {
  background-color: #f1f4f8;
}

.iphone-x.light .notch {
  background-color: #f1f4f8;
}

.iphone-x.light:before, .iphone-x.light:after {
  background-color: #e3e8eb;
}

.device-twin {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  max-width: 425px;
}

.device-twin .mockup {
  -webkit-box-shadow: inset 0 4px 10px 1px #ffffff, inset 0 0 6px 0 rgba(66, 77, 86, 0.5), 0 20px 50px -25px rgba(0, 0, 0, 0.5), 0 0 1px rgba(0, 0, 0, 0.1);
          box-shadow: inset 0 4px 10px 1px #ffffff, inset 0 0 6px 0 rgba(66, 77, 86, 0.5), 0 20px 50px -25px rgba(0, 0, 0, 0.5), 0 0 1px rgba(0, 0, 0, 0.1);
  max-width: 210px;
}

@media (min-width: 768px) {
  .device-twin .phone {
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
  }
  .device-twin .phone.front:hover {
    -webkit-transform: rotate(2deg) translate3d(0, -8px, 0);
            transform: rotate(2deg) translate3d(0, -8px, 0);
  }
  .device-twin .phone.absolute {
    margin-top: -30px;
  }
  .device-twin .phone.absolute:hover {
    -webkit-transform: rotate(-2deg) translate3d(-10px, 0, 0);
            transform: rotate(-2deg) translate3d(-10px, 0, 0);
  }
}

.device-twin.free-width {
  max-width: none;
}

.browser {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fff), color-stop(10%, #eef1f3));
  background: linear-gradient(#fff 1%, #eef1f3 10%);
  position: relative;
  padding-top: 2em;
  border-radius: 0.4em;
}

.browser:before {
  display: block;
  position: absolute;
  content: "";
  top: 0.75em;
  left: 1em;
  width: 0.5em;
  height: 0.5em;
  border-radius: 50%;
  background: #f44;
  -webkit-box-shadow: 0 0 0 1px #f44, 1.5em 0 0 1px #9b3, 3em 0 0 1px #fb5;
          box-shadow: 0 0 0 1px #f44, 1.5em 0 0 1px #9b3, 3em 0 0 1px #fb5;
}

.browser img {
  max-width: 100%;
}

.browser.shadow {
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 2px 4px rgba(0, 0, 0, 0.09);
          box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 2px 4px rgba(0, 0, 0, 0.09);
}

.browser.border {
  border: 1px solid #d9e2ef;
}

.fade-bottom:after {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(70%, #fff), to(#fff));
  background: linear-gradient(rgba(255, 255, 255, 0), #fff 70%, #fff);
  bottom: -25px;
  content: "";
  display: block;
  height: 85px;
  left: 0;
  position: absolute;
  right: 0;
}

.shape-divider {
  position: absolute;
  pointer-events: none;
}

.shape-divider-bottom {
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-transform: scale(2);
          transform: scale(2);
}

.shape-divider-bottom > * {
  -webkit-transform-origin: top center;
          transform-origin: top center;
}

@media (min-width: 768px) {
  .shape-divider-bottom {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

.shape-divider-fluid-x > * {
  width: 100%;
  height: auto;
}

.shape-divider-fluid-y > * {
  width: auto;
  height: 100%;
}

.shape-divider svg {
  fill: currentColor;
  -webkit-transform: scale(2);
          transform: scale(2);
}

.gradient {
  background-color: transparent;
}

.gradient.gradient-purple-blue {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#a772ff), to(#0083dd));
  background-image: linear-gradient(to right top, #a772ff, #0083dd);
}

.gradient.gradient-purple-blue.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.1)), to(rgba(0, 131, 221, 0.1)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.1), rgba(0, 131, 221, 0.1));
}

.gradient.gradient-purple-blue.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.2)), to(rgba(0, 131, 221, 0.2)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.2), rgba(0, 131, 221, 0.2));
}

.gradient.gradient-purple-blue.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.3)), to(rgba(0, 131, 221, 0.3)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.3), rgba(0, 131, 221, 0.3));
}

.gradient.gradient-purple-blue.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.4)), to(rgba(0, 131, 221, 0.4)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.4), rgba(0, 131, 221, 0.4));
}

.gradient.gradient-purple-blue.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.5)), to(rgba(0, 131, 221, 0.5)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.5), rgba(0, 131, 221, 0.5));
}

.gradient.gradient-purple-blue.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.6)), to(rgba(0, 131, 221, 0.6)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.6), rgba(0, 131, 221, 0.6));
}

.gradient.gradient-purple-blue.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.7)), to(rgba(0, 131, 221, 0.7)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.7), rgba(0, 131, 221, 0.7));
}

.gradient.gradient-purple-blue.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.8)), to(rgba(0, 131, 221, 0.8)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.8), rgba(0, 131, 221, 0.8));
}

.gradient.gradient-purple-blue.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.9)), to(rgba(0, 131, 221, 0.9)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.9), rgba(0, 131, 221, 0.9));
}

.gradient.gradient-purple-dark {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#a772ff), to(#4f2ca9));
  background-image: linear-gradient(to right top, #a772ff, #4f2ca9);
}

.gradient.gradient-purple-dark.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.1)), to(rgba(79, 44, 169, 0.1)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.1), rgba(79, 44, 169, 0.1));
}

.gradient.gradient-purple-dark.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.2)), to(rgba(79, 44, 169, 0.2)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.2), rgba(79, 44, 169, 0.2));
}

.gradient.gradient-purple-dark.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.3)), to(rgba(79, 44, 169, 0.3)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.3), rgba(79, 44, 169, 0.3));
}

.gradient.gradient-purple-dark.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.4)), to(rgba(79, 44, 169, 0.4)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.4), rgba(79, 44, 169, 0.4));
}

.gradient.gradient-purple-dark.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.5)), to(rgba(79, 44, 169, 0.5)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.5), rgba(79, 44, 169, 0.5));
}

.gradient.gradient-purple-dark.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.6)), to(rgba(79, 44, 169, 0.6)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.6), rgba(79, 44, 169, 0.6));
}

.gradient.gradient-purple-dark.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.7)), to(rgba(79, 44, 169, 0.7)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.7), rgba(79, 44, 169, 0.7));
}

.gradient.gradient-purple-dark.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.8)), to(rgba(79, 44, 169, 0.8)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.8), rgba(79, 44, 169, 0.8));
}

.gradient.gradient-purple-dark.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.9)), to(rgba(79, 44, 169, 0.9)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.9), rgba(79, 44, 169, 0.9));
}

.gradient.gradient-purple-navy {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#a772ff), to(#161c2d));
  background-image: linear-gradient(to right top, #a772ff, #161c2d);
}

.gradient.gradient-purple-navy.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.1)), to(rgba(22, 28, 45, 0.1)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.1), rgba(22, 28, 45, 0.1));
}

.gradient.gradient-purple-navy.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.2)), to(rgba(22, 28, 45, 0.2)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.2), rgba(22, 28, 45, 0.2));
}

.gradient.gradient-purple-navy.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.3)), to(rgba(22, 28, 45, 0.3)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.3), rgba(22, 28, 45, 0.3));
}

.gradient.gradient-purple-navy.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.4)), to(rgba(22, 28, 45, 0.4)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.4), rgba(22, 28, 45, 0.4));
}

.gradient.gradient-purple-navy.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.5)), to(rgba(22, 28, 45, 0.5)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.5), rgba(22, 28, 45, 0.5));
}

.gradient.gradient-purple-navy.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.6)), to(rgba(22, 28, 45, 0.6)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.6), rgba(22, 28, 45, 0.6));
}

.gradient.gradient-purple-navy.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.7)), to(rgba(22, 28, 45, 0.7)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.7), rgba(22, 28, 45, 0.7));
}

.gradient.gradient-purple-navy.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.8)), to(rgba(22, 28, 45, 0.8)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.8), rgba(22, 28, 45, 0.8));
}

.gradient.gradient-purple-navy.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(167, 114, 255, 0.9)), to(rgba(22, 28, 45, 0.9)));
  background-image: linear-gradient(to right top, rgba(167, 114, 255, 0.9), rgba(22, 28, 45, 0.9));
}

.gradient.gradient-blue-purple {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#0083dd), to(#a772ff));
  background-image: linear-gradient(to right top, #0083dd, #a772ff);
}

.gradient.gradient-blue-purple.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.1)), to(rgba(167, 114, 255, 0.1)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.1), rgba(167, 114, 255, 0.1));
}

.gradient.gradient-blue-purple.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.2)), to(rgba(167, 114, 255, 0.2)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.2), rgba(167, 114, 255, 0.2));
}

.gradient.gradient-blue-purple.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.3)), to(rgba(167, 114, 255, 0.3)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.3), rgba(167, 114, 255, 0.3));
}

.gradient.gradient-blue-purple.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.4)), to(rgba(167, 114, 255, 0.4)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.4), rgba(167, 114, 255, 0.4));
}

.gradient.gradient-blue-purple.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.5)), to(rgba(167, 114, 255, 0.5)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.5), rgba(167, 114, 255, 0.5));
}

.gradient.gradient-blue-purple.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.6)), to(rgba(167, 114, 255, 0.6)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.6), rgba(167, 114, 255, 0.6));
}

.gradient.gradient-blue-purple.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.7)), to(rgba(167, 114, 255, 0.7)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.7), rgba(167, 114, 255, 0.7));
}

.gradient.gradient-blue-purple.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.8)), to(rgba(167, 114, 255, 0.8)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.8), rgba(167, 114, 255, 0.8));
}

.gradient.gradient-blue-purple.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.9)), to(rgba(167, 114, 255, 0.9)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.9), rgba(167, 114, 255, 0.9));
}

.gradient.gradient-blue-dark {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#0083dd), to(#00447b));
  background-image: linear-gradient(to right top, #0083dd, #00447b);
}

.gradient.gradient-blue-dark.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.1)), to(rgba(0, 68, 123, 0.1)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.1), rgba(0, 68, 123, 0.1));
}

.gradient.gradient-blue-dark.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.2)), to(rgba(0, 68, 123, 0.2)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.2), rgba(0, 68, 123, 0.2));
}

.gradient.gradient-blue-dark.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.3)), to(rgba(0, 68, 123, 0.3)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.3), rgba(0, 68, 123, 0.3));
}

.gradient.gradient-blue-dark.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.4)), to(rgba(0, 68, 123, 0.4)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.4), rgba(0, 68, 123, 0.4));
}

.gradient.gradient-blue-dark.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.5)), to(rgba(0, 68, 123, 0.5)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.5), rgba(0, 68, 123, 0.5));
}

.gradient.gradient-blue-dark.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.6)), to(rgba(0, 68, 123, 0.6)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.6), rgba(0, 68, 123, 0.6));
}

.gradient.gradient-blue-dark.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.7)), to(rgba(0, 68, 123, 0.7)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.7), rgba(0, 68, 123, 0.7));
}

.gradient.gradient-blue-dark.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.8)), to(rgba(0, 68, 123, 0.8)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.8), rgba(0, 68, 123, 0.8));
}

.gradient.gradient-blue-dark.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.9)), to(rgba(0, 68, 123, 0.9)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.9), rgba(0, 68, 123, 0.9));
}

.gradient.gradient-blue-navy {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#0083dd), to(#161c2d));
  background-image: linear-gradient(to right top, #0083dd, #161c2d);
}

.gradient.gradient-blue-navy.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.1)), to(rgba(22, 28, 45, 0.1)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.1), rgba(22, 28, 45, 0.1));
}

.gradient.gradient-blue-navy.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.2)), to(rgba(22, 28, 45, 0.2)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.2), rgba(22, 28, 45, 0.2));
}

.gradient.gradient-blue-navy.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.3)), to(rgba(22, 28, 45, 0.3)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.3), rgba(22, 28, 45, 0.3));
}

.gradient.gradient-blue-navy.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.4)), to(rgba(22, 28, 45, 0.4)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.4), rgba(22, 28, 45, 0.4));
}

.gradient.gradient-blue-navy.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.5)), to(rgba(22, 28, 45, 0.5)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.5), rgba(22, 28, 45, 0.5));
}

.gradient.gradient-blue-navy.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.6)), to(rgba(22, 28, 45, 0.6)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.6), rgba(22, 28, 45, 0.6));
}

.gradient.gradient-blue-navy.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.7)), to(rgba(22, 28, 45, 0.7)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.7), rgba(22, 28, 45, 0.7));
}

.gradient.gradient-blue-navy.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.8)), to(rgba(22, 28, 45, 0.8)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.8), rgba(22, 28, 45, 0.8));
}

.gradient.gradient-blue-navy.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(0, 131, 221, 0.9)), to(rgba(22, 28, 45, 0.9)));
  background-image: linear-gradient(to right top, rgba(0, 131, 221, 0.9), rgba(22, 28, 45, 0.9));
}

.gradient.gradient-navy-purple {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#161c2d), to(#a772ff));
  background-image: linear-gradient(to right top, #161c2d, #a772ff);
}

.gradient.gradient-navy-purple.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.1)), to(rgba(167, 114, 255, 0.1)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.1), rgba(167, 114, 255, 0.1));
}

.gradient.gradient-navy-purple.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.2)), to(rgba(167, 114, 255, 0.2)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.2), rgba(167, 114, 255, 0.2));
}

.gradient.gradient-navy-purple.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.3)), to(rgba(167, 114, 255, 0.3)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.3), rgba(167, 114, 255, 0.3));
}

.gradient.gradient-navy-purple.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.4)), to(rgba(167, 114, 255, 0.4)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.4), rgba(167, 114, 255, 0.4));
}

.gradient.gradient-navy-purple.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.5)), to(rgba(167, 114, 255, 0.5)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.5), rgba(167, 114, 255, 0.5));
}

.gradient.gradient-navy-purple.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.6)), to(rgba(167, 114, 255, 0.6)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.6), rgba(167, 114, 255, 0.6));
}

.gradient.gradient-navy-purple.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.7)), to(rgba(167, 114, 255, 0.7)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.7), rgba(167, 114, 255, 0.7));
}

.gradient.gradient-navy-purple.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.8)), to(rgba(167, 114, 255, 0.8)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.8), rgba(167, 114, 255, 0.8));
}

.gradient.gradient-navy-purple.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.9)), to(rgba(167, 114, 255, 0.9)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.9), rgba(167, 114, 255, 0.9));
}

.gradient.gradient-navy-blue {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#161c2d), to(#0083dd));
  background-image: linear-gradient(to right top, #161c2d, #0083dd);
}

.gradient.gradient-navy-blue.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.1)), to(rgba(0, 131, 221, 0.1)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.1), rgba(0, 131, 221, 0.1));
}

.gradient.gradient-navy-blue.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.2)), to(rgba(0, 131, 221, 0.2)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.2), rgba(0, 131, 221, 0.2));
}

.gradient.gradient-navy-blue.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.3)), to(rgba(0, 131, 221, 0.3)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.3), rgba(0, 131, 221, 0.3));
}

.gradient.gradient-navy-blue.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.4)), to(rgba(0, 131, 221, 0.4)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.4), rgba(0, 131, 221, 0.4));
}

.gradient.gradient-navy-blue.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.5)), to(rgba(0, 131, 221, 0.5)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.5), rgba(0, 131, 221, 0.5));
}

.gradient.gradient-navy-blue.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.6)), to(rgba(0, 131, 221, 0.6)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.6), rgba(0, 131, 221, 0.6));
}

.gradient.gradient-navy-blue.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.7)), to(rgba(0, 131, 221, 0.7)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.7), rgba(0, 131, 221, 0.7));
}

.gradient.gradient-navy-blue.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.8)), to(rgba(0, 131, 221, 0.8)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.8), rgba(0, 131, 221, 0.8));
}

.gradient.gradient-navy-blue.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(22, 28, 45, 0.9)), to(rgba(0, 131, 221, 0.9)));
  background-image: linear-gradient(to right top, rgba(22, 28, 45, 0.9), rgba(0, 131, 221, 0.9));
}

.gradient.gradient-primary-dark {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#5533ff), to(#161c2d));
  background-image: linear-gradient(to right top, #5533ff, #161c2d);
}

.gradient.gradient-primary-dark.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.1)), to(rgba(22, 28, 45, 0.1)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.1), rgba(22, 28, 45, 0.1));
}

.gradient.gradient-primary-dark.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.2)), to(rgba(22, 28, 45, 0.2)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.2), rgba(22, 28, 45, 0.2));
}

.gradient.gradient-primary-dark.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.3)), to(rgba(22, 28, 45, 0.3)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.3), rgba(22, 28, 45, 0.3));
}

.gradient.gradient-primary-dark.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.4)), to(rgba(22, 28, 45, 0.4)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.4), rgba(22, 28, 45, 0.4));
}

.gradient.gradient-primary-dark.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.5)), to(rgba(22, 28, 45, 0.5)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.5), rgba(22, 28, 45, 0.5));
}

.gradient.gradient-primary-dark.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.6)), to(rgba(22, 28, 45, 0.6)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.6), rgba(22, 28, 45, 0.6));
}

.gradient.gradient-primary-dark.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.7)), to(rgba(22, 28, 45, 0.7)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.7), rgba(22, 28, 45, 0.7));
}

.gradient.gradient-primary-dark.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.8)), to(rgba(22, 28, 45, 0.8)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.8), rgba(22, 28, 45, 0.8));
}

.gradient.gradient-primary-dark.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.9)), to(rgba(22, 28, 45, 0.9)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.9), rgba(22, 28, 45, 0.9));
}

.gradient.gradient-primary-light {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#5533ff), to(#a772ff));
  background-image: linear-gradient(to right top, #5533ff, #a772ff);
}

.gradient.gradient-primary-light.overlay.alpha-1:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.1)), to(rgba(167, 114, 255, 0.1)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.1), rgba(167, 114, 255, 0.1));
}

.gradient.gradient-primary-light.overlay.alpha-2:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.2)), to(rgba(167, 114, 255, 0.2)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.2), rgba(167, 114, 255, 0.2));
}

.gradient.gradient-primary-light.overlay.alpha-3:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.3)), to(rgba(167, 114, 255, 0.3)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.3), rgba(167, 114, 255, 0.3));
}

.gradient.gradient-primary-light.overlay.alpha-4:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.4)), to(rgba(167, 114, 255, 0.4)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.4), rgba(167, 114, 255, 0.4));
}

.gradient.gradient-primary-light.overlay.alpha-5:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.5)), to(rgba(167, 114, 255, 0.5)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.5), rgba(167, 114, 255, 0.5));
}

.gradient.gradient-primary-light.overlay.alpha-6:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.6)), to(rgba(167, 114, 255, 0.6)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.6), rgba(167, 114, 255, 0.6));
}

.gradient.gradient-primary-light.overlay.alpha-7:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.7)), to(rgba(167, 114, 255, 0.7)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.7), rgba(167, 114, 255, 0.7));
}

.gradient.gradient-primary-light.overlay.alpha-8:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.8)), to(rgba(167, 114, 255, 0.8)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.8), rgba(167, 114, 255, 0.8));
}

.gradient.gradient-primary-light.overlay.alpha-9:after {
  background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(85, 51, 255, 0.9)), to(rgba(167, 114, 255, 0.9)));
  background-image: linear-gradient(to right top, rgba(85, 51, 255, 0.9), rgba(167, 114, 255, 0.9));
}
.absolute {
    position: absolute !important;
}