/***** NB: we're currently NOT MANAGING THIS IN BRICOLAGE - 
if you need to change it PLEASE TELL TOM OR YOUR CHANGES WILL GET OVERWRITTEN 
* Our DVD backup of whole site has the 13/10/12 version
*
* LAST UPDATED: 
* 2011:
* 14/11 T - #section-explanation
* 17/11 T - #toc-extra-nav redone 
* 18/11 T - .item-detail .item-extra .hreview (replaced .item-detail .hreview)
* 25/11 T - body.books #superbox-container .content { background: #bbb - was rgb(245,245,245) but was unreadable
* 15/12 C - header .h1 background is now h1-index 
* 23/12 T - added .compact - currently just used to contain compact versions of ul.inline
* 2012:
* 19/1 T - added .nav-lists-sidebyside
* 26/1 T - body.entry .entry-summary margin
*
****/
/* ----------------------------------------------------------------------------------------- 
Stuff and Nonsense Ltd.
The Cow Shed Studio,
Gwaenysgor,
Flintshire, North Wales
LL18 6EP, UK
+44 1745 851848
http://www.stuffandnonsense.co.uk
http://www.forabeautifulweb.com */
/************************
*** TABLE OF CONTENTS ***  <- not complete, Tom working on
*************************

- HTML ELEMENTS
	- Anchors
	- Lists
	- Forms
	- Tables
	- Images (except article-specific styles)
- OUR DESIGN
	- Layout
	- Boxes
		- general
		- notice
		- highlight
		- Prominent box
- ELEMENTS/TOOLS OF NO FIXED ABODE
	- Popup box
		- Superbox modal window
- SIDEBAR
	- Signup/follow us
	- Multimedia block
- UNSORTED STUFF
- NAVIGATION
	- Nav-tools
	- Nav-main
	- Nav-location (breadcrumb)
	- Nav-gallery
	- Nav-podcasts
	- Nav-sub
	- Pagination
	- Dropdown menu navigation
	- Accordion navigation
- UNSORTED STUFF
- BITS & BOBS
	- Styles for different textual content
	- Buttons & other widgets
	- Adverts
- LEGACY CONTENT
	- .legacy classed (from Phillip)
	- Pre-Bricolage articles
- OVERRIDES FOR SPECIFIC BITS
	- .remove-styling: MicroPolls, etc.
- SINGLE-RULE STYLES (.clear, etc.)
- FRONT PAGE
	- Slideshow
	- Sidebar boxes 
- ARTICLE PAGES
	- Articles
		- Comments
			- Old style comments
			- New style comments
	- Email nag
	- ShareThis
	- Photos
	- Bottom links & meta-info
	- Comments
	- Tweetbacks
- TABLE OF CONTENTS PAGES
	- 3 boxes above listings
	- utility links
	- columns
- LANDING/SUBSCRIPTION PAGES
- BOOK PAGES
- SPECIFIC PAGES
	- Home Page
		- Tabs at bottom of front page
	- /themes/full-index/
	- /subscriptions/international/
	- /tag/
	- Topics
	- /contact/ 


/************************
**** RESERVED WORDS *****
*************************

.right
.blurb

*/



/* Author styles ------------------------------------------------------------------------ */

@font-face {
font-family : "Caecilia-LT-Std-Bold";
src: url('/ui/type/CaeciliaLTStd-Bold.eot'); /* for IE */
src: local("Caecilia-LT-Std-Bold"), url('/ui/type/CaeciliaLTStd-Bold.otf') format("opentype"), url('/ui/type/CaeciliaLTStd-Bold.ttf') format("truetype"); 
}

/*@font-face {
font-family : "Cambria";
src: url('/ui/type/cambria.eot'); /* For IE *//*
src: local("Cambria"), url('/ui/type/cambria.woff') format('woff'), url('/ui/type/cambria.ttf') format("truetype"); /* For proper browsers */ 
/*}*/

body { 
background-color : rgb(244,243,242);
font : 14px Cambria,"Palatino Linotype","URW Palladio L",Palatino,"Book Antiqua",Georgia,serif; 
color : rgb(0,0,0);
padding-top: 18px;
 }

h1, h2, h3, h4, h5, h6 {

color : inherit; 

}

h1, h2 {
/*font-family : "Caecilia-LT-Std-Bold";*/
font-family: Georgia, "Deja Vu Serif", serif;
/*letter-spacing : -1px;*/
}

h1 { 
font-size : 2em; 
margin-bottom : .75em; }

.header h1,
.header h2 { 
width : 600x;
height : 70px;
background : url(/ui/img/h1-index.png) no-repeat 0 0; 
text-indent : -9999px; }
.header h2 a { display:block}


h3 { 
/* clear : left; */
font-size : 1.2em;
line-height : 1.25; }


blockquote { 
position : relative;
left : -40px;
min-height: 30px;
margin : 0 0 18px 0;
padding-left : 40px;
background : url(/ui/img/quotes-open.png) no-repeat 0 0; }

#promo, #promo-foot {
font : normal 11px Helvetica, Arial, sans-serif; }

#intro {
position : relative;
padding : 6px 9px 5px;
background : rgb(160,60,60); 
border-bottom : 1px solid rgb(105,40,40);
color : rgb(255,255,255); 
font : normal 11px Helvetica, Arial, sans-serif; }

address { 
margin : 0; 
font-style : normal; }

abbr, acronym { 
border-bottom-width : 0; }

iframe {
margin-bottom : 18px; }

#facebook-likers {width:90%;}
#flattr-article {width:10%;text-align:right;}


/*********************
*** HTML ELEMENTS  ***
*********************/



/* Anchors -------------------------------------------------------------- */

a { 
color : rgb(160,60,60);
text-decoration : none; }

a:focus, a:hover { 
color : rgb(25,25,25);
text-decoration : underline; }

a:active, a:focus { 
color : #333;
position : relative; 
top : 1px; }

#content-blogs:target .more,
#content-magazine:target .more {
padding : 2px 3px;
background-color : rgb(160,60,60);
color : rgb(255,255,255); }

a.more:after {
content : " »"; }

.action-button a, .close a { 
padding : 4px 9px; 
border-radius : 5px; 
font : normal 10px Helvetica, Arial, sans-serif;
text-transform : uppercase; 
letter-spacing : 1px; 
cursor : pointer; }

.action-button a:hover, .close a:hover { 
text-decoration : none; }

.action-button a { 
background-color : rgb(160,60,60); 
color : rgb(255,255,255); }

.action-button a:hover { 
background-color : rgb(25,25,25); }

.close a { 
background-color : rgb(25,25,25); 
text-shadow: #000 0 1px 0; 
color : rgb(255,255,255); }

.close a:hover { 
background-color : #666; }

#intro a {
font-weight : bold;
color : rgb(255,255,255); }

a.x {
position: absolute;
top : 5px;
right : 9px; }

.rss a { 
padding-right : 18px; 
background : url(/ui/img/icons/a-rss-small.png) no-repeat 100% 50%; }

.footer .rss a { 
padding-left : 30px; 
background : url(/ui/img/icons/a-rss.png) no-repeat 0 50%; }

 /*li.  a,
abbr.comments a { 
padding-left : 18px; 
background : url(/ui/img/icons/a-comment.png) no-repeat 0 50%; 
font : 11px Helvetica, Arial, sans-serif; }*/ 


/* Lists -------------------------------------------------------------- */

ul, ol { 
margin : 0 0 18px 0; }

.article ul, .article ol {
	margin-left: 2em;
}

form ul { 
overflow : hidden; 
list-style-type : none; }

form li { 
float : left; 
width : 190px; 
margin-right : 10px; }

.footnotes { 
margin-bottom : 1.5em; 
font-size : 11px; 
line-height : 1.44em; }

.article ul.inline, .article ol.inline {
	margin-left: 0px;
}

.inline { 
clear : both;
list-style-type : none; 
padding : 18px 0; 
border-top : 1px dashed rgb(180,180,180);
font : 11px Helvetica, Arial, sans-serif; }

.inline:after { 
content : "\0020"; 
display : block; 
height : 0; 
clear : both; 
visibility : hidden; 
overflow : hidden; }

.inline li { 
float : left; 
display : inline; 
margin-right : 10px; 
padding-right : 10px; 
border-right : 1px solid rgb(180,180,180); }

.inline li.first, .inline li.label {
	border-right : none !important;
	padding-right: 0 !important;
}

.inline li.last { 
margin-right : 0!important; 
padding-right : 0!important; 
border-width : 0!important; }


.compact {
	margin-bottom: 1em;
}

.compact .inline {
	border-top: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Forms -------------------------------------------------------------- */

fieldset { 
margin : 0 0 18px 0; 
padding : 0; 
border-width : 0; }

li fieldset { 
margin : 0;
padding : 0; }

input[type="text"], 
textarea { 
margin : .5em 0; 
border : 1px solid rgb(180,180,180); }

input[type="text"] { 
width : 390px; 
padding : 5px; 
font : normal 11px Helvetica, Arial, sans-serif; }

input[type="text"]:hover, 
textarea:hover { 
border : 1px solid rgb(100,100,100); }

input[type="text"]:focus, 
textarea:focus { 
border : 1px solid rgb(0,0,0); }

#search-top input[type="text"] {
	margin: 0;
}

#search-top button, #search button { 
padding : 4px 9px; 
border-width : 0;
border-radius : 5px;
-moz-border-radius : 5px;
-webkit-border-radius : 5px;
background-color : rgb(160,60,60); 
color : rgb(255,255,255);
font : normal 10px Helvetica, Arial, sans-serif; 
text-transform: uppercase;
letter-spacing : 1px; 
cursor : pointer; }

#search-top button:hover, #search button:hover { 
background-color : rgb(0,0,0); }

#search-top p { 
margin : 0; 
font : normal 11px Helvetica, Arial, sans-serif; }

#search-top input[type="text"] { 
width : 200px; 
margin-right : 10px; }

#search input[type="text"] { 
width : 200px; 
margin-right : 10px; }

.shop #search input[type="text"] { 
width : 160px; 
margin-right : 10px; }

.aside input[type="text"] { 
width : 160px; 
padding : 3px; 
margin-bottom : 0; }

#signup input[type="text"] { 
width : 210px; }

/* Tables -------------------------------------------------------------- */

td, caption { 
padding : 4px 10px 4px 0; }

caption {
margin-bottom : 18px;
background : transparent; 
font-size : 1.2em;
line-height : 1.25; }

th, td { 
vertical-align : top; 
/*font : normal 11px Helvetica, Arial, sans-serif;*/ }

th { 
padding : 4px 5px 4px 0; 
font-weight : bold; }

