:root{
  --year: 2025;
  --hub-id:5473887;
  --base-color: #201f42;
  --base-color-rgb: 32, 31, 66;
  --base-font-size: 16px;
  --base-font-weight: 400;

  --base-font-family: 'Tenorite', sans-serif;
  --base-line-height: 1.8;

  --heading-font-family: 'Tenorite', sans-serif;
  --heading-line-height: 1.4;
  --heading-weight: 700;

  --primary: #201F42;
  --primary-light: #343356;
  --primary-dark: #0c0b2e;

  --secondary: #1ebcc0;
  --secondary-light: #32d0d4;
  --secondary-dark: #0aa8ac;

  --tertiary: #2bb6be;
  --tertiary-light: ;
  --tertiary-dark: ;

  --off-white: #F8FAFC;
}  

#main-content {width: 100vw; overflow-x: hidden;}

h1, .h1 {
  font-family: 'Tenorite-Display-Bold', sans-serif;
  font-size: 60px;
  
  font-weight: var(--heading-weight);
  line-height: var(--heading-line-height);
  
}
h2, .h2 {
  font-family: var(--heading-font-family);
  font-size: 40px;
  
  font-weight: var(--heading-weight);
  line-height: var(--heading-line-height);
  
}
h3, .h3 {
  font-family: var(--heading-font-family);
  font-size: 34px;
  
  font-weight: var(--heading-weight);
  line-height: var(--heading-line-height);
  
}
h4, .h4{
  font-family: var(--heading-font-family);
  font-size: 24px;
  
  font-weight: var(--heading-weight);
  line-height: var(--heading-line-height);
  
}
h5, .h5{
  font-family: var(--heading-font-family);
  font-size: 22px;
  
  font-weight: var(--heading-weight);
  line-height: var(--heading-line-height);
  
}
h6, .h6{
  font-family: var(--base-font-family);
  font-size: 20px;
  
  font-weight: var(--heading-weight);
  line-height: var(--heading-line-height);
  
}
body {
  font-family: var(--base-font-family);
  font-size: var(--base-font-size);
  font-weight: var(--base-font-weight);
  line-height: var(--base-line-height);
  color: var(--base-color);
}

pre {
	background-color: #1a1a1a;
	color: whitesmoke;
	padding: 15px!important;
	width: 100%;
  white-space:normal;
  border-radius: 5px;;
	box-shadow: 0 0 10px black;
}

blockquote{
  display:block;
  background: #fff;
  padding: 15px 20px 15px 45px;
  padding: 1em 1em 1em 4em;
  margin: 0 0 20px;
  position: relative;
  
  /*Font*/
  font-family: var(--base-font-family);
  font-size: var(--base-font-size);
  line-height: var(--base-line-height);
  color: var(--base-color);
  text-align: justify;
  
  /*Borders - (Optional)*/
  border-left: 15px solid var(--primary);
  border-right: 2px solid var(--primary);
  
  /*Box Shadow - (Optional)*/
  box-shadow: 2px 2px 15px rgba(0,0,0,0.3);
}

blockquote::before{
  content: "\201C"; /*Unicode for Left Double Quote*/
  
  /*Font*/
  font-family: Georgia, serif;
  font-size: 60px;
  font-weight: bold;
  color: #999;
  
  /*Positioning*/
  position: absolute;
  left: 10px;
  left: .25em;
  top:0;
}

blockquote::after{
  /*Reset to make sure*/
  content: "";
}

/* Gradient border */

