<div class="item">
</div>
.item {
margin-left: 80%;
width: 200px;
height: 300px;
overflow: hidden;
position: relative;
box-shadow: 0 0 10px #ccc;
background-color: rgba(255,184,34,.07)!important;
&:after {
content: ' ';
width: 1000px;
height: 1025px;
position: absolute;
bottom: 65%;
left: -250px;
border-radius: 35%;
background: #fff;
z-index: 0;
animation: wave 10s infinite linear;
}
}
@keyframes wave{from{transform:rotate(0);transform:rotate(0)}from{transform:rotate(360deg);transform:rotate(360deg)}}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.