/*
 * CSS for david.hgbrg.se
 */
@import url('reset.css');
body {
  font-family: Helvetica, Arial;
  font-size: 12px;
  color: #222729;
  line-height: 1.4; }

.struct {
  display: none; }

/**
 * frame
 */
#doc, .std {
  width: 950px;
  margin: 0 auto;
  position: relative; }

#footer {
  clear: both; }

/**
 * grids
 */
/* base construct */
.g {
  display: inline-block;
  width: 950px;
  clear: both; }

/** two slots (half-half) */
.g2 > div {
  width: 470px; }

.g .g2 > div {
  width: 220px; }

.g2 .s1 {
  float: left; }

.g2 .s2 {
  float: right; }

/* nested grids */
.g2 .g {
  width: 450px; }

/** two slots (more-little+little) */
.g2_2 > div {
  float: left; }

.g2_2 .s1 {
  width: 358px;
  margin-right: 10px; }

.g2_2 .s2 {
  width: 582px; }

/** three slots (little-little-more) */
.g3 > div {
  float: left;
  margin-right: 10px; }

.g3 > .s1, .g3 > .s2 {
  width: 286px; }

.g3 > .s3 {
  width: 358px;
  margin-right: 0; }

/** three slots (third-third-third) */
.g3_2 > div {
  width: 310px;
  float: left;
  margin-right: 10px; }

.g3_2 > .s3 {
  margin-right: 0; }

/**
 * grid styling
 */
/** standard frame */
#intro {
  margin-top: 30px;
  padding-top: 40px;
  margin-bottom: 30px; }

div#footer {
  border-top: 1px solid #ecece6;
  padding-top: 30px;
  color: #999;
  text-align: right;
  margin-bottom: 10px;
  margin-top: 30px; }

#footer p {
  margin: 0; }

/** padding, basically pad everything 10 pxs */
.s > p, .s > h3, .s > ul, .s > dl, .s > form,
.g > div > p, .g > div > h3, .g > div > ul, .g > div > dl, .g > div > form {
  padding: 0 10px; }

/**
 * navigation
 */
.nav {
  position: absolute;
  top: 5px;
  right: 0; }

/** 
 * text
 */
a {
  color: #1f7b93;
  text-decoration: underline; }

h1, h2, h3 {
  font-weight: normal; }

h1 {
  margin-bottom: 20px; }

h2 {
  font-size: 14px;
  padding: 1px 10px 0 10px;
  height: 30px;
  line-height: 34px;
  color: #354147;
  margin-bottom: 20px; }

h3 {
  text-transform: uppercase;
  font-size: 12px;
  margin: 15px 0 5px 0;
  color: #3c4739; }

h3 a {
  text-transform: none; }

h3:first-child {
  margin-top: 0; }

h3 + p {
  margin-top: 5px; }

.hilite1 {
  background: #dfe3de; }

.hilite2 {
  background: #fce6cb; }

.hilite3 {
  background: #fcf2c1; }

.hilite4 {
  /*border-bottom: 1px solid #ecece6;*/
  font-weight: bold;
  padding: 0; }

.hilite5 {
  padding: 0;
  font-weight: bold;
  margin-bottom: 0; }

h2.section, h3.section {
  font-weight: bold;
  margin-bottom: 15px; }

h2.txt {
  margin: 18px 0 13px 0;
  padding: 0;
  font-weight: bold;
  font-size: 16px; }

h2 small {
  font-size: 11px; }

p {
  margin: 15px 0; }

p:last-child {
  margin-bottom: 0; }

p:first-child {
  margin-top: 0; }

p.sub {
  margin-left: 15px; }

/* feed icon */
.feed {
  background: transparent url(images/feedicon.png) no-repeat 0 0;
  padding-left: 18px !important;
  display: inline-block; }

h2 .feed {
  line-height: 1.3;
  font-size: 12px;
  font-weight: normal; }

.hr {
  width: 75%;
  margin: 40px auto;
  border-top: 1px solid #ecece6; }

.hr1 {
  width: 100%;
  margin: 30px auto; }

.hr0 {
  border: none; }

.hr hr {
  display: none; }

/** dates */
.d {
  color: #333; }

/**
 * lists
 */
ul {
  margin-left: 20px; }

li {
  margin: 3px 0; }

dt {
  font-weight: bold;
  margin-top: 7px;
  margin-bottom: 1px; }

dt:first-child {
  margin-top: 0; }

li .desc {
  display: block;
  font-style: italic; }

/**
 * forms
 */
form {
  color: #465760; }

label {
  display: block;
  margin-bottom: 2px; }

form p {
  clear: both;
  margin: 15px 0; }

form p:last-child {
  margin-bottom: 0; }

#contact input[type=text] {
  width: 200px; }

#contact textarea {
  width: 336px; }

#contact input#q {
  width: 125px;
  margin-right: 5px; }

form .help {
  font-size: 10px; }

/**
 * messages
 */
div#msg {
  margin: 20px auto 0 auto;
  width: 600px; }

.msg {
  background: #ffd2da;
  padding: 12px 12px 8px 12px;
  margin-bottom: 20px; }

#doc div.msg > * {
  padding-left: 0;
  padding-right: 0; }

.msg > *:first-child {
  margin-top: 0; }

.msg > *:last-child {
  margin-bottom: 0; }

.msg h4 + * {
  margin-top: 10px; }

.msg ul {
  margin-left: 20px; }

.msg > * {
  margin: 10px 0; }

/**
 * masthead
 */
#intro p {
  max-width: 600px; }

#intro p.nav {
  width: auto; }

/**
 * running pages
 */
.old {
  text-decoration: line-through; }

.lowkey dt {
  font-weight: normal; }

dd.broken {
  text-decoration: line-through; }

/**
 * Work
 */
.work #doc {
  width: 100%; }

.work #intro p {
  max-width: 400px;
  font-size: 12px; }

.portfolio-w {
  width: 100%;
  display: inline-block;
  background: #e8edf0;
  padding: 30px 0; }

.portfolio {
  width: 950px;
  margin: 0 auto; }

.portfolio .item {
  width: 290px;
  float: left;
  margin: 0 0 0 10px;
  padding: 0 10px; }
  .portfolio .item h2 {
    font-weight: bold;
    padding: 0;
    margin: 0 0 5px 0; }
  .portfolio .item img {
    border: 1px solid #b7b7ae;
    padding: 2px;
    background: #fff; }
  .portfolio .item .href a {
    font-weight: bold; }
  .portfolio .item ul {
    list-style: none;
    margin: 3px 0 0 0;
    padding: 0;
    display: inline-block; }
  .portfolio .item li {
    /*display: inline-block;*/
    float: left;
    margin: 0 9px 0 0; }
  .portfolio .item li img {
    display: block;
    margin: 0; }
  .portfolio .item li.l {
    margin: 0; }

.portfolio .item-f {
  margin-left: 0; }