/*
---

name: SPIN 2

description: Provides SPIN2 generic styles

provides: [CSS.SPIN2, CSS.SPIN2Visuals]

...
*/

/* COMMON STYLES */
H1, H2, H3, H4, H5, H6, P, IMG, BLOCKQUOTE, UL, OL, LI, DL, DT, DD, FORM, FIELDSET {
	border: none;
	list-style: none;
	margin: 0;
	padding: 0;
}
OL LI {
	list-style: decimal inside none;
}

.grid a {
	text-decoration: none;
}
.grid a:hover,
.grid a:focus {
	text-decoration: underline;
}
.grid .meta a {
	text-decoration: underline;
}
.grid .meta a:hover,
.grid .meta a:focus {
	text-decoration: none;
}

/* LAYOUT */
#colwrapper:after {
	content: ".";
	visibility: hidden;
	height: 0;
	display: block;
	clear: both;
}
.column > div {
	margin-top: 20px;
}
.column > div:first-child {
	margin-top: 0;
}

#rightcolumn_sleeve > div {
	margin-top: 0px;
}

#top .grid.noContent {
	margin: 0;
}

/* SPIN SECTIONHEAD */
#section_intro {
	margin: 0 16px 20px;
	padding: 0;
}

.sectionhead h2,
#main.area .sectionhead h2 {
    font-size: 1.0769em;
    line-height: 1.2857;
    margin: 0 0 1px;
    text-transform: uppercase;
}

/* GRIDS */
#wrapper .grid p.more {
	clear: both;
	font-size: .9231em;
	line-height: 1.1667;
	margin: 10px 0 0;
	padding: 8px 0 0;
}

.half:AFTER, .thumb:AFTER {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
.half {
	clear: both;
}
.twocolumn.half {
	clear: none;
}
.half .picture, .thumb .picture {
	float: left;
	margin: 0 20px 5px 0;
}

.grid .twocolumn {
	float: left;
	clear: none;
}
.grid .twocolumn.left {
	clear: left;
	margin-right: 20px;
}
.grid .twocolumn.right {
	clear: none;
}

.grid .twocolumn * {
    border: 0;
}
.grid .columnContainer {
	margin-bottom: 20px;
}
	.grid .colour1, .grid .colour2, .grid .colour3 {
		clear: both;
		margin-bottom: 0;
		min-height: 0;
	}
	.grid .colour1:after, .grid .colour2:after, .grid .colour3:after {
		content: '';
		display: table;
		clear: both;
	}

	.grid .colour2 {
		border: 2px solid #C60508;
		padding: 8px;
	}
		.grid .colour2 .sectionhead {
			border-top: 5px solid #D1D1D1;
			padding-top: 2px;
		}
			.grid .colour2 .sectionhead_sleeve {
				border-bottom: 1px solid #D1D1D1;
				padding: 0 0 1px;
			}
				.grid .colour2 .sectionhead h2 {
					background: #FFF;
					color: #000;
				}
					.grid .colour2 .sectionhead h2 a {
						color: #CE0306;
						padding-right: 25px;
						text-decoration: none;
					}

	.grid .colour3 {
		padding: 0 10px 10px;
	}
		.grid .colour3 .sectionhead {
			background:#c7c7c7 url(/magazine/graphics/colour3_h2_top.gif) repeat-x left top;
			margin: 0 -10px 10px;
			padding-top: 2px;
		}
			.grid .colour3 .sectionhead_sleeve {
				background:transparent url(/magazine/graphics/colour3_h2_bottom.gif) repeat-x left bottom;
				padding:0 0 1px;
			}
				.grid .colour3 .sectionhead h2,
				#main.area .grid .colour3 .sectionhead h2 {
					color:#000;
					background:#c7c7c7;
					border:1px solid #fff;
					border-width:0 0 1px;
					margin: 0;
					padding: 0 0 1px 10px;
				}
				.grid .colour3 .sectionhead h2 a {
					color: #000;
					text-decoration: none;
					padding-right: 25px;
				}
				.grid .colour3 .sectionhead .rssfeed {
					padding: 0 4px 0 0;
				}


