How to style the "read more" link?

Here’s some CSS from a theme I’m installing. The trigger is adding the “more-link” class to the link.

HTML from View Source
<a href="https://my-site/my-post-url/" class="more-link">Read more</a>

=============================
CSS styling

a.more-link:link, a.more-link:visited {
    -moz-border-radius: 3px 3px 3px 3px; /*round corners*/
    background: #7f7e7e;
    border: 1px solid #555555;
    color: #FFFFFF;
    float: right;
    font-family: some-font;
    font-style: italic;
    margin: 0;
    padding: 5px 10px;
    text-decoration: none;
 }

===============================
If you need the code to turn the read more ellipse into a text link, this goes in the theme’s functions.php file:

function excerpt_ellipse($text) {
   return str_replace(' [...]', '<a class="more-link" href="'.get_permalink().'"><br />Read more</a>', $text); }
add_filter('the_excerpt', 'excerpt_ellipse');

thanks for your reply.
I completely get the css and function code but I am not sure what to do with the code below which is in my index page? What do I need to do to the [Read More…] line? Thanks in advance.

`<?php
if(sp_get_option(‘content_archive’) == ‘full’) :
the_content(__(‘[Read more…]’, ‘genesis’));
else :
if(genesis_get_option(‘thumbnail’))
genesis_image(array(‘format’ => ‘html’, ‘size’ => genesis_get_option(‘image_size’), ‘attr’ => array(‘class’ => ‘alignleft post-image’)));
the_excerpt();
endif;
?>

Do you have a URL you can post on which I can see what you have now? That will make it easier.

Here is also this general guide: Customizing the Read More