:root {
  --gray-900: #2a2c2e;
  --gray-800: #3d3f40;
  --gray-700: #6b6f73;
  --gray-600: #babdc2;
  --gray-400: #bfbfc0;
  --gray-300: #eceded;
  --gray-200: #f9fafa;
  --cyan-600: #10bccd;

  --font-display: 'Maven Pro', sans-serif;
  --font-sans: 'Rubik', sans-serif;
  --font-monospace: 'Source Code Pro', monospace;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

.border-cyan-600 {
  border-color: var(--cyan-600);
}

.border-gray-900 {
  border-color: var(--gray-900);
}

.border-gray-700 {
  border-color: var(--gray-400);
}

.border-gray-400 {
  border-color: var(--gray-400);
}

.border-gray-300 {
  border-color: var(--gray-300);
}

.bg-cyan-600 {
  background-color: var(--cyan-600);
}

.bg-gray-900 {
  background-color: var(--gray-900);
}

.bg-gray-300 {
  background-color: var(--gray-300);
}

.bg-gray-200 {
  background-color: var(--gray-200);
}

.bg-lean {
  background-color: #47b7a2;
}

.bg-knohub {
  background-color: #ff9400;
}

.rounded-xl {
  border-radius: 1rem;
}

/* link with a / render previous text */
.link-normal {
  text-transform: uppercase;
  text-decoration: none;
  position: relative;
  font-weight: bold;
  display: inline-block;
}

.link-normal.lowercase {
  text-transform: lowercase;
}

.link-normal::after,
.link-normal::before {
  content: '';
  height: 1px;
  position: absolute;
  bottom: 0;
}

.link-normal::after {
  transition: width 0.8s 0.4s;
  width: 100%;
  right: 0;
}

.link-normal::before {
  transition: width 0.8s 0s;
  width: 0;
  left: 0;
}

.link-normal.text-cyan-600::after,
.link-normal.text-cyan-600::before {
  background-color: var(--cyan-600);
}

.link-normal.text-gray-900::after,
.link-normal.text-gray-900::before {
  background-color: var(--gray-900);
}

.link-normal.text-white::after,
.link-normal.text-white::before {
  background-color: #fff;
}

.link-normal:hover::after {
  transition: width 0.8s;
  width: 0;
}

.link-normal:hover::before {
  transition: width 0.8s 0.3s;
  width: 100%;
}

.h-1px {
  height: 1px;
}

.h-2px {
  height: 2px;
}

.h-56px {
  height: 3.5rem;
}

.w-22 {
  width: 22%;
}

.w-48 {
  width: 48%;
}

.min-w-48 {
  min-width: 48%;
}

.w-56px {
  width: 3.5rem;
}

.w-9\/10 {
  width: 90%;
}

.min-h-1\/4w-screen {
  min-height: 25vw;
}

.h-1\/6w-screen {
  height: 16.666666vw;
}

.h-1\/5w-screen {
  height: 20vw;
}

.h-1\/4w-screen {
  height: 25vw;
}

.h-1\/2w-screen {
  height: 50vw;
}

.h-3\/5w-screen {
  height: 60vw;
}

.h-3\/4w-screen {
  height: 75vw;
}

.ml-0 {
  margin-left: 0;
}

.ml-1\/2w-screen {
  margin-left: 50vw;
}

.ml-8\/12w-screen {
  margin-left: 66vw;
}

.ml-3\/4w-screen {
  margin-left: 75vw;
}

.ml-4\/5w-screen {
  margin-left: 80vw;
}

.mr-0 {
  margin-right: 0;
}

.mr-1\/2w-screen {
  margin-right: 50vw;
}

.mr-8\/12w-screen {
  margin-left: 66vw;
}

.mr-3\/4w-screen {
  margin-left: 75vw;
}

.mr-4\/5w-screen {
  margin-right: 80vw;
}

.-mt-0-screen {
  margin-top: 0;
}

.-mt-1\/8w-screen {
  margin-top: -12.5vw;
}

.px-1\/8w-screen {
  padding-left: 12.5vw;
  padding-right: 12.5vw;
}

.pl-1\/8w-screen {
  padding-left: 12.5vw;
}

.pr-1\/8w-screen {
  padding-right: 12.5vw;
}

.px-1\/12w-screen {
  padding-left: 8.333vw;
  padding-right: 8.333vw;
}

.pl-1\/12w-screen {
  padding-left: 8.333vw;
}

.pr-1\/12w-screen {
  padding-right: 8.333vw;
}

.delay-4 {
  transition-delay: 0.4s;
}

.delay-6 {
  transition-delay: 0.6s;
}

.duration-3 {
  transition-duration: 0.3s;
}

.duration-5 {
  transition-duration: 0.5s;
}

.duration-6 {
  transition-duration: 0.6s;
}

.duration-9 {
  transition-duration: 0.9s;
}

.duration-10 {
  transition-duration: 1s;
}

.ease {
  transition-timing-function: ease;
}

.opacity-15 {
  opacity: 0.15;
}

.z-35 {
  z-index: 35;
}

.left-1\/12 {
  left: 8.333333%;
}

.left-1\/8 {
  left: 12%;
}

#page-tabs button {
  transition: all 0.5s ease;
}