thead th {
background : transparent; }

.file tr:nth-child(odd) th,
.file tr:nth-child(odd) td {
background-color : rgb(234,232,230); }

.file th {
width : 120px; }

.ratings tr th,
.ratings tr td {
border-bottom : 1px solid rgb(180,180,180); }

/* Table sorting */

th.header { 
padding : 0 0 9px 12px;  
background : url(/ui/img/arrow_sort.png) no-repeat 0 4px; 
cursor : pointer; }

th.headerSortUp { 
background : url(/ui/img/arrow_up.png) no-repeat 0 6px; }

th.headerSortDown { 
background : url(/ui/img/arrow_down.png) no-repeat 0 6px; }

td.dt { 
width : 110px; }

td.summary { 
width : 190px; }

td.extra { 
padding-left : 5px; 
width : 95px; }

/* Images -------------------------------------------------------------- */

img { 
padding : 5px; 
background-color : rgb(255,255,255); }

#superbox img {
	padding: 0;
	margin: 0;
}

img.stars,
img.pop {
padding : 0;
background-color : transparent; 
border-width : 0; }

img.pop {
margin-top : -20px; }

p img.left { 
float : left; 
margin : 0 20px 18px 0; }

p img.right { 
float : right; 
margin : 0 0 18px 20px; }

.image-left { /* for block-level elements, more compatible than the above and used in related_media_graphic.mc */
	float: left;
	margin : 0 20px 18px 0;
}

.image-right {
	float: right;
	margin : 0 0 18px 20px; 
}

p.caption { 
margin-bottom : 18px; 
font : bold 10px Helvetica, Arial, sans-serif;
text-transform : uppercase;
letter-spacing : 1px;
line-height : 1.44em; 
color : rgb(180,180,180);}

p.caption img { 
display : block; 
margin-bottom : 4px; }




/*****************
*** OUR DESIGN ***
******************/



/* Layout -------------------------------------------------------------- */

.container,
#header, 
#footer { 
width : 100%; }

.header, .nav-main, .section, .footer { 
width : 950px; 
margin : 0 auto; }

.header { 
position : relative; }

#leaderboard { 
float: right; }

.nav-main {
margin-bottom : 18px; 
border-top : 3px double rgb(180,180,180);
border-bottom : 3px double rgb(180,180,180); }

.article { 
float : left; 
width : 600px;
margin-bottom: 1.5em;
}

.article.no-sidebar {
	width:950px;
	float: none;
}

#content-blogs {
margin-bottom : 18px; 
border-bottom : 4px solid rgb(160,60,60); }

.row {
overflow : hidden;
margin-bottom : 18px; 
border-bottom : 3px double rgb(180,180,180); }

.col { 
float : left; }

.aside { 
float : right; 
width : 300px; } /* was 310, has this broken anything? would it look better to take article up to 610 to keep the gap the same width? */

.footer { 
padding : 36px 0 18px 0; 
border-top : 4px solid rgb(160,60,60);
font-size : 13px; }

.group:after { 
content : "\0020"; 
display : block; 
height : 0; 
clear : both; 
visibility : hidden; 
overflow : hidden; }

.last { 
margin : 0; 
padding : 0; 
border-width : 0} 

/* Layout variants -------------------------------------------------------------- */

.index .aside { 
padding-top : 4em; }

.alt .aside { 
padding-top : 0; }

.alt #content-blogs {
float : left;
width : 270px; 
margin : 0; 
padding-bottom : 18px;
border-bottom-width : 0; }

.alt #content-magazine {
float : left;
width : 270px; 
margin-right : 50px; 
padding-bottom : 18px;
border-bottom-width : 0; }

.shop .article { 
width : 630px; }

.shop .aside { 
width : 280px; }

/*.entry .aside { 
padding-top : 3.6em; }*/

/** Boxes **/

/* Box - general -------------------------------------------------------------- */

.box h4 {
margin-bottom : 4px; }

.aside .box { 
margin-bottom : 18px; 
background : rgb(244,243,242);
border-bottom : 1px solid rgb(180,180,180); }

.aside .box ul { /* is this needed anywhere outside asides? -T */
list-style-type : none; }

/* Box - notice */

.error, .notice, .success { 
overflow : hidden;
padding : 20px; }

.notice { 
background : rgb(228,225,223) url(/ui/img/featured.png) repeat-x 0 0;
border-width : 0; }

.notice img {
float : right; 
margin-left : 20px; 
background-color : rgb(255,255,255); }

.notice p {
font-size : 16px; }

/* Box - highlight */

.aside .highlight {
padding: 20px 20px 0 20px;
background : rgb(160,60,60) url(/ui/img/highlight.png) repeat-x 0 0; 
font : normal 12px Helvetica, Arial, sans-serif;
color : rgb(255,255,255); }

.aside h3 {
font : normal 11px Helvetica, Arial, sans-serif; 
text-transform : uppercase; 
letter-spacing : 1px; }

.aside .highlight a {
color : rgb(255,255,255); 
text-decoration : underline; }

.aside .highlight #email {
width : 160px; 
margin-right : 10px;
background-color : rgb(160,60,60); 
color : rgb(255,255,255); }

.aside .highlight button { 
background-color : rgb(105,40,40); 
border-width : 0; 
border-radius : 5px; 
padding : 5px 9px; 
text-transform : uppercase; 
letter-spacing : 1px; 
font : normal 10px Helvetica, Arial, sans-serif; 
color : rgb(255,255,255);
cursor : pointer; }

.aside .highlight button:hover { 
background-color : rgb(75,30,30); 
color : rgb(255,255,255); }

/* Prominent box */

.prominent-box {
padding: 20px 20px 0 20px;
margin-bottom: 18px;
background : rgb(160,60,60) url(/ui/img/highlight.png) repeat-x 0 0; 
font-family:  Helvetica, Arial, sans-serif;
color : rgb(255,255,255);
}

.prominent-box p {
	margin-bottom: 0;
	padding-bottom: 20px;
}

.prominent-box h3 {
text-transform : uppercase; 
letter-spacing : 1px; }

.prominent-box a {
color : rgb(255,255,255); 
text-decoration : underline; }



/***************************************
*** ELEMENTS/TOOLS OF NO FIXED ABODE ***
***************************************/

/** Badges
****************************************/

.minibadge span, .non-fp-button span { /* TO DO: .button is taken by FP subscribe button - so when time, rename this or see if can bring under this rule... */
	background-color: #690000;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius : 5px;
	color: #FFFFFF;
	padding: 4px 9px;
	letter-spacing: 1px;
	font: 12px Helvetica,Arial,sans-serif;
}

.minibadge a, .non-fp-button a {
	color: #FFFFFF;
}

.black-badge {
	background-color: #000000;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius : 5px;
	color: #FFFFFF;
	padding: 4px 9px;
	letter-spacing: 1px;
	font: 12px Helvetica,Arial,sans-serif;
}

.grey-badge {
	background-color: #555;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius : 5px;
	color: #FFFFFF;
	padding: 4px 9px;
	letter-spacing: 1px;
	font: 12px Helvetica,Arial,sans-serif;
}

/* Popup superbox */

/* Popup superbox :: Base styles */
#superbox-overlay { 
position : fixed; 
top : 0; 
left : 0; 
z-index : 9998; 
width : 100%; 
height : 100%;}

#superbox-wrapper { 
position : fixed; 
z-index : 9999; 
top : 0; 
display : table; 
width : 100%; 
height : 100%; }

#superbox-container { 
position : relative; 
display : table-cell; 
width : 100%; 
height : 100%; 
margin : 0; 
padding : 0; 
vertical-align : middle; }

#superbox{ 
margin : 0 auto; 
padding : 0; }

#superbox-container .loading { 
margin : 0; 
text-align : center; }

/* Popup superbox :: Default styles */
#superbox-container .loading { 
text-align : center; 
font-size : 40px; 
color : rgb(255,255,255); }

#superbox { 
overflow : hidden;
padding : 0px;
border : 4px solid rgb(255,255,255); }

#superbox #superbox-innerbox {
min-height: 340px!important; 
}

#superbox-container .iframe {
	padding: 20px;
}

#superbox.image { 
text-align : center; }

#superbox .close,
#superbox .nextprev{ 
display : none; }

.popup {
background : transparent;
border-width : 0; 
color : rgb(255,255,255); 
padding: 5px 10px;
}

.popup #offer {
padding : 4px; 
background-color : rgb(105,0,0);
border : 1px solid rgb(255,255,255);
color : rgb(255,255,255);
font : normal 12px Helvetica, Arial, sans-serif; 
text-align : center; }

.popup #promo { 
float : left; 
width : 160px; 
font : normal 11px Helvetica, Arial, sans-serif; 
color : rgb(255,255,255); }

.popup .col { 
float : left; 
width : 190px; 
margin-right : 30px; }

.popup .last { 
width : 190px; 
margin-right : 0; }

.popup .clear {
clear : both; }

.popup a { 
color : rgb(255,255,255); }

.popup .action-button a, .popup .action-button a { 
background-color : rgb(105,0,0); }

.popup .action-button a:hover { 
background-color : rgb(25,25,25); }

.popup .clear {
padding-top : 18px;
border-top : 1px dashed rgb(255,255,255);
font : normal 11px Helvetica, Arial, sans-serif; }

#superbox-overlay { 
background : rgb(255,255,255); }

#superbox, .standard-colour-bg { 
background : rgb(160,60,60) url(/ui/img/subscribe.png) repeat-x 0 0; }

p.loading {
padding : 9px 18px;
background : rgb(255,255,255); 
color : rgb(0,0,0)!important; }

.popup form br {
display : none; }

.popup form fieldset {
float : left; 
width : 280px;
margin-right : 10px; }

.popup form p {
overflow : hidden; 
margin : 0; }

.popup form p label {
position : relative;
top : 6px;
float : left; 
width : 90px;
margin-right : 10px; }

.popup form p input {
float : left; 
width : 140px; 
background-color : rgb(160,60,60); 
color : rgb(255,255,255); }

.popup form button { 
margin-bottom : 9px;
padding : 5px 9px; 
background-color : rgb(105,40,40); 
border-width : 0; 
border-radius : 5px; 
text-transform : uppercase; 
letter-spacing : 1px; 
font : normal 10px Helvetica, Arial, sans-serif; 
color : rgb(255,255,255);
cursor : pointer; }

.popup form button:hover { 
background-color : rgb(75,30,30); 
color : rgb(255,255,255); }



/*********************
****** SIDEBAR  ******
*********************/

/* Adverts */

#google_ads_div_Sidebar {
	margin-bottom: 12px;
}

/* Sidebar :: Signup/follow us */

