CSS
body {
text-align:center;
height: 100%;
margin: 0px;
background-color:#84CBC6;
}
#cheesecake{
margin: 10px auto;
position: relative;
height:510px;
width:510px;
}
#cheesecake div{position:absolute;}
#cheesecake div::before,
#cheesecake
div::after {
content:'';
position:absolute;
display:block;
}
.base{
width:170px;
height:142px;
background-image:linear-gradient(#f69a9c 20px, #f7e498 20px, #f7e498 90px, #f8e182 90px, #f8e182 127px, #deac59 127px);
bottom:156px;
left:170px;
border-top-left-radius:15px;
border-top-right-radius:15px;
border:6px solid #414042;
}
.base::before{
width:17px;
height:42px;
border-radius:0 0 17px 17px;
background-color:#f69a9c;
box-shadow: 17px -17px #f69a9c, 95px -17px #f69a9c, 126px 0 #f69a9c ;
left:13px;
top:19px;
}
.base::after{
width: 4px;
height:4px;
background-color:#deac59;
border-radius:4px;
box-shadow: 10px -10px #deac59;
right:15px;
bottom:20px;
}
.toppings{
width:108px;
height:22px;
border:6px solid #414042;
border-radius: 22px;
background-color:white;
top:184px;
left:200px;
}
.toppings::before{
width:71px;
height:22px;
border:6px solid #414042;
border-radius: 22px;
background-color:white;
top:-22px;
left:12px;
z-index:-1;
}
.toppings::after{
width:22px;
height:22px;
border:6px solid #414042;
border-radius: 22px;
background-color:#f26d72;
top:-44px;
left:36px;
z-index:-1;
}
.plate{
width:264px;
height:6px;
background-color:#414042;
border-radius:6px;
bottom:156px;
left:130px;
}
.plate::before{
width:235px;
height:10px;
background-color:#cdfffb;
border:6px solid #414042;
border-radius: 0 0 20px 20px;
left:8px;
}
.plate::after{
width:10px;
height:10px;
border-radius:10px;
border:6px solid transparent;
border-left:6px solid #414042;
bottom:195px;
left:128px;
transform:rotate(45deg);
-webkit-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-ms-transform:rotate(45deg);
-o-transform:rotate(45deg);
}
.glasee{
width:40px;
height:4px;
background-color:white;
border-radius:4px;
top:212px;
left:182px;
}
.glasee::after{
width:13px;
height:4px;
background-color:white;
border-radius:4px;
left:46px;
}
.glasee::before{
width:6px;
height:6px;
background-color:white;
border-radius:6px;
top:-55px;
left:69px;
}
