/* Reset */
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;
}

/* End reset */

/* Grid: 18px */
body {
    font-size:75%;
    font-family:Verdana,Arial,sans-serif
}
html>body {font-size:12px}
p {
    line-height:18px;
    margin:0 0 1em 0;
}
p.last {
    margin:0;
}

/* Text styles */
h1, h2, h3, h4, h5, strong {font-weight:bold}
h2 {font-size:1.75em;margin:14px 238px 7px 0;}
h3 {font-size:1.5em;margin:1.2em 0 0.5em 0;}
ul.links {padding:2em 0 1px 0 }
ul.links li {
    display:inline;
    padding:0 11px 0 6px;
    font-size:1.25em;
    font-weight:bold;
    border-right:2px solid #FFF;
}
ul.links li a {
    text-decoration:none;
}
ul.links li.last {
    border:0;
    padding-right:0;
}

a:link {color:#AAA}
a:visited {color:#AAA}
a:hover {color:#F11}
a:active {color:#F11}

.hidden {display:none}
br.clear {clear:both;line-height:0em;display:block;}
ul li {line-height:18px}

/* Structure */
body {
    text-align:right;
    background:url(../images/stars.png) top right repeat #000712; /* this will be better stars eventually */
    color:#FFF;
}
#main {
    margin:0 0 0 auto;
    padding:0;
    background:url(../images/moon.jpg)  top right no-repeat transparent;
}
#header {
    height:240px;
    background:url(../images/header.png) bottom right no-repeat transparent;
}
#body {
    width:700px;
    margin:0 0 0 auto;
}

#body .boxwrap {
    width:700px;
}
#body .hr {
    background:url(../images/box.png) bottom left no-repeat transparent;
    border:0;
    width:700px;
    padding:2em 0 0 0;
    margin:0 0 2em 0;
}
#body .hr hr {
    display:none;
}
#body .box {
    background:url(../images/box.png) top left no-repeat transparent;
    overflow:auto;
    padding:1em 0 0 0;
    width:700px;
    position:relative;
}
#body .box.first {
    padding-top:2em;
}
#body .box .image {
    width:237px;
    clear:both;
    float:right;
    padding-top:1em;
    border:1px solid transparent; /* IE hack */
}
#body .box .text {
    padding-top:1em;
    width:400px;
    float:right;
}
.image img {
    border:1px solid #000;
}
.image p {
    margin:-1px 1px 0 35px;
    line-height:16px;
    font-family:Arial;
    background:url(../images/box.png) bottom right no-repeat;
    width:202px;
}
#screens {
    text-align:center;
}
#screens li {
    display:inline;
}
#screens img {
    width:50px;
    height:50px;
    border:4px solid #000;
    margin:0.5em;
    text-align:center;
    position:relative;
    vertical-align:top;
}
#footer {
    color:#FFF;
    text-align:right;
    margin:3em 0 1.5em 0;
}

/* Bucket list styling */

ol {
    list-style:decimal;
    margin:1em 0;
    text-align:left;
}
ol li {
    margin-bottom:14px;
    line-height:18px;
    vertical-align:baseline;
    padding-left:1em;

}
.box .list {
    padding:0 38px 0 61px;
    margin-left:1em;
}