#page-tabs.tabs-top {
  top: 0;
}

#page-tabs.tabs-top button {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

button:focus {
  outline: 0;
}

.button-white {
  background-color: #fff;
  border: 1px solid var(--cyan-600);
  color: var(--cyan-600);
}

.button-brand {
  background-color: var(--cyan-600);
  border: 1px solid #fff;
  color: #fff;
}

.-z-1 {
  z-index: -1;
}

.half-screen {
  min-height: 50vw;
}

.left-50 {
  left: 50%;
}

.left-50.center {
  transform: translateX(-50%);
}

.top-50 {
  top: 50%;
}

.top-50.center {
  transform: translateY(-50%);
}

.left-50.top-50.center {
  transform: translate(-50%, -50%);
}

.back {
  margin-top: 4.5rem;
  /*height of header */
}

.pulse {
  cursor: pointer;
  border-radius: 50%;
  animation: pulse 2s infinite;
}

.pulse:hover {
  animation: pulse 2s infinite;
}

.through {
  transition: 0.6s cubic-bezier(0.77, 0, 0.175, 1);
}

.through::before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  z-index: 9;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);
}

.through.through-bg-gray-900::before {
  background: var(--gray-900);
}

.through.through-bg-white::before {
  background: white;
}

.through>span {
  z-index: 10;
  transition: color 0.6s 0.2s;
}

.through.through-bg-gray-900:hover {
  border-color: var(--gray-900);
}

.through.through-bg-white:hover {
  border-color: white;
}

/* .through:hover {
  background: transparent;
} */
.through.through-text-white:hover>span {
  color: white;
}

.through.through-text-cyan-600:hover>span {
  color: var(--cyan-600);
}

.through:hover::before {
  transform: scaleX(1);
  transform-origin: left;
}

/* iubenda */
#iubenda-cs-banner {
  cursor: auto !important;
}

@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(16, 188, 205, 0.4);
  }

  70% {
    -webkit-box-shadow: 0 0 0 20px rgba(16, 188, 205, 0);
  }

  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(16, 188, 205, 0);
  }
}

@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(16, 188, 205, 0.4);
    box-shadow: 0 0 0 0 rgba(16, 188, 205, 0.4);
  }

  70% {
    -moz-box-shadow: 0 0 0 20px rgba(16, 188, 205, 0);
    box-shadow: 0 0 0 20px rgba(16, 188, 205, 0);
  }

  100% {
    -moz-box-shadow: 0 0 0 0 rgba(16, 188, 205, 0);
    box-shadow: 0 0 0 0 rgba(16, 188, 205, 0);
  }
}

.contents-container>.container-flame {
  margin-top: -20vh;
}

