/*===============================================
| Background
===============================================*/
.bg-dot {
   background-color: #ffffff;
   background-image: radial-gradient(#f1f1f1 1px, transparent 1px);
   background-size: 22px 22px;
   -webkit-text-size-adjust: 100%;
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.bg-grid {
   height: 16rem;
   background-image: linear-gradient(to right, #f2f2f2 1px, transparent 1px),
      linear-gradient(to bottom, #f2f2f2 1px, transparent 1px) !important;
   background-size: 2.5rem 2.5rem;
   background-position: center center;
}

/*===============================================
| Moving Image
===============================================*/

.moving-img {
   animation: moveUpDown 4s ease-in-out infinite !important;
   pointer-events: none !important;
}
@keyframes moveUpDown {
   0% {
      transform: translateY(0);
   }
   50% {
      transform: translateY(-10px);
   }
   100% {
      transform: translateY(0);
   }
}

/*===============================================
| Hover show '#'
===============================================*/
.hashtag {
   position: relative;
}
.hashtag:before {
   content: "#";
   position: absolute;
   top: 0;
   left: -20px;
   opacity: 0;
   transition: opacity 0.3s ease;
}
.hashtag:hover::before {
   opacity: 1;
   color: var(--app-dark-blue);
}

/*===============================================
| Gradient text
===============================================*/
.gradient-blue-text {
   background: -webkit-gradient(
      linear,
      left top,
      right top,
      from(var(--app-dark-blue)),
      to(var(--app-light-blue))
   );
   background-image: linear-gradient(
      90deg,
      var(--app-dark-blue) 0,
      var(--app-light-blue) 100%
   );
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent;
}

.gradient-dark-text {
   background: -webkit-gradient(
      linear,
      left top,
      right top,
      from(#373d3f),
      to(#555f61)
   );
   background-image: linear-gradient(90deg, #373d3f 0, #555f61 100%);
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent;
}