if you like to have it for the whole page (team) and you have no other ul on it which should not be influenced by that code you can do it without custom class:

.page-id-29 .avia_textblock ul {
    list-style: none outside;
}

.page-id-29 .avia_textblock ul {
    line-height: 1.2em;
}

.page-id-29 .avia_textblock ul li::before {
    content: "\2022";
    padding-right: 5px;
    font-size: 18px !important;
}

.page-id-29 .entry-content-wrapper .avia_textblock li {
    margin-left: -8px;
    display: flex
}

give a custom class to your text-block where you have placed the list
f.e.: smaller-dots

i do not see any custom css at all for the avia text block elements ? !

f.e. Josias van der Westhuize you have set the class for the ul – ok that will work too – but than you have to do the transform yourself –
on my code the avia-text block class is before ul
now you have ul.bothdot etc pp.
read carefully – thats all – I apologize because I formulate a little harshly now but I try to describe it as accurately as possible, but it will not be read exactly.

click to enlarge and see the difference:

you see here the svg with text :
it is placed as an image-alb not as background-image
because i added svg support to every avia_image the svg is inserted: https://webers-testseite.de/popup-contact-formelement/

and for example the “orange path” is a link to my homepage

this will work nice – Hover the path of the svg – but as background-image it is not inserted as svg itself i guess.

@Studio13SprayTan : https://coyotewebsitedesign.com/
great page – but on mobile there has to be some adaptations

see here f.e. :

maybe you add :

.entry-content-wrapper .smaller-dots li {
    margin-left: 0;
}

for less distance to the non list text

this is not true. The enfold contact form offers checkboxes if you like.
Look : https://webers-testseite.de/kontakt/

you can do it via :

and you can see in your screenshot that this what you see is the logo alternate – this is the logo used if header layout is set to transparency (including glassy) and you will find that on Enfold options dialog / header / transparency options

documentation is here: https://kriesi.at/documentation/enfold/custom-social-icons/

if you do not have a font icon of your “social-icon” you can use png files for that.

1 look for a png file you like to have
f.e.:

2 : upload it to your media library and copy the link – you will need it:

3 : now go to your functions.php of your child-theme and enter:
that little goodreads will be the addendum to the class set by enfold

function avia_add_custom_social_icon($icons) {
    $icons['Goodreads'] = 'goodreads';
    return $icons;
}
add_filter('avf_social_icons_options','avia_add_custom_social_icon', 10, 1);

with that you can now choose the new social icon on Enfold Options – Social Profiles ( it is at the end of the list)

4 : This comes to quick css ( you see here is the automatically created class av-social-link-goodreads )

#top #wrap_all .av-social-link-goodreads a:before{
    content: "";
    width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    background: url(https://link-to-your-image/goodreads.png) no-repeat center center;
    background-size: contain;
}

5 : styling the hover effect – this to quick css ( color makes no sense here because we have no font )

#top #wrap_all .av-social-link-goodreads:hover a{
    color:#fff; 
    background-color:#9fae37; 
}

6 : for another “social-icon” you only have to replace goodreads

yes but it seems that there is something missing !
i started with Enfold Options Elegant – then it is possible to have modern because it only goes an additional class to html (html_modern-blog)
but from that point it does not remove the globaly set elegant if i choose business .
– i will try a different solution now – but had to remove those settings for now

sorry – it seems not to work propper

the thing is that on html there are the classes added – (html_blog-elegant, html_blog-modern) if they were present the blog will look this way we know. But adding it via addClass has a timeshift – thats ugly – so best would be to have a filter there similar to header-styling.

and again you can have here too f.e. the choice of header style for each page ;)

add_filter('avf_builder_boxes', 'register_meta_boxes', 10, 1);
function register_meta_boxes($boxes){
$boxes[] = array( 'title' =>__('Layout','avia_framework' ), 'id'=>'layout', 'page'=>array('page' , 'post' , 'portfolio' ), 'context'=>'side', 'priority'=>'low');
return $boxes;
}