#enews-signup {
padding-bottom: 5px;
}

.box.red-and-beige h3 {
	background: url("http://www.newint.org/ui/img/highlight.png") repeat-x scroll 0 0 #A03C3C;
	margin: 0px;
	padding: 9px 20px;
	color: white;
}
.box.red-and-beige .main {
	background: url('http://www.newint.org/ui/img/halftone.png') repeat-x scroll 0 0 #c7bf91;
	padding: 14px 20px;
}
#enews-signup p {
	margin-bottom: 1em;
}
#enews-signup input[type="text"] {
   width: 180px;
}

#social-networks {
margin-bottom: 0px;
height:16px;
}

#enews-signup-facebook {
background:url("/ui/img/icons/facebook.png") no-repeat scroll 0 0 transparent;
height:16px;
padding-left:20px;
float: left;
margin-right: 17px;
}

#enews-signup-twitter {
background:url("/ui/img/icons/twitter.png") no-repeat scroll 0 0 transparent;
height:16px;
padding-left:20px;
float: left;
margin-right: 17px;
}

#enews-signup-rss {
background:url("/ui/img/icons/rss.png") no-repeat scroll 0 0 transparent;
height:16px;
padding-left:20px;
float: left;
}

/* Sidebar :: Most popular block */

#most-popular-box .hentry {
	margin-bottom: 0.5em;
}

#most-popular-box .hentry h4 {
	font-size: 1em;
}

/* Sidebar :: Multimedia block */

#tabs-b3 .credit- { /* credit on vid tab */
	font-size: 0.7em;
	margin-bottom: 4px;
}

#radio-ni-header a {
	color: black;
}

#radio-ni-header img {
	padding: 0px; /* really should use generic class instead */
	margin-right: 3px;
}



/* issues */

.next-issue h2,
.last-issue h2 {
font-size: 24px;
margin-bottom : 0; }

.next-issue p,
.last-issue p {
font-size : 13px; }

.next-issue h2 + p,
.last-issue h2 + p {
font-size : 12px;
letter-spacing : 1px;
text-transform : uppercase; }

.next-issue img,
.last-issue img {
float : right; 
margin : 0 0 5px 20px; }

/* halftone */

.halftone {
background : rgb(244,243,242) url(/ui/img/halftone.png) repeat-x 0 -48px; 
border-top : 3px solid rgb(225,225,225); }

.halftone .tabs-box > h3 {
padding : 9px 0 0 9px; }

.halftone .box {
padding-top : 18px; 
padding-bottom : 0; 
border-bottom : 0; }

/* Issue number -------------------------------------------------------------- */

#issue { 
position : absolute;
top : 0;
left : 20px;
list-style-type : none; 
margin : 0; 
padding : 18px 0;
width : 80px;
background : rgb(160,60,60); 
color : rgb(255,255,255); 
text-align : center; 
text-transform : uppercase; 
line-height : 1; }
#issue li {text-align:center}

#issue .month {
margin-top: 2px;
}

#issue .month,
#issue .year {
font : normal 11px Helvetica, Arial, sans-serif; 
letter-spacing : 2px; }

#issue .number {
font-size : 20px; }

/* Teaser --------------------------------- */

.teaser h3 {
margin-bottom : 18px;
clear : none; 
font : normal 11px Helvetica, Arial, sans-serif; 
text-transform : uppercase; 
letter-spacing : 1px; }

.teaser h4 {
margin-bottom : 9px; }

.teaser p { 
margin-bottom : 9px;
font-size : 13px; } 

.teaser img { 
background-color : rgb(255,255,255); }




/* Grid components only for teaser -------------------------------------------------------------- */

.teaser .span-1, 
.teaser .span-2, 
.teaser .span-3, 
.teaser .span-4, 
.teaser .span-5, 
.teaser .span-6, 
.teaser .span-7, 
.teaser .span-8, 
.teaser .span-9, 
.teaser .span-10, 
.teaser .span-11, 
.teaser .span-12, 
.teaser .span-13, 
.teaser .span-14, 
.teaser .span-15, 
.teaser .span-16, 
.teaser .span-17, 
.teaser .span-18, 
.teaser .span-19, 
.teaser .span-20, 
.teaser .span-21, 
.teaser .span-22, 
.teaser .span-23, 
.teaser .span-24 
{ float : left; margin : 0 10px 0 0; padding : 18px 20px; }

.teaser .last { margin-right : 0; padding : 18px 20px; }

.teaser .span-1 { width : 10px; }
.teaser .span-2 { width : 30px; }
.teaser .span-3 { width : 70px; }
.teaser .span-4 { width : 110px; }
.teaser .span-5 { width : 150px; }
.teaser .span-6 { width : 190px; }
.teaser .span-7 { width : 230px; }
.teaser .span-8 { width : 270px; }
.teaser .span-9 { width : 310px; }
.teaser .span-10 { width : 350px; }
.teaser .span-11 { width : 390px; }
.teaser .span-12 { width : 430px; }
.teaser .span-13 { width : 470px; }
.teaser .span-14 { width : 510px; }
.teaser .span-15 { width : 550px; }
.teaser .span-16 { width : 590px; }
.teaser .span-17 { width : 630px; }
.teaser .span-18 { width : 670px; }
.teaser .span-19 { width : 710px; }
.teaser .span-20 { width : 750px; }
.teaser .span-21 { width : 790px; }
.teaser .span-22 { width : 830px; }
.teaser .span-23 { width : 870px; }
.teaser .span-24 { width : 910px; }

/* Twitter -------------------------------------------------------------- */

#twitter_update_list { 
list-style-type : none; }

#twitter_update_list li { 
margin-bottom : .5em; 
padding-bottom : .5em; 
border-bottom : 1px dashed rgb(180,180,180); }

/* Flickr -------------------------------------------------------------- */

#flickr_badge_wrapper {
overflow : hidden; }

.flickr_badge_image {
float : left; 
margin : 0 10px 5px 0; }




/*********************
***** NAVIGATION *****
*********************/



/* Nav-tools -------------------------------------------------------------- */

#nav-tools { 
position : absolute; 
top : 0; 
left : 535px; 
overflow : hidden; 
list-style-type : none; 
padding : 9px; }

#nav-tools li { 
float : left; 
margin-right : 18px; }

#nav-tools a, 
.nav-tools a:visited { 
float : left;
font : normal 11px Helvetica, Arial, sans-serif;
text-transform : uppercase; }

/* Nav-main -------------------------------------------------------------- */

#nav-sections { 
overflow : hidden; 
list-style-type : none; 
float : left; 
margin : 24px 0 18px 0; }

#nav-sections li {
display : block;
float : left;
margin-right : 20px; }

#nav-sections a { 
display : block;
padding : 6px 9px 5px;
border-radius : 5px;
font : normal 11px Helvetica, Arial, sans-serif; 
text-transform : uppercase; }

#nav-sections a:hover { 
background-color : rgba(140,130,120,.1);
text-decoration : none; }

#nav-main #search, #nav-main #search-top { 
/*float : right; */
width : 300px; 
margin : 0; }

#nav-main #search fieldset { 
margin : 9px 0 0 0; }

#nav-sections {
	float: left;
}

#nav-utilities {
	margin-top: 24px;
	float: right;
}

#nav-utilities ul { 
	list-style-type : none; 
	margin-left: 0 !important;
	padding-left: 0 !important;
}

#nav-utilities li {
display : block;
float : left;
}

#nav-utilities a { 
display : block;
padding : 6px 9px 14px 0px;
font : normal 11px Helvetica, Arial, sans-serif; 
}

#nav-utilities a.more {
  font-weight:bold; 
  background:url("/ui/img/ext-link-12px.png") no-repeat scroll right 6px transparent;
  padding-right: 14px;
}

#nav-utilities a.more:after {
  content:none;
}

body.blog #nav-utilities a.more {
  background:url("/ui/img/ext-link-blog-12px.png") no-repeat scroll right 6px transparent;
}

body.books #nav-utilities a.more {
  background:url("/ui/img/ext-link-books-12px.png") no-repeat scroll right 6px transparent;
}


/* Nav-location (breadcrumb) -------------------------------------------------------------- */

.nav-location {
overflow : hidden;
list-style-type : none; 
background-color : rgb(228,225,223);
border-top : 1px solid rgb(255,255,255);
border-bottom : 1px solid rgb(205,202,201);
font : normal 11px Helvetica, Arial, sans-serif; }

.nav-location li {
display : block;
float : left; }

.nav-location a {
display : block; 
padding : 6px 9px 5px; }

/* Nav-gallery -------------------------------------------------------------- */

.nav-gallery {
list-style-type : none; }

.nav-gallery li { 
float : left;
width : 300px; /* 310px pre-sidebar narrowing */
margin : 0 10px 18px 0; 
font : bold 10px Helvetica, Arial, sans-serif;
text-transform : uppercase;
letter-spacing : 1px;
line-height : 1.44em; 
color : rgb(180,180,180); }

.nav-gallery .last { 
margin : 0 0 18px 0; }

p.caption img { 
display : block; 
margin-bottom : 9px; }

/* Nav-podcasts -------------------------------------------------------------- */

.nav-podcasts li { 
position : relative; 
list-style-type : none; 
margin-bottom : 1em; 
padding-bottom : .5em; 
border-bottom : 1px dashed rgb(180,180,180); }

.nav-podcasts h5 { 
margin-bottom : 4px;
font : normal 11px Helvetica, Arial, sans-serif; 
text-transform : uppercase; }

.nav-podcasts h4 { 
margin-bottom : 0; }

.nav-podcasts .play { 
position : absolute;
top : 0;
right : 0;
font : normal 11px Helvetica, Arial, sans-serif; 
text-transform : uppercase; }

/* Nav-sub -------------------------------------------------------------- */

.nav-sub { 
list-style-type : none; }

.nav-sub li { 
margin-bottom : .5em; 
padding-bottom : .5em; 
border-bottom : 1px dashed rgb(180,180,180); }

/* Pagination -------------------------------------------------------------- */

.pagination { 
clear : both;
padding-top : 18px; 
border-top : 3px double rgb(180,180,180); }

.pagination li { 
display : inline; 
margin-right : 5px; }

.pagination li a { 
padding : 3px 7px; 
background-color : rgb(255,255,255); 
border : 1px solid rgb(180,180,180); 
font : normal 11px Helvetica, Arial, sans-serif;
text-transform : uppercase;
text-decoration : none; }

a.currentpage { 
background-color : rgb(160,60,60); 
color : rgb(0,0,0); 
border-color : rgb(180,180,180); }

a.disablelink { 
background-color : rgb(255,255,255); 
border-color : rgb(180,180,180); }

