<div id="jwplayerplg1048id64420478649ff45cca622ff593ec42ab" class="jwplayer jw-reset jw-state-complete jw-skin-seven jw-stretch-uniform jw-flag-aspect-mode jw-flag-media-audio jw-no-focus jw-flag-user-inactive" tabindex="0" style="width: 100%; height: 270px;">

Option 1: Referencing the CSS on the page itself (Best Practice)
 
Directly embedding your CSS allows for your styles to load at the same time as your page. If we've placed the above CSS into a file (Which we'll call myskinfile.css), we can reference our .css file by placing the following in our HTML page's head:
 
<link rel="stylesheet" type="text/css" href="//yoursite.com/yourstyles/myskinfile.css"> </link>
 
Once the above is loaded, your player configuration will still need to reference the style appended to .jw-skin- within the skin.name configuration. In this case, we've called this myskin
 
jwplayer('myElement')setup({
    "skin": {
    "name": "myskin"
    }
});