* {
  box-sizing : border-box;
  }
  html, body {
  height : 100%;
  width : 100%;
  overflow : hidden;
  }
  .fun {
  width : 100vw;
  height : 100vh;
  margin-left : 0%;
  border-radius : 0%;
  margin-top : 0%;
  transition : 0.5s;
  transform : rotate(0deg);
  visibility : visible;
  }
  .notfun {
  margin-left : 50%;
  margin-top : 30%;
  transition : 0.5s;
  width : 0;
  height : 0;
  border-radius : 50%;
  transform : rotate(1000deg);
  overflow : hidden;
  }
  body {
  text-rendering : optimizeLegibility;
  cursor : url(heart2.gif), auto;
  }
  .images {
  height : 100%;
  width : 100%;
  position : relative;
  display : block;
  margin : 0;
  }
  .gradient {
  position : fixed;
  top : 0;
  left : 0;
  height : 100%;
  width : 100%;
  background : radial-gradient(at center, rgb(253, 108, 188), rgb(255, 217, 0), #53eaf5);
  z-index : 0;
  mix-blend-mode : soft-light;
  }
  .flower1 {
  height : 15vh;
  width : 10vh;
  background-image : url("flowers2.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  left : 40%;
  bottom : 3%;
  position : absolute;
  z-index : 5;
  }
  .flower2 {
  height : 15vh;
  width : 10vh;
  background-image : url("flowers2.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  left : 45%;
  bottom : 3%;
  position : absolute;
  z-index : 5;
  }
  .flower3 {
  height : 15vh;
  width : 10vh;
  background-image : url("flowers2.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  left : 50%;
  bottom : 3%;
  position : absolute;
  z-index : 5;
  }
  .sun {
  height : 15vh;
  width : 55vh;
  background-image : url("sun2.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  left : -7%;
  top : 5%;
  position : absolute;
  }
  .pigonrose {
  height : 20vh;
  width : 20vh;
  background-image : url("pigonrose.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  left : 3%;
  top : -1%;
  position : absolute;
  }
  .amore2 {
  height : 15vh;
  width : 15vh;
  background-image : url("heartbouncing.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  top : 25%;
  left : 72%;
  position : absolute;
  }
  .church {
  height : 35vh;
  width : 35vh;
  background-image : url("church2.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  top : 62%;
  left : 75%;
  position : absolute;
  z-index : 3;
  }
  .lastplz {
  height : 20vh;
  width : 20vh;
  background-image : url("flies.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 60%;
  left : 0%;
  position : absolute;
  mix-blend-mode : difference;
  }
  .last2plz {
  height : 40vh;
  width : 55vh;
  background-image : url("h_03.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  top : 0%;
  left : 70%;
  position : absolute;
  mix-blend-mode : overlay;
  }
  .sunny {
  height : 40vh;
  width : 40vh;
  background-image : url("Sun Gif (7).gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  top : 35%;
  left : 75%;
  position : absolute;
  }
  .butnf {
  height : 15vh;
  width : 15vh;
  background-image : url("butnf.gif");
  background-size : 100% 100%;
  background-repeat : no-repeat;
  top : 83%;
  left : 63%;
  position : absolute;
  z-index : 3;
  }
  .rosescolor {
  height : 35vh;
  width : 20vw;
  background-image : url("rosescolor.gif");
  background-size : contain;
  background-repeat : no-repeat;
  left : 20%;
  top : -2%;
  position : absolute;
  transform : rotateZ(90deg);
  }
  .welcome {
  width : 70vw;
  height : 30vh;
  background-image : url("keller.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  position : absolute;
  left : 15%;
  top : 3%;
  z-index : 2;
  }
  .lots {
  width : 60vw;
  height : 10vh;
  background-image : url("lots\ of\ hearts\ .gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  position : absolute;
  left : 20%;
  top : 18%;
  }
  .middle {
  width : 100vw;
  height : 100vh;
  position : relative;
  }
  .rainbow {
  width : 110vh;
  height : 100vh;
  left : 19%;
  top : 15%;
  background-image : url("rainbow3.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  position : absolute;
  }
  .sister {
  height : 30vh;
  width : 100vh;
  border-radius : 200px 200px 0 0;
  background-image : url("sister3.png");
  background-size : 60% auto;
  background-repeat : no-repeat;
  position : absolute;
  left : 34%;
  top : 40%;
  mix-blend-mode : screen;
  display : block;
  }
  .ontop {
  height : 30vh;
  width : 100vh;
  border-radius : 200px 200px 0 0;
  background-image : url("back.gif");
  background-size : 60% auto;
  background-repeat : no-repeat;
  left : 34%;
  top : 40%;
  position : absolute;
  mix-blend-mode : overlay;
  display : block;
  }
  .clouds {
  width : 200vh;
  height : 100vh;
  position : relative;
  }
  .cloud1 {
  height : 100vh;
  width : 100vh;
  background-image : url("cloud.gif");
  background-size : 43% auto;
  background-repeat : no-repeat;
  left : 12%;
  top : 60%;
  position : absolute;
  z-index : 2;
  display : block;
  }
  .cloud2 {
  height : 100vh;
  width : 100vh;
  background-image : url("cloud.gif");
  background-size : 43% auto;
  background-repeat : no-repeat;
  left : 65%;
  top : 60%;
  position : absolute;
  z-index : 2;
  display : block;
  }
  .bun {
  height : 45vh;
  width : 20vw;
  background-image : url("hopinbun.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  position : absolute;
  right : -1%;
  top : 60%;
  }
  .column {
  display : flex;
  flex-direction : column;
  flex-wrap : wrap;
  align-items : flex-end;
  position : absolute;
  top : 0;
  z-index : 2;
  transform : rotate(180deg);
  left : 96vw;
  }
  .column2 {
  display : flex;
  flex-direction : column;
  flex-wrap : wrap;
  align-items : flex-start;
  position : absolute;
  top : 0;
  z-index : 2;
  left : 0;
  display : none;
  }
  .heartr {
  height : 10vh;
  width : 6vw;
  }
  .heartl {
  height : 10vh;
  width : 6vw;
  transform : rotate(360deg);
  }
  .star {
  height : 22vh;
  width : 7vw;
  background-image : url("pigeon3.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 49%;
  left : 23%;
  position : absolute;
  }
  .wings {
  height : 22vh;
  width : 20vh;
  background-image : url("wings.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 33%;
  left : 65%;
  position : absolute;
  }
  .angel {
  height : 24vh;
  width : 12vw;
  background-image : url("angel.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 3%;
  left : 80%;
  position : absolute;
  }
  .saves {
  height : 35vh;
  width : 35vw;
  background-image : url("jesusaves3.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 35%;
  left : 73%;
  position : absolute;
  }
  .day {
  height : 15vh;
  width : 22vh;
  background-image : url("day.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 28%;
  left : 40%;
  position : absolute;
  z-index : 3;
  }
  .fire {
  height : 40vh;
  width : 40vw;
  background-image : url("fireworks.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 2%;
  left : 30%;
  position : absolute;
  mix-blend-mode : screen;
  }
  .fleft2 {
  height : 20vh;
  width : 30vw;
  background-image : url("pxlrose.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 55%;
  left : 70%;
  position : absolute;
  transform : rotate(180deg);
  transform : scaleY(-1) rotate(180deg);
  z-index : 3;
  }
  .fleft3 {
  height : 20vh;
  width : 30vw;
  background-image : url("pxlrose.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 20%;
  left : -4%;
  position : absolute;
  z-index : 3;
  }
  .clickinfo {
  height : 18vh;
  width : 100vh;
  background-image : url("click4");
  background-repeat : no-repeat;
  background-size : 75% 80%;
  left : 29%;
  top : 69%;
  position : absolute;
  z-index : 3;
  cursor : pointer;
  }
  .smalllove {
  height : 7vh;
  width : 13vw;
  background-image : url("samlllove.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 40%;
  left : 68%;
  position : absolute;
  z-index : 3;
  opacity : 0;
  }
  .rosestop {
  height : 15vh;
  width : 70vh;
  background-image : url("roses4.gif");
  background-repeat : no-repeat;
  background-size : 100% 100%;
  left : 31%;
  top : 61%;
  position : absolute;
  cursor : pointer;
  pointer-events : none;
  z-index : 3;
  }
  .fleft {
  height : 20vh;
  width : 25vw;
  background-image : url("roses3.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 80%;
  left : 2%;
  position : absolute;
  z-index : 3;
  }
  .fright {
  height : 20vh;
  width : 25vw;
  background-image : url("roses3.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 80%;
  left : 2%;
  position : absolute;
  z-index : 3;
  }
  .happy {
  height : 7vh;
  width : 12vw;
  background-image : url("happysun.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 5%;
  left : 95%;
  position : absolute;
  z-index : 3;
  }
  .fish {
  height : 7vh;
  width : 12vw;
  background-image : url("fish3.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 15%;
  left : 90%;
  position : absolute;
  z-index : 3;
  }
  .flies {
  height : 20vh;
  width : 25vw;
  background-image : url("flies.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 45%;
  left : 80%;
  position : absolute;
  z-index : 3;
  opacity : 0;
  }
  .lovsu {
  height : 10vh;
  width : 15vw;
  background-image : url("jesusloveanim3.gif.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 80%;
  left : 70%;
  position : absolute;
  z-index : 3;
  }
  .floersfly {
  width : 100%;
  height : 100%;
  top : 0%;
  left : 0%;
  background-image : url("flowersfly.gif");
  background-size : cover;
  background-repeat : no-repeat;
  position : absolute;
  mix-blend-mode : overlay;
  }
  .hands {
  height : 20vh;
  width : 10vw;
  background-image : url("giphy.gif");
  background-size : cover;
  background-repeat : no-repeat;
  top : 60%;
  left : 80%;
  position : absolute;
  opacity : 0;
  }
  .cross2 {
  height : 16vh;
  width : 26vw;
  background-image : url("cross.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 25%;
  left : 30%;
  position : absolute;
  z-index : 3;
  }
  .thanks {
  height : 10vw;
  width : 50vh;
  background-image : url("handspng.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 20%;
  left : 53%;
  position : absolute;
  z-index : 1;
  opacity : 0;
  }
  .love {
  height : 35vh;
  width : 35vw;
  background-image : url("love2.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 40%;
  left : 1%;
  position : absolute;
  opacity : 1;
  mix-blend-mode : screen;
  }
  .love2 {
  height : 15vh;
  width : 15vw;
  background-image : url("hred.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 37%;
  left : 13%;
  position : absolute;
  }
  .small {
  height : 10vh;
  width : 10vw;
  background-image : url("small.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 13%;
  left : 10%;
  position : absolute;
  }
  .horse {
  height : 15vh;
  width : 15vw;
  background-image : url("horse.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 83%;
  left : 30%;
  position : absolute;
  z-index : 3;
  opacity : 0;
  }
  .sheep {
  height : 15vh;
  width : 15vw;
  background-image : url("sheep.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 83%;
  left : 24%;
  position : absolute;
  z-index : 3;
  }
  .bible {
  height : 20vh;
  width : 20vw;
  background-image : url("bible2.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 25%;
  left : 83%;
  position : absolute;
  }
  .jstext {
  height : 5%;
  width : 5%;
  background-image : url("jesustext.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 34%;
  left : 18%;
  position : absolute;
  z-index : 1;
  display : none;
  }
  .rock {
  height : 35vh;
  width : 30vw;
  background-image : url("book3.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 45%;
  left : 0%;
  position : absolute;
  z-index : 3;
  }
  .point {
  height : 15vh;
  width : 10vw;
  background-image : url("pointer.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 76%;
  left : 20%;
  position : absolute;
  z-index : 3;
  }
  .swan {
  height : 40vh;
  width : 45vw;
  background-image : url("swan.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 76%;
  left : -20%;
  position : absolute;
  }
  .but {
  height : 20vh;
  width : 25vw;
  background-image : url("butterfly.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 78%;
  left : 3%;
  position : absolute;
  z-index : 3;
  }
  .sparkles {
  height : 25vh;
  width : 20vw;
  background-image : url("ampinksparkles.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 25%;
  left : 75%;
  position : absolute;
  mix-blend-mode : screen;
  }
  .hand {
  height : 15vh;
  width : 10vw;
  background-image : url("eg.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : -5%;
  left : 55%;
  position : absolute;
  transform : rotateZ(180deg);
  }
  .bells {
  height : 25vh;
  width : 20vw;
  background-image : url("bells.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 20%;
  left : 10%;
  position : absolute;
  transform : rotateZ(90deg);
  }
  .trust {
  height : 20vh;
  width : 20vw;
  background-image : url("trust.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 36%;
  left : 5%;
  position : absolute;
  z-index : 3;
  }
  .kisses {
  height : 8vh;
  width : 8vw;
  background-image : url("kisses.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 73%;
  left : 5%;
  position : absolute;
  z-index : 3;
  opacity : 0;
  }
  .loves {
  height : 30vh;
  width : 25vw;
  background-image : url("loves4.gif");
  background-size : auto 100%;
  background-repeat : no-repeat;
  top : 25%;
  left : 78%;
  position : absolute;
  opacity : 0;
  }
  .grass {
  width : 100%;
  height : 35%;
  bottom : 0%;
  background-image : url("grass.gif");
  background-size : cover;
  background-repeat : no-repeat;
  position : absolute;
  }
  .unicorn {
  width : 10vw;
  height : 15vh;
  background-image : url("unicorn.gif");
  background-size : 100%;
  pointer-events : none;
  background-repeat : no-repeat;
  animation : run 8s linear infinite;
  pointer-events : none !important ;
  transform : translateX(0) translateY(87vh);
  position : absolute;
  animation-delay : 0s;
  z-index : 8;
  }
  @keyframes run {
  0% {
  transform : translateX(-2vw) translateY(87vh);
  }
  19.99% {
  transform : translateX(92vw) translateY(87vh);
  }
  25% {
  transform : translateX(92vw) translateY(87vh) rotatez(-90deg);
  }
  50% {
  transform : translateX(92vw) translateY(0) rotatez(-90deg);
  }
  50.001% {
  transform : translateX(92vw) translateY(-2vh) rotatez(-180deg);
  }
  75% {
  transform : translateX(-2vw) translateY(-2vh) rotatez(-180deg);
  }
  75.001% {
  transform : translateX(-2vw) translateY(0) rotatez(-270deg);
  }
  100% {
  transform : translateX(-2vw) translateY(87vh) rotatez(-270deg);
  }
  }
  .pigon {
  width : 40%;
  height : 40%;
  display : flex;
  flex-wrap : wrap;
  background-image : url("pigon.gif");
  background-repeat : no-repeat;
  background-size : 50%;
  pointer-events : none;
  position : relative;
  z-index : 3;
  }
  .pigon {
  animation : fly 5s linear infinite;
  pointer-events : none !important ;
  top : 0;
  left : 0;
  transform : translateX(-20vw) translateY(10vh);
  position : absolute;
  animation-delay : 1s;
  }
  @keyframes fly {
  0% {
  transform : translateX(-20vw) translateY(10vh);
  }
  25% {
  transform : translateX(30vw) translateY(30vh);
  }
  50% {
  transform : translateX(60vw) translateY(10vh);
  }
  75% {
  transform : translateX(90vw) translateY(30vh);
  }
  100% {
  transform : translateX(150vw) translateY(20vh);
  }
  }
  .disco {
  height : 10%;
  width : 10%;
  background-image : url("disco.gif");
  background-size : contain;
  background-repeat : no-repeat;
  top : 0%;
  left : 80%;
  position : absolute;
  z-index : 1;
  opacity : 0;
  }
  .butterfly {
  height : 35vh;
  width : 45vw;
  background-image : url("butterfly2.gif");
  background-size : 100% auto;
  background-repeat : no-repeat;
  top : 25%;
  left : 60%;
  position : absolute;
  transform : rotate(180deg);
  }