/* Tabbed navigation -------------------------------------------------------------- */

.ui-tabs .ui-tabs-nav { 
margin : 0; 
border-bottom : 1px solid rgb(180,180,180); }

.ui-tabs .ui-tabs-nav:after { 
content : "\0020"; 
display : block; 
height : 0; 
clear : both; 
visibility : hidden; 
overflow : hidden; }

.ui-tabs .ui-tabs-panel { 
padding : 18px 0;  }

.halftone .ui-tabs .ui-tabs-panel { 
padding : 0 0 18px 0;  }

.ui-tabs .ui-tabs-nav li { 
margin : 0 0 -1px 5px;
background : rgb(244,243,242);
border : 1px solid rgb(200,200,200);
font : normal 11px Helvetica,Sans-serif; }

.ui-tabs .ui-tabs-nav li.ui-tabs-selected { 
border-color : rgb(180,180,180); }

.ui-tabs .ui-tabs-nav li a { 
padding : .5em 10px; }

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a { 
color : rgb(0,0,0); }

/* Dropdown menu navigation
------------------------------------------------------------------------------- */

.nav-interact li { 
position : relative; 
z-index : 100; }

.nav-interact .last a { 
position : relative; 
top : -5px; }

.nav-interact li span { 
position : relative; 
z-index : 10; }		

.nav-interact img.arrow { 
margin-left: 4px; 
padding : 0; 
background : transparent; 
border-width : 0; 
cursor : pointer; }

.nav-interact div.sub_menu { 
display : none; 
position : absolute; 
top : 0; 
left : 0; 
margin-top : 18px; 
padding : 10px; 
width : 160px; 
background-color : rgb(255,255,255);
background-color : rgba(255,255,255,.75);
border : 1px solid rgb(180,180,180); 
box-shadow : 0 0 10px rgb(180,180,180); }

.nav-interact div.sub_menu a { 
top : 0;
display : block; 
margin : 4px 0; 
padding-left : 25px; }	

#digg { background : transparent url(/ui/img/icons/a-digg.png) no-repeat 0 50%; }
#reddit { background : transparent url(/ui/img/icons/a-reddit.png) no-repeat 0 50%; }
#stumbledupon { background : transparent url(/ui/img/icons/a-stumbledupon.png) no-repeat 0 50%; }
#facebook { background : transparent url(/ui/img/icons/a-facebook-s.png) no-repeat 0 50%; }
#delicious { background : transparent url(/ui/img/icons/a-delicious.png) no-repeat 0 50%; }

/* Accordion navigation
------------------------------------------------------------------------------- */

.ui-accordion { 
margin : 0 0 36px 0; 
padding : 0; }

.ui-accordion .ui-accordion-header { 
margin : 0 0 .5em 0; 
padding : 0 0 .5em 0; 
border-bottom : 1px dashed rgb(180,180,180); }

.ui-accordion .ui-accordion-header a { 
font-size : inherit; 
padding : 0; }

.ui-accordion .ui-accordion-content { 
margin : 0 0 24px 0;
padding : 0; }

.ui-accordion ul,
.ui-accordion ol { 
list-style-type : none; }

.ui-accordion ol li { 
position : relative; }

.ui-accordion ol a { 
display : block; 
padding : 2px; }

.ui-accordion ol em { 
position : absolute; 
top : 0;
right : 0; }

/* nav-lists-sidebyside for in content */
.nav-lists-sidebyside {
	float: left;
	width: 30%;
	font-size: 0.9em;
	list-style-type: none;
	padding: 0 1em 0 0 !important;
	margin: 0 0 1em 0 !important;
}
.nav-lists-sidebyside li {
	margin-bottom: 4px;
}


/*********************
*** ??????? ***
*********************/



/* Subscription -------------------------------------------------------------- */

.subscription .section { 
position : relative; 
width : 700px; 
margin-bottom : 18px;
padding : 36px 230px 36px 20px; 
background : rgb(228,225,223) url(/ui/img/subscription.png) no-repeat 0 0; 
border-top : 1px solid rgb(255,255,255);
border-bottom : 1px solid rgb(205,202,201); } 

.subscription .one { 
width : 310px; 
margin-right : 40px; 
padding-right : 40px; 
border-right : 1px solid rgb(180,180,180); }

.subscription .two { 
width : 300px; }

.subscription blockquote { 
left : 0;
margin : 0; 
font-style : normal; }

.subscription .col p:last-child { 
margin : 0; }

.subscription #promo, .subscription #promo-foot { 
position : absolute; 
top : -18px; 
left : 760px; 
width : 160px; }

.subscription #promo img, .subscription #promo-foot img { 
margin-bottom : 4px; }

/* Footer -------------------------------------------------------------- */

.footer ul { 
float : left; 
list-style-type : none; 
width : 110px; 
margin-right : 50px; }

.footer .vcard { 
float : left; 
width : 140px; 
margin-right : 20px; }

.footer #about { 
float : left; 
padding-left : 20px;
width : 239px; 
border-left : 1px solid rgb(180,180,180); }

.footer #thirdparty { 
clear : left; 
overflow : hidden; 
width : auto; /* why can't this be 900px like the IE style? */
margin : 18px 0 36px 0; }

#thirdparty #facebook-foot { 
float : left; 
width : 300px; 
margin-right : 20px; }

#thirdparty #twitter-foot { 
float : left; 
width : 300px; 
margin-right : 20px; }

#thirdparty #rss-foot { 
float : left; 
width : 200px; }

#thirdparty a[rel*="facebook"] { 
display : block; 
height : 32px; 
padding-left : 40px; 
background : url(/ui/img/icons/a-facebook.png) no-repeat 0 0; }

#thirdparty a[rel*="twitter"] { 
display : block; 
height : 32px; 
padding-left : 40px; 
background : url(/ui/img/icons/a-twitter.png) no-repeat 0 0; }

#thirdparty #rss-foot a { 
display : block; 
height : 32px; 
padding-left : 40px; 
background : url(/ui/img/icons/a-rss.png) no-repeat 0 50%; }

#thirdparty a[rel*="facebook"]:active, 
#thirdparty a[rel*="twitter"]:active, 
#thirdparty #rss a:active { background-position : 0 2px; }

.footer #copyright { 
clear : left; 
padding : 18px 0;
text-align:center; }

/* Reviews template  
------------------------------------------------------------------------------- */

.reviews .hreview { 
overflow : hidden; 
margin : 0 0 18px 0; }

.reviews .hreview .description { 
margin : 0; }

#reviews-more {
display: none;
}

#superbox #reviews-more {
display: block;
padding: 10px 10px 10px 60px;
}
#superbox #reviews-more blockquote p {
	color: rgb(255, 255, 255);
	font-weight: bold;
	margin-bottom: 0px;
}
#superbox #reviews-more ul {
	margin-top: -14px;
}
#superbox #reviews-more ul li {
	list-style: none;
	color: rgb(200, 200, 200);
	font-style: italic;
}
body.books #superbox-container .content {
	background: #bbb none; /* T: was rgb(245,245,245) but was unreadable */
	overflow: auto;
}


/* Blog template 
------------------------------------------------------------------------------- */

h4.category {
font : normal 11px Helvetica, Arial, sans-serif; 
text-transform : uppercase; }

/* Lead entry 
------------------------------------------------------------------------------- */

.leader {
margin-bottom : 18px; }

.leader img {
margin-bottom : 9px; }

.leader p {
font-size : 16px; }

.blog .leader {
border-bottom : 3px double rgb(180,180,180); }

/* illustrated */

.leader-illustrated img {
float : left; 
margin : 0 20px 18px 0; }

/* Archived entry 
------------------------------------------------------------------------------- */

/*
.archive {
width : 540px; }

.archive .photo {
float : right;
margin-left : 20px; }

.archive .inline { 
margin-right : 150px; }
*/

/* hentry entries in two columns (note minor source order change)  
------------------------------------------------------------------------------- */

.summary { 
position: relative; 
overflow : hidden; 
margin : 0 0 18px 0; }

.summary .entry-title { 
width : 410px; }

.summary .entry-content { 
width : 410px; }

.summary ul { 
position : absolute; 
top : 0; 
right : 0; 
list-style-type : none; 
margin : 0; 
width : 150px; }

/* Grid entries in a grid format
------------------------------------------------------------------------------- */

.grid { 
float : left; 
width : 270px; 
margin-right : 30px; }

/* illustrated */

.grid-illustrated img {
float : left; 
margin : 0 20px 18px 0; }

/* hentry entries expressed as an unordered list
------------------------------------------------------------------------------- */

li.hentry { 
position : relative;
list-style-type : none; }

li:only-child {
margin-bottom : 0; 
border-bottom-width : 0; }

li.hentry .entry-title { 
margin : 0 30px 4px 0; }

li.hentry .entry-summary { 
padding-right : 30px;
font-size : 13px; }
 
li.hentry .comments { 
position : absolute; 
top : 0; 
right : 0; }
 
li.hentry address,
li.hentry .updated { 
display : none; }

/* Standard entry template (for older/archived entries)
------------------------------------------------------------------------------- */

.entry .article { 
position : relative; }

.entry .entry-issue { 
text-transform : uppercase;
letter-spacing : 1px; }

.entry .article .entry-meta { 
padding : 18px 0; 
border-top : 1px dashed rgb(180,180,180); 
font : normal 11px Helvetica, Arial, sans-serif; }

.entry .article .entry-meta li { 
border-right : 1px solid rgb(180,180,180); }

.entry .entry-summary,
.entry .entry-content {
line-height : 1.4; }

.enhanced .entry-title,
.enhanced .entry-summary,
.enhanced .entry-content {
padding-left : 0px; }

/* .enhanced .entry-summary blockquote,  <-- removed by Tom, as pulls quotes off the page
.enhanced .entry-content blockquote {
margin-left : -70px; } */

.enhanced .entry-content img.left {
margin-left : -70px; }

.entry-content table {
	width: 500px;
}

.entry-content .box {
	padding: 20px;
	background: rgb(228,225,223);
	margin-bottom: 30px;
}

/* Wide entry template (for latest entries)
------------------------------------------------------------------------------- */

.current { 
position : relative; }

.current .entry-content { 
width : 550px; 
margin : 0 auto; }

.current p.vcard { 
text-align : center; }

.current p.vcard strong { 
margin-bottom : 18px; 
padding-bottom : 9px; 
border-bottom : 1px solid rgb(180,180,180);
font-weight : normal; }

/* Image treatments
------------------------------------------------------------------------------- */

.entry-intro div {
margin : 0 auto; }

.entry-intro .span-14 { 
width : 550px; }

