/************************************************
 *
 *  File     :  css/screen.css
 *  Medium   :  Screen
 *  Version  :  8.0? (I lost count)
 *  Website  :  Pud.ca
 *  Author   :  Pud.ca (c) 2012 // 'Drej
 *
 ************************************************/

/* global */
    html {
        background: url(../img/bg_html.jpg);
        overflow: auto;
    }

    body { 
        cursor: default;
        width: 620px;
        margin: 0 auto;
        font-family: 'Nobile', Helvetica, Arial, sans-serif;
        font-size: 16px;
        line-height: 25px;
        text-align: center;
        color: #fff;
        text-shadow: 1px 1px 0 #b87000;
    }

    /* image replacement */
        h1, ul li a
        	{ display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
   
    /* headings */
        h1 {
            width: 125px;
            height: 125px;
            background: url(../img/bg_logo.png);
            margin: 2em auto;
        }

        h2 {
            font-family: 'Lobster', Georgia, Times, serif;
            font-size: 70px;
            line-height: 100px;
            color: #fff;
            text-shadow: 2px 2px 0 #b87000;
        }
    
    /* anchors */
        a {
            color: #fff;
            opacity: .8;
            -webkit-transition: all .2s ease-in-out;
            -moz-transition: all .2s ease-in-out;
            -o-transition: all .2s ease-in-out;
            transition: all .2s ease-in-out;
        }
        
        a:hover {
            opacity: 1;
            color: #000;
        }
        
        footer a {
            text-decoration: none;
            border-bottom: 1px dotted #fff;
        }
        
        footer a:hover {
            border-color: #000;
        }
/* // global */

/* page structure */
    header {
        padding-top: 8em;
    }
    
    footer {
        margin: 2em 0;
        padding: 2em 0;
        border-top: 1px solid rgba(255,255,255,.2)
    }
/* // page structure */

/* content */
    section p {
        margin: 1em 0;
    }
    
    /* social */
        ul {
            list-style: none;
            padding: 0;
            margin: 2em 0;
        }
        
        ul li {
            display: inline-block;
            width: 64px;
            height: 64px;
            position: relative;
        }
        
        ul li a {
            width: 64px;
            height: 64px;
            background: url(../img/s_social.png) 0 0;
            position: absolute;
            top: 0;
        }
        
        ul li a:hover {
            top: -5px;
        }
        
        ul li.twi a { background-position: 0 0 }
        ul li.git a { background-position: -64px 0 }
        ul li.lin a { background-position: -128px 0 }
        ul li.fac a { background-position: -192px 0 }
        ul li.ema a { background-position: -256px 0 }
    /* // social */
/* // content */