1936 lines
32 KiB
CSS
1936 lines
32 KiB
CSS
/* 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;
|
|
}
|
|
}
|