/*!
 * Start Bootstrap - Scrolling Nav (https://startbootstrap.com/template-overviews/scrolling-nav)
 * Copyright 2013-2017 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-scrolling-nav/blob/master/LICENSE)
 */

header {
  padding: 154px 0 100px;
}

@media (min-width: 992px) {
  header {
    padding: 156px 0 100px;
  }
}

/**
 * `@property` is required for the animation to work.
 * Without it, the angle values won’t interpolate properly.
 *
 * @see https://dev.to/afif/we-can-finally-animate-css-gradient-kdk
 */
@property --bg-angle {
  inherits: false;
  initial-value: 0deg;
  syntax: "<angle>";
}

/**
 * To animate the gradient, we set the custom property to 1 full
 * rotation. The animation starts at the default value of `0deg`.
 */
@keyframes spin {
  to {
    --bg-angle: 360deg;
  }
}

.bg-calendar{
	/* add the animation, but pause it by default */
  animation: spin 5s infinite linear paused;
  
  /**
   * Using `background-origin` we can create a “border” using two gradients. And to
   * make the gradients better-looking, we use OKLCH.
   *
   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/background-origin
   * @see https://evilmartians.com/chronicles/oklch-in-css-why-quit-rgb-hsl
   */
  background:
    /* Background colors don’t work with `background-origin`, so use a gradient. */
    linear-gradient(
        to right, rgba(255,255,255,0.8), rgba(255,255,255,1)
      )
      padding-box, /* ends at inner border edges */
    conic-gradient(
        from var(--bg-angle),
        rgba(0,0,0,1), rgba(188,188,188,1), rgba(0,0,0,1)
      )
      border-box; /* extends to outer border edges */
  
  /* a clear border lets the background gradient shine through */
	animation-play-state: running;
	padding-top:150px;
	padding-bottom:150px;
}


footer {
	padding-top: 0px;
	padding-bottom: 0px;	
	color: #ffffff;
	background-color: #0E1320;
}

@media (max-width: 576px) {
	footer {
	text-align: center;
}
}