@media screen and (min-width: 640px) {
  .sm\:border-cyan-600 {
    border-color: var(--cyan-600);
  }

  .sm\:border-gray-900 {
    border-color: var(--gray-900);
  }

  .sm\:border-gray-700 {
    border-color: var(--gray-400);
  }

  .sm\:border-gray-400 {
    border-color: var(--gray-400);
  }

  .sm\:border-gray-300 {
    border-color: var(--gray-300);
  }

  .sm\:bg-cyan-600 {
    background-color: var(--cyan-600);
  }

  .sm\:bg-gray-900 {
    background-color: var(--gray-900);
  }

  .sm\:bg-gray-300 {
    background-color: var(--gray-300);
  }

  .sm\:h-56px {
    height: 3.5rem;
  }

  .sm\:w-56px {
    width: 3.5rem;
  }

  .sm\:w-21\/24 {
    width: 87.49999965%;
  }

  .sm\:ml-0 {
    margin-left: 0;
  }

  .sm\:ml-1\/2w-screen {
    margin-left: 50vw;
  }

  .sm\:ml-8\/12w-screen {
    margin-left: 66vw;
  }

  .sm\:ml-3\/4w-screen {
    margin-left: 75vw;
  }

  .sm\:ml-4\/5w-screen {
    margin-left: 80vw;
  }

  .sm\:mr-0 {
    margin-right: 0;
  }

  .sm\:mr-1\/2w-screen {
    margin-right: 50vw;
  }

  .sm\:mr-8\/12w-screen {
    margin-left: 66vw;
  }

  .sm\:mr-3\/4w-screen {
    margin-left: 75vw;
  }

  .sm\:mr-4\/5w-screen {
    margin-right: 80vw;
  }

  .sm\:-mt-0-screen {
    margin-top: 0;
  }

  .sm\:-mt-1\/8w-screen {
    margin-top: -12.5vw;
  }

  .sm\:px-1\/8w-screen {
    padding-left: 12.5vw;
    padding-right: 12.5vw;
  }

  .sm\:pl-1\/8w-screen {
    padding-left: 12.5vw;
  }

  .sm\:pr-1\/8w-screen {
    padding-right: 12.5vw;
  }

  .sm\:px-1\/12w-screen {
    padding-left: 8.333vw;
    padding-right: 8.333vw;
  }

  .sm\:pl-1\/12w-screen {
    padding-left: 8.333vw;
  }

  .sm\:pr-1\/12w-screen {
    padding-right: 8.333vw;
  }

  .sm\:min-h-1\/4w-screen {
    min-height: 25vw;
  }

  .sm\:h-1\/6w-screen {
    height: 16.666666vw;
  }

  .sm\:h-1\/5w-screen {
    height: 20vw;
  }

  .sm\:h-1\/4w-screen {
    height: 25vw;
  }

  .sm\:h-1\/2w-screen {
    height: 50vw;
  }

  .sm\:h-3\/5w-screen {
    height: 60vw;
  }

  .sm\:h-3\/4w-screen {
    height: 75vw;
  }
}

@media screen and (min-width: 768px) {
  .back {
    margin-top: 7.5rem;
    /*height of header */
  }

  .md\:border-cyan-600 {
    border-color: var(--cyan-600);
  }

  .md\:border-gray-900 {
    border-color: var(--gray-900);
  }

  .md\:border-gray-700 {
    border-color: var(--gray-400);
  }

  .md\:border-gray-400 {
    border-color: var(--gray-400);
  }

  .md\:border-gray-300 {
    border-color: var(--gray-300);
  }

  .md\:bg-cyan-600 {
    background-color: var(--cyan-600);
  }

  .md\:bg-gray-900 {
    background-color: var(--gray-900);
  }

  .md\:bg-gray-300 {
    background-color: var(--gray-300);
  }

  .md\:h-56px {
    height: 3.5rem;
  }

  .md\:w-56px {
    width: 3.5rem;
  }

  .md\:ml-0 {
    margin-left: 0;
  }

  .md\:ml-1\/2w-screen {
    margin-left: 50vw;
  }

  .md\:ml-8\/12w-screen {
    margin-left: 66vw;
  }

  .md\:ml-3\/4w-screen {
    margin-left: 75vw;
  }

  .md\:ml-4\/5w-screen {
    margin-left: 80vw;
  }

  .md\:mr-0 {
    margin-right: 0;
  }

  .md\:mr-1\/2w-screen {
    margin-right: 50vw;
  }

  .md\:mr-8\/12w-screen {
    margin-left: 66vw;
  }

  .md\:mr-3\/4w-screen {
    margin-left: 75vw;
  }

  .md\:mr-4\/5w-screen {
    margin-right: 80vw;
  }

  .md\:-mt-0-screen {
    margin-top: 0;
  }

  .md\:-mt-1\/8w-screen {
    margin-top: -12.5vw;
  }

  .md\:px-1\/8w-screen {
    padding-left: 12.5vw;
    padding-right: 12.5vw;
  }

  .md\:pl-1\/8w-screen {
    padding-left: 12.5vw;
  }

  .md\:pr-1\/8w-screen {
    padding-right: 12.5vw;
  }

  .md\:px-1\/12w-screen {
    padding-left: 8.333vw;
    padding-right: 8.333vw;
  }

  .md\:pl-1\/12w-screen {
    padding-left: 8.333vw;
  }

  .md\:pr-1\/12w-screen {
    padding-right: 8.333vw;
  }

  .md\:min-h-1\/4w-screen {
    min-height: 25vw;
  }

  .md\:h-1\/6w-screen {
    height: 16.666666vw;
  }

  .md\:h-1\/5w-screen {
    height: 20vw;
  }

  .md\:h-1\/4w-screen {
    height: 25vw;
  }

  .md\:h-1\/2w-screen {
    height: 50vw;
  }

  .md\:h-3\/5w-screen {
    height: 60vw;
  }

  .md\:h-3\/4w-screen {
    height: 75vw;
  }
}

