Testimonial box with hover effect
This is an example of a testimonial box with hover effects, designed using HTML, CSS, and Bootstrap framework 4. The images are imported to the code with their URLs and media quarries have been used to increase the responsiveness of the form. The body of the form is given the styles of height and width as 100%, font-family as 'Cormorant', serif, and background as #262626. The testimonial card is given the styles of box-shadow as 0px 5px 16px rgba(223, 241, 223, 0.5), transition as 0.8s, background as #333, box-sizing as border-box, and border-radius as 7px. The content of the card the styles of font-size as 20px, line-height as 33px, and color as #fff. The testimonial profile name is given a font color as #fff, and a font-weight as 500. In a hover event, the testimonial card takes a layer effect of linear-gradient(#03a9f4, #e91ee3) and gets filled with the layer color, a box-shadow effect of -5px 50px 100px rgba(223, 241, 223, 0.5), whereas the font-weight of the profile title and content section gets changed to 600.