.gradient-leftright {
  box-shadow: 0 0 0 6px transparent; 
  border: solid 3px transparent; 
  background-image: linear-gradient(white, white), linear-gradient(to right, #201F42, #2BB6BE); 
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.gradient-rightleft {
  box-shadow: 0 0 0 6px transparent; 
  border: solid 3px transparent; 
  background-image: linear-gradient(white, white), linear-gradient(to left, #201F42, #2BB6BE); 
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.gradient-topdown {
  box-shadow: 0 0 0 6px transparent; 
  border: solid 3px transparent; 
  background-image: linear-gradient(white, white), linear-gradient(to bottom, #201F42, #2BB6BE); 
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.gradient-topdown {
  box-shadow: 0 0 0 6px transparent; 
  border: solid 3px transparent; 
  background-image: linear-gradient(white, white), linear-gradient(to top, #201F42, #2BB6BE); 
  background-origin: border-box;
  background-clip: padding-box, border-box;
}


.customer-card {
  background: rgb(32,31,66) !important;
  background: -moz-linear-gradient(180deg, rgba(32,31,66,1) 0%, rgba(37,105,127,1) 66%, rgba(43,182,190,1) 100%) !important;
  background: -webkit-linear-gradient(180deg, rgba(32,31,66,1) 0%, rgba(37,105,127,1) 66%, rgba(43,182,190,1) 100%) !important;
  background: linear-gradient(180deg, rgba(32,31,66,1) 0%, rgba(37,105,127,1) 66%, rgba(43,182,190,1) 100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#201f42",endColorstr="#2bb6be",GradientType=1);

}

.card-glass {
  background-color: rgba(255, 255, 255, .3)
}

.stack ul, .stack ol, .stack.post-body ul, .stack.post-body ol  {margin-top: 0px !important;}


.blob {
  /*position: sticky;*/
  position: absolute;
  /*margin-top: -800px;*/
  /*  opacity: 0.25; */
  opacity: .3;
  /*width: 800px;*/
  height: 40%;
  aspect-ratio: 1/1;
  top: 20%;
  animation: animate 10s cubic-bezier(1, 1, 1, 1) infinite
  /*animation: animate 10s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite*/
    alternate forwards;
  filter: blur(100px);
  /*top: 40vh;*/
    /*left: calc(60% - 25%);*/
    left: 50%;
  z-index: -1;
  background: linear-gradient(
    47deg,
    #E4057C 21%,
    #1ebcc0 61%,
    #000 81%
  );

  /*  Optional  */
  /*   box-shadow: inset 50px 50px 17px 0px #ff588b,
    inset 100px 100
    px 17px 0px #66319f; */
}

@keyframes animate {
  0% {
    /*translate: 40% -5%;*/
    translate: 75% 50%
    border-radius: 60% 40% 30% 70% / 100% 85% 92% 74%;
  }
  50% {
    /*translate: 0% 13%;*/
    translate: 75% 50%
    border-radius: 20% 71% 47% 70% / 81% 15% 22% 54%;
    rotate: 41deg;
    scale: 1.15;
  }
  100% {
    /*translate: -45% 39%;*/
    translate: 75% 100%;
    border-radius: 100% 75% 92% 74% / 60% 80% 30% 70%;
    rotate: -60deg;
    scale: 1.05;
  }
}



.bg-transparent-gradient {
  background: rgb(255,255,255);
background: -moz-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 30%, rgba(255,255,255,0) 70%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 30%, rgba(255,255,255,0) 70%, rgba(255,255,255,1) 100%);
background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 30%, rgba(255,255,255,0) 70%, rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}


a.menu___item.active {color: var(--secondary);}

/* Blob 2 */

.blobs-2 {
  width: 50vw;
  height: 50%;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 50vw !important;
}

.blobs-2-center {
  transform: translate(-50%, -50%);
}

@media (max-width: 768px) {
  .blobs-2 {
    width: 100vw;
    height: 100vh;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

}



.blob-2 {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  position: absolute;
  background-color: white;
  mix-blend-mode: darken;
  filter: blur(70px);
  /*filter: blur(200px);*/
  opacity: .3;
}



.blob-2.a {
  background: rgba(30, 188, 192, 0.8); /* RGBA representation of #1ebcc0 with 80% opacity */
  animation: circular2 10s linear infinite;
}

.blob-2.b {
  background-color: rgba(228, 5, 124, 0.5); /* RGBA representation of #e4057c with 50% opacity */
  animation: circular 5s linear infinite;
}



@keyframes circular {
  0% {
      transform: translate(0, -150px);
  }
  25% {
      transform: translate(150px, 0);
  }
  50% {
      transform: translate(0, 150px);
  }
  75% {
      transform: translate(-150px, 0);
  }
  100% {
      transform: translate(0, -150px);
  }
}

@keyframes circular2 {
  0% {
      transform: translate(0, 150px);
  }
  25% {
      transform: translate(-150px, 0);
  }
  50% {
      transform: translate(0, -150px);
  }
  75% {
      transform: translate(150px, 0);
  }
  100% {
      transform: translate(0, 150px);
  }
}







@media (max-width: 1024px) {
  .blob {
    margin-top: -50%;
    width: 50%;
    left: 0;
    
}


@media (max-width: 768px) {
  .h1, h1 {font-size: 40px;}
  .h2, h2 {font-size: 30px;}
  .h3, h3 {font-size: 24px;}
  .blob {
    opacity: 1;filter: blur(70px);}


}