SR2 supports the use of cascading style sheets (.css files) with both input and display templates and imposes no special restrictions on how you construct those style sheets. Because styles are centrally specified, individual users can't change them or add new ones.  Thus, you can use a style sheet to enforce styles across all pages. See http://www.w3.org/TR/html401/present/styles.html for tips on developing effective style sheets.

Note that SR2 only reads in classes from style sheets; that is, style names preceded by a dot - for example, .Heading1.  If you want a specific style to be available in the dropdown list of styles available to SR2 authors in the Content Editor, you must preface its name with a dot in the style sheet.  An example of such a specification would be:

.Heading1 {
     font-weight: bold;
     padding-bottom: 1.0pt;
     margin-top: 0pt;
     font-size: 14pt;
     background-color: #ffffff;
     font-family: Verdana, sans-serif;
}

In order to add/modify styles to the WYSIWYG, you need to add/modify the styles in the styles directory: <HOST_NAME>/styles/*.css

If you are using separate directories for the WYSIWYG and the website, make sure to change the website style.

Note:
If you don't see stylesheets selector in the WYSIWYG, then you do not have any stylesheets in the /style directory. Once you add stylesheets to the /styles directory you'll immediatly see the stylesheet selector in the WYSIWYG.

It doesn't matter what you call the name of the stylesheet, as long as it ends with .css