@font-face {
font-family: 'DIN1451MittelschriftRegular';
src: url('/fonts/din1451m-webfont.eot');
src: local('☺'), url('/fonts/din1451m-webfont.woff') format('woff'), url('/fonts/din1451m-webfont.ttf') format('truetype'), url('/fonts/din1451m-webfont.svg#webfonts2XZ8o7x') format('svg');
font-weight: normal;
font-style: normal;
}

/* =white-space reset
----------------------------------------------- */
body, h1, h2, h3, h4, h5, p, ol, ul, li, pre, form {margin: 0; padding: 0;}

/* =skin
----------------------------------------------- */
body {color: #585858; background: #fff url(/i/fade.png) repeat-x;}

h1, h1 a:link, h1 a:visited, h2, h4, h5, #nav li, #content ul, .shout strong {color: #333;}

h1 strong, h3, a:link, a:visited, a:hover, #content .shout .readMore {color: #ec118f;}
a:hover {border-bottom-color: #ec118f;}

a:focus, a:hover, .text:focus, textarea:focus, .submit {background: #fcfcfc;}
.text:focus, textarea:focus, .submit:focus {border-color: #ec118f;}
#content img, #content form, #content .vcard {border-color: #dedede;}

/* =generally
----------------------------------------------- */
body {font-size:x-small;}
h1, h2, h3, h4, h5, p, ul, li, address, input, textarea {font-family: arial, "helvetica neue", helvetica, sans-serif;}
code {font-family: consolas, "lucida console", monaco, monospace;}
p, ul, ol, pre {font-size: 130%; line-height: 1.23;}
a img, abbr {border: none;}
a:link, a:visited {text-decoration: none; font-weight: normal;}
a:hover {border-bottom-width: 1px; border-bottom-style: dashed;}
a.imgLink:hover {border: none; background: none;}

form br {display: none;}
label {display: block; margin-bottom: .123em; font-weight: bold; color: #333; cursor: pointer;}
label em {font-weight: normal; font-style: normal; color: #585858;}
textarea {overflow: auto;}
p input, p textarea {border: 1px solid #7F9DB9; color: #585858; font-size: 100%;}
.submit {padding: 2px; font-weight: bold; cursor: pointer;}

/* =structure
----------------------------------------------- */
#wrap {position: relative;
margin: 0 auto;
width: 62em;}

#head {position: relative;
height: 50px;}

#nav {position: absolute;
top: 53px;
left: 14px;
padding-top: 6.9em;}

#content {position: absolute;
top: 53px;
left: 13.4em;
margin-left: 6.9em;
padding-top: 6.9em; 
padding-bottom: 23px;
width: 40.8em;}

#foot {position: absolute;
top: 40.9em;
left: 14px;}

/* =headings
----------------------------------------------- */
h1, h2, h3 {line-height: 31px; font-size: 27px; font-size-adjust: .519; font-weight: normal; font-family: DIN1451MittelschriftRegular, arial, "helvetica neue", helvetica, sans-serif;}

h1 {position: absolute;
top: 54px;
left: 13px;
width: 7em;
height: 50px;
line-height: 23px;}
h1 a:hover {border: none; background: none;}

h1 strong {position: absolute; top: .926em; left: 0; font-weight: normal;}

h2 {position: absolute; top: -3px; left: 0;}

h3 {position: absolute; top: .815em; left: 0;}

/* =specifics
----------------------------------------------- */
#nav ul {list-style: none; margin-bottom: 1.3em; line-height: 1.3em; font-weight: bold;}
#nav li {margin:0;}

#content h4, #content h5 {margin: 0 0 1.207em; font-size: 140%; line-height: 1.207;}
#content p {line-height: 1.3em; margin-bottom: 1.3em;}
#content ul {list-style: square; margin-bottom: 1.3em; line-height: 1.231em;}
li {margin-left: 16px;}
#content img {margin-left: 1px; margin-top: .3em; border-width: 1px; border-style: solid; -moz-box-shadow: 0 4px 8px #dedede;-webkit-box-shadow: 0px 4px 8px #dedede;box-shadow: 0px 4px 8px #dedede;}

#content .meta {color:#888;font-size:84.6%;}

#content form, #content .vcard {position: relative; top: 3px; margin: 0 0 1.5em 1px; padding: 1.1em 0 0 14px; border-width: 1px; border-style: solid;  }
#content form {padding-bottom: .37em; -moz-box-shadow: 0 4px 8px #dedede;-webkit-box-shadow: 0px 4px 8px #dedede;box-shadow: 0px 4px 8px #dedede;}
#content .vcard .fn, #content .vcard .org {display: none;}
.vcard p, form p {margin-bottom: .83em;}

#content .shout {margin-top: -26px; width: 11.1em; line-height: 1.23; font-size: 27px;}

#ask-hero {position: relative; left: -5px; top: 8px; z-index: 1; color: #c00;}
#ask-hero img {margin-top: 0; border: none; -moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;}
#ask-shout {display:block; position: relative; top: -2px; left: 0; z-index: 2;}
#ask-shout a {position: relative;}

.doc {padding: 1px 0 1px 17px; width: 20px; background: url(/i/doc.png) no-repeat right;}
.feeds li {list-style: none; margin: 0 0 .15em 0; padding-left: 16px; background: url(/i/feed-icon-12x12.gif) no-repeat 0% 50%;} 
.readMore {position: relative; top: 3px; left: 2px; background: none;}


#content .validationerrors h4 {visibility: visible; margin: 0 0 .844em; padding: 4px 0 4px 30px; background: url(/i/error-icon-24x24.gif) no-repeat 0% 50%;}
#content .validationerrors ol {list-style-position: inside; margin: .889em 0 1.23em; line-height: 1.3;}
#content .validationerrors ol li {font-weight: bold; color: #c33;}
#content .validationerrors a {font-weight: bold; color: #c33;}
#content .validationerrors a:hover {border-color: #c33;}
#content a.submissionerror {text-decoration: none; border: none; background: none;}


#foot #validators {line-height: 1.4;}

.fdpoweredby {display:none ! important;}

/* =print
----------------------------------------------- */

@media print {
body {font-size: 10.5pt;}
#wrap p, #wrap li, #wrap pre {color: #333;}
#head, #nav, #foot, #wrap form, #subscribe, .noPrint {display: none;}
#wrap {margin: 0 5%; width: auto;}
#wrap #content {position: static; margin: 0; padding: 0; width: auto;}
#wrap h1 {position: static; margin-bottom: .5em; width: auto; height: auto;}
#wrap h2, #wrap h3, h1 strong {position:static;}
#wrap li {padding-left: 0; margin-left: 0;}
#wrap a:link, #wrap a:visited, #wrap a:hover {border: none; text-decoration: underline;}
#content a:link:after, #content a:visited:after {content: " (" attr(href) ") "; font-size: 90%;}
#content a[href^="/"]:after {content: " (http://scottboyle.co.uk" attr(href) ") ";}
#content a[href^="mailto:"]:after {content: "";}
#content .shout {white-space: normal;}
#content .vcard .fn {display: block;}
}
