/* screen - desktop */

body {
	background-color: var(--brand2) !important;
}

.desktop {
  align-items: flex-start;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  height: 1853px;
  width: 1280px;
}

.desktop .header {
  align-items: flex-end;
  background-color: var(--brand2);
  display: flex;
  height: 722px;
  width: 1280px;
}

.desktop .overlap-group-1 {
  height: 662px;
  position: relative;
  width: 1280px;
}

.desktop .hero-tilt {
  height: 80px;
  left: 0;
  position: absolute;
  top: 582px;
  width: 1280px;
}

.desktop .group-24 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  left: 10px;
  position: absolute;
  top: 0;
  width: 1264px;
}

.desktop .flex-row {
  align-items: center;
  display: flex;
  margin-left: -0.17px;
  min-width: 1260px;
}

.desktop .brand {
  display: block;
  height: 60px;
  width: 316px;
  opacity: 0;
transform: translate(-25px, 0);
}

.desktop .brand.bp3-animate-enter {
  animation: bp3-animate-enter-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp3-animate-enter-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.desktop .menu {
  height: 27px;
  margin-bottom: 1.0px;
  margin-left: 619px;
  position: relative;
  width: 325px;
  opacity: 0;
transform: translate(25px, 0);
}

.desktop .menu.bp3-animate-enter1 {
  animation: bp3-animate-enter1-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(25px, 0);
}

@keyframes bp3-animate-enter1-frames {
  from{opacity: 0;
transform: translate(25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.desktop .about {
  left: -5px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: right;
  top: 0;
  white-space: nowrap;
}

.desktop .support {
  left: 108px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: right;
  top: 0;
  white-space: nowrap;
}

.desktop .connect {
  left: 249px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: right;
  top: 0;
  white-space: nowrap;
}

.desktop .overlap-group2 {
  height: 532px;
  margin-top: 64px;
  position: relative;
  width: 1256px;
}

.desktop .overlap-group1 {
  height: 532px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1256px;
}

.desktop .hero-text {
  left: 0;
  letter-spacing: 0;
  line-height: 72px;
  position: absolute;
  top: 5px;
  width: 632px;
}

.desktop .hero-text-1 {
  left: 0;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  top: 261px;
  width: 632px;
}

.desktop .stack4 {
  height: 508px;
  left: 628px;
  position: absolute;
  top: 0;
  width: 628px;
}

.desktop .human1 {
  height: 249px;
  left: 563px;
  position: absolute;
  top: 283px;
  width: 173px;
}

.desktop .buttons {
  align-items: flex-start;
  display: flex;
  height: 44px;
  left: 0;
  position: absolute;
  top: 355px;
}

.desktop .button {
  background-color: var(--brand1);
  height: 44px;
  pointer-events: auto;
  position: relative;
  transition: all 0.2s ease;
  width: 125px;
}

.desktop .text-i13631421432 {
  height: 14px;
  left: 20px;
  letter-spacing: 0;
  line-height: 14px;
  position: absolute;
  text-align: center;
  top: 15px;
  white-space: nowrap;
}

.desktop .button-1 {
  align-items: center;
  background-color: var(--light-gray);
  display: flex;
  height: 44px;
  justify-content: flex-end;
  margin-left: 20px;
  min-width: 141px;
  padding: 0 18px;
}

.desktop .text-i13631422432 {
  height: 14px;
  letter-spacing: 0;
  line-height: 14px;
  min-width: 103px;
  text-align: center;
  white-space: nowrap;
}

.desktop .aim {
  align-items: flex-end;
  background-color: var(--brand3);
  display: flex;
  flex-direction: column;
  height: 495px;
  padding: 20px 8px;
  width: 1280px;
}

.desktop .reclaim-hosting {
  letter-spacing: 0;
  line-height: 72px;
  min-height: 72px;
  text-align: center;
  white-space: nowrap;
  width: 1262px;
  opacity: 0;
transform: translate(0, 25px);
}

.desktop .reclaim-hosting.bp3-animate-enter2 {
  animation: bp3-animate-enter2-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(0, 25px);
}

@keyframes bp3-animate-enter2-frames {
  from{opacity: 0;
transform: translate(0, 25px);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.desktop .hero-text-2 {
  align-self: center;
  letter-spacing: 0;
  line-height: 27px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 54px;
  text-align: center;
  width: 632px;
  opacity: 0;
}

.desktop .hero-text-2.bp3-animate-enter3 {
  animation: bp3-animate-enter3-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp3-animate-enter3-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.desktop .flex-row-1 {
  align-items: flex-start;
  align-self: center;
  display: flex;
  margin-top: 40px;
  min-width: 1260px;
}

.desktop .box {
  background-color: var(--white);
  box-shadow: 10px 10px 0px #00b856;
  height: 175px;
  position: relative;
  width: 610px;
  opacity: 0;
transform: translate(-25px, 0);
}

.desktop .box.bp3-animate-enter4 {
  animation: bp3-animate-enter4-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp3-animate-enter4-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.desktop .frame-4 {
  align-items: flex-end;
  display: flex;
  height: 60px;
  justify-content: flex-end;
  left: 10px;
  position: absolute;
  top: 10px;
}

.desktop .overlap-group {
  height: 78px;
  margin-bottom: -18px;
  position: relative;
  width: 560px;
}

.desktop .text {
  left: 0;
  letter-spacing: 0;
  line-height: 48px;
  position: absolute;
  top: 30px;
  white-space: nowrap;
  width: 512px;
}

.desktop .icon-dove {
  height: 60px;
  left: 500px;
  position: absolute;
  top: 0;
  width: 60px;
}

.desktop .text-1 {
  left: 40px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  top: 108px;
  white-space: nowrap;
  width: 592px;
}

.desktop .box-1 {
  background-color: var(--white);
  box-shadow: 10px 10px 0px #00b856;
  height: 175px;
  margin-left: 39px;
  position: relative;
  width: 610px;
  opacity: 0;
transform: translate(-25px, 0);
}

.desktop .box-1.bp3-animate-enter5 {
  animation: bp3-animate-enter5-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp3-animate-enter5-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.desktop .icon-dove-1 {
  height: 60px;
  left: 500px;
  position: absolute;
  top: 0;
  width: 61px;
}

.desktop .text-5 {
  letter-spacing: 0;
  line-height: 24px;
  margin-top: 50px;
  min-height: 24px;
  text-align: center;
  white-space: nowrap;
  width: 1262px;
  opacity: 0;
}

.desktop .text-5.bp3-animate-enter6 {
  animation: bp3-animate-enter6-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp3-animate-enter6-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.desktop .frame-25 {
  align-items: flex-start;
  display: flex;
  height: 529px;
  width: 1280px;
}

.desktop .overlap-group2-1 {
  height: 489px;
  position: relative;
  width: 1280px;
}

.desktop .hero-tilt-1 {
  height: 40px;
  left: 0;
  position: absolute;
  top: 60px;
  width: 1280px;
}

.desktop .frame-26 {
  background-color: var(--brand3);
  height: 60px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1280px;
}

.desktop .group-26 {
  align-items: center;
  display: flex;
  flex-direction: column;
  left: 10px;
  position: absolute;
  top: 0;
  width: 1264px;
}

.desktop .human2 {
  height: 100px;
  margin-right: 4.34px;
  width: 101px;
}

.desktop .overlap-group-2 {
  height: 122px;
  margin-right: 2.0px;
  margin-top: 20px;
  position: relative;
  width: 1262px;
}

.desktop .a-joint-mission {
  left: 0;
  letter-spacing: 0;
  line-height: 72px;
  position: absolute;
  text-align: center;
  top: 0;
  white-space: nowrap;
  width: 1262px;
  opacity: 0;
transform: translate(0, 25px);
}

.desktop .a-joint-mission.bp3-animate-enter7 {
  animation: bp3-animate-enter7-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(0, 25px);
}

@keyframes bp3-animate-enter7-frames {
  from{opacity: 0;
transform: translate(0, 25px);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.desktop .hero-text-3 {
  left: 315px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: center;
  top: 68px;
  width: 632px;
  opacity: 0;
}

.desktop .hero-text-3.bp3-animate-enter8 {
  animation: bp3-animate-enter8-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp3-animate-enter8-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.desktop .frame-20 {
  align-items: flex-start;
  display: flex;
  height: 100px;
  justify-content: flex-end;
  margin-right: 4.0px;
  margin-top: 47px;
  min-width: 433px;
}

.desktop .logo-autonomic {
  display: block;
  height: 80px;
  width: 99px;
  opacity: 0;
}

.desktop .logo-autonomic.bp3-animate-enter9 {
  animation: bp3-animate-enter9-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp3-animate-enter9-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.desktop .logo-platform6 {
  display: block;
  height: 80px;
  margin-left: 82px;
  width: 71px;
  opacity: 0;
}

.desktop .logo-platform6.bp3-animate-enter10 {
  animation: bp3-animate-enter10-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp3-animate-enter10-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.desktop .logo-wa {
  display: block;
  height: 80px;
  margin-left: 90px;
  margin-top: 5px;
  width: 91px;
  opacity: 0;
}

.desktop .logo-wa.bp3-animate-enter11 {
  animation: bp3-animate-enter11-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp3-animate-enter11-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.desktop .frame-21 {
  align-items: center;
  display: flex;
  margin-right: 4.0px;
  margin-top: 20px;
  min-width: 630px;
}

.desktop .logo-cni {
  display: block;
  height: 80px;
  width: 292px;
  opacity: 0;
}

.desktop .logo-cni.bp3-animate-enter12 {
  animation: bp3-animate-enter12-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp3-animate-enter12-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.desktop .logo-mediablaze {
  display: block;
  height: 50px;
  margin-left: 54px;
  margin-top: 0;
  width: 284px;
  opacity: 0;
}

.desktop .logo-mediablaze.bp3-animate-enter13 {
  animation: bp3-animate-enter13-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp3-animate-enter13-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.desktop .frame-28 {
  align-items: center;
  background-color: var(--brand2);
  display: flex;
  height: 107px;
  padding: 0 25px;
  width: 1280px;
}

.desktop .hero-text-4 {
  letter-spacing: 0;
  line-height: 27px;
  min-height: 27px;
  text-align: center;
  white-space: nowrap;
  width: 1192px;
}
/* screen - mobile */

.mobile {
  align-items: flex-start;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  height: 2257px;
  width: 375px;
}

.mobile .header {
  align-items: center;
  background-color: var(--brand2);
  display: flex;
  flex-direction: column;
  height: 933px;
  overflow: hidden;
  width: 375px;
}

.mobile .brand {
  display: block;
  height: 60px;
  margin-right: 14.34px;
  margin-top: 20px;
  width: 321px;
  opacity: 0;
transform: translate(-25px, 0);
}

.mobile .brand.bp1-animate-enter {
  animation: bp1-animate-enter-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp1-animate-enter-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.mobile .menu {
  height: 27px;
  margin-top: 22px;
  position: relative;
  width: 335px;
  opacity: 0;
transform: translate(25px, 0);
}

.mobile .menu.bp1-animate-enter1 {
  animation: bp1-animate-enter1-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(25px, 0);
}

@keyframes bp1-animate-enter1-frames {
  from{opacity: 0;
transform: translate(25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.mobile .about {
  left: 3px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: center;
  top: 0;
  white-space: nowrap;
}

.mobile .support {
  left: 114px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: center;
  top: 0;
  white-space: nowrap;
}

.mobile .connect {
  left: 255px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: center;
  top: 0;
  white-space: nowrap;
}

.mobile .hero-text {
  letter-spacing: 0;
  line-height: 48px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 144px;
  width: 337px;
}

.mobile .hero-text-1 {
  letter-spacing: 0;
  line-height: 27px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 108px;
  width: 337px;
}

.mobile .overlap-group {
  height: 308px;
  margin-right: 0.49px;
  margin-top: 38px;
  position: relative;
  width: 365px;
}

.mobile .stack4 {
  height: 279px;
  left: 20px;
  position: absolute;
  top: 0;
  width: 345px;
}

.mobile .human1 {
  height: 120px;
  left: 0;
  position: absolute;
  top: 188px;
  width: 85px;
}

.mobile .buttons {
  align-items: flex-start;
  display: flex;
  margin-left: 1.0px;
  margin-top: 40px;
  min-width: 286px;
}

.mobile .button {
  background-color: var(--brand1);
  height: 44px;
  pointer-events: auto;
  position: relative;
  transition: all 0.2s ease;
  width: 125px;
}

.mobile .text-i13629856432 {
  height: 14px;
  left: 20px;
  letter-spacing: 0;
  line-height: 14px;
  position: absolute;
  text-align: center;
  top: 15px;
  white-space: nowrap;
}

.mobile .button-1 {
  align-items: center;
  background-color: var(--light-gray);
  display: flex;
  height: 44px;
  justify-content: flex-end;
  margin-left: 20px;
  min-width: 141px;
  padding: 0 18px;
}

.mobile .text-i13629857432 {
  height: 14px;
  letter-spacing: 0;
  line-height: 14px;
  min-width: 103px;
  text-align: center;
  white-space: nowrap;
}

.mobile .hero-tilt {
  height: 40px;
  margin-top: 40px;
  width: 375px;
}

.mobile .aim {
  align-items: center;
  background-color: var(--brand3);
  display: flex;
  flex-direction: column;
  height: 618px;
  padding: 20px 0;
  width: 375px;
}

.mobile .group-23 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  margin-left: 4.0px;
  min-height: 176px;
  width: 339px;
}

.mobile .reclaim-hosting {
  letter-spacing: 0;
  line-height: 48px;
  min-height: 48px;
  text-align: center;
  white-space: nowrap;
  width: 337px;
  opacity: 0;
transform: translate(0, 25px);
}

.mobile .reclaim-hosting.bp1-animate-enter2 {
  animation: bp1-animate-enter2-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(0, 25px);
}

@keyframes bp1-animate-enter2-frames {
  from{opacity: 0;
transform: translate(0, 25px);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.mobile .hero-text-2 {
  letter-spacing: 0;
  line-height: 27px;
  margin-top: 20px;
  min-height: 108px;
  width: 337px;
  opacity: 0;
}

.mobile .hero-text-2.bp1-animate-enter3 {
  animation: bp1-animate-enter3-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp1-animate-enter3-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.mobile .box {
  background-color: var(--white);
  box-shadow: 10px 10px 0px #00b856;
  height: 147px;
  margin-top: 20px;
  position: relative;
  width: 355px;
  opacity: 0;
transform: translate(-25px, 0);
}

.mobile .box.bp1-animate-enter4 {
  animation: bp1-animate-enter4-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp1-animate-enter4-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.mobile .frame-4 {
  align-items: flex-start;
  display: flex;
  height: 60px;
  left: 10px;
  position: absolute;
  top: 10px;
}

.mobile .text {
  color: var(--brand1);
  font-family: var(--font-family-liberation_sans-bold);
  font-size: var(--font-size-m);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 27px;
  min-height: 27px;
  white-space: nowrap;
  width: 267px;
}

.mobile .icon-dove {
  height: 60px;
  margin-left: 8px;
  width: 60px;
}

.mobile .text-1 {
  left: 10px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  top: 80px;
  width: 337px;
}

.mobile .box-1 {
  background-color: var(--white);
  box-shadow: 10px 10px 0px #00b856;
  height: 147px;
  margin-top: 20px;
  position: relative;
  width: 355px;
  opacity: 0;
transform: translate(-25px, 0);
}

.mobile .box-1.bp1-animate-enter5 {
  animation: bp1-animate-enter5-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp1-animate-enter5-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.mobile .text-10 {
  letter-spacing: 0;
  line-height: 24px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 48px;
  text-align: center;
  width: 337px;
  opacity: 0;
}

.mobile .text-10.bp1-animate-enter6 {
  animation: bp1-animate-enter6-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp1-animate-enter6-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.mobile .frame-25 {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: 599px;
  width: 375px;
}

.mobile .overlap-group1 {
  height: 100px;
  position: relative;
  width: 375px;
}

.mobile .hero-tilt-1 {
  height: 40px;
  left: 0;
  position: absolute;
  top: 60px;
  width: 375px;
}

.mobile .frame-26 {
  background-color: var(--brand3);
  height: 60px;
  left: 0;
  position: absolute;
  top: 0;
  width: 375px;
}

.mobile .human2 {
  height: 100px;
  left: 137px;
  position: absolute;
  top: 0;
  width: 102px;
}

.mobile .a-joint-mission {
  letter-spacing: 0;
  line-height: 48px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 48px;
  text-align: center;
  white-space: nowrap;
  width: 337px;
  opacity: 0;
transform: translate(0, 25px);
}

.mobile .a-joint-mission.bp1-animate-enter7 {
  animation: bp1-animate-enter7-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(0, 25px);
}

@keyframes bp1-animate-enter7-frames {
  from{opacity: 0;
transform: translate(0, 25px);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.mobile .hero-text-3 {
  letter-spacing: 0;
  line-height: 27px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 81px;
  width: 337px;
  opacity: 0;
}

.mobile .hero-text-3.bp1-animate-enter8 {
  animation: bp1-animate-enter8-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp1-animate-enter8-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.mobile .frame-20 {
  align-items: flex-start;
  display: flex;
  height: 100px;
  justify-content: flex-end;
  margin-left: 1.0px;
  margin-top: 20px;
  min-width: 334px;
}

.mobile .logo-autonomic {
  display: block;
  height: 80px;
  width: 99px;
  opacity: 0;
}

.mobile .logo-autonomic.bp1-animate-enter9 {
  animation: bp1-animate-enter9-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp1-animate-enter9-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.mobile .logo-platform6 {
  display: block;
  height: 80px;
  margin-left: 33px;
  width: 70px;
  opacity: 0;
}

.mobile .logo-platform6.bp1-animate-enter10 {
  animation: bp1-animate-enter10-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp1-animate-enter10-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.mobile .logo-wa {
  display: block;
  height: 80px;
  margin-left: 41px;
  margin-top: 5px;
  width: 91px;
  opacity: 0;
}

.mobile .logo-wa.bp1-animate-enter11 {
  animation: bp1-animate-enter11-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp1-animate-enter11-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.mobile .frame-21 {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  margin-top: 20px;
  min-height: 150px;
  padding: 0 21.2px;
  width: 335px;
}

.mobile .logo-cni {
  display: block;
  height: 80px;
  width: 292px;
  opacity: 0;
}

.mobile .logo-cni.bp1-animate-enter12 {
  animation: bp1-animate-enter12-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp1-animate-enter12-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.mobile .logo-mediablaze {
  align-self: center;
  display: block;
  height: 50px;
  margin-left: 1.0px;
  margin-top: 20px;
  width: 284px;
  opacity: 0;
}

.mobile .logo-mediablaze.bp1-animate-enter13 {
  animation: bp1-animate-enter13-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp1-animate-enter13-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.mobile .frame-28 {
  align-items: center;
  background-color: var(--brand2);
  display: flex;
  height: 107px;
  padding: 0 18px;
  width: 375px;
}

.mobile .hero-text-4 {
  letter-spacing: 0;
  line-height: 27px;
  margin-left: 2px;
  min-height: 27px;
  text-align: center;
  white-space: nowrap;
  width: 337px;
}
/* screen - tablet */

.tablet {
  align-items: flex-start;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  height: 2050px;
  width: 768px;
}

.tablet .overlap-group {
  height: 1394px;
  position: relative;
  width: 768px;
}

.tablet .header {
  align-items: center;
  background-color: var(--brand2);
  display: flex;
  flex-direction: column;
  height: 933px;
  left: 0;
  padding: 20px 0;
  position: absolute;
  top: 0;
  width: 768px;
}

.tablet .brand {
  display: block;
  height: 60px;
  margin-right: 15.34px;
  width: 321px;
  opacity: 0;
transform: translate(-25px, 0);
}

.tablet .brand.bp2-animate-enter {
  animation: bp2-animate-enter-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp2-animate-enter-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.tablet .menu {
  height: 27px;
  margin-right: 0;
  margin-top: 22px;
  position: relative;
  width: 686px;
  opacity: 0;
transform: translate(25px, 0);
}

.tablet .menu.bp2-animate-enter1 {
  animation: bp2-animate-enter1-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(25px, 0);
}

@keyframes bp2-animate-enter1-frames {
  from{opacity: 0;
transform: translate(25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.tablet .about {
  left: 178px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: center;
  top: 0;
  white-space: nowrap;
}

.tablet .support {
  left: 290px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: center;
  top: 0;
  white-space: nowrap;
}

.tablet .connect {
  left: 431px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  text-align: center;
  top: 0;
  white-space: nowrap;
}

.tablet .hero-text {
  letter-spacing: 0;
  line-height: 48px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 96px;
  text-align: center;
  width: 486px;
}

.tablet .hero-text-1 {
  letter-spacing: 0;
  line-height: 27px;
  margin-left: 2.0px;
  margin-top: 19px;
  min-height: 54px;
  text-align: center;
  width: 642px;
}

.tablet .overlap-group1-1 {
  height: 478px;
  margin-left: 25.59px;
  margin-top: 19px;
  position: relative;
  width: 538px;
}

.tablet .stack4 {
  height: 402px;
  left: 40px;
  position: absolute;
  top: 0;
  width: 498px;
}

.tablet .human1 {
  height: 180px;
  left: 0;
  position: absolute;
  top: 267px;
  width: 128px;
}

.tablet .buttons {
  align-items: flex-start;
  display: flex;
  height: 44px;
  left: 113px;
  position: absolute;
  top: 434px;
}

.tablet .button {
  background-color: var(--brand1);
  height: 44px;
  pointer-events: auto;
  position: relative;
  transition: all 0.2s ease;
  width: 125px;
}

.tablet .text-i13630520432 {
  height: 14px;
  left: 20px;
  letter-spacing: 0;
  line-height: 14px;
  position: absolute;
  text-align: center;
  top: 15px;
  white-space: nowrap;
}

.tablet .button-1 {
  align-items: center;
  background-color: var(--light-gray);
  display: flex;
  height: 44px;
  justify-content: flex-end;
  margin-left: 20px;
  min-width: 141px;
  padding: 0 18px;
}

.tablet .text-i13630521432 {
  height: 14px;
  letter-spacing: 0;
  line-height: 14px;
  min-width: 103px;
  text-align: center;
  white-space: nowrap;
}

.tablet .hero-tilt {
  height: 40px;
  margin-top: 40px;
  width: 768px;
}

.tablet .aim {
  align-items: flex-end;
  background-color: var(--brand3);
  display: flex;
  flex-direction: column;
  height: 497px;
  left: 0;
  padding: 20px 18px;
  position: absolute;
  top: 897px;
  width: 768px;
}

.tablet .group-23 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  margin-right: 18px;
  min-height: 122px;
  width: 692px;
}

.tablet .reclaim-hosting {
  letter-spacing: 0;
  line-height: 48px;
  min-height: 48px;
  text-align: center;
  white-space: nowrap;
  width: 690px;
  opacity: 0;
transform: translate(0, 25px);
}

.tablet .reclaim-hosting.bp2-animate-enter2 {
  animation: bp2-animate-enter2-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(0, 25px);
}

@keyframes bp2-animate-enter2-frames {
  from{opacity: 0;
transform: translate(0, 25px);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.tablet .hero-text-2 {
  letter-spacing: 0;
  line-height: 27px;
  margin-top: 20px;
  min-height: 54px;
  text-align: center;
  width: 642px;
  opacity: 0;
}

.tablet .hero-text-2.bp2-animate-enter3 {
  animation: bp2-animate-enter3-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp2-animate-enter3-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.tablet .flex-row {
  align-items: flex-start;
  display: flex;
  margin-right: 22px;
  margin-top: 74px;
  min-width: 688px;
}

.tablet .box {
  background-color: var(--white);
  box-shadow: 10px 10px 0px #00b856;
  height: 207px;
  position: relative;
  width: 335px;
  opacity: 0;
transform: translate(-25px, 0);
}

.tablet .box.bp2-animate-enter4 {
  animation: bp2-animate-enter4-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp2-animate-enter4-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.tablet .frame-4 {
  align-items: flex-end;
  display: flex;
  height: 60px;
  justify-content: flex-end;
  left: 10px;
  position: absolute;
  top: 10px;
}

.tablet .overlap-group1 {
  height: 106px;
  margin-bottom: -46px;
  position: relative;
  width: 305px;
}

.tablet .text-1 {
  left: 0;
  letter-spacing: 0;
  line-height: 48px;
  position: absolute;
  top: 10px;
  width: 247px;
}

.tablet .icon-dove {
  height: 60px;
  left: 245px;
  position: absolute;
  top: 0;
  width: 60px;
}

.tablet .text-1-1 {
  left: 20px;
  letter-spacing: 0;
  line-height: 27px;
  position: absolute;
  top: 136px;
  width: 317px;
}

.tablet .box-1 {
  background-color: var(--white);
  box-shadow: 10px 10px 0px #00b856;
  height: 207px;
  margin-left: 18px;
  position: relative;
  width: 335px;
  opacity: 0;
transform: translate(-25px, 0);
}

.tablet .box-1.bp2-animate-enter5 {
  animation: bp2-animate-enter5-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(-25px, 0);
}

@keyframes bp2-animate-enter5-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.tablet .text-15 {
  letter-spacing: 0;
  line-height: 24px;
  margin-top: 30px;
  min-height: 24px;
  text-align: center;
  white-space: nowrap;
  width: 730px;
  opacity: 0;
}

.tablet .text-15.bp2-animate-enter6 {
  animation: bp2-animate-enter6-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp2-animate-enter6-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.tablet .frame-25 {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: 549px;
  width: 768px;
}

.tablet .overlap-group2 {
  height: 100px;
  position: relative;
  width: 768px;
}

.tablet .hero-tilt-1 {
  height: 40px;
  left: 0;
  position: absolute;
  top: 60px;
  width: 768px;
}

.tablet .frame-26 {
  background-color: var(--brand3);
  height: 60px;
  left: 0;
  position: absolute;
  top: 0;
  width: 768px;
}

.tablet .human2 {
  height: 100px;
  left: 333px;
  position: absolute;
  top: 0;
  width: 102px;
}

.tablet .a-joint-mission {
  letter-spacing: 0;
  line-height: 48px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 48px;
  text-align: center;
  white-space: nowrap;
  width: 730px;
  opacity: 0;
transform: translate(0, 25px);
}

.tablet .a-joint-mission.bp2-animate-enter7 {
  animation: bp2-animate-enter7-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
transform: translate(0, 25px);
}

@keyframes bp2-animate-enter7-frames {
  from{opacity: 0;
transform: translate(0, 25px);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.tablet .hero-text-3 {
  letter-spacing: 0;
  line-height: 27px;
  margin-left: 2.0px;
  margin-top: 20px;
  min-height: 54px;
  text-align: center;
  width: 642px;
  opacity: 0;
}

.tablet .hero-text-3.bp2-animate-enter8 {
  animation: bp2-animate-enter8-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp2-animate-enter8-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.tablet .frame-20 {
  align-items: flex-start;
  display: flex;
  height: 100px;
  justify-content: flex-end;
  margin-top: 47px;
  min-width: 640px;
}

.tablet .logo-autonomic {
  display: block;
  height: 80px;
  width: 99px;
  opacity: 0;
}

.tablet .logo-autonomic.bp2-animate-enter9 {
  animation: bp2-animate-enter9-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp2-animate-enter9-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.tablet .logo-platform6 {
  display: block;
  height: 80px;
  margin-left: 186px;
  width: 70px;
  opacity: 0;
}

.tablet .logo-platform6.bp2-animate-enter10 {
  animation: bp2-animate-enter10-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp2-animate-enter10-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.tablet .logo-wa {
  display: block;
  height: 80px;
  margin-left: 194px;
  margin-top: 5px;
  width: 91px;
  opacity: 0;
}

.tablet .logo-wa.bp2-animate-enter11 {
  animation: bp2-animate-enter11-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp2-animate-enter11-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.tablet .frame-21 {
  align-items: center;
  display: flex;
  margin-top: 20px;
  min-width: 640px;
}

.tablet .logo-cni {
  display: block;
  height: 80px;
  width: 292px;
  opacity: 0;
}

.tablet .logo-cni.bp2-animate-enter12 {
  animation: bp2-animate-enter12-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp2-animate-enter12-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.tablet .logo-mediablaze {
  display: block;
  height: 50px;
  margin-left: 64px;
  margin-top: 0;
  width: 284px;
  opacity: 0;
}

.tablet .logo-mediablaze.bp2-animate-enter13 {
  animation: bp2-animate-enter13-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes bp2-animate-enter13-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.tablet .frame-28 {
  align-items: center;
  background-color: var(--brand2);
  display: flex;
  height: 107px;
  padding: 0 38px;
  width: 768px;
}

.tablet .hero-text-4 {
  letter-spacing: 0;
  line-height: 27px;
  margin-left: 2px;
  min-height: 27px;
  text-align: center;
  white-space: nowrap;
  width: 690px;
}
@media screen and (max-width: 767px) {
  .screen.desktop { 
    display: none;
   }
  .screen.tablet { 
    display: none;
   }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
  .screen.desktop { 
    display: none;
   }
  .screen.mobile { 
    display: none;
   }
}
@media screen and (min-width: 1280px) {
  .screen.mobile { 
    display: none;
   }
  .screen.tablet { 
    display: none;
   }
}