I'm using demo-shop as my base files. However, I have added the demo-nonprofit>subscribe section into my webpage. I added the nonprofit.css subscribe css into the custom.css page. All works well except the arrow doesn't twirl up or down upon clicking. It does successfully displays the form.
Here's the part of the nonprofit.css subscribe section that I put in the custom.css:
.subscribe-section .subscribe-section-target {
cursor: pointer;
padding: 35px 0;
}
.subscribe-icon {
position: absolute;
top: 0px;
left: 50%;
width: 120px;
height: 120px;
line-height: 110px;
background-color: var(--cnvs-themecolor);
border-radius: 50%;
text-align: center;
transform: translate(-50%, -45%);
}
.subscribe-icon i {
font-size: 38px;
text-align: center;
color: #444;
font-weight: 600;
}....all the way until
.subscribe-section .subscribe-icon i { transform: scale(1); transition: transform .25s ease; }
.subscribe-section:hover .subscribe-icon i { transform: scale(1.2); }
.nonprofit-success #nonprofit-submitted { display: block; }