.grid .full, .grid .half, .grid .thumb, .grid .list, .grid .story_list {
	clear: both;
	border-top: 1px solid #CCC;
	padding: 12px 0 0;
	margin-bottom: 0;
	border-bottom: 0;
}

.grid .list,
.grid .story_list {
	padding: 8px 0;
}

.grid .full .sleeve h2,
.grid .half .sleeve h2,
.grid .thumb .sleeve h2,
.grid .list .sleeve h2 {
	text-transform: none;
}

.grid .full .sleeve > h2,
.grid .half .sleeve > h2 {
	font-size: 1.2308em;
	line-height: 1.25;
	margin: 0 0 8px;
}
	.grid .full h2 a, .grid .half h2 a, .grid .thumb h2 a {
		padding-right: 6px;
	}
	.grid .half .picture, .grid .thumb .picture {
		padding-right: 20px;
	}
	.grid .full p.picture, .grid .half p.picture, .grid .thumb p.picture, .grid .list p.picture {
		margin-top: 0;
		margin-bottom: 7px;
	}
	.grid .full p.picture IMG, .grid .half p.picture IMG, .grid .thumb p.picture IMG, .grid .list p.picture IMG {
		margin-top: 0;
		display: block;
	}
	.grid .full p, .grid .half p, .grid .thumb p, .grid .list p {
		margin: 0 0 8px;
		font-size: 1em;
		line-height: 1.308;
	}
	.grid .full .meta, .grid .half .meta, .grid .thumb .meta, .grid .list .meta, .grid .story_list .meta,
	#main .grid .full .meta, #main .grid .half .meta, #main .grid .thumb .meta, #main .grid .list .meta, #main .grid .story_list .meta {
		font-size: .846em;
		line-height: 1.273;
		margin: 0 0 8px;
	}
		.grid .meta span {
			color: #666;
		}
		.grid .list .meta span.date {
			padding: 0;
			border: 0;
		}
		.grid .moreinfo span {
			color: #666;
		}
		.grid .moreinfo span.comments {
			border-right: 1px solid #666;
			padding-right:5px;
		}
	.moreinfo {
		margin-top: 8px;
	}

#top .oneColumn .full .sleeve > h2,
#foot .oneColumn .full .sleeve > h2,
#top .oneColumn .half .sleeve > h2,
#foot .oneColumn .half .sleeve > h2 {
	font-size: 2.3077em;
	line-height: 1.2;
}

#main .oneColumn .full .sleeve > h2,
#main .oneColumn .half .sleeve > h2,
#main .oneColumn .thumb .sleeve > h2,
#main .twoColumns .full .sleeve > h2,
#main .twoColumnsSmallLeft .columnTwo .full .sleeve > h2,
#main .twoColumnsSmallRight .columnOne .full .sleeve > h2,
#top .oneColumn .full.twocolumn .sleeve > h2,
#top .threeColumns .full .sleeve > h2,
#foot .oneColumn .full.twocolumn .sleeve > h2,
#foot .threeColumns .full .sleeve > h2,
#top .twoColumnsSmallLeft .columnOne .full .sleeve > h2,
#top .twoColumnsSmallLeft .columnTwo .full.twocolumn .sleeve > h2,
#top .twoColumnsSmallLeft .columnTwo .half .sleeve > h2,
#top .twoColumnsSmallRight .columnOne .full.twocolumn .sleeve > h2,
#top .twoColumnsSmallRight .columnOne .half .sleeve > h2,
#top .twoColumnsSmallRight .columnTwo .full .sleeve > h2,
#foot .twoColumnsSmallLeft .columnOne .full .sleeve > h2,
#foot .twoColumnsSmallLeft .columnTwo .full.twocolumn .sleeve > h2,
#foot .twoColumnsSmallLeft .columnTwo .half .sleeve > h2,
#foot .twoColumnsSmallRight .columnOne .full.twocolumn .sleeve > h2,
#foot .twoColumnsSmallRight .columnOne .half .sleeve > h2,
#foot .twoColumnsSmallRight .columnTwo .full .sleeve > h2,
#foot .threeColumns .full .sleeve > h2 {
	font-size: 1.5385em;
	line-height: 1.2;
}

