/* :root {
  --primary: #0000eb;
  --orange: #ff6129;
  --red: #ed0000;
  --yellow: #ffd217;
  --indigo: #6900ff;
  --blue: #0072ec;
  --cyan: #31c8ff;
} */

html,body {
  height: 100%;
  padding: 0;
  margin: 0;
}

@media only screen and (max-width: 767px) {
  /* mobile */
}

.artifact-pos-bottom {
  position: relative;
}

.artifact-bottom-primary-box::after {
  position: absolute;
  bottom: -4rem;
  right: 0;
  height: 12rem;
  width: 12rem;
  content: "";
  display: block;
  background-color: #0000eb;
  z-index: 100;
}

.artifact-bottom-white-box::after {
  position: absolute;
  bottom: -4rem;
  right: 0;
  height: 12rem;
  width: 12rem;
  content: "";
  display: block;
  background-color: #fff;
  z-index: 100;
}

.artifact-bottom-cyan-box::after {
  position: absolute;
  bottom: -4rem;
  right: 0;
  height: 12rem;
  width: 12rem;
  content: "";
  display: block;
  background-color: #31c8ff;
  z-index: 100;
}

.artifact-bottom-orange-box::after {
  position: absolute;
  bottom: -4rem;
  right: 0;
  height: 12rem;
  width: 12rem;
  content: "";
  display: block;
  background-color: #ff6129;
  z-index: 100;
}

.artifact-pos-bottom-primary {
  border-bottom: 40px solid #0000eb;
}

.artifact-pos-top-primary {
  border-top: 40px solid #0000eb;
}

.artifact-pos-top-white {
  border-top: 40px solid #fff;
}

.artifact-pos-bottom-white {
  border-bottom: 40px solid #fff;
}

.artifact-pos-top-black {
  border-top: 40px solid #000;
}

.swipeup-container {
  overflow: hidden;
  /* display: block; */
}

.swipeup {
  animation: fadein 0.7s cubic-bezier(0.83, 0, 0.17, 1);
  animation-fill-mode: forwards;
  animation-delay: 0.3s;
  /* transform: translateY(200%); */
  opacity: 0;
  white-space: nowrap;
  /* display: block; */
}

.swipeup.two {
  animation-delay: 0.6s;
}

.hero-headline,
.hero-subheadline,
.lgo {
  z-index: 100;
}

/* .hero-date,
.sf.date .cms-date-row, */
.hero-subheadline {
  animation: fadein 0.7s cubic-bezier(0.83, 0, 0.17, 1);
  animation-delay: 0.6s;
  animation-fill-mode: forwards;
  opacity: 0;
}

.hero-logos {
  animation: fadein 0.7s cubic-bezier(0.83, 0, 0.17, 1);
  animation-delay: 0.7s;
  animation-fill-mode: forwards;
  opacity: 0;
}

.lgo {
  animation: scaleup 0.7s cubic-bezier(0.83, 0, 0.17, 1);
  animation-delay: 0.7s;
  animation-fill-mode: forwards;
  /* transform: translateX(200%); */
  transform:scaleY(0);
}

.lgo::before {
  content:"";
  display:block;
  background-color: #31c8ff;
  height: 100%;
  width: 0%;
  top: -100%;
  right: 100%;
  z-index: 100;
  position: absolute;
  animation: leftborder 0.7s cubic-bezier(0.83, 0, 0.17, 1);
  animation-delay: 1.2s;
  animation-fill-mode: forwards;
}

.lgo::after {
  content:"";
  display:block;
  background-color: #6900ff;
  height: 0px;
  width: 25%;
  z-index: 100;
  position: absolute;
  bottom: -30px;
  right: 0;
  animation: logoborder 0.7s cubic-bezier(0.83, 0, 0.17, 1);
  animation-delay: 1.4s;
  animation-fill-mode: forwards;
}

.lgo .img {
  animation: fadein 0.7s cubic-bezier(0.83, 0, 0.17, 1);
  animation-delay: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}

.vegas {
  position: fixed;
  top:0;
  left:0;
  height: 100%;
  width: 100%;
  z-index: 0;
}

.vegas::before {
  content:"";
  display:block;
  background-color: rgba(0, 0, 0, 0.4);
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 100;
}

.left-border-indigo {
  border-left: 4rem solid #6900ff;
}

.left-border-cyan {
  border-left: 4rem solid #31c8ff;
}

