/* screen - ovisuals-all-breakpoints */

.ovisuals-all-breakpoints {
  align-items: center;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  min-height: 17037px;
  width: 980px;
}

.ovisuals-all-breakpoints .o-start {
  align-items: flex-start;
  cursor: pointer;
  display: flex;
  margin-top: -1px;
  min-width: 980px;
  transition: all 0.2s ease-in-out;
}

.ovisuals-all-breakpoints .o-start:hover {
  opacity: .7;
}

.ovisuals-all-breakpoints .ux {
  font-weight: 900;
  height: 439px;
  letter-spacing: 0;
  line-height: 439px;
  opacity: 0;
  text-align: center;
  white-space: nowrap;
  width: 980px;
}

.ovisuals-all-breakpoints .ux.bp1-animate-enter107 {
  animation: bp1-animate-enter107-frames 0.50s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .big-text {
  align-items: flex-start;
  display: flex;
  margin-top: 60px;
  min-width: 692px;
}

.ovisuals-all-breakpoints .title {
  font-weight: 700;
  height: 124px;
  letter-spacing: 0;
  line-height: 96px;
  text-align: center;
  width: 692px;
}

.ovisuals-all-breakpoints .portfolio-components-15 {
  align-self: flex-start;
  display: block;
  height: 390px;
  margin-left: 76px;
  margin-top: 83px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-15.bp1-animate-enter95 {
  animation: bp1-animate-enter95-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-container {
  align-items: flex-start;
  display: flex;
  margin-top: 120px;
  min-width: 828px;
}

.ovisuals-all-breakpoints .portfolio-components-21 {
  display: block;
  height: 390px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-21.bp1-animate-enter89 {
  animation: bp1-animate-enter89-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-22 {
  display: block;
  height: 390px;
  margin-left: 48px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-22.bp1-animate-enter90 {
  animation: bp1-animate-enter90-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-5 {
  display: block;
  height: 390px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-5.bp1-animate-enter106 {
  animation: bp1-animate-enter106-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-4 {
  display: block;
  height: 390px;
  margin-left: 48px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-4.bp1-animate-enter105 {
  animation: bp1-animate-enter105-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-19 {
  display: block;
  height: 390px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-19.bp1-animate-enter92 {
  animation: bp1-animate-enter92-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-20 {
  display: block;
  height: 390px;
  margin-left: 48px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-20.bp1-animate-enter91 {
  animation: bp1-animate-enter91-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-16 {
  display: block;
  height: 828px;
  margin-top: 120px;
  opacity: 0;
  width: 828px;
}

.ovisuals-all-breakpoints .portfolio-components-16.bp1-animate-enter103 {
  animation: bp1-animate-enter103-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-18 {
  display: block;
  height: 390px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-18.bp1-animate-enter93 {
  animation: bp1-animate-enter93-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-17 {
  display: block;
  height: 390px;
  margin-left: 48px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-17.bp1-animate-enter94 {
  animation: bp1-animate-enter94-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-7 {
  align-self: flex-start;
  display: block;
  height: 277px;
  margin-left: 76px;
  margin-top: 240px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-7.bp1-animate-enter96 {
  animation: bp1-animate-enter96-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-2 {
  display: block;
  height: 273px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-2.bp1-animate-enter104 {
  animation: bp1-animate-enter104-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-10 {
  display: block;
  height: 277px;
  margin-left: 48px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-10.bp1-animate-enter97 {
  animation: bp1-animate-enter97-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-9 {
  display: block;
  height: 588px;
  margin-top: 120px;
  opacity: 0;
  width: 828px;
}

.ovisuals-all-breakpoints .portfolio-components-9.bp1-animate-enter102 {
  animation: bp1-animate-enter102-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-11 {
  display: block;
  height: 279px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-11.bp1-animate-enter99 {
  animation: bp1-animate-enter99-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-14 {
  display: block;
  height: 279px;
  margin-left: 48px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-14.bp1-animate-enter98 {
  animation: bp1-animate-enter98-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-13 {
  display: block;
  height: 279px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-13.bp1-animate-enter100 {
  animation: bp1-animate-enter100-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .portfolio-components-12 {
  display: block;
  height: 279px;
  margin-left: 48px;
  opacity: 0;
  width: 390px;
}

.ovisuals-all-breakpoints .portfolio-components-12.bp1-animate-enter101 {
  animation: bp1-animate-enter101-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .big-text-1 {
  align-items: flex-start;
  display: flex;
  margin-top: 299px;
  min-width: 692px;
}

.ovisuals-all-breakpoints .task-desktop-header {
  display: block;
  height: 1165px;
  margin-top: 76px;
  opacity: 0;
  width: 980px;
}

.ovisuals-all-breakpoints .task-desktop-header.bp1-animate-enter62 {
  animation: bp1-animate-enter62-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .x-desktop-container {
  align-items: flex-start;
  display: flex;
  min-width: 980px;
}

.ovisuals-all-breakpoints .task-desktop-1 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-1.bp1-animate-enter63 {
  animation: bp1-animate-enter63-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-2 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-2.bp1-animate-enter64 {
  animation: bp1-animate-enter64-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-3 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-3.bp1-animate-enter65 {
  animation: bp1-animate-enter65-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-4 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-4.bp1-animate-enter66 {
  animation: bp1-animate-enter66-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-5 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-5.bp1-animate-enter67 {
  animation: bp1-animate-enter67-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-6 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-6.bp1-animate-enter68 {
  animation: bp1-animate-enter68-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-7 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-7.bp1-animate-enter69 {
  animation: bp1-animate-enter69-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-8 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-8.bp1-animate-enter70 {
  animation: bp1-animate-enter70-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-9 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-9.bp1-animate-enter71 {
  animation: bp1-animate-enter71-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-10 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-10.bp1-animate-enter72 {
  animation: bp1-animate-enter72-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-11 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-11.bp1-animate-enter73 {
  animation: bp1-animate-enter73-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-12 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-12.bp1-animate-enter74 {
  animation: bp1-animate-enter74-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .task-desktop-14 {
  align-self: flex-end;
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .task-desktop-14.bp1-animate-enter75 {
  animation: bp1-animate-enter75-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .rectangle {
  background-color: var(--white);
  height: 240px;
  margin-left: 180.0px;
  width: 132px;
}

.ovisuals-all-breakpoints .big-text-2 {
  align-items: flex-start;
  display: flex;
  margin-top: 59px;
  min-width: 692px;
}

.ovisuals-all-breakpoints .see-desktop-header {
  display: block;
  height: 1165px;
  margin-top: 83px;
  opacity: 0;
  width: 980px;
}

.ovisuals-all-breakpoints .see-desktop-header.bp1-animate-enter76 {
  animation: bp1-animate-enter76-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-1 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-1.bp1-animate-enter77 {
  animation: bp1-animate-enter77-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-2 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-2.bp1-animate-enter78 {
  animation: bp1-animate-enter78-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-3 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-3.bp1-animate-enter79 {
  animation: bp1-animate-enter79-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-4 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-4.bp1-animate-enter80 {
  animation: bp1-animate-enter80-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-5 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-5.bp1-animate-enter81 {
  animation: bp1-animate-enter81-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-6 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-6.bp1-animate-enter82 {
  animation: bp1-animate-enter82-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-7 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-7.bp1-animate-enter83 {
  animation: bp1-animate-enter83-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-8 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-8.bp1-animate-enter84 {
  animation: bp1-animate-enter84-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-9 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-9.bp1-animate-enter85 {
  animation: bp1-animate-enter85-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-10 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-10.bp1-animate-enter86 {
  animation: bp1-animate-enter86-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .overlap-group {
  height: 958px;
  position: relative;
  width: 980px;
}

.ovisuals-all-breakpoints .see-desktop-11 {
  display: block;
  height: 520px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-11.bp1-animate-enter87 {
  animation: bp1-animate-enter87-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .see-desktop-12 {
  display: block;
  height: 520px;
  left: 490px;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 490px;
}

.ovisuals-all-breakpoints .see-desktop-12.bp1-animate-enter88 {
  animation: bp1-animate-enter88-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .o-end {
  cursor: pointer;
  height: 439px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 519px;
  transition: all 0.2s ease-in-out;
  width: 980px;
}

.ovisuals-all-breakpoints .o-end.bp1-animate-enter109 {
  animation: bp1-animate-enter109-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

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

.ovisuals-all-breakpoints .o-end:hover {
  opacity: 0.7;
}

.ovisuals-all-breakpoints .ux-1 {
  font-weight: 900;
  height: 439px;
  left: 0;
  letter-spacing: 0;
  line-height: 439px;
  opacity: 0;
  position: absolute;
  text-align: center;
  top: 0;
  white-space: nowrap;
  width: 980px;
}

.ovisuals-all-breakpoints .ux-1.bp1-animate-enter108 {
  animation: bp1-animate-enter108-frames 0.50s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp1-animate-enter108-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}
/* screen - ovisualsmobile */

.ovisualsmobile {
  align-items: center;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  min-height: 13641px;
  width: 390px;
}

.ovisualsmobile .huge-text-copy-3 {
  align-items: flex-start;
  cursor: pointer;
  display: flex;
  min-width: 390px;
  transition: all 0.2s ease-in-out;
}

.ovisualsmobile .huge-text-copy-3:hover {
  opacity: 0.7;
}

.ovisualsmobile .ux-2 {
  font-weight: 900;
  height: 175px;
  letter-spacing: 0;
  line-height: 174.7px;
  opacity: 0;
  text-align: center;
  white-space: nowrap;
  width: 390px;
}

.ovisualsmobile .ux-2.bp2-animate-enter79 {
  animation: bp2-animate-enter79-frames 0.50s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

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

.ovisualsmobile .big-text-3 {
  align-items: flex-start;
  display: flex;
  margin-right: 1.0px;
  margin-top: 59px;
  min-width: 275px;
}

.ovisualsmobile .title-1 {
  font-weight: 700;
  height: 49px;
  letter-spacing: 0;
  line-height: 38px;
  text-align: center;
  width: 275px;
}

.ovisualsmobile .task-mobile-1 {
  display: block;
  height: 520px;
  margin-top: 34px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-1.bp2-animate-enter63 {
  animation: bp2-animate-enter63-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-2 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-2.bp2-animate-enter64 {
  animation: bp2-animate-enter64-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-3 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-3.bp2-animate-enter65 {
  animation: bp2-animate-enter65-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-4 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-4.bp2-animate-enter66 {
  animation: bp2-animate-enter66-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-5 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-5.bp2-animate-enter67 {
  animation: bp2-animate-enter67-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-6 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-6.bp2-animate-enter68 {
  animation: bp2-animate-enter68-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-7 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-7.bp2-animate-enter69 {
  animation: bp2-animate-enter69-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-container {
  height: 1023px;
  position: relative;
  width: 390px;
}

.ovisualsmobile .task-mobile-9 {
  display: block;
  height: 520px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 503px;
  width: 390px;
}

.ovisualsmobile .task-mobile-9.bp2-animate-enter54 {
  animation: bp2-animate-enter54-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-8 {
  display: block;
  height: 520px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-8.bp2-animate-enter70 {
  animation: bp2-animate-enter70-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-10 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-10.bp2-animate-enter55 {
  animation: bp2-animate-enter55-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-11 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-11.bp2-animate-enter56 {
  animation: bp2-animate-enter56-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-12 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-12.bp2-animate-enter57 {
  animation: bp2-animate-enter57-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .task-mobile-13 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .task-mobile-13.bp2-animate-enter58 {
  animation: bp2-animate-enter58-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .big-text-4 {
  align-items: flex-start;
  display: flex;
  margin-right: 1.0px;
  margin-top: 83px;
  min-width: 275px;
}

.ovisualsmobile .see-mobile-1 {
  display: block;
  height: 520px;
  margin-top: 34px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-1.bp2-animate-enter59 {
  animation: bp2-animate-enter59-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-2 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-2.bp2-animate-enter60 {
  animation: bp2-animate-enter60-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-3 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-3.bp2-animate-enter61 {
  animation: bp2-animate-enter61-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-4 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-4.bp2-animate-enter62 {
  animation: bp2-animate-enter62-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-5 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-5.bp2-animate-enter71 {
  animation: bp2-animate-enter71-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-6 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-6.bp2-animate-enter72 {
  animation: bp2-animate-enter72-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-7 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-7.bp2-animate-enter73 {
  animation: bp2-animate-enter73-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-8 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-8.bp2-animate-enter74 {
  animation: bp2-animate-enter74-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-9 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-9.bp2-animate-enter75 {
  animation: bp2-animate-enter75-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-10 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-10.bp2-animate-enter76 {
  animation: bp2-animate-enter76-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-11 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-11.bp2-animate-enter77 {
  animation: bp2-animate-enter77-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .see-mobile-12 {
  display: block;
  height: 520px;
  opacity: 0;
  width: 390px;
}

.ovisualsmobile .see-mobile-12.bp2-animate-enter78 {
  animation: bp2-animate-enter78-frames 0.30s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

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

.ovisualsmobile .ux-3 {
  font-weight: 900;
  height: 175px;
  letter-spacing: 0;
  line-height: 174.7px;
  opacity: 0;
  text-align: center;
  white-space: nowrap;
  width: 390px;
}

.ovisualsmobile .ux-3.bp2-animate-enter80 {
  animation: bp2-animate-enter80-frames 0.50s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes bp2-animate-enter80-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}
@media screen and (max-width: 979px) {
  .screen.ovisuals-all-breakpoints { 
    display: none;
   }
}
@media screen and (min-width: 980px) {
  .screen.ovisualsmobile { 
    display: none;
   }
}