.back-portion{
height: 77%;
width: 80%;
top:16%;
left:7%;
background: #C2DAE6;
transform: rotate(4deg) }

.top-portion{
height: 80%;
width: 80%;
top:7%;
left:9.3%;
background: #ffffff;
border-radius:1px; }

.lin-1{
width:20%;
height:2.5%;
top: 3%;
left:8%;
background: lightgray;
border-radius:23px; }

.lin-2{
width:14%;
height:1.5%;
top: 8%;
left:8%;
background: lightgray;
border-radius:23px; }

.lin-3{
width:60%;
height:2.5%;
top: 14%;
left:3%;
background: #efefef;
border-radius:23px; }

.lin-4{
width:40%;
height:3%;
top: 20%;
left:3%;
background: #efefef;
border-radius:23px; }

.lin-6{
width: 94%;
width: 94%;
width: 94%;
height:1%;
bottom:16%;
left:3%;
background: #efefef;
border-radius:23px; }

.rght-arrow{
height: 6%;
height: 6%;
width: 6%;
bottom:4%;
right:6%;
background: lightgray;
-webkit-clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);
clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%); }

.wrapper{
width:100%;
height:40%;
top:30%;
background:#02A1E2; }

.wraper-ring-1{
width: 22%;
height:50%;
height:50%;
left:3%;
background: #3666AE;
transform: rotate(180deg);
-webkit-clip-path: circle(50% at 50% 65%);
clip-path: circle(50% at 50% 65%); }

.wraper-ring-2{
width: 22%;
height:50%;
right:30%;
bottom:0%;
background: #3666AE;
-webkit-clip-path: circle(50% at 50% 65%);
clip-path: circle(50% at 50% 65%); }

.wraper-ring-3{
width: 16%;
height:45%;
right:0%;
background: #3666AE;
border-bottom-left-radius: 100%; }

.col-1{
height:50%;
width:2%;
left: 30%;
top:5%;
background: #F8AA0C;
border-radius:10px;
transform:rotate(20deg); }

.col-2{
position: absolute;
height:50%;
width:2%;
right: 25%;
top:15%;
background: #F8AA0C;
border-radius:10px;
transform:rotate(-93deg); }

.ring-1{
position: absolute;
height: 4.8%;
width: 3.8%;
bottom:23%;
left:13%;
background:#DE5B69;
border-radius: 50%; }

.ring-2{
height: 4.8%;
width: 3.8%;
bottom:23%;
left:18%;
background: #F1AD0C;
border-radius: 50%; }

.lin-5{
width:20%;
height:1.5%;
bottom: 24.5%;
left:24%;
background: #3666AE;
border-radius: 23px; }

.mesg-front{
width: 28%;
height:25%;
background: #DD5E65;
right:3%;
top:-4%;
border-radius: 10%;
box-shadow:2px 2px 2px 0px; }

.inner-mesg-front{
width: 100%;
height:100%;
z-index: 2;
border-radius: 12%;
background: #DD5E65; }

.text{
top: 25%;
left:36%;
color:white;
z-index: 2; }

.text p{
font-size:45px;
transform:rotate(4deg);
text-shadow: 0.5px 2px; }

.toe{
background: #DD5E65;
width: 25%;
height:30%;
border-radius:12%;
bottom:-12%;
left:37.5%;
transform:rotate(40deg);
box-shadow:2px 2px 2px 0px; }