#top .oneColumn .thumb .sleeve > h2,
#top .twoColumnsSmallLeft .columnTwo .full .sleeve > h2,
#top .twoColumnsSmallRight .columnOne .full .sleeve > h2,
#foot .oneColumn .thumb .sleeve > h2,
#foot .twoColumnsSmallLeft .columnTwo .full .sleeve > h2,
#foot .twoColumnsSmallRight .columnOne .full .sleeve > h2 {
	font-size: 1.5385em;
	line-height: 1.2;
}

.half.twocolumn .sleeve > h2,
.twoColumns .half .sleeve > h2,
.twoColumnsSmallLeft .columnOne .full .sleeve > h2,
.twoColumnsSmallLeft .columnTwo .full.twocolumn .sleeve > h2,
.twoColumnsSmallLeft .half .sleeve > h2,
.twoColumnsSmallRight .columnTwo .full .sleeve > h2,
.twoColumnsSmallRight .columnOne .full.twocolumn .sleeve > h2, 
.twoColumnsSmallRight .half .sleeve > h2,
.threeColumns .full .sleeve > h2,
.threeColumnsWideLeft .columnTwo .full .sleeve > h2,
.threeColumnsWideLeft .half .sleeve > h2,
.threeColumnsWideLeft .full.twocolumn .sleeve > h2,
.threeColumnsWideRight .columnTwo .full .sleeve > h2,
.threeColumnsWideRight .half .sleeve > h2,
.threeColumnsWideRight .full.twocolumn .sleeve > h2,
#main .oneColumn .half.twocolumn .sleeve > h2,
#main .oneColumn .thumb.twocolumn .sleeve > h2,
#main .grid .twoColumns .half .sleeve > h2,
#main .grid .twoColumns .thumb .sleeve > h2,
#main .twoColumnsSmallLeft .columnOne .full .sleeve > h2,
#main .twoColumnsSmallLeft .columnTwo .half .sleeve > h2,
#main .twoColumnsSmallLeft .columnTwo .full.twocolumn .sleeve > h2,
#main .twoColumnsSmallRight .columnTwo .full .sleeve > h2,
#main .twoColumnsSmallRight .columnOne .half .sleeve > h2,
#main .twoColumnsSmallRight .columnOne .full.twocolumn .sleeve > h2,
#main .threeColumns .full .sleeve > h2,
#mainright .half .sleeve > h2,
#mainright .full.twocolumn .sleeve > h2,
#top .oneColumn .half.twocolumn .sleeve > h2,
#top .oneColumn .thumb.twocolumn .sleeve > h2,
#top .twoColumns .full.twocolumn .sleeve > h2,
#top .twoColumnsSmallLeft .columnOne .full.twocolumn .sleeve > h2,
#top .twoColumnsSmallLeft .columnTwo .half.twocolumn .sleeve > h2,
#top .twoColumnsSmallRight .columnOne .half.twocolumn .sleeve > h2,
#top .twoColumnsSmallRight .columnTwo .full.twocolumn .sleeve > h2,
#top .threeColumns .half .sleeve > h2,
#top .threeColumns .full.twocolumn .sleeve > h2,
#foot .oneColumn .half.twocolumn .sleeve > h2,
#foot .twoColumns .full.twocolumn .sleeve > h2,
#foot .twoColumnsSmallLeft .columnOne .full.twocolumn .sleeve > h2,
#foot .twoColumnsSmallLeft .columnTwo .half.twocolumn .sleeve > h2,
#foot .twoColumnsSmallRight .columnOne .half.twocolumn .sleeve > h2,
#foot .twoColumnsSmallRight .columnTwo .full.twocolumn .sleeve > h2,
#foot .threeColumns .half .sleeve > h2,
#foot .threeColumns .full.twocolumn .sleeve > h2 {
	font-size: 1.2308em;
	line-height: 1.25;
}

