:root {
  --black: #171717;
  --white: #e0e0e0;

  --page-pad: 64px;
  --page-pad-v: 48px;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;

  font-family: 'Abel', sans-serif;
  font-size: 18px;
  color: var(--white);
}

html {
  background: var(--black);

  font-family: 'Abel', sans-serif;
  font-size: 18px;
  color: var(--white);

  overflow-x: hidden;
}

a, a:visited { color: inherit; text-decoration: none; }

body {
/*  padding: 0 var(--page-pad);*/
/*  width: 100%;*/
  overflow-x: hidden;
}

.Donut {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

p + p,
p + .DonutList,
.DonutList + p {
  margin-top: 32px;
}

.Section {
  min-width: 100%;
  min-height: 100vh;

  overflow-x: hidden;

}

.Content {
  max-width: 800px;
  padding: var(--page-pad-v);

  min-width: auto;
  margin-left: auto;
  margin-right: auto;
}

.Intro {
  position: relative;

  display: flex;
  align-items: center;
  justify-content: center;

  /*max-height: 80%;
  min-height: 80%;*/
  overflow: hidden;
  width: 100%;
  min-height: 100dvh;
}
  .Intro .__bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: url('assets/header-bg.jpg');
    background-size: cover;
    background-position: center center;
    filter: blur(2px);
  }

  .Intro .__overlay {
    position: absolute;
    inset: 0;
  }
  .Intro .__logo {
    max-width: 80vw;
    max-height: 80vh;
    opacity: 1;
    transition: opacity .5s;
  }

  .Intro .__yt {
    position: fixed;
    top: 0px;
    right: 0px;
    z-index: 1;

    padding: 32px;
  }
  .Intro .__yt img {
    width: 82px;

    filter: invert(1) hue-rotate(120deg);
  }

  .Intro video {
    position: absolute;
    z-index: -1;
/*    object-fit: fill;*/
    object-position: center;
    min-width: 100%;
    min-height: 100%;

    opacity: 0;
    transition: opacity .5s;
    mix-blend-mode: hard-light;
  }

.About {
  white-space: break-spaces;
}

.Copyable,
.CopyableHelp {
  border-bottom: 1px dotted white;
  text-wrap: nowrap;

  color: grey;
}

.DonutList {
  display: flex;
  flex-direction: column;
  gap: 12px;

  font-size: 18px;
}

  .DonutList li {
    margin-top: 18px;
  }

.a-hue-color-anim {
  animation: 10s k-hue-color-anim infinite linear;
}

.a-copy {
  animation:
    .3s k-invert-there-and-back infinite linear;
}

.Footer {
  background-image: url('assets/footer.jpg');
  background-size: cover;
  background-position: center center;
}

footer {
  align-items: flex-end;
}

@keyframes k-hue-color-anim {
  from { filter: hue-rotate(0); }
  to { filter: hue-rotate(360deg); }
}

@keyframes k-invert-there-and-back {
  0% { filter: invert(0); }
  50% { filter: invert(1) }
  100% { filter: invert(0) }
}

/* insta feed */
.eapps-instagram-feed-header {
  background: transparent !important;
}

.eapps-instagram-feed {
  position: relative;
  overflow: hidden;
}
