Code CSS Untuk Membuat Website Dengan Elementor

CSS Untuk Menyembunyikan Horizontal Overflow di Seluruh Halaman

<style>
/* Hide horizontal overflow for the entire page */
html, body {
   overflow-x: hidden;
}
</style>

CSS Maksimum Lebar Kolom

@media (max-width: 767.98px) {
    
.img-banner-mx-w {
    max-width: 350px;
    margin: 0 auto;
}

CSS Class Maksimum Lebar Kolom

img-banner-mx-w

CSS Tombol Warna Oranye

.cta-btn-2 .elementor-button .elementor-button-content-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}

.cta-btn-2 .elementor-button .elementor-button-icon {
    background: #fff;
    width: 38px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #fff;
}
.cta-btn-2 .elementor-button {
    display: flex;
    justify-content: end;
    align-items: center;
    height: 50px;
}


.cta-w-165 .elementor-button{
    width: 165px;
}

CSS Class Tombol Warna Oranye

cta-btn-2
cta-w-165

CSS Efek Hover Tombol Warna Oranye

.pulse-orr .elementor-button:hover {
          animation: pulses-orrange 1s;
          box-shadow: 0 0 0 2em transparent;
}
@keyframes pulses-orrange {
  0% {
    box-shadow: 0 0 0 0 #ff512a;
  }
}

CSS Class Efek Hover Tombol Warna Oranye

pulse-orr

CSS Pulse Animation

.anim-top {
    animation: anim-top 2s infinite linear;
    animation-direction: alternate;
}
@keyframes anim-top{
    from{
        transform: scale(.7);
    }
    to{
        transform: scale(1);
    }
}

CSS Class Pulse Animation

anim-top

CSS Rotated Animation

.anim-rotate {
    animation: anim-rotate 4s infinite linear;
    animation-direction: alternate;
}
@keyframes anim-rotate{
    from{
        transform: rotate(0deg) scale(1);
    }
    to{
        transform: rotate(360deg) scale(.3);
    }
}

CSS Class Rotated Animation

anim-rotate

CSS Tombol Warna Hijau

.cta-btn-3 .elementor-button .elementor-button-content-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}

.cta-btn-3 .elementor-button .elementor-button-icon {
    background: #fff;
    width: 38px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #101700;
}
.cta-btn-3 .elementor-button {
    display: flex;
    justify-content: end;
    align-items: center;
    height: 50px;
}

.cta-w-192 .elementor-button{
    width: 192px;
}

CSS Class Tombol Warna Hijau

cta-btn-3
cta-w-192

CSS Efek Hover Tombol Warna Hijau

.pulse-lgrn .elementor-button:hover{
          animation: pulses-lgreen 1s;
          box-shadow: 0 0 0 2em transparent;
}
@keyframes pulses-lgreen {
  0% {
    box-shadow: 0 0 0 0 #cafc01;
  }
}

CSS Class Efek Hover Tombol Warna Hijau

pulse-lgrn