.generic-btn{ padding: 16px 37px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; background: var(--accent-color); border-radius: 45px; color: var(--secondary--color); display: inline-block; box-shadow: 0px 0px 20px 0px rgb(251 156 35 / 30%); transition-duration: .3s; transition-property: transform; transition-timing-function: ease-out; } .generic-btn:hover, .Started-btn:hover, .banner-left-btn a:hover:last-child, #submit:hover{ color: var(--accent-color); box-shadow: 0 0 0 1px var(--accent-color); background: transparent; transform: translateY(-8px); } .Started-btn{ padding: 13px 25px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 16px; background: var(--accent-color); border-radius: 45px; color: var(--secondary--color); display: inline-block; box-shadow: 0px 0px 20px 0px rgb(251 156 35 / 30%); transition-duration: .3s; transition-property: transform; transition-timing-function: ease-out; } .align{ text-align: center; } h5{ font-size: 20px; color: var(--accent-color); font-weight: 500; letter-spacing: 1.9px; } h1{ font-size: 60px; font-weight: 700; color: var(--primary--color); } h2{ font-size: 46px; line-height: 55px; color: var(--primary--color); font-weight: 700; } h3{ font-size: 30px; line-height: 70px; color: var(--primary--color); font-weight: 700; } h4{ font-size: 22px; font-weight: 700; color: var(--primary--color); } p{ font-size: 18px; line-height: 31px; color: var(--text-color); font-weight: 400; } .bg-overlay-img{ position: relative; } .bg-overlay-img::after{ content: ""; width: 100%; height: 100%; background: url(../image/bg-img.png) no-repeat center; background-size: cover; position: absolute; top: 0; left: 0; } .left-white-circle:after{ content: ""; width: 137px; height: 335px; position: absolute; left: 0; background: url(../image/left-white-circle.png) no-repeat center; background-size: cover; top: 391px; animation: right-mover 1s infinite alternate; -webkit-animation: right-mover 1s infinite alternate; } @-webkit-keyframes left-mover{ 0% { transform: translatey(0); } 100% { transform: translatey(10px); } } .right-white-circle::before{ content: ""; width: 132px; height: 336px; position: absolute; right: 0; background: url(../image/right-white-circle.png) no-repeat center; background-size: cover; top: 80px; animation: left-mover 1s infinite alternate; -webkit-animation: left-mover 1s infinite alternate; } @-webkit-keyframes right-mover{ 0% { transform: translatey(0); } 100% { transform: translatey(-10px); } } .overlay-img{ position: relative; z-index: 1; } .padding-top{ padding-top: 120px; } .padding-bottom{ padding-bottom: 120px; } .overflow{ overflow: hidden; }