.entry-intro .span-15 { 
width : 590px; }

.entry-intro .span-16 { 
width : 630px; }

.entry-intro .span-17 { 
width : 670px; }

.entry-intro .span-18 { 
width : 710px; }

.entry-intro .span-19 { 
width : 750px; }

.entry-intro .span-20 { 
width : 790px; }

.entry-intro .span-21 { 
width : 830px; }

.entry-intro .span-22 { 
width : 870px; }

.entry-intro .span-23 { 
width : 910px; }

.entry-intro .span-24 { 
width : 950px; }

.current .entry-content .caption { 
float : left;
margin : 0 20px 18px 0; 
font : normal 11px Helvetica, Arial, sans-serif;
text-transform : none;
letter-spacing : 0;
line-height : 1.44em; 
color : rgb(0,0,0); }

.current .entry-content .caption img { 
margin-bottom : 4px; }

.current .entry-content .span-1 { 
width : 30px; }

.current .entry-content .span-2 { 
width : 70px; }

.current .entry-content .span-3 { 
width : 110px; }

.current .entry-content .span-4 { 
width : 150px; 
margin : 0 20px 18px -200px; }

.current .entry-content .span-5 { 
width : 190px; }

.current .entry-content .span-6 { 
width : 230px; }

.current .entry-content .span-7 { 
width : 270px; }

.current .entry-content .span-8 { 
width : 310px; }

.current .entry-content .span-9 { 
width : 350px; }

.current .entry-content .span-10 { 
width : 390px; }

.current .entry-content .span-11 { 
width : 430px; }

.current .entry-content .span-12 { 
width : 470px; }

.current .entry-content .span-13 { 
width : 510px; }

.current .entry-content .span-14 { 
width : 550px; }

.current .entry-content .span-15 { 
width : 590px; }

.current .entry-content .span-16 { 
width : 630px; }

.current .entry-content .span-17 { 
width : 670px; }

.current .entry-content .span-18 { 
width : 710px; }

.current .entry-content .span-19 { 
width : 750px; }

.current .entry-content .span-20 { 
width : 790px; }

.current .entry-content .span-21 { 
width : 830px; }

.current .entry-content .span-22 { 
width : 870px; }

.current .entry-content .span-23 { 
width : 910px; }

.current .entry-content .span-24 { 
width : 950px; 
margin : 0; }

/* Related entries template
------------------------------------------------------------------------------- */

.related .promo { 
float : left; 
width : 160px; 
margin-right : 20px;
font : normal 11px Helvetica, Arial, sans-serif; }

/* Entries in context
------------------------------------------------------------------------------- */

.context {
margin-bottom : 18px; 
padding-top : 18px; 
border-top : 3px double rgb(180,180,180); }

.context #promo {
float : left; 
width : 150px;
margin-right : 10px; }

.context #promo img {
display : block; }

.context .article { 
padding-left : 30px;
width : 429px; 
margin-left: 15px; /* Tom: was 140px, too large for bottom of http://www.newint.org/features/2006/01/01/zimbabwe/ */
border-left : 1px solid rgb(180,180,180); }

.context .aside { 
width : 310px; 
padding-top : 0; }

.context .aside li {
list-style-type : none; 
margin-bottom : 9px; }

/* Items template  
------------------------------------------------------------------------------- */

ol.hlisting { 
list-style-type : none; 
margin : 0; }

ol.hlisting:after { 
content : "."; 
display : block; 
height : 0; 
clear : both; 
visibility : hidden; }

ol .item { 
position : relative; 
min-height : 230px; 
margin-bottom : 18px;
padding-bottom : 18px;
border-bottom : 1px dashed rgb(200,200,200); }

ol .item:last-child { 
margin-bottom : 0;
border-bottom-width : 0; }

ol .photo { 
float : left; 
margin-right : 20px;
border : 5px solid rgb(200,200,200); }

ol .dtlisted { 
display : none; }

/* Featured item  
------------------------------------------------------------------------------- */

/* New styles from Tom so these can cope with images of larger heights */
.featured-box {
position : relative; 
margin-bottom : 18px; 
padding : 20px 20px 9px 20px; 
background : rgb(228,225,223) url(/ui/img/featured.png) repeat-x 0 0; 
border-top : 1px solid rgb(255,255,255);
border-bottom : 1px solid rgb(205,202,201); 
}

.featured-box-text {
	width: 360px;
}

.featured-box-photo {
	float: right;
	border : 5px solid rgb(200,200,200);
}

/* older styles */

.featured { 
position : relative; 
margin-bottom : 18px; 
padding : 20px 220px 9px 20px; 
background : rgb(228,225,223) url(/ui/img/featured.png) repeat-x 0 0; 
border-top : 1px solid rgb(255,255,255);
border-bottom : 1px solid rgb(205,202,201); }

.featured .photo { 
position : absolute; 
top : 20px; 
right : 20px; 
border : 5px solid rgb(200,200,200); }

.featured .author { 
margin-top : 1.75em; }

.featured .item-meta { 
padding-top : .75em;
border-top : 1px dashed rgb(200,200,200); }

.featured .item-meta li { 
display : inline; 
margin-right : 20px; }

.featured .item-meta li:last-child { 
margin-right : 0; }

.featured .item-meta .action-button a { 
position : absolute; 
top : 230px; 
left : 450px; }

.availability {
margin-bottom : 9px; }

.add {
position : absolute; 
top : 200px; 
left : 410px; }

.buy { 
list-style-type : none; }

.buy li { 
display : inline; 
margin-right : 20px; }

.buy a { 
padding-left : 20px; }

/* Item detail template  
------------------------------------------------------------------------------- */

.item-detail .item-extra { 
position : relative; 
padding-left : 200px; 
margin-bottom : 18px; 
padding-bottom : 18px; 
border-bottom : 1px dashed rgb(180,180,180); }

.item-detail .last-child { 
border-bottom-width : 0; }

.item-detail .item-extra .hreview { 
position : absolute; 
top : 0; 
left : 0; 
width : 200px; 
font-size : 13px; }

.item-detail .hreview p {
	width: 150px;
}

.item-detail .item-extra .description { 
margin-top : 0; 
margin-left : 0; }

.item-detail .item-extra .hreview li { 
list-style-type : none; }

.item-detail .item-extra .hreview li:last-child { 
margin-top : 18px; }


/* Hanging internal ads  
------------------------------------------------------------------------------- */

.entry .hlisting { 
overflow : hidden; 
position : relative; 
margin-bottom : 18px; 
padding : 20px; 
background : rgb(228,225,223) url(/ui/img/featured.png) repeat-x 0 0;
border-top : 1px solid rgb(255,255,255);
border-bottom : 1px solid rgb(205,202,201); }

.entry .hlisting .item { 
float : left;
margin-right : 20px; 
width : 270px; 
font-size : 13px; }

.entry .hlisting .last { 
margin-right : 0; }

.entry .hlisting .photo { 
float : left; 
margin-right : 20px;
background-color : rgb(255,255,255); }

.entry .hlisting .summary {
margin-bottom : 9px; }

.entry .hlisting .dtlisted { 
display : none; }

.current .hlisting { 
margin : 0 -200px 18px -200px; }

/* Strip items 
------------------------------------------------------------------------------- */

.strip {
margin-bottom : 18px;
padding : 20px 30px 0 30px; 
background : rgb(228,225,223) url(/ui/img/featured.png) repeat-x 0 0; 
border-top : 1px solid rgb(255,255,255);
border-bottom : 1px solid rgb(205,202,201); }

.strip ul {
list-style-type : none; }

.strip .item {
float : left; 
width : 270px; 
min-height : 0;
margin : 0 20px 0 0; 
border-bottom-width : 0; }

.strip .last {
margin-right : 0; }

.strip .summary,
.strip .description {
width : 190px;
margin : 0 0 9px 80px; 
font-size : 13px; }

.strip .photo {
float : left; }

/* hcalendar
------------------------------------------------------------------------------- */

td.dtstart .value {
display : none; }

/* jQuery plugin - Easy Image or Content Slider
http://cssglobe.com/post/3783/jquery-plugin-easy-image-or-content-slider
------------------------------------------------------------------------------- */

#slider,
.slides,
.slide {
overflow : hidden; }

.slider {
position : relative; 
margin-bottom : 36px; }

.slide {
width : 950px;
list-style-type : none; }

.slide div { 
float : left; 
width : 160px; 
margin-right : 30px; }

.slide p { 
margin : 0; }

#prevBtn, 
#nextBtn { 
position : absolute; 
top : 2.2em;
left : 760px; }

/* Shop slider
------------------------------------------------------------------------------- */

.shop .slider {
margin-bottom : 0; }

.shop .slide {
margin : 0 25px; 
padding : 0; 
width : 900px; }

.shop .slide div { 
width : 160px; 
margin : 0 15px 0 0; 
padding : 0; 
font : normal 11px Helvetica, Arial, sans-serif; }

.shop .slide div.first { 
margin-left : 20px; }

.shop .slide div.last { 
margin : 0!important; }

.shop .slide a,
.shop .slide a:hover {
text-decoration : none; }

.shop #prevBtn,
.shop #nextBtn {
position : absolute; 
top : 50px; 
width : 20px;
height : 20px;  
text-indent : -9999px; }

.shop #prevBtn a,
.shop #nextBtn a {
display : block;
width : 20px;
height : 20px; }

.shop #prevBtn { 
left : 0; 
background : url(/ui/img/next-previous.png) no-repeat 0 0; }

.shop #nextBtn { 
left : 930px; 
background : url(/ui/img/next-previous.png) no-repeat -20px 0;}

.shop #prevBtn:hover { 
background : url(/ui/img/next-previous.png) no-repeat 0 -20px; }

.shop #nextBtn:hover { 
background : url(/ui/img/next-previous.png) no-repeat -20px -20px; }

.shop .slide .summary {
margin-bottom : 0; }

.shop .slide .photo {
border : 5px solid rgb(200,200,200); }

.shop .slide .dtlisted,
.shop .strip .dtlisted { 
display : none; }

/* Shop 
------------------------------------------------------------------------------- */

.no-display {
display : none; }

.controls {
margin-bottom : 18px;
padding : 9px 10px;
background-color : rgb(228,225,223);
border-top : 1px solid rgb(255,255,255);
border-bottom : 1px solid rgb(205,202,201);
font : normal 11px Helvetica, Arial, sans-serif; }

.controls form,
.controls fieldset {
margin : 0; 
padding : 0; }

.controls .pager {
float : left;
width : 290px; }

.controls .sorter {
float : left;
width : 260px; }

.controls .amount {
position : relative;
top : 5px;
float : left; 
width : 130px; 
margin : 0; }

