@font-face {
                          font-family: "SFProText-Semibold";
                          src: url('../fonts/SF-Pro-Text-Semibold.otf') format("opentype");
                        }
                        @font-face {
                          font-family: "SFProText-Light";
                          src: url('../fonts/SF-Pro-Text-Light.otf') format("opentype");
                        }
                        @font-face {
                          font-family: "SFProText-Medium";
                          src: url('../fonts/SF-Pro-Text-Medium.otf') format("opentype");
                        }
                        @font-face {
                          font-family: "SFCompactText-Medium";
                          src: url('../fonts/SF-Compact-Text-Medium.otf') format("opentype");
                        }
                        @font-face {
                          font-family: "SFProDisplay-Medium";
                          src: url('../fonts/SF-Pro-Display-Medium.otf') format("opentype");
                        }
                        @font-face {
                          font-family: "SFProText-Regular";
                          src: url('../fonts/SF-Pro-Text-Regular.otf') format("opentype");
                        }
                        
.desktop {
  width               : 100%;
  min-width           : 1335px;
  height              : 100vh;
  min-height          : 1447px;
  position            : relative;
  overflow            : hidden;
  margin              : 0px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color    : rgba(255, 255, 255, 1.0);
  opacity             : 1.0;
}
a {
  text-decoration     : none;
}
div {
  -webkit-text-size-adjust: none;
}
.anima-full-width-a {
  width               : 100%;
}
.anima-full-height-a {
  height              : 100%;
}
div {
  -webkit-text-size-adjust: none;
}
.desktop .bg {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : calc(100.00% - 917px);
  width               : 100%;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group3 {
  background-color    : rgba(255,255,255,0.0);
  top                 : -12px;
  height              : 605px;
  width               : 1359px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group3 .group2 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : 605px;
  width               : 1359px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group3 .group2 .path {
  background-color    : rgba(255,255,255,0.0);
  right               : 0px;
  bottom              : 0px;
  height              : 188px;
  width               : 885px;
  position            : absolute;
  margin              : 0;
  transform           : rotate(0deg);
  opacity             : 0.62;
}
.desktop .group3 .group2 .group {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : 168px;
  width               : 172px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group3 .group2 .group .path2 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 12px;
  height              : 156px;
  width               : 172px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 0.59;
}
.desktop .group3 .group2 .group .path21 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : 108px;
  width               : 112px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 0.33;
}
.desktop .group3 .screens {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : 545px;
  width               : 915px;
  position            : absolute;
  margin              : 0;
  left                : 376px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group3 .screens .bitmap {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : 241px;
  width               : 326px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .group3 .screens .bitmap {
  pointer-events      : auto;
}
.desktop .group3 .screens .bitmap:hover {
  transform           : scale(0.9);
}
.desktop .group3 .screens .bitmap1 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 250px;
  height              : 295px;
  width               : 326px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .group3 .screens .bitmap1 {
  pointer-events      : auto;
}
.desktop .group3 .screens .bitmap1:hover {
  transform           : scale(0.9);
}
.desktop .group3 .screens .bitmap2 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 250px;
  height              : 293px;
  width               : 326px;
  position            : absolute;
  margin              : 0;
  left                : 332px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .group3 .screens .bitmap2 {
  pointer-events      : auto;
}
.desktop .group3 .screens .bitmap2:hover {
  transform           : scale(0.9);
}
.desktop .group3 .screens .bitmap3 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : 243px;
  width               : 326px;
  position            : absolute;
  margin              : 0;
  left                : 332px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .group3 .screens .bitmap3 {
  pointer-events      : auto;
}
.desktop .group3 .screens .bitmap3:hover {
  transform           : scale(0.9);
}
.desktop .group3 .screens .bitmap4 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 2px;
  height              : 541px;
  width               : 251px;
  position            : absolute;
  margin              : 0;
  left                : 664px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .group3 .screens .bitmap4 {
  pointer-events      : auto;
}
.desktop .group3 .screens .bitmap4:hover {
  transform           : scale(0.9);
}
.desktop .group3 .intro {
  background-color    : rgba(255,255,255,0.0);
  top                 : 193px;
  height              : 214px;
  width               : 280px;
  position            : absolute;
  margin              : 0;
  left                : 40px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group3 .intro .ipadianstudio {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : auto;
  width               : auto;
  position            : absolute;
  margin              : 0;
  left                : -1px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProText-Semibold", Helvetica, Arial, serif;
  font-size           : 40.0px;
  color               : rgba(255, 255, 255, 1.0);
  text-align          : center;
  letter-spacing      : -1.3px;
  line-height         : 45.0px;
}
.desktop .group3 .intro .enjoyaccessthe100 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 58px;
  height              : auto;
  width               : 266px;
  position            : absolute;
  margin              : 0;
  left                : 16px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProText-Light", Helvetica, Arial, serif;
  font-size           : 17.0px;
  color               : rgba(228, 228, 228, 1.0);
  text-align          : left;
  letter-spacing      : -0.38px;
  line-height         : 22.0px;
}
.desktop .group3 .intro .button1 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 137px;
  height              : 43px;
  width               : 152px;
  position            : absolute;
  margin              : 0;
  left                : 46px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .group3 .intro .button1 {
  pointer-events      : auto;
}
.desktop .group3 .intro .button1:hover {
  transform           : scale(1.1);
}
.desktop .group3 .intro .button1 .rectangle {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : 43px;
  width               : 152px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  border-radius       : 12px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group3 .intro .button1 .buynow {
  background-color    : rgba(255,255,255,0.0);
  top                 : 10px;
  height              : auto;
  width               : auto;
  position            : absolute;
  margin              : 0;
  left                : 37px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProText-Medium", Helvetica, Arial, serif;
  font-size           : 17.0px;
  color               : rgba(228, 228, 228, 1.0);
  text-align          : left;
  letter-spacing      : -0.38px;
  line-height         : 20.0px;
}
.desktop .group5 {
  background-color    : rgba(255,255,255,0.0);
  position            : relative;
  height              : 100%;
  width               : 899px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group5-layout-container {
  pointer-events      : none;
  flex-direction      : column;
  top                 : 564px;
  align-items         : center;
  height              : 814px;
  width               : 100%;
  position            : absolute;
  margin              : 0;
  display             : flex;
  left                : 0;
}
.desktop .group5-layout-container > * {
  pointer-events      : auto;
}
.desktop .group5 .rectangle {
  background-color    : rgba(255,255,255,0.0);
  flex-direction      : row;
  top                 : 0px;
  align-items         : center;
  height              : 814px;
  width               : 377px;
  justify-content     : center;
  position            : absolute;
  flex-wrap           : wrap;
  margin              : 0;
  display             : flex;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group5 .icon {
  background-color    : rgba(255,255,255,0.0);
  top                 : 70px;
  height              : 128px;
  width               : 128px;
  position            : absolute;
  margin              : 0;
  left                : 398px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group5 .instagramlogo {
  background-color    : rgba(255,255,255,0.0);
  top                 : 213px;
  height              : 28px;
  width               : 105px;
  position            : absolute;
  margin              : 0;
  left                : 410px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group5 .group4 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 331px;
  height              : 65px;
  width               : 168px;
  position            : absolute;
  margin              : 0;
  left                : 397px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .group5 .group4 {
  pointer-events      : auto;
}
.desktop .group5 .group4:hover {
  transform           : translate(0, -5px);
  box-shadow          : 0px 12px 5px -8px rgba(0,0,0,0.2);
}
.desktop .group5 .group4 .rectangle1 {
  background-color    : rgba(250, 250, 250, 1.0);
  top                 : 0px;
  height              : 65px;
  box-sizing          : border-box;
  width               : 168px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  border-radius       : 12px;
  border-style        : solid;
  border-width        : 1px;
  border-color        : rgba(231, 231, 231, 1.0);
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group5 .group4 .swift {
  background-color    : rgba(255,255,255,0.0);
  top                 : 20px;
  height              : auto;
  width               : auto;
  position            : absolute;
  margin              : 0;
  left                : 68px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFCompactText-Medium", Helvetica, Arial, serif;
  font-size           : 21.0px;
  color               : rgba(75, 75, 75, 1.0);
  text-align          : left;
  letter-spacing      : -0.47px;
  line-height         : 25.0px;
}
.desktop .group5 .group4 .bitmap {
  background-color    : rgba(255,255,255,0.0);
  top                 : 16px;
  height              : 34px;
  width               : 38px;
  position            : absolute;
  margin              : 0;
  left                : 16px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group5 .group41 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 332px;
  height              : 63px;
  width               : 187px;
  position            : absolute;
  margin              : 0;
  left                : 573px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .group5 .group41 {
  pointer-events      : auto;
}
.desktop .group5 .group41:hover {
  transform           : translate(0, -5px);
  box-shadow          : 0px 12px 5px -8px rgba(0,0,0,0.2);
}
.desktop .group5 .group41 .rectangle1 {
  background-color    : rgba(73, 143, 225, 1.0);
  top                 : 0px;
  height              : 63px;
  width               : 187px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  border-radius       : 12px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group5 .group41 .reactnative {
  background-color    : rgba(255,255,255,0.0);
  top                 : 19px;
  height              : auto;
  width               : auto;
  position            : absolute;
  margin              : 0;
  left                : 62px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProDisplay-Medium", Helvetica, Arial, serif;
  font-size           : 21.0px;
  color               : rgba(255, 255, 255, 1.0);
  text-align          : left;
  letter-spacing      : -0.47px;
  line-height         : 25.0px;
}
.desktop .group5 .group41 .bitmap {
  background-color    : rgba(255,255,255,0.0);
  top                 : 11px;
  height              : 41px;
  width               : 41px;
  position            : absolute;
  margin              : 0;
  left                : 11px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group5 .downloadsourcecode {
  background-color    : rgba(255,255,255,0.0);
  top                 : 295px;
  height              : auto;
  width               : auto;
  position            : absolute;
  margin              : 0;
  left                : 400px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProText-Regular", Helvetica, Arial, serif;
  font-size           : 17.0px;
  color               : rgba(0, 0, 0, 1.0);
  text-align          : left;
  letter-spacing      : -0.41px;
  line-height         : 22.0px;
}
.desktop .group5 .howdoesitwork {
  background-color    : rgba(255,255,255,0.0);
  top                 : 436px;
  height              : auto;
  width               : auto;
  position            : absolute;
  margin              : 0;
  left                : 399px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProText-Medium", Helvetica, Arial, serif;
  font-size           : 22.0px;
  color               : rgba(0, 0, 0, 1.0);
  text-align          : center;
  letter-spacing      : -0.71px;
  line-height         : 45.0px;
}
.desktop .group5 .ipadianstudioisso {
  background-color    : rgba(255,255,255,0.0);
  top                 : 486px;
  height              : auto;
  width               : 500px;
  position            : absolute;
  margin              : 0;
  left                : 400px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProText-Regular", Helvetica, Arial, serif;
  font-size           : 17.0px;
  color               : rgba(0, 0, 0, 1.0);
  text-align          : left;
  letter-spacing      : -0.41px;
  line-height         : 22.0px;
}
.desktop .button {
  background-color    : rgba(255,255,255,0.0);
  top                 : 1151px;
  height              : 43px;
  width               : 152px;
  position            : absolute;
  margin              : 0;
  left                : 615px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  transition          : all 0.2s ease-in-out;
}
.desktop .button {
  pointer-events      : auto;
}
.desktop .button:hover {
  transform           : scale(1.1);
}
.desktop .button .rectangle {
  background-color    : rgba(255,255,255,0.0);
  top                 : 0px;
  height              : 43px;
  width               : 152px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  border-radius       : 12px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .button .buynow {
  background-color    : rgba(255,255,255,0.0);
  top                 : 10px;
  height              : auto;
  width               : auto;
  position            : absolute;
  margin              : 0;
  left                : 37px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProText-Medium", Helvetica, Arial, serif;
  font-size           : 17.0px;
  color               : rgba(255, 255, 255, 1.0);
  text-align          : left;
  letter-spacing      : -0.38px;
  line-height         : 20.0px;
}
.desktop .ipadianstudiofree {
  background-color    : rgba(255,255,255,0.0);
  top                 : 834px;
  height              : auto;
  width               : auto;
  position            : absolute;
  margin              : 0;
  left                : 615px;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFProText-Semibold", Helvetica, Arial, serif;
  font-size           : 17.0px;
  color               : rgba(0, 0, 0, 1.0);
  text-align          : left;
  letter-spacing      : -0.41px;
  line-height         : 22.0px;
}
.desktop .group6 {
  background-color    : rgba(255,255,255,0.0);
  top                 : 1402px;
  height              : 45px;
  width               : 1335px;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group6 .rectangle {
  background-color    : rgba(0, 0, 0, 1.0);
  bottom              : 0px;
  height              : 45px;
  width               : 100%;
  position            : absolute;
  margin              : 0;
  left                : 0px;
  transform           : rotate(0deg);
  opacity             : 1.0;
}
.desktop .group6 .ipadianstudio {
  background-color    : rgba(255,255,255,0.0);
  position            : relative;
  height              : auto;
  width               : auto;
  transform           : rotate(0deg);
  opacity             : 1.0;
  font-family         : "SFCompactText-Medium", Helvetica, Arial, serif;
  font-size           : 21.0px;
  color               : rgba(255, 255, 255, 1.0);
  text-align          : left;
  letter-spacing      : -0.47px;
  line-height         : 25.0px;
}
.desktop .group6 .ipadianstudio-layout-container {
  pointer-events      : none;
  flex-direction      : column;
  top                 : 10px;
  align-items         : center;
  height              : auto;
  width               : 100%;
  position            : absolute;
  margin              : 0;
  display             : flex;
  left                : 0;
}
.desktop .group6 .ipadianstudio-layout-container > * {
  pointer-events      : auto;
}
/* .anima-animate-appear prefix for appear animations */
.anima-animate-appear {
  opacity             : 0;
  display             : block;
  -webkit-animation   : anima-reveal 0.3s ease-in-out 1 normal forwards;
  -moz-animation      : anima-reveal 0.3s ease-in 1 normal forwards;
  -o-animation        : anima-reveal 0.3s ease-in-out 1 normal forwards;
  animation           : anima-reveal 0.3s ease-in-out 1 normal forwards;
}
.anima-animate-disappear {
  opacity             : 1;
  display             : block;
  -webkit-animation   : anima-reveal 0.3s ease-in-out 1 reverse forwards;
  -moz-animation      : anima-reveal 0.3s ease-in 1 normal forwards;
  -o-animation        : anima-reveal 0.3s ease-in-out 1 reverse forwards;
  animation           : anima-reveal 0.3s ease-in-out 1 reverse forwards;
}
.anima-animate-nodelay {
  -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  -o-animation-delay  : 0;
  animation-delay     : 0;
}
@-webkit-keyframes anima-reveal {
  0%
   
  {
      opacity: 0;
    }
  
    
  100%
   
  {
      opacity: 1;
    }
}
@-moz-keyframes anima-reveal {
  0%
   
  {
      opacity: 0;
    }
  
    
  100%
   
  {
      opacity: 1;
    }
}
@-o-keyframes anima-reveal {
  0%
   
  {
      opacity: 0;
    }
  
    
  100%
   
  {
      opacity: 1;
    }
}
@keyframes anima-reveal {
  0%
   
  {
      opacity: 0;
    }
  
    
  100%
   
  {
      opacity: 1;
    }
}
.anima-component-wrapper,
.anima-component-wrapper * {
  pointer-events      : none;
}
.anima-component-wrapper a *,
.anima-component-wrapper a,
.anima-component-wrapper input,
.anima-component-wrapper video,
.anima-component-wrapper iframe,
.anima-listeners-active,
.anima-listeners-active * {
  pointer-events      : auto;
}
.anima-hidden,
.anima-hidden * {
  visibility          : hidden;
  pointer-events      : none;
}
.anima-smart-layers-pointers,
.anima-smart-layers-pointers * {
  pointer-events      : auto;
  visibility          : visible;
}
.anima-component-wrapper.anima-not-ready,
.anima-component-wrapper.anima-not-ready * {
  visibility          : hidden !important;
}
.anima-listeners-active-click,
.anima-listeners-active-click * {
  cursor              : pointer;
}