.div1{
	width: 50%;
	height: 400px;
	border-right: solid;
	border-top: dashed;
	float:left;
	margin-top:-25px;
}
.div2{
	width: 50%;
	height: 400px;
	margin-top: -25px;
	border-top: dashed;
	float:right;
}
.div3{width: 60%;
	height: 700px;
	border-right: solid;
	border-bottom:dashed;
	float: left;
	
}
.div4{width: 50%;
	height: 700px;
	border-left: solid;
	border-bottom: dashed;
	float:right;
	
}

*,*:before,*:after{
	box-sizing:border-box;
}

.tul{
	list-style: none;
	padding: 30px;
	margin: 0px 35px;
	width: 180px;
	display: inline-block;
}
.tli{
	padding: 10px;
	background:#80e25e;
	display: block;
}
.head{
	padding: 35px 0px;
	border-radius: 50% 50% 0px 0px ;
	margin-bottom: 10px;
	position: relative;
}
.head::before,
.head::after{
	content:"";
	display: inline-block;
	position: absolute;
	border: 6px solid #fff;
	border-radius: 50%;
}
.head::before{
	left: 20px;
	top:20px;	
}
.head::after{
	right: 20px;
	top:20px;	
}
.body{
	padding: 60px 0;
	position: relative;
}
.body::before,
.body::after{
	content:"";
	display: inline-block;
	position: absolute;
	padding: 20px;
	height: 100%;
	border-radius: 30px;
    top:0;
	background: #80e25e;
}
.body::before{
	left:-10px;
	transform: translate(-100%,0);
}
.body::after{
	right:-10px;
	transform: translate(100%,0);	
}
.foot{
	background: #fff;
	width: calc(100%-30px);
	padding: 25px 0;
	margin: 0 auto;
	border: 1px solid #80e25e;
	border-width: 0 22px;
}
.horn{
	position: relative;
	padding: 0;
}
.horn::before,
.horn::after{
	content:"";
	display: inline-block;
	position: absolute;
	padding: 15px 15px;
    top:15px;
	border-radius: 20px;
	background: #80e25e;
	transform: translate(0,-100%);
}
.horn::before{
	left: 23px;
}
.horn::after{
	right:23px;
}
body{
background: #4e4e4e;	
overflow: hidden;
}
.apple,
butt:before,
.top span:after,
.middle:after,
.top:before,
.top:after,
.middle:before,
.butt:after{
	background: #fff;
}
.apple{
	width: 230px;
	height: 200px;
	border-radius: 36% 36% 41% 41%/42% 42% 75% 75%;
	position: relative;
	margin: 80px auto 0;
	top: 20%;
}
.footer{
	position: absolute;
	width: 60%;
	height: 62%;
	right: -40% ;
	top:8%;
	border-radius: 60%;
	background: #c3cbce;
	
}
.middle span{
	display: block;
	position: absolute;
	border-radius: 100% 100% 0% 0%;
	width: 24.5%;
	height: 400%;
	bottom: -239%;
	left: 38%;
	background: #c3cbce;	
}
.middle{
	position: absolute;
	width: 100%;
	height: 4%;
	bottom: -1%;
	background: #c3cbce;
}
.middle:before{
	content: "";
	position: absolute;
	width: 24%;
	height: 400%;
		border-radius: 0% 0% 100% 100%;
	left: 21%;
	bottom: 38%;
}
.middle:after{
	content: "";
	position: absolute;
	width: 23.4%;
	height: 400%;
		border-radius: 0% 0% 100% 100%;
	right: 21%;
	bottom: 38%;
}
.top span{
	display: block;
	position: absolute;
	border-radius: 0% 0% 44% 44%/ 0% 0% 100% 100%;
	width: 63%;
	height: 259%;
	top: -92%;
	left: 18.6%;
	background: #c3cbce;
	z-index: 3;
}
.top span:after{
	content: "";
	
	border-radius:  100% 0% 100% 0%;
	height: 242%;
	left: 41%;
	position: absolute;
	top: -193%;
	width: 90%;	
}
.top{
	position: absolute;
	width: 42%;
	height: 4%;
	top:0px;
	left: 29%;
	background: #c3cbce;
}
.top:before{
	content: "";
	position: absolute;
	width: 62%;
	height: 260%;
	border-radius: 100% 100% 0% 0% /100% 200% 0;
	left:-27%;
	top:1%;
}
.top:after{
	content: "";
	position: absolute;
	width: 62%;
	height: 260%;
	border-radius: 100% 100% 0% 0% /200% 100% 0;
	right:-27%;
	top:1%;
}
.droplet {
position: relative;
left: 60px;
background:#54abfb;
height: 100px;
width: 100px;
border-radius:51% 49% 48% 52%/
62% 44% 56% 38%;
opacity: 0.8;
border: 2px solid #3d93ff;}
	.droplet::before{
content:"";
position: absolute;
background: #318cef;
height: 100%;
width: 100%;
border-radius: 51% 49% 48% 52% / 62% 44% 56% 38%;
box-shadow: -10px 15px 8px #1b6ceb,
-20px 38px 16px #1b6cfb,
inset -3px 3px 5px #1b6cfb,
inset 1px 3px 5px #1a74e5,
inset 10px -10px 11px #fff, 
inset 20px -20px 22px #a8ceff;}
droplet::after{
content:"";
position: absolute;
background: #e6fdfb;
height: 20px;
width: 20px;
border-radius: 44% 56% 46% 54% / 36% 50% 50% 64%; 
left: 65px;
top: 20px;
box-shadow: 8px 20px 0 -5px #fff; 
opacity: 0.8;
		}
.div6{
	box-shadow: 1px  1px 110px #559CC6,1px 1px 50px #559CC6 inset;
	border: 2px solid #559CC6;
	border-radius: 62px;
	height: 200px;
	width: 180px;
    align:center;
	margin:-100px 20px   0px 1px;
	
}
.div7{
	box-shadow: 1px  1px 110px #559CC6,1px 1px 50px #559CC6 inset;
	border: 2px solid #559CC6;
	border-radius: 62px;
	height: 200px;
	width: 180px;
    align:center;
	margin:-400px 20px  80px 1px;
	
	
}
.droplet1 {
position: relative;
left: 60px;
background:#54abfb;
height: 100px;
width: 100px;
border-radius:51% 49% 48% 52%/
62% 44% 56% 38%;
opacity: 0.8;
border: 2px solid #3d93ff;
margin-top:150px}
	.droplet1::before{
content:"";
position: absolute;
background: #318cef;
height: 100%;
width: 100%;
border-radius: 51% 49% 48% 52% / 62% 44% 56% 38%;
box-shadow: -10px 15px 8px #1b6ceb,
-20px 38px 16px #1b6cfb,
inset -3px 3px 5px #1b6cfb,
inset 1px 3px 5px #1a74e5,
inset 10px -10px 11px #fff, 
inset 20px -20px 22px #a8ceff;}
droplet1::after{
content:"";
position: absolute;
background: #e6fdfb;
height: 20px;
width: 20px;
border-radius: 44% 56% 46% 54% / 36% 50% 50% 64%; 
left: 65px;
top: 20px;
box-shadow: 8px 20px 0 -5px #fff; 
opacity: 0.8;
		}


.div5,buttom{
	background:radial-gradient(#ffffff);
	box-shadow: 0px  0px 10px #ffffff,10px 
	0px 100px #ffffff inset;
	
	border-radius: 50px 50px ;
	height: 80px;
	width: 110px;
    align:center;
	margin:30px 20px 5px  125px;
	cursor: pointer;
	}
buttom:hover{
	box-shadow: 0 0 1000px #ffffff;
	background:radial-gradient(#F2DC73 50%,#4e4e4e);
height: 80px;
	width: 140px;
	transition:all 1s;
}
.ul{ border-radius: 50px;
	text-align: center;
	list-style-type: none;
	margin: 120px;
	margin-left: 400px;
	padding: 0;
	margin-top: 160px;
	padding-left: 20px;
	background-color: #A7B5C2;
	overflow: hidden;
	position:absolute;
	top: 0;
	width: 455px;
	height: 30px;
}
.li{ border: #797979 solid;
	float: left;	
	text-align: center;

}
.li a {
	text-decoration: none;
	color: black;
	padding: 15px;
	
}	
.li a:hover{
	
	background-color: #808080;
}