@import url(http://www.stuffandnonsense.co.uk/styles/css3); 
@import url(http://www.stuffandnonsense.co.uk/styles/iphone) screen and (max-device-width:480);

@media screen {

/* Revision number:  2.0 (obviously)
    Last updated:        16th November 2007
    Last updated by:   Andy Clarke ( aceface@stuffandnonsense.co.uk ) 
    This file is not a template and may not be reproduced. */

/*  =reset.css 
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */

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, 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-weight : inherit; font-style : inherit; font-size : 100%; font-family : inherit; vertical-align: baseline; background : transparent;  }

:focus { outline : 0; } 
ol, ul { list-style : none; }
table { border-collapse : collapse; border-spacing : 0; }
caption, th, td { text-align : left; font-weight : normal; }

/* =html */
html { background : #fff; color : #0f1214; }	

/* =body */
body { font : normal 69%/1.6 "Lucida Grande", Verdana, Arial, sans-serif;  }

/* =blocktext */
h1, h2, h3, h4, h5, p, blockquote, address, dl, ul, ol { margin : 0 15px; padding : .5em 0; }

/* =h1 */
h1 { position : absolute; top : -25px; left : 75px; z-index : 2; width : 165px; height : 180px; margin : 0; padding : 0; background : url(../siteimages/h1.png) no-repeat 0 0; }
.work h1 { left : 15px; }

/* =h2 */
h2 { font : bold 240% Palatino, Georgia, Times, serif; }
#branding h2 { position : absolute; top : -9999px; }
#content_sub h2 { font-size : 300%; background : url(../siteimages/h_line_one.png) repeat-x 0 100%;}

/* =h3 */
h3 { clear : left;  margin-top : 30px; font : bold 160% Palatino, Georgia, Times, serif; }
h3:first-child { margin-top : 0; }
form h3 { margin-left : 0; }
#form_info h3 { margin-left : 15px; }
#nav_archives h3 { margin-top : 30px; }

/* =h4 */
h4 { font-size : 120%; font-weight : bold; }
#nav_sub h4 { position : absolute; top : -9999px; }
#content_promo h4 { padding-bottom : 0; }
.article #content_main > h4 { font-size : 140%; margin-top : 18px; padding-top : 18px; border-top : 1px solid #ccc; }

/* =h5 */
h5 { font-size : 110%; font-weight : bold; }
li h5 { margin-left : 0; }

/* =p */
p { font-size : 100%; }
li p { margin-left : 0; }
form div p { margin-left : 0; }
dd p { margin-left : 0; padding-top : 0; }
.article h2 + p { margin-bottom : 1em; padding-bottom : 2em; font-weight : bold;  background : url(../siteimages/h_line_one.png) repeat-x 0 100%; }
.article blockquote p:first-child { padding-bottom : 0; }
.article blockquote p:last-child { padding-top : 0; }
#testimonials blockquote p { text-align : center; }
#content_main .one p:first-child { margin-bottom : 15px;  padding-bottom : 30px;  background : url(../siteimages/h_line_one.png) repeat-x 0 100%;  font-weight : bold; }
#content_main .three > h3:first-child + p { font-weight : bold; }
#siteinfo p { color : #ae888b; }
.work #content_intro p { font-weight : bold; }
p.rss { padding-left : 15px; background : url(../siteimages/a_rss.png) no-repeat 0 50%; }

/* =.index blockquote */
.index blockquote { padding : 1.5em 0; }
.index blockquote p { text-align : center; }
.index blockquote p:first-child { padding : 0; font : normal 120% Palatino, Georgia, Times, serif; font-style : italic; }

/* =.article blockquote */
.article blockquote { margin-bottom : 1em; border-left : 1px solid #ccc; }
.more blockquote { width : 80%; font : normal 120% Palatino, Georgia, Times, serif; font-style : italic; text-align : center; }
#recommendations blockquote { float : left; width : 45%; }
li blockquote { margin-left : 0; padding-left : 15px; }
#testimonials blockquote { padding-left : 15px; border-left-width : 0; }

/* =kbd/del/ins */
kbd { text-decoration : underline; }
del { color : #999; }
abbr { cursor : help; }
ins { text-decoration : none; }

/* =strong/b/em/i */
strong, b { font-weight : bold; }
em, i { font-style : italic; }

/* =address */
address { font-style : normal; }
address span { display : block; }

/* =pre */
pre, code { font : 115% monospace; }

/* =dl/dt/dd */
dt { font-weight : bold; }
dd { padding-bottom : .5em; }

/* =ul */
ul { list-style-type : none; }
ul ul { margin-left : 0;  }
ul + ul { margin-top : 5px; border-top : 1px dotted #ccc;  }
#nav_access { position : absolute; top : -9999px; margin : 0; }
.index #nav_sub ul { min-width : 960px; max-width : 1380px; width : 98%; margin : 0 auto; }

/* =ol */
ol ol { margin-left : 0; }

/* =li */
#nav_sub li { display : inline; margin-right : 10px; padding-right : 10px; border-right : 1px solid #999; }
.index #nav_sub li:first-child { padding-left : 15px; }
#nav_sub li:last-child { border-right-width : 0; }

/* =img */
img, a img { border : none; }
img.l { position : relative; left : -25px; float : left; margin : 0 -15px 5px 0; }
img.r { float : right; margin : 0 0 0 10px; }
img.cs { position : relative; left : 330px; float : right; margin : 0 0 0 -330px; }

/* =hr */
hr { display : none; }
.clear { clear : both; }

/* =a */
a, a:visited { color : #5d1117; font-weight : bold; text-decoration : none; }
a:hover { color : #450c07; text-decoration : underline; }
a:active, a:focus { color : #000; text-decoration : underline; }
h1 a { display : block; height : 180px; text-indent : -9999px;  }

#nav a, #nav a:visited { font : bold 140% Palatino, Georgia, Times, serif; text-decoration : none; color : #fff; display : block; width : 99%; }
#nav a:hover { text-decoration : underline; }
table[id="nav"] em a { display : block; width : 24px; height : 28px; text-indent : -9999px; }
#content_sub .vevent a { display : block; }

a[title*="MediaTemple"] { float : left; display : block; width : 35px; height : 15px; background : url(../siteimages/a_mt.gif) no-repeat 0 4px; text-indent : -9999px; }
#siteinfo a, #siteinfo a:visited, #siteinfo a:hover { color : #fff; text-decoration : underline; }

/* =table */
table { width : 100%; margin : 0; font-size : inherit; }
#product table { margin-left : 15px; }

/* =caption */
caption { font-weight : normal; text-align : center; }
#nav caption { display : none; }

/* =thead */
#nav thead { display : none; }

/* =tr */
tr { padding : .5em 0; }
table[id="nav"] tbody tr { background : url(../siteimages/nav_main_tr.png) repeat-x 0 100%; }
table[id="nav"] tbody tr+tr { background-position : 50% 100%; }
table[id="nav"] tbody tr+tr+tr { background-position : 100% 100%; }
table[id="nav"] tbody tr:hover { background-color : #67130a; }
table[id="nav"] tbody tr:last-child { background-image : none;  }
tr#easterEgg { display : none; }
table[id="nav"] td[class="numeral"] em { display : block; width : 24px; height : 28px; }
tr[class="one"] .numeral em { background : url(../siteimages/tr_one_n.png) no-repeat 0 50%; }
tr[class="two"] .numeral em { background : url(../siteimages/tr_two_n.png) no-repeat 0 50%; }
tr[class="three"] .numeral em { background : url(../siteimages/tr_three_n.png) no-repeat 0 50%; }
tr[class="four"] .numeral em { background : url(../siteimages/tr_four_n.png) no-repeat 0 50%; } 
tr[class="five"] .numeral em { background : url(../siteimages/tr_five_n.png) no-repeat 0 50%; } 

/* = th td */
th, td { padding : .25em 1.5em .25em .25em; vertical-align : top; }

/* =form */
form { margin-left : 15px; }
#comment_form { margin-top : 1em; padding-top : 1em; background : url(../siteimages/h_line_one.png) repeat-x 0 0;  }
#product form { min-height : 90px; margin : 15px 0; padding-left : 100px; background : #faf4f3 url(../siteimages/img_badge.jpg) no-repeat 0 0; border : 1px solid #e9dddc; }

/* =fieldset */
fieldset { overflow : hidden; padding : 1em 0; }

/* =legend */
legend { font-weight : bold; }

/* =label */
label, label span { display : block; }
label span { font-size : 100%;  font-weight : bold; }

.contact label, .comments label { overflow : hidden; padding-bottom : .5em; }
.contact label span, .comments label span { display : block; float : left; width : 30%; }
.contact label.textarea span, .comments label.textarea span { display : block; float : none; width : auto; }

/* = input */
.contact fieldset input, .comments fieldset input { float : left; padding : .15em 0; width : 200px; font : 99% "Lucida Grande", Verdana, Arial, sans-serif;  }
.contact fieldset input { background : url(../siteimages/input.png) repeat-x 0 100%; border-width : 0;   }
.comments fieldset input { border : 1px solid #ccc;  }
fieldset.cb input { width : auto; }

/* =textarea */
.contact textarea, .comments textarea { padding : .15em 0; border : 1px solid #ccc; font : 99% "Lucida Grande", Verdana, Arial, sans-serif;  }
.contact textarea { width : 400px;  }
.comments textarea { width : 360px;  }

/* =select */
select { float : left; width : 200px; font : 100% "Lucida Grande", Verdana, Arial, sans-serif;  }

#content_promo { margin : 0 15px; padding-bottom : .5em; border : 1px solid #ae888b; /* background-color : #d7c4c5; */ }
#recommendations { margin-top : 15px; }
form div { padding : .5em 0; } 
#form_data { float : left; width : 400px; }
#form_info { float : left; width : 200px; }
.details { line-height : 1.8; color : #666; }

/* =widgets */

/* =iotbs */
#screen-switcher form { padding : 0 0 0 5px; }
#screen-switcher label span { display : block; float : left; width : 26.5%; }
#screen-switcher select { float : left; margin-left : 1%; width : 200px;  }
#print-switcher form { padding : 0 0 0 5px; }
#print-switcher label span { display : block; float : left; width : 26.5%; }
#print-switcher select { float : left; margin-left : 1%; width : 200px;  }

/* =vcard */
.vcard  { font-size : 100%; }
.vcard .org { display : block; margin : 0 15px;  }
.vcard a span { display : inline; }
.vcard div { margin : 0 15px; }
.vcard .adr span { display : inline; }

.contact .vcard .street-address { display : block; }
.contact .vcard .locality { display : block; } 
.contact .vcard .region { display : block; }
.contact .vcard .postal-code { display : block; } 
.contact .vcard .email { display : block; } 
.contact .vcard .tel { display : block; } 
.contact .vcard a[rel="hcard"] { display : block; } 

/* =vevent */
.events .vcalendar { padding-left : 35px; background : url(../siteimages/ico_mf.png) no-repeat 0 15px; }
/* .events #content_sub .vcalendar { padding-left : 0; background-image : none; } */
.events .vevent { margin-bottom : 15px; }
.events .vcalendar li:first-child h5 + p { font-weight : bold; }

/* =past events */
ol#past { padding-left : 0; background-image : none;  }

/* =nav_events, nav_writing, widget_resources */
#nav_events, #nav_writing, #widget_resources { padding-bottom : 15px; background : url(../siteimages/h_line_one.png) repeat-x 0 100%; }
#nav_events h5, #nav_writing h5, #widget_resources h5 { margin-left : 0; padding-bottom : 0; }
#nav_events p, #nav_writing p, #widget_resources p { padding-top : 0; }

/* =content_writing */
.writing #content_main li { padding-bottom : 15px; }

/* =content_partners */
#content_partners dt { clear : left; }
#content_partners dd { padding-bottom : 30px; }
#content_partners img  { float : right; margin : 0 0 0 5px; padding : 2px; border : 1px solid #ccc; }

/* =comments */
.comments li h4 { margin-left : 0; }
.comments li h4 span { font-size : 88%; color : #666; }
.comments li blockquote { margin : 0 0 15px 0; padding-bottom : 30px; padding-left : 0; border-left-width : 0;  border-bottom : 1px solid #ccc; }
.comments li:last-child blockquote { margin : 0; padding-bottom : 0; border-bottom-width : 0; }

/* =magnolia */
.magnolia-linkroll { /* tba */ }
.magnolia-linkroll h2 { display : none; }
.magnolia-linkroll dl { /* tba */ }
.magnolia-linkroll dt { /* tba */ }
.magnolia-linkroll dd { /* tba */ }

/* =layout */
#nav_main { width : 100%; padding : 15px 0; background : #5d1117 url(../siteimages/nav_main.png) repeat-x 50% 100%;  }
#container { position : relative; }
#content { width : 100%; padding : 180px 0 2em 0; }
#nav_sub { clear : both; width : 100%; padding : 1em 0; background : url(../siteimages/h_dotted_one.png) repeat-x 0 0; }
#siteinfo { position : relative; clear : both; width : 100%; min-height : 120px; background  : #5d1117 url(../siteimages/siteinfo.png) repeat-x 50% 0; color : #ae888b; }
#siteinfo .one { margin : 0 auto; padding : 3em 0; }

/* =article layout */
.article #nav { width : 960px; margin : 0 auto; }
.article #container { width : 960px; margin : 0 auto; }
.article #content:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.article #content_main { float : left; width : 620px; }
.article #content_sub { position : relative;  top : -120px; float : right; width : 339px; margin-bottom : -120px; }
.article #nav_sub { width : 960px; margin : 0 auto; }
.article #siteinfo .one { width : 960px; }

/* =contact layout */
.contact #content_main { position : relative;  top : -120px; float : right; margin-bottom : -120px; }
.contact #content_sub { float : left; top : 0; }

/* =work layout */
.work #nav { width : 960px; margin : 0 auto; }
.work #container { width : 960px; margin : 0 auto; }
.work #content:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.work .wrapper { width : 960px; margin : 0 auto; padding-bottom : 30px; }
.work .first { margin-bottom : 30px; padding-bottom : 30px; background : url(../siteimages/h_line_one.png) repeat-x 0 100%; }
.work .wrapper:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.work .col { position : relative; float : left; width : 49.5%; }
.work #content_intro { position : absolute; top : 30px; left : 200px; width : 700px; }
.more #content_intro { position : absolute; top : 60px; left : 200px; width : 700px; }
.more .col { position : relative; float : left; width : 33%; }
.more .ssp .col { width : 240px; }
.more .ssp .ss { width : 475px; }
.more .bg { padding-top : 15px; background : url(../siteimages/h_line_one.png) repeat-x 0 0; }

.work #content_main { float : left; width : 620px; }
.work #content_sub { position : relative;  top : -120px; float : right; width : 339px; margin-bottom : -120px; }
.work #nav_sub { width : 960px; margin : 0 auto; }
.work #siteinfo .one { width : 960px; }

/* =index layout */
.index #container { min-width : 960px; max-width : 1380px; width : 98%; margin : 0 auto; }
.index #nav { min-width : 960px; max-width : 1380px; width : 98%; margin : 0 auto; }
.index #content_main { width : 100%; padding : 0; }
.index #content_main:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.index #content_main > div { padding-bottom : 1em; }
.index #content_main .one { float : left; width : 37.5%; }
.index #content_main .two { float : left; width : 37.5%; position : relative; top : -120px; margin-bottom : -120px; }
.index #content_main .three { float : right; width : 24.5%; position : relative; top : -120px; margin-bottom : -120px; background : url(../siteimages/v_line_one.png) repeat-y 0 0;  }
.index #content_sub { width : 100%; margin : 0; padding : 0 0 1.5em 0;  }
.index #content_sub:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.index #content_sub > div { float : left;  padding-top : 15px; }
.index #content_sub .one { width : 25%; }
.index #content_sub .two { width : 25%; }
.index #content_sub .three { width : 25%; }
.index #content_sub .four { width : 24.5%; }
.index #nav_sub { background : #f7f7f7 url(../siteimages/h_dotted_two.png) repeat-x 0 0; }
.index #siteinfo .one { min-width : 960px; max-width : 1380px; width : 98%; }

/* =blog layout */
.blog { background-color : #f7f7f7; }
.blog #nav { width : 960px; margin : 0 auto; }
.blog #container { width : 960px; margin : 0 auto; }
.blog #content:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.blog #content_main { float : left; width : 620px; }
.blog #content_sub {  float : right; width : 339px; margin-bottom : -120px; }
.blog #nav_sub { background-color : #fff; }
.blog #siteinfo .one { width : 960px; }
.blog #branding { display : none; }

/* =blog index layout */
.home #content { min-width : 960px; max-width : 1380px;  width : 100%; margin : 0 auto; padding : 0; }
.home #content:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.home #content_main { float : left; width : 50%; padding : 2em 0; }
.home #content_sub { float : right; width : 49.5%; background-color : #cfcfcf; padding : 2em 0; }
.home #content_sub > div { float : left; }
.home #content_sub .one { width : 50%; }
.home #content_sub .two { width : 49.5%; }
.home #nav_sub { width : 100%; }
.home #siteinfo .one { min-width : 960px; max-width : 1380px; width : 100%; margin : 0 auto; }

/* =britpack page layout */
.britpack #content_main { width : 100%; }
.britpack .members { margin-bottom : 30px; padding-bottom : 30px; background : url(../siteimages/h_line_one.png) repeat-x 0 100%; }
.britpack .members:last-child { margin-bottom : 0; padding-bottom : 0; background-image : none; }
.britpack .members:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.britpack .books { margin-bottom : 30px; padding-bottom : 30px; background : url(../siteimages/h_line_one.png) repeat-x 0 100%; }
.britpack .books:last-child { margin-bottom : 0; padding-bottom : 0; background-image : none; }
.britpack .books:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }
.britpack .hreview { float : left; width : 24.5%; }
.britpack .hreview img { margin-left : 15px; border : 1px solid #ccc; }
.britpack .hreview h4 { font-size : 92%; }
.britpack .hreview h4 span { display : block; }
.britpack .hreview ul { margin-left : 0; font-size : 92%; }
.britpack .hreview ul li:first-child { padding-bottom : 5px; }
.britpack .vcard { float : left; width : 24.5%; }
.britpack .vcard .adr span { display : block; }
.britpack .vcard div { margin : 0; }
.britpack .tel, 
.britpack .locality, 
.britpack .country-name, 
.britpack .region, 
.britpack .email, 
.britpack .url, 
.britpack .postal-code { display : block; margin : 0 15px; }
.britpack .vcard .fn { padding-left : 30px; background : url(../siteimages/vcf.gif) no-repeat 0 0; }
.britpack a[class$="uk"] { display : block; width : 90px; height : 20px; background : url(../siteimages/amazon-com.gif) no-repeat 0 0; text-indent : -9999px; }
.britpack a[class$="com"] { display : block; width : 90px; height : 20px; background : url(../siteimages/amazon-couk.gif) no-repeat 0 0; text-indent : -9999px; }

/* =The Cornell Edition */
#img01 { float : right; position : relative; left : 220px; top : -120px; margin : 0 0 -110px -220px; width : 398px; height : 390px;  background : url(../siteimages/branding.jpg) no-repeat 0 0; }
#img02 { float : left; position : relative; left : -210px; top : -120px; margin : 120px -200px -110px 0; width : 398px; height : 390px; }
a[rel="self"] { position : absolute; right : 0; bottom : 0; display : block; height : 120px; width : 105px; background : url(../siteimages/a_top.jpg) no-repeat 0 0; text-indent : -9999px; }
a[rel="self"]:hover { background-position : 0 -120px; }

/* =The Burgerman Edition */
.burgerman #nav_main { background-color : #8c242b;  }
.burgerman #img01 { top : -140px; margin : 0 0 -140px -220px; width : 369px; background : url(../siteimages/branding_burgerman.jpg) no-repeat 0 0; }
.burgerman #img02 { top : -140px; width : 369px; margin : 120px -200px -140px 0; }
.burgerman a[rel="self"] { background : url(../siteimages/a_top-burgerman.jpg) no-repeat 0 0; }
.burgerman a[rel="self"]:hover { background-position : 0 -120px; }

/* Safari FOUC */
body { display : block !important; }
}

@media print { 
/* Print stylesheet in progress */
#nav_access, #nav_main, #nav_sub { display : none !important; }
body { font : normal 11px Palatino, Georgia, Times, serif;  }
}