move breadcrumbs under title bar

as in this thread: https://kriesi.at/support/topic/how-to-move-breadcrumbs-to-above-footer/
I want to move my breadcrumbs. Only in my case I want to move them to just below the title bar (outside the title bar).

I tried this function, (which works)

function ava_before_footer_breadcrumb() {
    $args = array(
			'title' => '',
			'breadcrumb' => true,
			'class' => 'socket_breadcrumb stretch_full container_wrap alternate_color '.avia_is_dark_bg('alternate_color', true)
	);

    echo avia_title($args);
}
add_action('ava_before_footer', 'ava_before_footer_breadcrumb');

// breadcrumb socket
function ava_custom_script_breadcrumb_socket() {
?>
	<script type="text/javascript">
	(function($) {
		function a() {
			$('#main .title_container:not(".socket_breadcrumb")').remove();
			$('#main .socket_breadcrumb').detach().insertBefore('#socket');
		}

		a();
	})(jQuery);
	</script>
<?php
}
add_action('wp_footer', 'ava_custom_script_breadcrumb_socket');

and attempted to change this line:
add_action(‘ava_before_footer’, ‘ava_before_footer_breadcrumb’);
to
add_action(‘ava_before_content’, ‘ava_before_footer_breadcrumb’);
or
add_action(‘ava_after_main_title’, ‘ava_before_footer_breadcrumb’);

but none seemed to work

the documentation: https://kriesi.at/documentation/enfold/breadcrumbs/
shows to just add this css

.title_container .breadcrumb {
    top:auto;
    color: black!important;
    left: 0;
    padding-top: 25px;
}

but that doesn’t actually take it out of the title bar. I want it out so that it’s in white, not in the title bar color.