.grid .thumb h2,
#main .grid .thumb h2 {
	font-size: 1.2308em;
	line-height: 1.25;
	margin: 0 0 6px;
}

.grid .list h2,
.grid .story_list h2,
#main .grid .list h2,
#main .grid .story_list h2 {
	font-size: 1em;
	line-height: 1.3846;
	margin-bottom: 0;
	text-transform: none;
}
	.grid .list li,
	.grid .story_list li {
		background: url(/magazine/graphics/arrow_red.gif) no-repeat 0 5px;
	    margin: 0;
	    padding: 0 0 12px 15px;
	}
	.grid .list li:last-child,
	.grid .story_list li:last-child {
		border-bottom: 0;
		margin-bottom: 0;
		padding-bottom: 0;
	}
	#main .grid .list .meta,
	#main .grid .story_list .meta {
		margin: 0;
	}

.grid H2 .icon {
	float: none;
	margin: -3px 0 -2px;
}
.grid H2 .icon:first-of-type {
	margin-left: 3px;
}

/* WIDGETS */

/* CURRENT ISSUE */
.grid .currentissue {
	margin: 0;
}
	.grid .currentissue h2,
	#main .grid .currentissue h2 {
		font-size: 1.077em; line-height: 1.286;
	    margin: 0 0 11px;
	    text-transform: uppercase;
	}
	.grid .currentissue .picture {
		margin: 0 0 10px;
		padding: 0;
	}
	.grid .currentissue .subscribe {
	    font-size: 0.846em;
	    line-height: 1.273;
	}

#register .grid form, fieldset {
	margin-bottom: 6px;
}

/* Newsletter */
.grid .newsletter_block {
	margin-bottom: 20px;
	margin-top: 0;
}
#wrapper #main .grid .threeColumns .newsletter_block .text {
	width: 99px;
}
#wrapper .grid .twoColumnsSmallRight .columnTwo .newsletter_block .text,
#wrapper .grid .twoColumnsSmallLeft .columnOne .newsletter_block .text,
#wrapper .grid .threeColumnsWideRight .columnTwo .newsletter_block .text,
#wrapper .grid .threeColumnsWideLeft .columnTwo .newsletter_block .text {
	width: 127px;
}

/* Job of the week Widget */
.threeColumnsWideLeft .columnTwo #jotw .button_start,
.threeColumnsWideRight .columnTwo #jotw .button_start,
#main .twoColumnsSmallLeft .columnOne #jotw .button_start,
#main .twoColumnsSmallRight .columnTwo #jotw .button_start {
	width: 98px;
}
#main .threeColumns .columnOne #jotw .button_start,
#main .threeColumns .columnTwo #jotw .button_start,
#main .threeColumns .columnThree #jotw .button_start {
	width: 75px;
}

#mainright .twoColumns .columnOne #jotw .button_start,
#mainright .twoColumns .columnTwo #jotw .button_start {
	width: 149px;
}

/* Latest Jobs widget */
	.twoColumnsSmallLeft .columnOne .jobs .col1, .twoColumnsSmallLeft .columnOne .jobs .col2,
	.twoColumnsSmallRight .columnTwo .jobs .col1, .twoColumnsSmallRight .columnTwo .jobs .col2,
	.threeColumns .jobs .col1, .threeColumns .jobs .col2,
	.threeColumnsWideLeft .columnTwo .jobs .col1, .threeColumnsWideLeft .columnTwo .jobs .col2,
	.threeColumnsWideLeft .columnThree .jobs .col1, .threeColumnsWideLeft .columnThree .jobs .col2,
	.threeColumnsWideRight .columnOne .jobs .col1, .threeColumnsWideRight .columnOne .jobs .col2,
	.threeColumnsWideRight .columnTwo .jobs .col1, .threeColumnsWideRight .columnTwo .jobs .col2,
	#main .twoColumns .jobs .col1, #main .twoColumns .jobs .col2 {
		float: none;
		width: 100%;
	}
	.twoColumnsSmallLeft .columnOne .jobs .col1 .last,
	.twoColumnsSmallRight .columnTwo .jobs .col1 .last,
	.threeColumns .jobs .col1 .last,
	.threeColumnsWideLeft .columnTwo .jobs .col1 .last, .threeColumnsWideLeft .columnThree .jobs .col1 .last,
	.threeColumnsWideRight .columnOne .jobs .col1 .last, .threeColumnsWideRight .columnTwo .jobs .col1 .last,
	#main .twoColumns .jobs .col1 .last {
		border-bottom: 1px solid #999;
	}

