body{
	background-color: #8EC8BC;
}

.position-fixed{
      position: fixed;
      top: -80px;
      left:50px;
}


#container{
      position: relative;
      display: inline-block;
      margin-right: 150px;
      margin-bottom: -100px;
	transform: scale(0.9,0.9);
      transition: transform 2s;
}


#container:hover{
      transform: rotate(60deg);

}

.triangle-1{
	width: 0px;
	height: 0px;
	border-left: 50px solid transparent;
	border-right: 50px solid transparent;
	border-bottom: 80px solid #FDCBD4;
	transform:translateX(220px) translateY(50px) rotate(48deg) ;
}

.oval-1{
	  width: 230px;
      height: 200px;
      background: #FDCBD4;
      border-radius: 150px / 125px;
      transform:translateX(100px);
      transform:rotate(-35deg);
      margin-left: 50px;

}

.triangle-2{
	width: 0px;
	height: 0px;
	border-left: 30px solid transparent;
	border-right: 30px solid transparent;
	border-bottom: 60px solid #FDCBD4;
	transform:translateX(28px) translateY(-40px) rotate(230deg) ;
}

.circle-1{
	  width: 160px;
      height: 180px;
      background: #F2BCA4;
      border-radius: 50%;
      transform:translateX(80px) translateY(-245px) rotate(200deg);

}

.circle-2{
	  width: 150px;
      height: 150px;
      background: #FFF9E9;
      border-radius: 50%;
      transform:translateX(85px) translateY(-410px);

}

.oval-2{
	  width: 230px;
      height: 200px;
      background: #FDCBD4;
      border-radius: 150px / 125px;
      transform:rotate(-35deg);
      margin-left: 50px;

}

.circle-3{
	  width: 40px;
      height: 20px;
      background: #3D625A;
      border-radius: 50%;
      transform:translateX(95px) translateY(-515px) rotate(-40deg);

 }

.circle-4{
	  width: 35px;
      height: 20px;
      background: #3D625A;
      border-radius: 50%;
      transform:translateX(148px) translateY(-565px) rotate(-30deg);

 }

 .circle-5{
	width: 18px;
      height: 18px;
      background: #3D625A;
      border-radius: 50%;
      transform:translateX(150px) translateY(-555px);

 }

.position2-fixed{
      position: fixed;
      top:-4850px;
      left:220px;
}

#container-2{
	position: relative;
      display: inline-block;
      margin-right: 150px;
      margin-bottom: -100px;
      transform: scale(0.7,0.7) rotateY(180deg);
      transition: transform 2s;
}


#container-2:hover{
      transform: rotate(30deg);

}

#container-3{
      position: fixed;
      top:0;
      left: 0;
      right: 0;
      z-index: 0;
      display: flex;
      flex-wrap: wrap;
      mix-blend-mode: exclusion;
      margin-left: -10px;
      margin-right: -10px;
      margin-bottom: 200px;
      animation-name: shake;
      animation-duration: 1s;
      animation-delay: 0.5s;
      animation-iteration-count: infinite;
}


#container-4{
      position: fixed;
      top:200px;
      left: 0;
      right: 0;
      z-index: -1;
      display: flex;
      flex-wrap: wrap;
      mix-blend-mode: exclusion;
      margin-left: -10px;
      margin-right: -10px;
      margin-bottom: 200px;
      animation-name: shake;
      animation-duration: 1s;
      animation-iteration-count: infinite;
}

@keyframes shake {
  from,
  to {
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    transform: translate3d(10px, 0, 0);
  }
}

.infinity {
      position: relative;
      width: 232px;
      height: 100px;
      box-sizing: content-box;
      transform: scale(0.6);
      margin-left: -116px;
      margin-bottom: 300px;

    }


.infinity:before,
.infinity:after {
      content: "";
      box-sizing: content-box;
      position: absolute;
      top: 0;
      left: 0;
      width: 60px;
      height: 60px;
      border: 20px solid #94a299;
      border-radius: 50px 50px 0 50px;
      transform: rotate(-45deg);
    }

.infinity:after {
      left: auto;
      right: 0;
      border-radius: 50px 50px 50px 0;
      transform: rotate(45deg);
    }