@media screen and (min-width: 1024px) {
  .lg\:border-cyan-600 {
    border-color: var(--cyan-600);
  }

  .lg\:border-gray-900 {
    border-color: var(--gray-900);
  }

  .lg\:border-gray-700 {
    border-color: var(--gray-400);
  }

  .lg\:border-gray-400 {
    border-color: var(--gray-400);
  }

  .lg\:border-gray-300 {
    border-color: var(--gray-300);
  }

  .lg\:bg-cyan-600 {
    background-color: var(--cyan-600);
  }

  .lg\:bg-gray-900 {
    background-color: var(--gray-900);
  }

  .lg\:bg-gray-300 {
    background-color: var(--gray-300);
  }

  .lg\:h-56px {
    height: 3.5rem;
  }

  .lg\:w-56px {
    width: 3.5rem;
  }

  /* 4/9 */
  .lg\:w-444 {
    width: 44.444444%;
  }

  .lg\:w-22 {
    width: 22%;
  }

  .lg\:w-48 {
    width: 48%;
  }

  .lg\:ml-0 {
    margin-left: 0;
  }

  .lg\:ml-1\/2w-screen {
    margin-left: 50vw;
  }

  .lg\:ml-8\/12w-screen {
    margin-left: 66vw;
  }

  .lg\:ml-3\/4w-screen {
    margin-left: 75vw;
  }

  .lg\:ml-4\/5w-screen {
    margin-left: 80vw;
  }

  .lg\:mr-0 {
    margin-right: 0;
  }

  .lg\:mr-1\/2w-screen {
    margin-right: 50vw;
  }

  .lg\:mr-8\/12w-screen {
    margin-left: 66vw;
  }

  .lg\:mr-3\/4w-screen {
    margin-left: 75vw;
  }

  .lg\:mr-4\/5w-screen {
    margin-right: 80vw;
  }

  .lg\:-mt-0-screen {
    margin-top: 0;
  }

  .lg\:-mt-1\/8w-screen {
    margin-top: -12.5vw;
  }

  .lg\:px-1\/8w-screen {
    padding-left: 12.5vw;
    padding-right: 12.5vw;
  }

  .lg\:pl-1\/8w-screen {
    padding-left: 12.5vw;
  }

  .lg\:pr-1\/8w-screen {
    padding-right: 12.5vw;
  }

  .lg\:px-1\/12w-screen {
    padding-left: 8.333vw;
    padding-right: 8.333vw;
  }

  .lg\:pl-1\/12w-screen {
    padding-left: 8.333vw;
  }

  .lg\:pr-1\/12w-screen {
    padding-right: 8.333vw;
  }

  .lg\:min-h-1\/4w-screen {
    min-height: 25vw;
  }

  .lg\:h-1\/6w-screen {
    height: 16.666666vw;
  }

  .lg\:h-1\/5w-screen {
    height: 20vw;
  }

  .lg\:h-1\/4w-screen {
    height: 25vw;
  }

  .lg\:h-1\/2w-screen {
    height: 50vw;
  }

  .lg\:h-3\/5w-screen {
    height: 60vw;
  }

  .lg\:h-3\/4w-screen {
    height: 75vw;
  }
}