/* Forums block */
.midBox {
	background-color: #EEE;
}
	.midBox .sectionhead {
		margin: 0 0 2px;
		padding-top: 0;
		border-top: 5px solid #CCC;
	}
		.midBox .sectionhead h2 {
			float: none;
			margin: 0;
			border-top: 3px solid #fff;
			padding: 3px 6px;
			font-weight: bold;
			font-size: 1.167em;
			line-height: 1.2em;
		}
		.midBox li {
			width: auto;
			border-top: 1px solid #FFF;
		}
		.midBox li .updated {
			padding: 3px 0;
		}
		.midBox li .updated a {
			display: inline;
		}
		.midBox h3 {
			margin: 6px 0;
			line-height: 16px;
		}
		.midBox h3, .midBox h3 a {
			font-weight: bold;
		}

/* Newsletter */
#main.area .twoColumnsSmallLeft .columnOne #newsletter_block #news_email {
	margin-right: 0;
	margin-bottom: 10px;
	width: 194px;
}
#main.area .twoColumnsSmallRight .columnTwo #newsletter_block #news_email {
	margin-right: 0;
	margin-bottom: 10px;
	width: 194px;
}
#main.area .threeColumns .column #newsletter_block #news_email {
	margin-right: 0;
	margin-bottom: 10px;
	width: 165px;
}
.threeColumnsWideLeft .columnTwo #newsletter_block #news_email, .threeColumnsWideRight .columnTwo #newsletter_block #news_email {
	margin-right: 0;
	margin-bottom: 10px;
}

/* Promos */
.pagetext .more {
	margin: 0;
	border: 0;
	padding: 3px 0 10px;
	text-align: left;
}
	.pagetext .more a {
		padding-left: 0;
		color: #fff;
		font-weight: bold;
		
		background-image: none;
	}
	.pagetext .more a:hover {
		text-decoration: none;
	}

.editorial {
	margin-bottom: 5px;
}


/* --- */

.slideshowStyle2 .htmlContent {
	margin-top: 9px;
}
	.htmlContent  H1 {
		margin: 0 0 16px;
	}
	.htmlContent  H2 {
		margin: 0 0 10px;
		padding-bottom: 1px;
	}
	.htmlContent P {
		margin: 0 0 17px;
	}
	.htmlContent  H3 {
		margin: 0 0 16px;
	}
	.htmlContent  H4 {
		margin: 0 0 17px;
	}
	.htmlContent UL {
		list-style: disc outside none;
		margin: 0 0 18px;
		overflow: hidden;
		padding-left: 18px;
	}
		.htmlContent UL LI {
			background: 0;
			display: list-item;
			list-style: disc outside none;
			margin: 0;
			padding-left: 5px;
		}
	.htmlContent OL {
		margin: 0 0 18px;
		overflow: hidden;
    	padding: 0 0 0 2px;
	}
		.htmlContent OL LI {
			margin: 0;
			padding: 0;
		}

/* Remove borders below sectionhead  */
.sectionhead + .full,
.sectionhead + .half,
.sectionhead + .thumb,
.sectionhead + .list,
.sectionhead + .twocolumn,
.sectionhead + .twocolumn + .twocolumn {
	border-top: 0;
	padding-top: 0;
}

#rightcolumn img[width="160"] {
	display: block;
}

.grid #jotw {
	margin: 20px 0 0;
}