Custom code I used to integrate The Event Calendar with Divi

default-template.php

<?php
/**
 * Custom Events Template
 * This file is the basic wrapper template for all the views if 'Default Events Template'
 * is selected in Events -> Settings -> Template -> Events Template.
 *
 * Override this template in your own theme by placing this file at [your-theme]/tribe-events/default-template.php
 *
 * @package TribeEventsCalendar
 *
 */

if ( ! defined( 'ABSPATH' ) ) {
	die( '-1' );
}

get_header(); ?>

<div id="main-content">

	<div class="container">
		<div id="tribe-events-pg-template">
			<?php tribe_events_before_html(); ?>
			<?php tribe_get_view(); ?>
			<?php tribe_events_after_html(); ?>
		</div> <!-- #tribe-events-pg-template -->
	</div>

</div>

<?php get_footer(); ?>

tribe-events.css

/* Custom CSS for Tribe Events Plugin */

.tribe-event-duration {
  font-size: .8em;
  line-height: 1.2em;
  color: #00AFB6;
  padding-top: 0;
  margin-bottom: 0;
}
.tribe-event-title {
  font-size: 1em;
  padding-top: .25rem;
  padding-bottom: .1rem;
}
.tribe-events-list-widget .tribe-events-list-widget-events {
  margin-bottom: .25rem;
}

.tribe-events-page-template #main-content .container:before {
 	content: none;
}

#main-content .tribe-events-list-widget-events .entry-title {
 	font-size: 1em; 
  	padding-bottom: 0;
}

#main-content .tribe-events-list-widget ol {
  padding: 0;
}

.tribe-events-list-widget ol li {
  margin-bottom: 1em;
  margin-left: -1em;
}

#main-content .tribe-events-widget-link a:hover, a.more-link:hover {
  text-decoration: underline; 
}
#tribe-events-content {
  margin-bottom: 0;
}
.tribe-events-button {
  margin-bottom: 1.2em;  
}