/* -*- Mode: CSS; tab-width: 4; indent-tabs-mode: nil; -*-
 *
 * http://cv.marknormanfrancis.com/
 * Feel free to use my CSS as a learning resource, but don't just copy it
 * wholesale. That makes kitty sad.
 */

@import url(http://yui.yahooapis.com/2.7.0/build/reset/reset.css);

/* Both font-fonts by Jos Buivenga (exljbris) -> www.exljbris.nl */
@font-face {
    font-family:            'Museo';
    src:                    url(museo.otf) format('opentype');
}
@font-face {
    font-family:            'Museo Sans';
    src:                    url(museo-sans.otf) format('opentype');
}

@media print {
    body {
        font-size:          11pt;
        padding-right:      0.5in;
    }
    .page-break {
        page-break-after:   always;
        background:         none !important;
    }
    a {
        text-decoration:    none;
    }
    .forts a:before {
        content:            '"';
    }
    .forts a:after {
        content:            '"';
    }
    #pdf {
        display:            none;
    }
    #activities {
        border-bottom:      1px dashed #999;
    }
    #activities li {
        display:            block !important;
    }
    #activities a:before {
        content:            attr(href) ' - ';
    }
    #activities li:after {
        content:            '';
    }
    /* over-ride to public url */
    #linkedin:before {
        content:            'http://www.linkedin.com/in/marknormanfrancis - '
                            !important;
    }
    #latest:after {
        content:            ' is available from http://cv.marknormanfrancis.com/';
    }
}

body {
    width:              840px;
    margin:             0 auto;
    position:           relative;
    font-family:        'Museo Sans',
                        'Calibri',
                        sans-serif;
}
body.debug {
    background:         url(grid-85.gif);
}
body * {
    line-height:        1.5em;      /* 24px / 16px */
}
a {
    color:              #000;
}
a[href^="mailto"] { 
    text-decoration:    none;
}

#pdf {
    float:              right;
    padding-top:        10px;
}
#header {
    margin-left:        340px;
    margin-bottom:      1.5em;
}
#header h1 {
    font-family:        'Museo',
                        'Constantia',
                        serif;
}
#header ul {
    margin-left:        0;
}
#header p {
    margin-left:        0;
    margin-bottom:      0;
    font-weight:        bold;
}
#links, #header a {
    color:              #999;
}
h1 {
    font-size:          2em;        /* 32px / 16px */
    line-height:        1.5em;      /* 48px / 32px */
    margin-bottom:      0.75em;     /* 24px / 32px */
}
address img {
    position:           absolute;
    top:                0;
    left:               85px;
}
address span {
    position:           absolute; 
    left:               -999em;
    width:              500em;
}
address a {
    display:            block;
}
#summary {
    margin-bottom:      -1.5em;
}


h2 {
    position:           absolute; 
    left:               -999em;
    width:              500em;
}


p, ul {
    margin-left:        340px;
    margin-bottom:      1.5em;
}


.section {
    padding-top:        1.5em;
    margin-bottom:      1.5em;
}
.job {
    background:         url(dots.gif) repeat-x top;
}
.section:after {
    content:            '.';
    display:            block;
    height:             0;
    clear:              both;
    visibility:         hidden;
}
h3 {
    font-family:        'Museo',
                        'Constantia',
                        serif;
    font-size:          1.25em;     /* 20px / 16px */
    line-height:        1.2em;      /* 24px / 20px */
    font-weight:        normal;
    width:              245px;
    text-align:         right;
    float:              left;
    color:              #999;
}
.job h3 em {
    line-height:        1.2em;      /* 24px / 20px */
    text-transform:     uppercase;
}
h3 em {
    display:            block;
    font-weight:        bold;
    color:              #000;
}
h3 span {
    position:           absolute; 
    left:               -999em;
    width:              500em;
}
div.dates {
    color:              #999;
    float:              left;
    clear:              left;
    width:              245px;
    text-align:         right;
    font-size:          0.875em;        /* 14px / 16px */
    line-height:        1.71428em;      /* 24px / 14px */
    margin-top:         1.71428em;      /* 24px / 14px */
    margin-left:        0;
    margin-bottom:      0;
}
div.dates span {
    display:            block;
}

.job.older {
    font-size:          0.875em;
    margin-bottom:      0.5em;
}
.job.older h3 {
    font-size:          1em;
}
.job.older p {
    margin-bottom:      0.75em;
}
.job.older div.dates {
    margin-top:         1.2em;
}

.run-on li {
    display:            inline;
    padding-right:      0.25em;
}
.run-on li:after {
    content:            ',';
}
.run-on li:last-child:after {
    content:            '';
}


#footer {
    font-size:          0.875em;        /* 14px / 16px */
    line-height:        1.71428em;      /* 24px / 14px */
    margin-top:         5.14285em;      /* 72px / 14px */
    color:              #999;
}
#footer a {
    display:            block;
}