.flex {
  display: flex !important;
}

/* .sf.date {
  display: inline-block !important;
  margin-bottom: 20px;
  position: relative;
}

.sf.date::before {
  content: "";
  display: block;
  border-bottom: 0px solid #31c8ff;
  width: 100%;
  animation: dateborder 1s 0.7s, datebottommargin 1s 0.8s;
  animation-delay: 1s;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.83, 0, 0.17, 1);
} */

.intro-copy::before {
  content:'';
  display:block;
  background-color: #0000eb;
  height: 20px;
  width: 100%;
  top: -20px;
  left: 0;
  z-index: 100;
  position: absolute;
}

.headshot-container {
  width: 25% !important;
}

.headshot-wrapper {
  display: flex;
  flex-wrap: wrap;
}

.headshot-container .cms-image-v2-element {
  /* filter: grayscale(1); */
  position: relative;
}

.headshot-container .cms-image-v2-element::before {
  content:"";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.3s ease;
  backdrop-filter: grayscale(1);
  -webkit-backdrop-filter: grayscale(1);
}

.headshot-container .cms-image-v2-element:hover::before {
  backdrop-filter: grayscale(0);
  -webkit-backdrop-filter: grayscale(0);
}

.headshot-container .cms-image-v2-element::after {
  content:"";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  background-color: #0000eb;
  z-index: 100;
  transition: all 0.3s ease;
}

.headshot-container .cms-image-v2-element:hover::after {
  height: 0px;
}

.sxm-video {
  animation: fadein 1s 1.3s;
  opacity: 0;
  animation-fill-mode: forwards;
}

.video .embed {
  padding-top: 0 !important;
}

.speakers {
  padding-left: 0;
  margin-left: 0;
  list-style-type: none;
}
  
.speakers li{
  margin-bottom: 10px;
  list-style-type: none;
}
  
.speakers li::marker {
  color: #0000EB
}

.border-bottom {
  border-bottom: 1px solid #dfdfdf;
  padding-bottom: 10px;
}

@media only screen and (max-width: 767px) {
    .flex {
      display: inline-block !important
    }

    .reverse-stack {
      display: flex;
      flex-direction: column-reverse;
    }

    .footer-logo {
        background-position: center center !important;
        background-size: 40% !important;
    }
    .artifact-bottom-primary-box::after,
    .artifact-bottom-white-box::after,
    .artifact-bottom-cyan-box::after,
    .artifact-bottom-orange-box::after {
      height: 5rem;
      width: 5rem;
    }
    .artifact-pos-bottom-primary {
      border-bottom: 30px solid #0000eb;
    }
    
    .artifact-pos-top-primary {
      border-top: 30px solid #0000eb;
    }

    .artifact-pos-top-primary-lrg {
      border-top: 60px solid #0000eb;
    }

    .artifact-pos-top-primary-sm {
      border-top: 20px solid #0000eb;
    }
    
    .artifact-pos-top-white {
      border-bottom: 30px solid #fff;
    }

    .artifact-pos-top-white-lrg {
      border-top: 60px solid #fff;
    }

    .artifact-pos-top-white-sm {
      border-top: 20px solid #fff;
    }

    .artifact-pos-bottom-white {
      border-bottom: 30px solid #fff;
    }

    .artifact-pos-top-black {
      border-top: 30px solid #000;
    }

    .artifact-pos-top-black-lrg {
      border-top: 60px solid #000;
    }

    .artifact-pos-top-black-sm {
      border-top: 20px solid #000;
    }
}

@keyframes swipeleft {
  0% {
    transform: translateX(200%);
  }
  100% {
    transform: translateX(0%);
  }
}

@keyframes swipeup {
  0% {
    transform: translateY(200%);
  }
  100% {
    transform: translateY(0%);
  }
}

@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes scaleup {
  0% {
    transform:scaleY(0);
  }
  100% {
    transform:scaleY(1);
  }
}

@keyframes leftborder {
  0% {
    width: 0%;
  }
  100% {
    width: 70%
  }
}

@keyframes logoborder {
  0% {
    height:0
  }
  100% {
    height: 30px
  }
}

@keyframes dateborder {
  0% {
    border-bottom: 0px solid #31c8ff;
  }
  100% {
    border-bottom: 80px solid #31c8ff;
  }
}

@keyframes datebottommargin {
  0% {
    margin-bottom: 0;
  }
  100% {
    margin-bottom: 1rem;
  }
}