'Transition for element height between hover state

I cant seem to make my transition work for my element. I the box to animate to a larger and/or smaller height between hover states. What am I doing wrong?

body{
  background-color: #000;
}

.martin-testimonials {
  background-color: #fff;
  border-radius: 6px 6px 6px 6px;
  width:13%;
  padding: 40px;
  font-family: Open Sans,Arial,sans-serif;
  font-size: 15px;
  line-height: 27px;
}

.martin-testimonials .et_pb_testimonial_content {
    max-height: 108px;
    overflow: hidden;
    margin-bottom: 10px;
    -webkit-transition: height 0.9s;
    -moz-transition: height 0.9s;
    transition: height 0.9s;
}

.martin-testimonials:hover .et_pb_testimonial_content {
    max-height: none;
}
<div class="et_pb_module et_pb_testimonial et_pb_testimonial_0 martin-testimonials clearfix et_pb_text_align_left et_pb_bg_layout_light et_pb_icon_off et_pb_testimonial_no_image et_had_animation" style="">
                
                
                
                <div class="et_pb_testimonial_description" style="margin-left: 0px;">
                    <div class="et_pb_testimonial_description_inner"><div class="et_pb_testimonial_content">"Nunc consequat justo eget enim finibus porta. Suspendisse orci nunc, rutrum quis nunc sed, feugiat hendrerit massa. In cursus ornare sollicitudin. Nunc consequat justo eget enim finibus porta. Suspendisse orci nunc, rutrum quis nunc sed, feugiat hendrerit massa. In cursus ornare sollicitudin."</div></div>
                    <span class="et_pb_testimonial_author">Antonio Compbell</span>
                    <p class="et_pb_testimonial_meta"><span class="et_pb_testimonial_position">Student</span><span class="et_pb_testimonial_separator">,</span> <span class="et_pb_testimonial_company">Yoga Studio</span></p>
                </div>
            </div>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source