/*
---

name: Spin Galleries

provides: CSS.SPIN2Galleries

...
*/

.slideshowStyle1, .slideshowStyle2 { clear: both; }

/* STYLE 1 */
.oneColumn .slideshowStyle1 .display { height: 635px; }
.twoColumns .slideshowStyle1 .display { height: 345px; }
.twoColumnsSmallLeft .columnOne .slideshowStyle1 .display { height: 225px; }
.twoColumnsSmallLeft .columnTwo .slideshowStyle1 .display { height: 453px; }
.twoColumnsSmallRight .columnOne .slideshowStyle1 .display { height: 453px; }
.twoColumnsSmallRight .columnTwo .slideshowStyle1 .display { height: 225px; }

.threeColumns .slideshowStyle1 .display { height: 225px; }

.threeColumnsWideLeft .columnOne .slideshowStyle1 .display { height: 310px; }
.threeColumnsWideLeft .columnTwo .slideshowStyle1 .display { height: 250px; }
.threeColumnsWideLeft .columnThree .slideshowStyle1 .display { height: 280px; }

.threeColumnsWideRight .columnOne .slideshowStyle1 .display { height: 266px; }
.threeColumnsWideRight .columnTwo .slideshowStyle1 .display { height: 250px; }
.threeColumnsWideRight .columnThree .slideshowStyle1 .display { height: 310px; }

#main.area .oneColumn .slideshowStyle1 .display { height: 453px; }
#main.area .twoColumns .slideshowStyle1 .display { height: 320px; }
#main.area .twoColumnsSmallLeft .columnOne .slideshowStyle1 .display { height: 180px; }
#main.area .twoColumnsSmallLeft .columnTwo .slideshowStyle1 .display { height: 285px; }
#main.area .twoColumnsSmallRight .columnOne .slideshowStyle1 .display { height: 285px; }
#main.area .twoColumnsSmallRight .columnTwo .slideshowStyle1 .display { height: 165px; }

#mainright.area .oneColumn .slideshowStyle1 .display { height: 225px; }
.grid .slideshowStyle1 .display {
	background-color: #F3EFEA;
	position: relative;
}
.grid .slideshowStyle1 .display .caption {
		background-color: #000;
		bottom: 0;
		height: auto;
		left: 0;
		margin: 0;
		opacity: 0.8;
		right: 0;
		visibility: visible;
		width: auto;
	}
.grid .slideshowStyle1 .display .caption h4 {
		margin-bottom: 0px;
		background-color: #000;
		font-weight: bold;
		font-size: 1.433em ;
		line-height: 21px;
		font-family: "Merriweather",Georgia,"Times New Roman",Times,serif ;
		}
.grid .slideshowStyle1 .display .caption h4 a {
				display: block;
				padding: 5px 0;
				background-color: #000;
				text-decoration: none;
			}
			.grid .slideshowStyle1 .display .caption h4 a:hover {
				text-decoration: underline;
			}
		.grid .slideshowStyle1 .display .caption p {
			margin: 0;
			padding: 5px 0;
			font-size: .917em;
			line-height: 14px;
			color: #FFF;
			background-color: #000;
		}
	.grid .slideshowStyle1 .display .caption .read {
		display: inline-block;
		margin-top: 1px;
		padding: 1px;
		font-weight: bold;
	}
	.grid .slideshowStyle1 .display .caption .read:before {
		content: "\203A  ";
	}
	.grid .slideshowStyle1 .thumbs li {
		margin-right: 3px;
	}


/* STYLE 2 */
.grid .slideshowStyle2 .display {
	background: #000;
	width: 320px;
}
.grid .slideshowStyle2 .thumbs {
	margin-left: -15px;
	border: solid #ccc;
	border-width: 1px 1px 0 0;
	padding: 0;
}
.grid .slideshowStyle2 .thumbs LI {
	background: url('/magazine/graphics/gallery/gallery.border.png') repeat-y scroll 13px 0px #F0F0F0;
    height: 99px;
    border-bottom: 1px solid #DAD9D9;
    padding-left: 10px;
}
	.grid .slideshowStyle2 .thumbs LI.selected {
		position: relative;
		z-index: 10;
		border-bottom: 0;
		height: 100px;
		background: url(/magazine/graphics/gallery/selected.png) no-repeat 0 50%;
	}
		.grid .slideshowStyle2 .thumbs LI.selected .heading,
		.grid .slideshowStyle2 .thumbs LI.selected .heading A {
			color: #000;
			text-decoration: none;
		}
	.grid .slideshowStyle2 .thumbs LI .caption {
		padding: 12px 18px ;
	}
.grid .slideshowStyle2 .thumbs LI .caption .heading {
		margin: 0 0 5px;
		font-weight: bold;
		font-size: 1.43em ;
		line-height: 22px ;
		font-family: "Merriweather", Georgia,"Times New Roman",Times,serif ;
		}
		.grid .slideshowStyle2 .thumbs LI .caption .heading a {
			text-decoration: none;
		}
		.grid .slideshowStyle2 .thumbs LI .caption .heading a:hover {
			text-decoration: underline;
		}
		.grid .slideshowStyle2 .thumbs LI .caption .standfirst {
			margin-top: 0;
			height: 53px;
			overflow: hidden;
			font-size: .917em;
		}

.oneColumn .slideshowStyle2 .display { 
	width: 559px;
}
.oneColumn .slideshowStyle2 .thumbs {
	width: 427px;
	
}

/* TOP/FOOT TWO COLUMN (SMALL LEFT) */
#top.area .twoColumnsSmallLeft .columnTwo .slideshowStyle2 .thumbs, #foot.area .twoColumnsSmallLeft .columnTwo .slideshowStyle2 .thumbs {
	width: 334px;
}
/* TOP/FOOT TWO COLUMN (SMALL RIGHT) */
#top.area .twoColumnsSmallRight .columnOne .slideshowStyle2 .thumbs, #foot.area .twoColumnsSmallRight .columnOne .slideshowStyle2 .thumbs {
	width: 334px;
}

#main.area .oneColumn .slideshowStyle2 .display { width: 320px; }
#main.area .oneColumn .slideshowStyle2 .thumbs { width: 334px; }