@charset "UTF-8";

/*
=========================================================
RESET
=========================================================
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}




/*
=========================================================
BLAH
=========================================================
*/

body { background: #f7f7f7; color: #7d7d7d; font-family: 'Metrophobic', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: 300; }

a { color: #871E9C; font-size: 14px; text-decoration: none; font-weight: 300; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: 300; }

p { line-height: 20px; margin-top: 15px; }

.clear { clear: both; }

ul, ol { list-style-type: none; }

img { position: relative; float: left; border: none; }

.wrapper { margin: 0 auto; width: 908px; }
.container { position: relative; float: left; width: 908px; }

input, textarea { font-family: 'Metrophobic', Helvetica, Arial, sans-serif; color: #7d7d7d; font-size: 14px; font-weight: 300; }

#bottomspace { position: relative; float: left; width: 908px; height: 100px; }




/*
=========================================================
HEADER
=========================================================
*/

#header { position: relative; float: left; width: 960px; }

#logo { position: relative; float: left; margin-left: 354px; width: 200px; margin-top: 100px; opacity: .9; }
#logo:hover { opacity: 1; }




/*
=========================================================
BODY
=========================================================
*/

#portfolio { position: relative; float: left; margin-top: 84px; width: 908px; }
#portfolio ul { position: relative; float: left; width: 924px; left: -16px; }
#portfolio ul li { position: relative; float: left; width: 292px; height: 188px; margin-left: 16px; margin-top: 16px; opacity: .8; box-shadow: 0 1px 2px #ccc; overflow: hidden; }
#portfolio ul li:hover { opacity: 1; }
#portfolio ul li img { width: 292px; height: auto; }