.controls .view-mode {
display : none; }

#search_mini_form input[type="text"] { 
width : 210px; 
margin-right : 10px; 
padding : 5px; }

.cart {
position : relative; }

.cart .action-button {
position : absolute;
top : 0;
right : 0; }

.added .product-details {
padding : 0 10px; }

.added img {
position : relative;
top : 3px;
padding : 0;
background : transparent; }

li label,
li #qty {
float : left; 
width : 30px; 
margin-right : 10px; }

li #qty {
position : relative;
top : -6px; 
width : 20px; }

/* Variations
------------------------------------------------------------------------------- */

/* index */

body.index .header h1,
body.index .header h2 { 
height : 70px;
background : url(/ui/img/h1-index.png) no-repeat 0 0; }

body.index .nav-main {
margin-bottom : 0; 
border-bottom-width : 0; }

body.index #nav-index a {
font-weight : bold;
background-color : rgb(160,60,60); 
color : rgb(255,255,255); }

/* magazine */

body.magazine .header h1,
body.magazine .header h2 { 
background : url(/ui/img/h1-magazine.png) no-repeat 0 0; }

body.magazine #nav-magazine a {
font-weight : bold;
background-color : rgb(160,60,60); 
color : rgb(255,255,255); }

body.magazine #search button { 
background-color : rgb(160,60,60); }

/* blog */

body.blog { 
border-top : 4px solid rgb(85,110,5); }

body.blog a { 
color : rgb(85,110,5); }

body.blog #nav-blog a {
font-weight : bold;
background-color : rgb(85,110,5); 
color : rgb(255,255,255); }

body.blog #search button, 
body.blog #search-top button { 
background-color : rgb(85,110,5); }

body.blog #issue { 
background : rgb(85,110,5);  }

body.blog li.comments a em,
body.blog abbr.comments a em,
body.blog .comments-num
 {
background : rgb(85,110,5); }

body.blog li.comments a .point,
body.blog abbr.comments a .point,
body.blog .comments-bubble-point {
border-left : .45em solid rgb(85,110,5); }

body.blog .header h1,
body.blog .header h2 { 
background : url(/ui/img/h1-blog.png) no-repeat 0 0; }

body.blog .footer { 
border-top : 4px solid rgb(85,110,5); }

body.blog .aside .box .highlight, body.blog .aside .box .highlight input#email, body.blog .aside .box .highlight button {
	background-color : rgb(85,110,5);
}

/* books */

body.bookshop { 
border-top : 4px solid rgb(215,90,0); }

body.bookshop a { 
color : rgb(215,90,0); }

body.bookshop #nav-bookshop a {
font-weight : bold;
background-color : rgb(215,90,0); 
color : rgb(255,255,255); }

body.bookshop #search button, 
body.bookshop #search-top button { 
background-color : rgb(215,90,0); }

body.bookshop #issue { 
background : rgb(215,90,0);  }

body.bookshop li.comments a em,
body.bookshop abbr.comments a em {
background : rgb(215,90,0); }

body.bookshop li.comments a .point,
body.bookshop abbr.comments a .point {
border-left : .45em solid rgb(215,90,0); }

body.bookshop .header h1,
body.bookshop .header h2 { 
background : url(/ui/img/h1-books.png) no-repeat 0 0; }

body.bookshop .action-button a { 
background-color : rgb(215,90,0); 
color : rgb(255,255,255); }

body.bookshop .footer { 
border-top : 4px solid rgb(215,90,0); }

body.bookshop h1 span.pre-title {
	display: block;
	color: #666666;
	font-size: .6em;
}

body.bookshop .aside .box .highlight, body.bookshop .aside .box .highlight input#email, body.bookshop .aside .box .highlight button {
	background-color : rgb(215,90,0);
}

/* shop */

body.shop { 
border-top : 4px solid rgb(50,110,150); }

body.shop a { 
color : rgb(50,110,150); }

body.shop #nav-shop a {
font-weight : bold;
background-color : rgb(50,110,150); 
color : rgb(255,255,255); }

body.shop #search button { 
background-color : rgb(50,110,150); }

body.shop #issue { 
background : rgb(50,110,150);  }

body.shop li.comments a em,
body.shop abbr.comments a em {
background : rgb(50,110,150); }

body.shop li.comments a .point,
body.shop abbr.comments a .point {
border-left : .45em solid rgb(50,110,150); }

body.shop .header h1,
body.shop .header h2 { 
background : url(/ui/img/h1-shop.png) no-repeat 0 0; }

body.shop .action-button a { 
background-color : rgb(50,110,150); 
color : rgb(255,255,255); }

body.shop .aside .highlight {
background : rgb(50,110,150) url(/ui/img/highlight.png) repeat-x 0 0; }

body.shop .footer { 
border-top : 4px solid rgb(50,110,150); }

/* =moz and webkit 
------------------------------------------------------------------------------- */

/* transitions */
a, 
input[type="text"], 
textarea, 
#search button,
.aside .highlight button { 
-webkit-transition : all 0.5s linear; }

/* borders */
#nav-main a, 
.action-button a,
.action-button a, 
.close a,
.comments .dtreviewed,
.aside .highlight button,
.popup form button { 
-moz-border-radius : 5px; 
-webkit-border-radius : 5px; }

/* shadows */
.nav-interact div.sub_menu { 
-moz-box-shadow : 0 0 10px rgba(0,0,0,.25); 
-webkit-box-shadow : 0 0 10px rgba(0,0,0,.25); }

#superbox {
-moz-box-shadow : 0 0 10px rgba(0,0,0,.8); 
-webkit-box-shadow : 0 0 10px rgba(0,0,0,.8); }


/**********************
***  BITS & BOBS  *****
**********************/


/* Styles for different textual content
------------------------------------------------------- */

.menu-pipe-separated {
text-align:center;
}


.large-link {
	font-size: 1.1em;
	word-spacing: 1px;
}


/* Buttons & other widgets
------------------------------------------------------- */

a.coloured-button {
	background-color : rgb(105,0,0);
	color: #ffffff;
	-moz-border-radius:5px 5px 5px 5px;
	font: 10px Helvetica,Arial,sans-serif;
	padding:4px 9px;
}


/* Adverts
------------------------------------------------------- */

.doubleclick-ad {
	padding: 0px;
}


/**********************
*** LEGACY CONTENT  ***
**********************/


/* .legacy classed (from Phillip) */

.legacy font {
font-size: inherit!important; }

.legacy .drop1 {
display : inline;
float : left!important; 
width : auto!important; 
margin : 0; }

.legacy .drop1 table,
.legacy .drop1 tr,
.legacy .drop1 td, {
display : inline!important;
width : auto!important; }

.legacy .drop1 img {
display : block; }

.legacy .drop1 p {
display : inline; 
width : auto!important; 
font : bold 10px Helvetica, Arial, sans-serif;
text-transform : uppercase;
letter-spacing : 1px;
line-height : 1.44em; 
color : rgb(180,180,180); }

.legacy p.pullquote {
float : none!important; 
position : relative;
left : -40px;
margin : 0 0 18px 0;
padding-left : 40px;
background : url(/ui/img/quotes-open.png) no-repeat 0 0; }

.legacy br { display : none; }

/* Pre-Bricolage articles */

img[src$="_ni_pix_subbar.gif"] {
	display: none;
}

img[src$="_ni_pix_transparent.gif"] {
	display: none;
}

img[src$="_ni_pix_blackblock.gif"] {
	display: none;
}

img[src$="_ni_pix_megabar.gif"] {
	display: none;
}

img[src$="_ni_pix_gleft.gif"] {
	display: none;
}

img[src$="_ni_pix_gchoose.gif"] {
	display: none;
}

img[src$="_ni_pix_ghome.gif"] {
	display: none;
}

img[src$="_ni_pix_gright.gif"] {
	display: none;
}

/*for images in tables (yuk) eg: http://www.newint.org/features/1997/05/05/map/*/
#column1 td {padding:0px;}
#column1 td img {padding:0px;}


/**********************************
*** OVERRIDES FOR SPECIFIC BITS ***
***********************************/


/* .remove-styling: MicroPolls, etc.  
------------------------------------------------------- */

.remove-styling img {
	background-color: transparent;
	padding: 0px;
}

img.remove-styling {
	background-color: transparent;
	padding: 0px;
}


.remove-styling table {
	width: auto;
	margin-bottom: 0em; /* really?? */
}

.remove-styling table td {
	vertical-align: middle;
}

/* MicroPoll fix - not sure which bit of our CSS is messing it up */

table#mp_table_view > tbody > tr >td >tabe >tbody >tr > td {
	width: 142px; /* right value? */
}


/**************************
*** SINGLE-RULE STYLES  ***
***************************/

.clear {
	clear: both;
}

.hidden {
	display: none;
}

.left {
	float: left;
}

.centre, .center {
	text-align: center;
}

.right {
	float: right;
}

.no-margins {
	margin: 0px;
}

.bottom-margin, .margin-bottom {
	margin-bottom: 1em;
}

.margin-left-bottom {
	margin-left: 40px;
	margin-bottom: 30px;
}

.margin-right-bottom {
	margin-right: 40px;
	margin-bottom: 30px;
}

.red-bg {
	background-color: #A03C3C;
	color: white;
}

.red-bg a {
	color: white;
	text-decoration: underline;
}

.no-list-style li {
	list-style-type: none;
}

/*********************
***   FRONT PAGE   ***
*********************/


/* Slideshow 
------------------------------------------------------- */


	#slideshow { 
		width: 600px; 
		height: 330px; 
		position: relative; 
		display: none;
	}
	
	#slideshow img {
		background-color: transparent;
		padding: 0px;
		margin:0 !important;
	}
	
	.slideshow-label {
		bottom: 0px; /* 5px fixes display err in FF, etc. from JQuery Cycle plugin changing positioning of containing 'slide' div - but messes it up in Chrome */
		left: 0px;
		background-color: #000000;   opacity: 0.8;    position: absolute;
		width: 580px;
		color: white;
		padding: 10px;
	}
	
	.slideshow-label h3 {
		margin-top: 0px;
	}
	
	.slideshow-label a {
		color: white;
	}
	
	#slideshow .prev {
		position: absolute;
		bottom: 15px;
		left: 10px;
		text-align: left; 
		width: 30px;
		height: 60px;
	}
	
	#slideshow .next {
		position: absolute;
		bottom: 15px;
		right: 10px;
		text-align: right; 
		width: 30px;
		height: 60px;
	}
	
	#slideshow .text {
		width: 500px;
		padding-left: 40px;
	}


/* Sidebar boxes 
------------------------------------------------------- */