@media screen and (min-width: 1280px) {
  .xl\:border-cyan-600 {
    border-color: var(--cyan-600);
  }

  .xl\:border-gray-900 {
    border-color: var(--gray-900);
  }

  .xl\:border-gray-700 {
    border-color: var(--gray-400);
  }

  .xl\:border-gray-400 {
    border-color: var(--gray-400);
  }

  .xl\:border-gray-300 {
    border-color: var(--gray-300);
  }

  .xl\:bg-cyan-600 {
    background-color: var(--cyan-600);
  }

  .xl\:bg-gray-900 {
    background-color: var(--gray-900);
  }

  .xl\:bg-gray-300 {
    background-color: var(--gray-300);
  }

  .xl\:h-56px {
    height: 3.5rem;
  }

  .xl\:w-56px {
    width: 3.5rem;
  }

  .xl\:w-21\/24 {
    width: 87.49999965%;
  }

  .xl\:ml-0 {
    margin-left: 0;
  }

  .xl\:ml-1\/2w-screen {
    margin-left: 50vw;
  }

  .xl\:ml-8\/12w-screen {
    margin-left: 66vw;
  }

  .xl\:ml-3\/4w-screen {
    margin-left: 75vw;
  }

  .xl\:ml-4\/5w-screen {
    margin-left: 80vw;
  }

  .xl\:mr-0 {
    margin-right: 0;
  }

  .xl\:mr-1\/2w-screen {
    margin-right: 50vw;
  }

  .xl\:mr-8\/12w-screen {
    margin-left: 66vw;
  }

  .xl\:mr-3\/4w-screen {
    margin-left: 75vw;
  }

  .xl\:mr-4\/5w-screen {
    margin-right: 80vw;
  }

  .xl\:-mt-0-screen {
    margin-top: 0;
  }

  .xl\:-mt-1\/8w-screen {
    margin-top: -12.5vw;
  }

  .xl\:px-1\/8w-screen {
    padding-left: 12.5vw;
    padding-right: 12.5vw;
  }

  .xl\:pl-1\/8w-screen {
    padding-left: 12.5vw;
  }

  .xl\:pr-1\/8w-screen {
    padding-right: 12.5vw;
  }

  .xl\:px-1\/12w-screen {
    padding-left: 8.333vw;
    padding-right: 8.333vw;
  }

  .xl\:pl-1\/12w-screen {
    padding-left: 8.333vw;
  }

  .xl\:pr-1\/12w-screen {
    padding-right: 8.333vw;
  }

  .xl\:min-h-1\/4w-screen {
    min-height: 25vw;
  }

  .xl\:h-1\/6w-screen {
    height: 16.666666vw;
  }

  .xl\:h-1\/5w-screen {
    height: 20vw;
  }

  .xl\:h-1\/4w-screen {
    height: 25vw;
  }

  .xl\:h-1\/2w-screen {
    height: 50vw;
  }

  .xl\:h-3\/5w-screen {
    height: 60vw;
  }

  .xl\:h-3\/4w-screen {
    height: 75vw;
  }

  /* 1/9 */
  .xl\:w-111 {
    width: 11.111111%;
  }

  /* 3/9 */
  .xl\:w-333 {
    width: 33.333333%;
  }

  /* 4/9 */
  .xl\:w-444 {
    width: 44.444444%;
  }

  .xl\:w-22 {
    width: 22%;
  }

  .xl\:w-48 {
    width: 48%;
  }

  /* 7/9 */
  .xl\:w-777 {
    width: 77.777777%;
  }

  .xl\:mr-111 {
    margin-right: 11.11111%;
  }
}

@media screen and (min-width: 1600px) {
  .xxl\:w-full {
    width: 100%;
  }

  .xxl\:w-1\/2 {
    width: 50%;
  }

  .xxl\:w-1\/4 {
    width: 25%;
  }

  .xxl\:flex {
    display: flex;
  }

  .xxl\:hidden {
    display: none;
  }

  .xxl\:flex-row {
    flex-direction: row;
  }

  .xxl\:flex-wrap {
    flex-wrap: wrap;
  }
}
