Unable to get 3 pics in 1 row

Hi there,

I’ve been messing around a few days now, trying to get my problem fixed. But until now I can’t seem to get the css code to were I want to.

I’m using the free Creative Portfolio theme from Dessign.net and as you can see here: https://dessign.net/creative-portfolio-theme-responsive-free/
It comes with 2 pictures side by side underneath the slider.

But, I want to have 3 pictures next to each other. Like they have here: https://dessign.net/sellwoocommercetheme/

I’ve tried multible options, but none of them seem to work.
This is how far I’ve got so far:
https://www.jonaswijtenburg.nl/wordpress/

I thought it should be in the next css code

[ Moderator note: code fixed. Please wrap code in the backtick character or use the code button. ]

/* Content */
#home_inside_cont { padding: 0 10px; }
#home_cont {  padding-top: 25px }
#content { padding-top: 25px; }

.cat { color: #999; text-align: center; margin: 0; font-size: 12px; font-family: 'Lato', sans-serif; font-weight: 300;   }
.cat a { color: #999; text-decoration: none; }
.cat a:hover { color: #000; text-decoration: none; }

.home_left { float: left; width: 1180px; }
.home_box { float: left; width: 250px; margin-top: 25px; margin-right: 25px;}
.home_box img { display: inline-block; }
.home_box img,
.home_box iframe { width: 100%; height: 335px; }
.home_box h3 { text-align: center; font-size: 20px; font-family: 'Lato', sans-serif; font-weight: 400; color: #333; letter-spacing: 1.5px; }
.home_box_media { position: relative; }
.home_box_hover { position: absolute; width: 100%; height: 100%;  background: url('images/black-trans.png') repeat; top: 0; left: 0; display: none; }
.home_box_row { display: table; height: 100%; width: 100%; }
.home_box_cell { display: table-cell; padding: 10px 60px; vertical-align: middle; text-align: center; color: #fff; font-size: 15px; line-height: 21px; }
.home_featured { margin: 30px 0; text-align: center; font-size: 24px; }
.home_bottom_box_cont { margin-top: 45px; }
.home_bottom_box { float: left; width: 325px; margin-right: 60px; font-size: 16px; }
.home_bottom_box_last { width: 410px; margin-right: 0; }
h3.home_bottom_title { margin: 0 0 45px; font-size: 22px; font-weight: normal; padding-left: 85px; background: url('images/black-line.jpg') no-repeat; background-position: center left; }
.home_bottom_contact input[type=text],
.home_bottom_contact input[type=email],
.home_bottom_contact textarea { width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box; background-color: #FCFCFC; border: 1px solid #E3E3E3; height: 40px; margin-top: 6px; padding-left: 8px; padding-right: 8px; }
.home_bottom_contact textarea { height: 190px; padding: 8px; }
.home_bottom_contact input[type=submit] { border: none; color: #fff; font-size: 16px; font-weight: bold; text-align: center; display: block; padding: 10px 0px; background-color: #BEBEBE; width: 100%; }
ul.home_bottom_blog_list { list-style-type: none; margin: 0; padding: 0; }
ul.home_bottom_blog_list li { margin-bottom: 13px; padding-bottom: 13px; border-bottom: 1px solid #ccc; }
ul.home_bottom_blog_list li h4 { font-size: 19px; font-weight: normal; margin: 0 0 10px; }
ul.home_bottom_blog_list li p { margin: 0;  font-size: 12px; }

I hope anyone can help me ??
Thanks in advance.