/*** ==================================================================== How Tool Work ==================================================================== ***/ .how-tool-work { position: relative; display: block; padding: 109px 0 90px; } .how-tool-work__title-box { position: relative; display: block; text-align: center; margin-bottom: 58px; } .how-tool-work__title { font-size: 40px; font-weight: 600; color: var(--thm-white); line-height: 50px; } .how-tool-work__title span { color: var(--thm-base); } .how-tool-work__single { position: relative; display: block; margin-bottom: 30px; z-index: 1; } .how-tool-work__shape-1 { position: absolute; bottom: 25px; right: 0; height: 107px; width: 107px; background: linear-gradient(180deg, #6243FF 0%, #FF2828 100%); opacity: 0.8; filter: blur(90px); border-radius: 50%; transform: scale(0); -webkit-transition: all 500ms ease; transition: all 500ms ease; z-index: 2; } .how-tool-work__single:hover .how-tool-work__shape-1 { transform: scale(1); } .how-tool-work__single-inner { position: relative; display: block; border-radius: 16px; border: 1px solid var(--thm-bdr-color); overflow: hidden; z-index: 1; } .how-tool-work__img { position: relative; display: block; background-color: var(--thm-body-bg); padding-top: 15px; padding-left: 15px; padding-right: 15px; padding-bottom: 15px; } .how-tool-work__img img { width: 100%; border-radius: var(--thm-border-radius); } .how-tool-work__content { position: relative; display: block; text-align: center; background-color: var(--thm-main-bg); padding: 33px 40px 32px; } .how-tool-work__title-two { font-size: 24px; font-weight: 600; line-height: 34px; margin-bottom: 16px; } .how-tool-work__title-two a { color: var(--thm-white); -webkit-transition: all 500ms ease; transition: all 500ms ease; } .how-tool-work__title-two a:hover { color: var(--thm-base); } /* End */