/*
---------------------------------- RESETS ---------------------------------- */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }

/*
---------------------------------- LAYOUT ---------------------------------- */
body { font-family: Arial, Helvetica, sans-serif; font-size: 62.5%; position: relative; background: #fff; color: #333; text-align: center; }
#wrapper { width: 958px; position: relative; margin: 40px auto 0 auto; text-align: left; min-height: 100%; }
#masthead { width: 958px; margin: 0; position: relative; float: left; }
.inner-content { float: left; width: 958px; margin: 10px 0 0 0; display: inline; background: url(../images/site-objects/nav-line-1.gif) no-repeat top left; padding: 30px 0 0 0; }
#footer { width: 958px; position: relative; margin: 0 auto; text-align: left; background: url(../images/site-objects/nav-line-2.gif) no-repeat top left; padding: 20px 0 0 0; clear: both; }
.left-column { float: left; width: 610px; }
.right-column { float: left; width: 300px; margin: 0 0 0 48px; display: inline; }


/*
---------------------------------- HEADER ---------------------------------- */
h1#name-static { background: url(../images/text/nickmurraywillis.gif) no-repeat; width: 885px; height: 178px; text-indent: -9999px; float: left; margin: 10px 0 0 5px;  }
h2 { background: url(../images/text/animator.gif) no-repeat; width: 116px; height: 30px; text-indent: -9999px; float: left; margin: -20px 0 0 749px; display: inline; position: relative; z-index: 2; }

/* navigation */
#masthead ul { width: 611px; margin: 40px 0 0 0; float: left; }
#masthead ul li { height: 52px; float: left; margin-right: 50px; overflow: visible; }
#masthead ul li.contact-link { margin-right: 0; }
#masthead ul li a { display: block; text-indent: -9999px; height: 52px; background-image: url(../images/site-objects/nav-bar.gif); background-color: transparent; background-repeat: no-repeat; }
#masthead ul li.home-link a { width: 76px; }
#masthead ul li.films-link a { width: 72px; }
#masthead ul li.about-link a { width: 87px; }
#masthead ul li.blog-link a { width: 64px }
#masthead ul li.contact-link a { width: 112px; }
#masthead ul li.home-link a, #masthead ul li.home-link a:link, #masthead ul li.home-link a:visited { background-position: 0 0; }
#masthead ul li.home-link a:hover, #masthead ul li.home-link a:focus, #masthead ul li.home-link a:active, #index #masthead ul li.home-link a { background-position: 0 -52px; }
#masthead ul li.films-link a, #masthead ul li.films-link a:link, #masthead ul li.films-link a:visited { background-position: -76px 0; }
#masthead ul li.films-link a:hover, #masthead ul li.films-link a:focus, #masthead ul li.films-link a:active, #films #masthead ul li.films-link a { background-position: -76px -52px; }
#masthead ul li.about-link a, #masthead ul li.about-link a:link, #masthead ul li.about-link a:visited { background-position: -148px 0; }
#masthead ul li.about-link a:hover, #masthead ul li.about-link a:focus, #masthead ul li.about-link a:active, #about #masthead ul li.about-link a { background-position: -148px -52px; }
#masthead ul li.blog-link a, #masthead ul li.blog-link a:link, #masthead ul li.blog-link a:visited { background-position: -235px 0; }
#masthead ul li.blog-link a:hover, #masthead ul li.blog-link a:focus, #masthead ul li.blog-link a:active, #blog #masthead ul li.blog-link a { background-position: -235px -52px; }
#masthead ul li.contact-link a, #masthead ul li.contact-link a:link, #masthead ul li.contact-link a:visited { background-position: -299px 0; }
#masthead ul li.contact-link a:hover, #masthead ul li.contact-link a:focus, #masthead ul li.contact-link a:active, #contact #masthead ul li.contact-link a { background-position: -299px -52px; }

/*
---------------------------------- CONTENT ---------------------------------- */
/* headings */
h1 { font-size: 5em; font-weight: normal; }
h2 { font-size: 3.8em; font-weight: normal; margin-top: 10px; }
h3 { font-size: 2em; font-weight: normal; }
h4 { font-size: 1.8em; font-weight: normal; }
h5 { font-size: 1.4em; font-weight: normal; }

/* text */
.left-column p,.right-column p { font-size: 1.4em; line-height: 1.6em; margin: 0 0 14px 0; }
.small-text { font-size: .8em; }

/*
------- HOME PAGE ------- */
#index #wrapper { padding: 40px 0 0 0; margin-bottom: 40px; overflow: hidden; }
#index #football-flash { float: left; margin: 0 0 0 86px; }
#index p { font-size: 3em; font-weight: bold; position: absolute; bottom: 0; right: 0; }
#index p a { color: #333; text-decoration: none; }
#index p a:hover { text-decoration: underline; }

/*
------- FILMS PAGE ------- */
#films .left-column { float: left; width: 300px; }
#films ul#film-links { font-size: 1.4em; line-height: 1.6em; margin: 0 0 14px 0; }
#films ul#film-links li a { color: #333; text-decoration: none; }
#films ul#film-links li a#selected { font-weight: bold; }
#films ul#film-links li a:hover { text-decoration: underline; }
#films ul#film-links li.music-icon a { background: url(../images/icons/music-note.gif) no-repeat top right; display: inline-block; padding-right: 25px; }
#films .right-column { float: left; width: 610px; margin: 0 0 0 48px; padding: 0 0 14px 0; display: inline; }
#films .right-column p { margin: 0; }
#films .right-column p a { color: #333; }
#films .right-column iframe { margin: 0 0 15px 0; }

/*
------- ABOUT PAGE ------- */
#about .inner-content #nick-flash { margin: 0 0 0 139px; }
#about .inner-content #nick-static { margin: 0 0 0 139px; float: left }
#about .inner-content p { font-size: 1.4em; line-height: 1.6em; margin: 0 0 14px 0; text-align: center; clear: both; }
#about .inner-content p a { color: #333; text-decoration: none; }
#about .inner-content p a:hover { text-decoration: underline; }
#about .inner-content p#cv-text a { background: url(../images/text/cv.gif) no-repeat 0 7px; width: 228px; height: 38px; text-indent: -9999px; display: block; padding: 0 0 20px 0; margin: 0 0 0 335px; }

/*
------- CONTACT PAGE ------- */
#contact .inner-content { height: 40em; }
#contact .inner-content p { font-size: 1.4em; line-height: 1.6em; margin: 0 0 14px 0; }
#contact .inner-content p a { color: #333; text-decoration: none; }
#contact .inner-content p a:hover { text-decoration: underline; }
#contact span#mobile-number { background: url(../images/text/phone.gif) no-repeat; width: 212px; height: 30px; text-indent: -9999px; margin: 10px 0; display: block; }
#contact span#email-address a { background: url(../images/text/email.gif) no-repeat; width: 220px; height: 40px; text-indent: -9999px; display: block; margin: 10px 0 0 0; }

/*
---------------------------------- FOOTER ---------------------------------- */
#footer { overflow: hidden; }
#footer p { background: url(../images/text/copyright.gif) no-repeat 0 7px; width: 268px; height: 43px; text-indent: -9999px; float: left; padding: 0 0 20px 0; }
#footer ul { float: right; font-size: 1.2em; }
#footer ul li { float: left; padding: 0 12px; }
#footer ul li#vimeo-link a { background: url(../images/text/vimeo.gif) no-repeat 0 7px; width: 54px; height: 19px; text-indent: -9999px; display: block; padding: 0 0 20px 0; }
#footer ul li#youtube-link a { background: url(../images/text/youtube.gif) no-repeat; width: 70px; height: 34px; text-indent: -9999px; display: block; }
#footer ul li#facebook-link a { background: url(../images/text/facebook.gif) no-repeat 0 3px; width: 82px; height: 26px; text-indent: -9999px; display: block; padding: 3px 0 0 0; }
#footer ul li#twitter-link a { background: url(../images/text/twitter.gif) no-repeat; width: 67px; height: 26px; text-indent: -9999px; display: block; }
