/* Movable Type Ltd general stylesheet - version for html5 */

@import url(normalize.css);  /* necolas.github.com/normalize.css */
@import url(http://fonts.googleapis.com/css?family=Crimson+Text:400italic);

body
  {
  background: white;
  color: #333333;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 90%;  /* adjust from default 16px (!) to 9pt (@ 96ppi) */
  margin: 1em;
  max-width: 72em;
  padding-left: 90px; /* left margin: note margin-left won't work in IE */
  padding-right: 20px;
  line-height: 1.6;
  }

/* header class emulates header element */
header,         .header     { }
header hr,      .header hr  { margin-top: -0.4em; }
header a:hover, .header a:hover { text-decoration: none; }

h1 { font: italic 1.6em Garamond, "Crimson Text", "Times New Roman", Times, serif;
     margin-top: 0; margin-bottom: 0; }

p { margin-top: 1.0em; margin-bottom: 0.8em; }

p, li, td  { max-width: 65em; }

ul { margin: -0.5em 0 0.5em 3.2em; list-style: outside disc url(../images/listbullet.gif); }

form { margin-top: 1em; max-width: 65em; }
fieldset { border-radius: 5px; }
label              { font-style: italic; width: 9em; vertical-align: top; }
input, textarea    { font: Arial, Helvetica, sans-serif; }
input[type=number] { text-align: right; }
input + label      { font-style: normal; width: auto; } /* eg radio/checkbox labels */
form ul            { list-style: none; padding: 0; }
form li            { margin: 0.5em 1em; }

dt              { clear: left; float: left; font-weight: bold; width: 20%; }
dd              { margin-left: 20%; }

dd, dt          { padding-top: 1.5em; }

dl dl dt        { text-indent: -1em; width: 33%; }
dl dl dt:before { content: url(../images/listbullet.gif); }
dl dl dd        { font-style: italic; margin-left: 33%; }

.margin { margin-left: -150px; }

/* standard short-hand styles */
.align-right   { text-align: right; }
.align-top     { vertical-align: top; }
.border-none   { border: none; }
.float-left    { float: left; }
.float-right   { float: right; }
.margin-0      { margin: 0; }
.nowrap        { white-space: nowrap; }
.padding-0     { padding: 0; }
.width-auto    { width: auto; }
.width-full    { width: 100%; }
.grey          { color: #999999; }
.small         { font-size: 75%; } /* like <small> */

/* replace these... */
.hidden       { display: none; }
.clear-floats { clear: both; }

.w2  { width: 2em;  }
.w3  { width: 3em;  }  /* eg time */
.w4  { width: 4em;  }
.w6  { width: 6em;  }  /* eg date, postcode */
.w8  { width: 8em;  }  /* eg first/last name, town, phone  */
.w12 { width: 12em; }  /* eg addr1/2 */
.w16 { width: 16em; }  /* eg email */
.w24 { width: 24em; }
.w36 { width: 36em; }
.w48 { width: 48em; }
.ww  { width: 42em; }

/* validation */
label.error       { color: #990000; font-style: italic; margin-left: 1em; }
input.error       { border: 1px dotted #990000; }

/* suppress chrome/safari spin buttons: http://stackoverflow.com/questions/3790935/ */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
