Equal Column Heights

Please see page here: https://www.010productions.com/wordpress/company-retreats/

Near the bottom of the page I have a row with 3 columns:

Conquering New Heights:
Authentic Leadership

Get Lost to Find Yourself:
Overcoming Your Own Limitations

Awakening the Force:
Creative Problem Solving for Emerging Leaders

How would I go about making the height of these three columns automatically the same when viewing on different devices/resolutions?

Is there a CSS code for this, and where would I implement the CSS?

Any help on this would be most appreciated!

Many thanks

James

P.s. here is the code:

[vc_column width=”1/3″ css=”.vc_custom_1459523518145{background-color: #232323 !important;}”][vc_empty_space height=”45px”][vc_icon icon_fontawesome=”fa fa-bullhorn” color=”white” size=”xl” align=”center”][vc_column_text]

Conquering New Heights:

Authentic Leadership

[/vc_column_text][vc_empty_space height=”45px”][/vc_column][vc_column width=”1/3″ css=”.vc_custom_1459523512319{background-color: #2b2b2b !important;}”][vc_empty_space height=”45px”][vc_icon icon_fontawesome=”fa fa-child” color=”white” size=”xl” align=”center”][vc_column_text]

Get Lost to Find Yourself:

Overcoming Your Own Limitations

[/vc_column_text][vc_empty_space height=”45px”][/vc_column][vc_column width=”1/3″ css=”.vc_custom_1459523499105{background-color: #303030 !important;}”][vc_empty_space height=”45px”][vc_icon icon_fontawesome=”fa fa-rebel” color=”white” size=”xl” align=”center”][vc_column_text]