<!-- 
  Project: Stampsynk - Free Codes
  Author: @Saulomg2
  Description: Responsive Button for the tubesynk website, with buttons and useful links.
  Website: https://stampsynk.com
  License: Open source
  Creation date: February 2025
  
-->

<div class=button>
        <a href="https://stampsynk.com/" target="_blank" class="cta-button">            
Jump Button
        </a>
    </div>

    <p style="margin-top: 20px; font-size: 14px; opacity: 0.8;">Developed by <a href="https://stampsynk.com" target="_blank" style="color: #ffd700; text-decoration: underline;">
Stampsynk.com</a></p>
</div>



/* 
  Project: Stampsynk - Free Codes
  Author: @Saulomg2
  Description: Responsive Button for the tubesynk website, with buttons and useful links.
  Website: https://stampsynk.com
  License: Open source
  Creation date: February 2025
  
*/


.button { text-align: center; margin-top: 50px; }

/* Animation */
    @keyframes moveButton {
        0% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-10px); /* Sobe 10px */
        }
        100% {
            transform: translateY(0);
        }
    }

    /* Style */
    .cta-button {
        display: inline-block;
        padding: 20px 40px;
        font-size: 18px;
        font-weight: bold;
        color: #fff;
        text-decoration: none;
        background-color: #ff5733;
        border-radius: 50px;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        transition: background-color 0.3s ease;
        animation: moveButton 1.5s ease-in-out infinite; /* Continuous animation */
    }

    /* Changing button color on hover */
    .cta-button:hover {
        background-color: #e64a19; /* Cor mais escura no hover */
    }

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.