add_filter('avf_builder_elements', 'register_meta_elements', 10, 1);
function register_meta_elements($avf_builder_elements){
$avf_builder_elements[] = array(
						"slug"	=> "layout",
						"name" 	=> __("Menu and Logo Position", 'avia_framework'),
						"desc" 	=> __("You can choose various different logo and main menu positions here", 'avia_framework'),
						"id" 	=> "header_layout",
						"type" 	=> "select",
						"std" 	=> "",
						"subtype" => array( __('Logo left, Menu right', 'avia_framework')  	=>'logo_left main_nav_header menu_right',
											__('Logo right, Menu Left', 'avia_framework')	 	=>'logo_right main_nav_header menu_left',
											__('Logo left, Menu below', 'avia_framework') 	=>'logo_left bottom_nav_header menu_left',
											__('Logo right, Menu below', 'avia_framework') 	=>'logo_right bottom_nav_header menu_center',
											__('Logo center, Menu below', 'avia_framework') 	=>'logo_center bottom_nav_header menu_right',
										));
$avf_builder_elements[] = array(
				          "slug"  => "layout",
				          "name"  => __("Blog Styling", 'avia_framework' ),
				          "desc"  => __("Choose the blog styling here.", 'avia_framework' ),
				          "id"  => "blog_global_style",
				          "type"  => "select",
				          "std"   => "",
				          "no_first"=>true,
				          "subtype" => array( 
				                  __( 'Default (Business)', 'avia_framework' ) =>'',
				                  __( 'Elegant', 'avia_framework' ) =>'elegant-blog',
				                  __( 'Modern Business', 'avia_framework' ) =>'elegant-blog modern-blog',
				                    ));

return $avf_builder_elements;
}

hm – if you style your blogs via the blog alb – means if you setup a page f.e. and show your blog with blog ALB – we can create a meta-box on the right side of your editor page:

put this into functions.php of your child-theme:

add_filter('avf_builder_boxes', 'register_global_blog_style', 10, 1);
function register_global_blog_style($boxes){
    $boxes[] = array( 'title' =>__('Layout','avia_framework' ), 'id'=>'layout', 'page'=>array('page' , 'post' , 'portfolio' ), 'context'=>'side', 'priority'=>'low');
return $boxes;
}

add_filter('avf_builder_elements', 'register_meta_blogstyle', 10, 1);
function register_meta_blogstyle($avf_builder_elements){
  $avf_builder_elements[] = array(
          "slug"  => "layout",
          "name"  => __("Blog Styling", 'avia_framework' ),
          "desc"  => __("Choose the blog styling here.", 'avia_framework' ),
          "id"  => "blog_global_style",
          "type"  => "select",
          "std"   => "",
          "no_first"=>true,
          "subtype" => array( 
                  __( 'Default (Business)', 'avia_framework' ) =>'',
                  __( 'Elegant', 'avia_framework' ) =>'elegant-blog',
                  __( 'Modern Business', 'avia_framework' ) =>'elegant-blog modern-blog',
                    ));

return $avf_builder_elements;
}

you will have than on the right in Layout Options the choice of setting blog_style for each page
see here : https://webers-testseite.de/blog-seite-elegant/
and: vice versa: https://webers-testseite.de/blog-seite-modern/

Edit: hm now we have to support other themes – seems to me to be a proof of quality for Enfold.

if it wasn’t avada it will go this way:
the thing is that content gets a padding-top / padding-bottom of 50px !

so if you insert your hr element give it a custom class f.e. nopadding

and do this to functions.php of your child-theme:

function padding_to_parent_of_hr_nopadding(){
?>
<script>
(function($){
	$('div.hr.nopadding').closest('.content').css({"padding": "10px 0", "min-height": "0px"  });
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'padding_to_parent_of_hr_nopadding');

what does the code do – it looks for a hr with the class nopadding – if it finds some – it will search for the nearest parent element with class content and defines the padding for it.
this is something which could not be done by css – because we have to select the parent of a dif with class.

:lol Enfold is great : on avia-compat.js there are some checks concerning to devices. (test(navigator.userAgent))

as i did above with that code

var avia_is_mobile = false;
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) && 'ontouchstart' in document.documentElement)
{
	avia_is_mobile = true;
	document.documentElement.className += ' avia_mobile ';
}

so if it is a mobile the html document get the class avia_mobile

so we could use that allready for changings:
delete the function in your functions.php and try – this must be the same effect because avia-compat.js allready checked it an set that class to html:

.avia_mobile  #top.page-id-40 #full_slider_1,
.avia_mobile  #top.page-id-40 #av_section_1 .av_textblock_section.av-desktop-hide,
.avia_mobile  #top.page-id-40 #av_section_1 .avia-video.av-desktop-hide {
  display: none !important
}

.avia_mobile  #top.page-id-40 #full_slider_2 {
  display: block !important
}

please go to ipad settings / safari and empty the browser cache .

this is what i see on your page (click to enlarge):

Excuse my initial confusion, but you always have to see how it’s originally set in Enfold to overwrite it.
a separate own test page helps always better than anything else

i see on your page that it works now ( on my ipad it does show now the slideshow (not the film) even on landscape version)