.small-box h3 {
	font-size: 15px;
	margin-top: 0;
	margin-bottom: 10px;
}

.small-box p {
	margin-bottom: 16px;
}

.small-box .right {
	width: 120px;
}

.fp-sidebar-button {
	font-size: 14px;
	text-decoration: none !important;
	padding: 4px 9px 3px;	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px;
}

.aside .highlight-red {
	color: white;
	background: url("http://www.newint.org/ui/img/highlight.png") repeat-x scroll 0 0 #A03C3C;
}

.aside .highlight-red .fp-sidebar-button {
	background-color: #690000;
}

.aside .highlight-beige {
	color: black;
	background: url('http://www.newint.org/ui/img/halftone.png') repeat-x scroll 0 0 #c7bf91 !important;
}

.aside .highlight-beige .fp-sidebar-button {
	background-color: #7D6F20;
}

.aside .highlight-blue {
	color: white;
	background: #1D435B url("http://www.newint.org/ui/img/highlight.png") repeat-x scroll 0 0;
}

.aside .highlight-blue .fp-sidebar-button {
	background-color: #215A87;
}

.fp-sidebar-button-big {
	font-size: 13px; /* actually now small! */
	text-decoration: none !important;
	padding: 4px 9px 3px;	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px;
}

.aside .highlight-red .fp-sidebar-button-big {
	background-color: #690000;
}

.fp-sidebar-button-big a {
	text-decoration: none !important;
}


/*********************
*** ARTICLE PAGES  ***
*********************/


/* Articles 
------------------------------------------------------- */

.article {
font-size: 1.1em;
}

body.entry .entry-summary {
	margin-top: 1em;
}

.entry-summary {
	font-style: italic;
}

#section-explanation-img {
	float: left;
	padding-left: 30px;
	width: 33px;
}
#section-explanation-img img {
	background-color: transparent;
	padding: 0px;
}

#section-explanation-text {
	float: right;
	color: #666666;
	width: 490px;
	padding-right: 30px;
}

#section-explanation a {
	font-weight: bold;
	color: #666666;
}

.article h2 {
font-size: 1.6em;
}

.article .box {
	padding: 20px;
	background: rgb(228,225,223);
	margin-bottom: 30px;
}

.entry-content ul, .entry-content ul li {
	list-style-type: circle;
}

p.pullquote {
color: rgb(160,60,60);
font-size:1.2em;
margin-bottom:16px;
width:400px;
margin-left:1em;
float:right;
}

p.pullquote.left {
float:left;
margin-right:12px;
}

p.pullquote.right {
float:right;
margin-left:12px;
}

.author_note {
	font-style: italic;
}

/* - Comments */

/* -- Old style comments */
li.comments a,
abbr.comments a {	
position : relative; 
text-decoration : none; 
color : rgb(255,255,255); }

li.comments a em,
abbr.comments a em {
position : relative;
padding : .1em .4em;
-moz-border-radius : 0.25em;
-webkit-border-radius : 0.25em;
border-radius : 0.25em;
font : normal 11px Arial, freesans, sans-serif; /* Charlie changed this so that the speech bubble tails would work everywhere */
letter-spacing : 1px; 
cursor : pointer; 
background : rgb(160,60,60);
color : rgb(255,255,255); }

li.comments a .point,
abbr.comments a .point {
overflow : hidden;
position: absolute;
top : 15px; /* Charlie changed this to 16px as a test*/ /* was 1.15em; - changed by Tom 28/10/11 as this leaves white space on some browsers */
left : .5em;
display : block;
width : 0;
height : 0; 
border-left : .45em solid rgb(160,60,60); 
border-bottom : .45em solid rgb(255,255,255);
border-bottom : .45em solid rgba(0,0,0,0); 
}

li.comments a:hover,
abbr.comments a:hover {
color : rgb(255,255,255); }

li.comments a:hover em,
abbr.comments a:hover em {
background : rgb(25,25,25);
color : rgb(255,255,255); }

li.comments a:hover .point,
abbr.comments a:hover .point {
border-left : .5em solid rgb(25,25,25); }

/* -- New style comments */
.comment-bubble {
	display: inline-block;
}

.comment-submit-btn {
  float:right;
  border:0px;
  height:2em;
  margin-right:6em;
  color:#fff;
  background-color:#A03C3C;
  border-radius: 5px;
  font-weight:bold;
}

.commInf blockquote.description {
  font-style:normal;
}

.comments {
  font-size:0.9em;
  line-height:22px;
}

.comments-num {
padding : .1em .4em;
-moz-border-radius : 0.25em;
-webkit-border-radius : 0.25em;
border-radius : 0.25em;
font : normal 11px Helvetica, Arial, sans-serif; 
letter-spacing : 1px; 
background : rgb(160,60,60);
color : rgb(255,255,255);
display: block;
}

.comments-bubble-point {
width : 0;
height : 0; 
border-left : .45em solid rgb(160,60,60); 
border-bottom : .45em solid rgb(255,255,255);
border-bottom : .45em solid rgba(0,0,0,0);
position: relative;
left : .25em;
display: block;
}

/* Images 
------------------------------------------------------------------------------- */

.article-image {
	margin-bottom: 1em;
}

.new-image-caption {
	font: normal 11px Helvetica, Arial, sans-serif;
}

.article-image.left .new-image-caption,
.article-image.right .new-image-caption {
	width: 300px;
}

.entry-content img.related-media-graphic {
	margin: 10px;
}

/* Commented out by Tom - shout if it breaks anything
.entry-content img {
	max-width:585px;
}*/


.imageTableFloated table {
width:1px;
}

.imageTableFloated.left {
float:left;
margin-right: 68px;
clear:right;
}

.imageTableFloated.right {
float:right;
margin-left: 68px;
clear:left;
}


/* Email nag
------------------------------------------------------------------------------- */


	#email-nag-overlay {
		position: fixed;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
background-color: black;
z-index: 1000;
opacity: 0;
	}
	#email-nag {
		background: url("/ui/img/highlight.png") repeat-x scroll 0 0 #A03C3C;
    	color: #FFFFFF;
    	font: 12px Helvetica,Arial,sans-serif;
    	padding: 20px 20px 14px;
    	margin-bottom: 14px;
    	z-index: 1001;
    	position: relative;
	}
	
	#email-nag h3 {
		font: 11px Helvetica,Arial,sans-serif;
    letter-spacing: 1px;
    text-transform: uppercase;
	}
	
	#email-nag p {
		margin-bottom: 1em;
	}
	
	#email-nag #email {
		 background-color: #A03C3C;
    color: #FFFFFF;
    
    width: 160px;
    height: 12px;
    margin-bottom: 6px;
	}
	
	#email-nag input[type="submit"] {
		margin-left: 10px;
	}

/* ShareThis
------------------------------------------------------------------------------- */
a.stbar.chicklet img {
border:0;
height:16px;
width:16px;
margin-right:3px;
vertical-align:middle;
}
.stbar.chicklet {
height:16px;
line-height:16px;
}

#t-sharing-buttons {
float: right;
}

#t-sharing-buttons .label {
position: relative;
top: -9px;
}

#t-sharing-buttons img {
background: none;
padding: 0px;
margin-bottom: 1.5em;
}

/*** - new, cand delete old by 2012 */
#sharethis-buttons {
	float: right;
}

/* Photos */
.photographer {
	color: #A6A4A4;
}

.postscript {
	font-size: 0.9em;
}

/* Bottom links & meta-info
------------------------------------------------------------------------------- */

.entry-meta ul.nav-interact {
	margin-bottom: 0px;
}

/* Comments  
------------------------------------------------------------------------------- */

.comments h1 { 
margin-left : 40px; }

.comments ol { 
list-style-type : none; }

.comments .hreview { 
position : relative; 
padding-left : 40px;
margin : 0 0 36px 0; }

.comments .half-col {
  width:270px;
  float:left
}

.comments input[type="text"] {
  width: 250px;
}

.comments textarea {
  width: 520px;
}

.comments .dtreviewed { 
display : block;
position : absolute; 
top : 4px;
right : 0;
padding : 6px 9px 5px;
background-color : rgb(228,225,223);
color : rgb(150,150,150);
font : normal 10px freesans, Helvetica, Arial, sans-serif; 
text-transform : uppercase; 
letter-spacing : 1px; 
}

.comments a[rel="bookmark"] {
font : normal 10px freesans, Helvetica, Arial, sans-serif; }

/* Tweetbacks
------------------------------------------------------ */

.tweet {
  display: block;
  margin-bottom: 1em;
}
.tweet_container img{
  width: 48px;
  height: 48px;
  margin: 3px;
  border: 0;
  float: left;
  -webkit-border-top-left-radius: 7px;
  -webkit-border-bottom-right-radius: 7px;
  -moz-border-radius-topleft: 7px;
  -moz-border-radius-bottomright: 7px;
}
.tweet .tweet_container{
  height: 66px;
  background-color: #222;
  opacity: .8; 
  padding: 5px;
  width: 500px;
  font-size: 11px;
  text-shadow: 1px 1px 0 #000;
  color: #eee;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
}
.tweet .tweet_content{
  padding-left: 7em;
}
.tweet .tweet_handle{
  font-size: 13px;
  font-weight: bold;
  float:right;
}

/* Don't change this. It needs to be this size so horizontal lists scale properly */

.small { 
font-size:0.8em;
}
.unpadded {
margin:0px !important;
padding:0px;
}
.unstyled-list{
list-style-type:none;
}
.pot-meta { display:block; padding-bottom:1.2em; }
.pot-tweet { display:block; }


/*******************************
*** TABLE OF CONTENTS PAGES  ***
*******************************/

/*** multiColumnContainer ***/

.multiColumnContainer {
	display: inline-block;
}

.multiColumnContainer {
	display: block;
	overflow: hidden;
}

.multiColumnContainer > div {
	padding: 20px 20px 30000px; /* To create bottom-padding of 18px, you'd make this 18px bigger than margin-bottom */
	margin-bottom: -30000px;
	float: left;
}

/** 3 boxes above listings **/

#mag-top {
	margin-bottom: 30px;
	height: 297px;
}

#mag-top img {
	padding: 0px;
	background-color: transparent;
}

#issue-cover {
	float: left;
}

#issue-cover img {
	width: 210px;
	height: 297px;
}

#issue-blurb {
	float: left;
	width: 370px;
	height: 297px;
	background-color: #e1e0ed;
	position: relative;
}

#issue-blurb .text-, .subs-pitch .text- {
	padding: 12px 20px 0px 20px;
}

#issue-blurb h2, .subs-pitch h2 {
	margin: 0;
	font-weight: normal;
	font-size: 25px;
}

#issue-blurb p {
	margin: 0;
}

#issue-blurb .ps- {
	font-size: 0.8em;
	color: #444444;
}

#subscribe-pointer {
	font-size: 1.4em;
	font-weight: bold;
	
	position: absolute;
	bottom: 4px;
	right: 4px;
}

.subs-pitch {
	float: left;
	width: 370px;
	height: 297px;
	position: relative;
	background-color: #A52c34;
}

#sp2, #sp3, #sp4, #sp5 {
	display: none;
}

.subs-pitch h2 {
	color: #FFC40C; /* Ian had duller #f0c02b;*/
	text-transform: uppercase;
}

.subs-pitch .text- div {
	color: white;
	font-size: 22px;
}

.subs-pitch#sp1 .text- div {
	font-size: 20px;
}

.subs-pitch a {
	color: #FFC40C; /* Ian had duller #f0c02b;*/
}

#subs-pitch-covers {
	position: absolute;
	bottom: 0px;
}

.bottompusher {
	float: left; 
	clear: both;
	height: 82px;
}

.pitch-photo {
	float: left;
	clear: both;
	margin: 20px 12px 12px 0px;
}

.pitch-quote {
	font-style: italic;
	font-weight: bold;
	font-size: 20px;
}

.pitch-quotee {
	text-transform: uppercase;
	text-align: right;
	font-size: 20px;
}

/** utility links **/

#toc-extra-nav {
	background: #e4e3e2 url('http://www.newint.org/ui/img/specific-pages/toc/toc-grey-arrow-nontrans.png') top right no-repeat;
	padding: 4px 15px 4px 10px; /* right=12px as toc-grey-arrow-nontrans.png = 10x30 */
	height: 22px;
	display: inline-block;
	margin-bottom: 10px;
	font-weight: bold;
	color: #444;
}

/** columns **/

#toc-listing {
	clear: both;
}

.magazine.issues #col1, .magazine.issues #col2, .magazine.issues #col3 {
	width: 290px;
	float: left;
}

.magazine.issues #col1, .magazine.issues #col2 {
	margin-right: 40px;
}

.mag-section { 
	border-bottom: 1px solid #B4B4B4;
    margin-bottom: 25px;
}

.section-icon {
	float: left;
	background-color: transparent;
	padding: 0px;
	margin-right: 8px;
	height: 33px;
	margin-top: 3px;
}

.mag-section .title {
	margin-bottom: 1em;
	border: #e4e1df;
}

.mag-section .title {
	color: #666666;
}

.mag-section h3 {
/*	font-family:  Helvetica, Arial, sans-serif; */
  font-weight: bold;
	font-size: 31px;
	margin-bottom: 0;
	height: 33px;
	display: table-cell;
	vertical-align: middle;
}

.mag-section h4 {
	margin-bottom: 0.5em;
	color: #666666;
	font-weight: bold;
	font-size: 1.16em;
}

.hentry {
	margin-bottom: 24px;
}

#toc-listing .hentry img {
	max-width: 290px;
	padding: 0px;
}

.hentry h5 {
	margin-bottom: 5px;
}



/*************************************
***** LANDING/SUBSCRIPTION PAGES *****
*************************************/


/* 'Subscribe' button on post-DSB subs pages */

.action.subs-page a {
	font-size: 20px;
}



/*********************
***** BOOK PAGES *****
*********************/


/* Top grey info box (excluding buy links */

body.books .buy ul {
	margin-bottom: 2px;
}

#publication_info_text {
	clear: both;
	padding-top: 1.5em;
}

/* Buy links
------------------------------------------------------- */

.buy-label { width: 3em; font-weight: bold; }
.aus a { background : url(/ui/img/icons/au.gif) no-repeat 0 50%; }
.can a { background : url(/ui/img/icons/ca.png) no-repeat 0 50%; }
.nz a { background : url(/ui/img/icons/nz.png) no-repeat 0 50%; }
.uk a { background : url(/ui/img/icons/uk.png) no-repeat 0 50%; }
.us a { background : url(/ui/img/icons/usa.png) no-repeat 0 50%; }
.canandusa { background : url(/ui/img/icons/canandusa.png) no-repeat 0 50%; }
.buy .canandusa a {
	padding-left: 44px;
}


/* Reviews
------------------------------------------------------- */
.hreview h3 {
	font-size: 1.5em;
	font-weight: bold;
	color: #666666;
}

/* Labels */

.new-publication, .forthcoming-title {
	text-transform: uppercase;
}

.which-edition { /* implemented yet? */
	font-size: 14px;
	font-style: italic;
}


/*********************
*** SPECIFIC PAGES ***
*********************/


/* Front page
------------------------------------------------------- */

.teaser ul { 
list-style-type : none; 
background-color : rgb(228,225,223);
background-repeat : no-repeat;
background-position : 0 0;
border-top : 1px solid rgb(255,255,255);
border-bottom : 1px solid rgb(205,202,201); }

.teaser ul.v9-6-9 {
	background-image : url(/ui/img/teaser-9-6-9.png); 
}

.teaser ul.v9-6-9 h3, .teaser ul.v9-6-9 p {
	font-size: 1.07em;
}

.teaser li { 
position : relative; 
min-height : 180px; }

.teaser .a-magazine img { 
float : left; 
width : 110px;
margin-right : 20px; }

.teaser .a-subscribe h3,
.teaser .a-subscribe h4,
.teaser .a-subscribe p {
color  : rgb(255,255,255); } 

.teaser .a-subscribe p {
line-height : 1.5; }

.teaser .a-subscribe .action-button { 
margin-top : 18px;
}

.teaser .a-subscribe .action-button a { 
	font-size: 18px;
	background-color: rgb(105,0,0);
}

.teaser .a-subscribe .action-button a:hover { 
background-color : rgb(0,0,0); }

.teaser .a-shop img {
float : right; 
width : 110px;
margin-left : 10px; }



/* Front page :: Tabs at bottom of front page  
------------------------------------------------------------------------------- */

/* Front page :: Tabs at bottom of front page   :: back-issues */

.back-issues { 
overflow : hidden;
list-style-type : none; }

.back-issues:after { 
content : "."; 
display : block; 
height : 0; 
clear : both; 
visibility : hidden; }

.back-issues .item { 
float : left; 
margin : 0 20px 18px 0; 
width : 120px; 
height: 210px;
font : normal 11px freesans, Helvetica, Arial, sans-serif; }

.back-issues .photo { 
display : block; 
margin-bottom : 10px; }

.back-issues .dtlisted { 
display : none; }

/* Front page :: Tabs at bottom of front page :: books

Fucking disastrous class name, given that we have a body class=books
*/

.container .books { 
overflow : hidden; 
list-style-type : none; }

.container .books:after { 
content : "."; 
display : block; 
height : 0; 
clear : both; 
visibility : hidden; }

.container .books .item { 
float : left; 
margin-right : 20px; 
width : 300px; }

.container .books .last { 
margin-right : 0; }

.container .books .photo { 
float : left; 
margin-right : 10px; }

.container .books .dtlisted { 
display : none; }

body.books .buy ul, body.books .buy ul li {
float: left;
}

/* Front page :: Tabs at bottom of front page :: shop */

#tabs-5 .col {
float : left; 
margin-right : 20px; 
width : 300px; }

#tabs-5 .last { 
margin-right : 0; }

#tabs-5 .col ul {
list-style-type : none; }

/* Full Theme Index styles from Tom - June 27
*/

body.full-index .article h3 { /* My suggested change to the h3 style, as discussed on BaseCamp - if you decide against it, can you make this a new class assigned to the h3s below? */
font-size: 1.5em;
}
body.full-index .article h4 {
margin-bottom: 0;
}
body.full-index .article h4 a {
color: rgb(0,0,0);

}

body.full-index #col1 {
width: 280px;
float: left;
}

body.full-index #col2 {
width: 280px;
float: right;
}

body.full-index #col1 li, body.full-index #col2 li {
list-style: none outside none;
display: inline;
}

body.full-index #col1 ul li:after, body.full-index #col2 ul li:after {
content:", ";
}
body.full-index #col1 ul li:last-child:after, body.full-index #col2 ul li:last-child:after {
content:"";
}

/* Subscription page (new)
------------------------------------------------------- */

	#subs-page-rhs {
		float:right; width:520px; 
		padding: 0 20px;
	}
	#subs-page-offer-main {
		text-align: center;
	}
	#subs-page-offers td {
		font: 14px/1.3 Cambria,Georgia,FreeSerif,serif;
	}
	#subs-page-offers .subs-page-offer {
		width: 230px;
		background:url("/ui/img/featured.png") repeat-x scroll 0 0 #E4E1DF;
		border-bottom:1px solid #CDCAC9;
		border-top:1px solid #FFFFFF;
		padding:20px 20px 0px 20px;
	}
	


/* Browse A-Z : /tag/ -------------------------------------------------------------- */

.nav-az li { 
display : inline; 
margin-right : 2px; }

.nav-az li a { 
padding : 2px 4px; 
border : 1px solid rgb(180,180,180); 
font : normal 11px freesans, Helvetica, Arial, sans-serif;
text-transform : uppercase;
text-decoration : none; }

.nav-az li a:hover { 
background-color : rgb(160,60,60); 
color : rgb(255,255,255); 
border-color : rgb(180,180,180); }

.nav-az li a.currentpage { 
background-color : rgb(160,60,60); 
color : rgb(255,255,255); 
border-color : rgb(180,180,180); }

.nav-az li a.disablelink { 
background-color : rgb(255,255,255); 
border-color : rgb(180,180,180); }

/* Topics navigation -------------------------------------------------------------- */

.nav-topics {
list-style-type : none; 
margin-bottom : 0; }

.nav-topics li { 
float : left; 
width : 160px; 
min-height : 20em;
margin-right : 30px; }

.nav-topics img,
.nav-topics h3 { 
display : block;
margin-bottom : 4px; }

.nav-topics p { 
margin : 0; 
font-size : 13px; }

.nav-topics a:hover {
text-decoration : none; }


/* /contact/  
------------------------------------------------------------------------------- */

.contact .row {
padding-bottom : 18px; 
border-bottom : 1px dashed rgb(180,180,180); }

.contact .row .one,
.contact .row .two,
.contact .row .three { 
float : left; 
width : 180px; 
margin-right : 20px; }

.contact .row h4 {
margin-bottom : 4px; }

.contact .row .adr,
.contact .row .tel,
.contact .row .fax,
.contact .row .email {
font : normal 11px freesans, Helvetica, Arial, sans-serif; 
line-height : 1.7; }

.contact .tel { 
margin-top : 18px; }



