/* ----- General style ------------------------------------------------------------------ */

html {
	margin: 0px;
	border-style: none;
	padding: 0px;
	background-color: black;
	-webkit-text-size-adjust: 100%;	/* Stops Safari's version of font boost */
}

html.ni_html {
	background-color: white;
}

body {
	max-width: 960px;	/* new */
	min-width: 460px;	/* see also FFs */
	margin: 0px auto 0px auto;
	border-style: none;
	padding: 50px 100px;
	font-family: Georgia,"Times New Roman", Times, serif;
	font-size: 15px;
	line-height: 1.4;
	color: #804000;
	background-color: #A0E0A0;
	word-wrap: break-word;
}

.bodyts {
	background-color: #FFA97A;
}

.ffbodyud {	/* CHANGED */
	max-width: 960px;
	min-width: 460px;
	margin: 0px auto 0px auto;
	border-style: none;
	padding: 0px;
	font-family: Georgia,"Times New Roman", Times, serif;
	font-size: 15px;
	line-height: 1.4;
	color: #804000;
	background-color: #A0E0A0;
	overflow-x: auto;
}

.ffbodyts {
	max-width: 960px;
	min-width: 460px;
	margin: 0px auto 0px auto;
	border-style: none;
	padding: 0px;
	font-family: Georgia,"Times New Roman", Times, serif;
	font-size: 15px;
	line-height: 1.4;
	color: #804000;
	background-color: #FFA97A;
	overflow-x: auto;
}

.ffhtmlud {
	background-color: #A0E0A0;
}

.ffhtmlts {
	background-color: #FFA97A;
}

body.ni_body {
	width: auto;
	margin: 0px;
	padding: 0px;
	font-size: 14px;
	color: #B30004;
	background-color: white;
}

.bodytextjust {
	text-align: justify;
}

.smalltext {
	font-size: 13px;
	text-align: justify;
}

.smalltextnojust {
	font-size: 13px;
}

sup {
	font-size: 85%;
	vertical-align: super;
	line-height: 0;		/* Stops it shoving in extra spacing between the lines. */
}

.subhead {
	font-size: 22px;
}

.subsubhead {
	font-size: 18px; 
}

.redtext {
	color: red;
}

.hide {
	background-color: #804000;
}

.hide:hover {
	background-color: #A0E0A0;
}

.cent {
	text-align: center;
}

.lifter {
	margin: -48px 0px 0px 0px;
	border: 0px;
	padding: 0px;
}

.liftermore {
	margin: -62px 0px 0px 0px;
	border: 0px;
	padding: 0px;
}

.plainlink:link {
	color: #804000;
}

.plainlink:visited {
	color: #C8FFC8;
}

.plainlink:hover {
	color: white;
}

.clearboth {
	clear: both;
}




/* ----- Style to do with page headers ------------------------------------------------------------------ */

.headerdiv {
	margin: 0px 0px 42px 0px;
	border-style: none;
	padding: 0px;
	text-align: center;
}

.uddevice {
	display: block;
	margin: 0px auto 12px auto;
	border-style: none;
	padding: 0px;
}

.mainhead {
	margin: 0px;
	border-style: none;
	padding: 0px;
	font-size: 28px;
	line-height: 1.3;
}

a.emailb4click {
	color: #FF00FF;
	background-color: #E0E0E0;
}


/* ----- Style to do with page footer/back to contents ------------------------------------------------------------------ */

.backtocontentsa {
	display: block;
	margin: 48px auto 26px auto;
	clear: both;
	border-style: none;
	padding: 0px;
	width: 87px;
	height: 43px;
	background-image: url('backtocontents_sprite.gif');
	background-repeat: no-repeat;
}

.backtocontentsa:hover {
	background-position: -87px;
}




/* ----- Style to do with side/side images ------------------------------------------------------------------ */

.sidepicleft {
	float: left;
	margin-right: 20px;
	margin-top: 6px;
	margin-bottom: 6px;
	border-style: none;
	padding: 0px;
	max-width: 100%;	/* new */
	height: auto;	/* new */
}

.sidepicright {
	float: right;
	margin-left: 20px;
	margin-top: 6px;
	margin-bottom: 6px;
	border-style: none;
	padding: 0px;
	max-width: 100%;	/* new */
	height: auto;	/* new */
}




/* ----- Style to do with gallery images ------------------------------------------------------------------ */

.plainimg {
	max-width: 100%;	/* new */
	height: auto;	/* new */
	margin: 0px;
	border-style: none;
	padding: 0px;
}

/* ----- One pic centered --------------------------------------------------------------------------------- */

.onepicdiv {
	margin: 10px;	/* new */
	border-style: none;
	padding: 0px;
	text-align: center;
}

/* ----- Three pics, spread across width -------------------------------------------------------------------*/

.threepicdiv {
	margin: 0px;
	border-style: none;
	padding: 0px;
	text-align: center;
}

.threepicleftimg {
	margin: 10px;
	border-style: none;
	padding: 0px;
	vertical-align: bottom;	/* new */
	max-width: 100%;	/* new */
	height: auto;	/* new */
}

.threepicmiddleimg {
	margin: 10px;
	border-style: none;
	padding: 0px;
	vertical-align: bottom;	/* new */
	max-width: 100%;	/* new */
	height: auto;	/* new */
}

.threepicrightimg {
	margin: 10px;
	border-style: none;
	padding: 0px;
	vertical-align: bottom;	/* new */
	max-width: 100%;	/* new */
	height: auto;	/* new */
}

/* ----- Two pics, 100px between  -------------------------------------------------------------------------*/

.twopicdiv {
	margin: 0px;
	border-style: none;
	padding: 0px;
	text-align: center;
}

.twopicleftimg {
	margin: 10px;
	border-style: none;
	padding: 0px;
	vertical-align: bottom;	/* new */
	max-width: 100%;	/* new */
	height: auto;	/* new */
}

.twopicrightimg {
	margin: 10px;
	border-style: none;
	padding: 0px;
	vertical-align: bottom;	/* new */
	max-width: 100%;	/* new */
	height: auto;	/* new */
}





/* ----- Assorted tables - eplist, recurring chars, multimedia  ------------------------------------------*/

.bodtabtable {
	table-layout: auto;
	width: 100%;
	margin: 26px 0px 26px 0px;
	border-style: none;
	border-collapse: collapse;
	padding: 0px;
}

.bodtabcell {
	margin: 0px;
	border-style: solid;
	border-width: 1px;
	padding: 10px 8px;
}

.img-verthorizalignmid {	/* Centres icons in table cells */
	display: block;
	margin: 0px auto 0px auto;
	vertical-align: middle;
	border-style: none;
	padding: 0px;
}

.recurrtabepcol {	/* To set fixed width for ep list col in Recurr Chars table - try to keep each seas on one line */
	width: 240px;
}

.recurrtabactcol {	/* To set fixed width for actor list col in Recurr Chars table - try to keep each name on one line */
	width: 140px;
}

.multidlcol {	/* To set fixed width for download col in audio table */
	width: 26px;
}

.multidlcol2 {	/* To set fixed width for download col in video tables */
	width: 60px;
}

#jwaudiowrap {	/* The player changes things on jwaudio div, so we manipulate this wrapper */
	margin: 0px auto 0px auto;
	border-style: none;
	padding: 0px;
	width: 400px;	/* audio-player width CHANGED */
}

#jwaudio {
	margin: 0px;
	border-style: none;
	padding: 0px;
}

#jwvideowrap {	/* The player changes things on jwvideo div, so we manipulate this wrapper */
	margin: 0px auto 0px auto;
	border-style: none;
	padding: 0px;
	width: 400px;	/* Holding-video width, changed as req with JS */
}

#jwvideo {
	margin: 0px;
	border-style: none;
	padding: 0px;
}

.playerbutt {
	display: inline-block;
	width: 126px;
	margin: 0px 16px 0px 16px;
	border-style: none;
	padding: 0px;
	text-align: center;
	background-color: #804000;
}

.playerbutt:hover {
	cursor: pointer;
}

#playerbuttwrapper {
	width: 330px;
	margin: 20px auto 0px auto;
	border-style: none;
	padding: 0px;
	color: #A0E0A0;
}



/* ----- Two col layout ----------------------------------------------------------------------------------*/

.fiftypc-col-left {	/* new */
	float: left;
	width: 30%;
	margin: 26px 0px 26px 0px;
	border-style: none;
	padding: 0px;
	vertical-align: top;
}

.fiftypc-col-right {	/* new */
	float: right;
	width: 65%;
	margin: 26px 0px 26px 0px;
	border-style: none;
	padding: 0px;
	vertical-align: top;
}

.fiftypc-col-right p {
	margin: 0px 0px 15px 0px;
}

.lypic {
	margin: 0px 0px 16% 0px;
	border-style: none;
	padding: 0px;
	max-width: 100%;
	height: auto;
}




/* ----- Two col layout - book pages  ----------------------------------------------------------------------*/

.bookcol-col-left {	/* new */
	display: table-cell;
	width: 220px;
	margin: 0px;
	border-style: none;
	padding: 0px;
	vertical-align: middle;
}

.bookcol-col-right {	/* new */
	display: table-cell;
	margin: 0px;
	border-style: none;
	padding: 0px;
	vertical-align: middle;
}

.bookwrap {	/* new */
	margin: 56px 0px 0px 0px;
	border-style: none;
	padding: 0px;
}





/* ----- Gallery stuff -------------------------------------------------------------------------------------*/

.caption {
	display: table;
	text-align: justify;
	border-style: none;
	margin: -10px auto 0px auto;	/* changed */
	border-style: none;
	padding: 0px;
}

.galunit {
	border-style: none;
	margin: 104px 0px 104px 0px;
	border-style: none;
}





/* ----- Factfile stuff -------------------------------------------------------------------------------------*/

.ffwholerow {
	display: table;
	width: 100%;	/* NEW */
	margin: 0px;
	border-style: none;
	padding: 0px;
}

.ffcella {
	display: table-cell;
	vertical-align: middle;
	width: 112px;
	height: 140px;
	margin: 0px;
	border-style: none;
	padding: 0px 8px 0px 8px;
}

@media screen and (max-width:700px) {	/* less than 700 wide, lose decorative first row, first box */
	.ffcella {
		display: none;
	}
}

.ffcellb {
	display: table-cell;
	vertical-align: middle;
	height: 140px;
	margin: 0px;
	border-left: 1px solid;
	padding: 0px;
}

@media screen and (max-width:700px) {	/* less than 700 wide, lose border associated with lost first box */
	.ffcellb {
		border-left: none;
	}
}

.ffcellc {
	display: table-cell;
	vertical-align: top;
	text-align: center;
	width: 112px;
	margin: 0px;
	border-top: 1px solid;
	padding: 4px 8px 0px 8px;
	background-color: #CCCCCC;
}

@media screen and (max-width:700px) {	/* less than 700 wide, lose decorative second row, first box */
	.ffcellc {
		display: none;
	}
}

.ffcelld {
	display: table-cell;
	vertical-align: top;
	margin: 0px;
	border-top: 1px solid;
	border-left: 1px solid;
	border-right: 1px solid;
	padding: 0px 22px 0px 22px;
}

@media screen and (max-width:700px) {	/* less than 700 wide, lose border associated with lost first box */
	.ffcelld {
		border-left: none;
		padding: 0px 10px 0px 10px;
	}
}

.ffcelld p {
	border-style: none;
	padding: 0px;
}

.ffcelle {
	display: table-cell;
	vertical-align: top;
	width: 280px;
	margin: 0px;
	border-top: 1px solid;
	padding: 16px;
	background-color: white;
}

@media screen and (max-width:700px) {
	.ffcelle {
		padding: 16px 10px 16px 10px;
	}
}

.fflogo {
	display: block;
	margin: 0px;
	border-style: none;
	padding: 0px;
}

.fftitle {
	display: block;
	margin: 0px auto 0px auto;
	border-style: none;
	padding: 0px;
}

.fftvt {
	display: block;
	margin: 0px;
	border-style: none;
	padding: 0px;
}

.ffver {
	font-size: 13px;
}

.ffpotrtab td {
	padding: 0px 40px 0px 0px;
}

.ffgtcpara {
}

.ffgtcanc {
	display: block;
	width: 74px;
	height: 39px;
	margin: 0px auto 0px auto;
	background-image: url('gotocontents_sprite.gif');
	background-repeat: no-repeat;
}

.ffgtcanc:hover {
	background-position: -74px;
}





/* ----- Title page stuff ------------------------------------------------------------------ */

.tp_paratextcent {
	text-align: center;
	margin: 0px 0px 46px 0px;
	border-style: none;
	padding: 0px;
}

.tp_center {
	text-align: center;
}

.tp_newsiframe {
	display: block;
	width: 100%;
	height: 250px;
	margin: 44px auto 36px auto;
	border-style: solid;
	border-width: 1px;
	padding: 0px;
}

.tp_contcolgen {
	width: 42%;
	text-align: center;
	margin: 0px auto 0px auto;
	border-style: none;
	padding: 0px 16px 0px 16px;
}

.tp_contcol1 {
	float: left;
}

.tp_contcol2 {
	float: right;
}

.tp_collifter {
	margin: -45px 0px 0px 0px;
	border-style: none;
	padding: 0px;
}

.tp_conthead {
	font-size: 18px;
	font-weight: bold;
	margin: 60px 0px 12px 0px;
}

.tp_menuchunk {
	line-height: 130%;
}

.tp_smalltext {
	font-size: 12px;
}

.tp_search {
	display: inline-block;	/* To shrink-wrap contents */
	margin: 46px 0px 0px 0px;
	border-style: solid;
	border-width: 1px;
	border-radius: 12px;	
	padding: 12px 18px;
	font-size: 18px;
	font-weight: bold;
}

.tp_magnif {
	vertical-align: middle;
	margin: 0px 0px 4px 0px;
	border-style: none;
	padding: 0px;
}

.tp_uddevfeint {
	padding: 58px 0px 0px 0px;
}

.tp_rotatephone {
	margin: 14px 0px 0px 0px;
	border-style: none;
	padding: 0px;
}





/* ----- News iframe stuff (needs doing when 1st needed) -------------------------------------- */


/* ----- Episode guide stuff ------------------------------------------------------------------ */

.eg_et_wrap {
	display: table;
	table-layout: fixed;
	margin: 26px 0px 26px 0px;
	border-style: none;
	font-size: 13px;
}

.eg_et_c1 {
	display: table-cell;
	width: 294px;
	margin: 0px;
	border-style: solid solid solid solid;
	border-width: 1px;
	padding: 18px 12px;
}

.eg_et_c2 {
	display: table-cell;
	width: 295px;
	margin: 0px;
	border-style: solid solid solid none;
	border-width: 1px;
	padding: 18px 12px;
}

.eg_et_c3 {
	display: table-cell;
	width: 295px;
	margin: 0px;
	border-style: solid solid solid none;
	border-width: 1px;
	padding: 18px 12px;
}

.eg_etn_c {
	display: table-cell;
	width: 934px;
	margin: 0px;
	border-style: solid;
	border-width: 1px;
	padding: 12px;
	text-align: center;
}

.eg_et_epanchor:link {
	color: #804000;
	font-weight: bold;
}

.eg_et_epanchor:visited {
	color: #C8FFC8;
	font-weight: bold;
}

.eg_et_epanchor:hover {
	color: white;
	font-weight: bold;
}

.eg_rubrik {
	font-size: 13px;
	text-align: justify;
}

.eg_hr {
	height: 1px;
	margin: 26px 0px 26px 0px;
	border-style: none;
	border-width: 0px;
	color: #804000;
	background-color: #804000;
}

.eg_wholewrap {
	display: table;
	width: 100%;
	margin: 28px 0px 28px 0px;
	border-collapse: collapse;
	table-layout: fixed;
}

.eg_epwrap {
	display: table-row;
}

.eg_titbox {	/* CHANGED */
	display: table-cell;
	width: 42%;
	border-style: solid;
	border-width: 1px;
	padding: 10px 28px 10px 28px;
	text-align: center;
}

.eg_credbox {	/* CHANGED */
	display: table-cell;
	width: 58%;
	border-style: solid;
	border-width: 1px;
	padding: 10px 28px 10px 28px;
}

.egns_titbox {	/* CHANGED */
	display: table-cell;
	width: 46%;
	border-style: solid;
	border-width: 1px;
	padding: 10px 28px 10px 28px;
	text-align: center;
}

.egns_credbox {	/* CHANGED */
	display: table-cell;
	width: 54%;
	border-style: solid;
	border-width: 1px;
	padding: 10px 28px 10px 28px;
}

.eg_titdates {
}

.eg_eptitle {
	font-size: 17px;
	font-style: italic;
	font-weight: bold;
}

.eg_grabpara {
}

.eg_grabimg {
	max-width: 100%;
	height: auto;
}

.eg_syn {
	text-align: justify;
}

.eg_credits {
}

.eg_crednote {
	text-align: justify;
}

.eg_ffanchorpara {
	margin-top: 32px;
	margin-bottom: 32px;
}

.eg_ffanchor {
	display: block;
	width: 81px;
	height: 38px;
	margin: 0px auto 0px auto;
	background-image: url('clickfactfile_sprite.gif');
	background-repeat: no-repeat;
}

.eg_ffanchor:hover {
	background-position: -81px;
}





/* ----- Posh Factfile popup stuff ------------------------------------------------------------------ */


#pp_blackframe {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	margin: 0px;
	border-style: none;
	padding: 0px;
	background-color: rgba(0,0,0,0.5);
}

#pp_iframediv {
	display: block;
	position: relative;
	top: 0px;
	left: 0px;
	margin: 0px;
	border-style: none;
	padding: 0px;
}


#pp_iframe {
	display: block;
	position: static;
	width: 100%;
	height: 100%;
	margin: 0px;
	border-style: none;
	padding: 0px;
}

.pp_closebut {
	display: block;
	position: absolute;
	width: 16px;
	height: 16px;
	top: 8px;
	right: 20px;
	margin: 0px;
	border-style: none;
	padding: 0px;
}





/* ----- Mega-Factfile PHP scrape classes ------------------------------------------------------------------ */


.scrapebody {
}

.scrapeeptitle {
	font-size: 22px;
	margin: 104px 0px 26px 0px;

}

.scrapever {
	font-size: 13px;
}





/* ----- Query page classes ------------------------------------------------------------------ */


.qu_searchblock {
	margin: 0px;
	border-style: none;
	padding: 0px;
}

.qu_inpfield {
	width: 320px;
}

.qu_button {
	margin: 14px 30px 0px 0px;
}





/* ----- Navigation buttons style ------------------------------------------------------------------ */

.movebuttonsdiv {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 80px;
	height: 52px;	/* = height of arrows (40) + top padding (6) + bot padding (6). */
	margin: 0px;
	border-style: none;
	padding: 0px;
	font-size: 0px;	/* To stop insertion of space if the elements are on diff. lines in source code. */
}

.movebutton {
	vertical-align: bottom; /* So no narrow line at bot. for text descenders */;
	margin: 0px;
	border-style: none;
	padding: 6px 0px 6px 0px;
	opacity: 0.7;
}





/* ----- New popup style ------------------------------------------------------------------ */

#backgrounddiv {
	position: fixed;
	z-index: 20;
	height: 100%;
	width: 100%;
	overflow: hidden;
	top: 0px;
	left: 0px;
	border-style: none;
	padding: 0px;
	margin: 0px;
	background-color: #000000;   /* Fallback for browsers which don't understand rgba */
	background-color: rgba(0,0,0,0.8);
	display: none;
	-webkit-user-select: none;	/* Stops the pic being selected/highlighted if the user clicks on the surrounding DIV */
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#constrainer {
	display: block;
	border-style: none;
	padding: 0px;
	margin: 0px;
	overflow-x: hidden;	/* Changed as req by JS */
	overflow-y: hidden;	/* Changed as req by JS */
}

#blownupimage {
	display: block;
	border-style: none;
	padding: 0px;
	margin: 0px;
}

#closepurple {
	display: block;
	position: absolute;
	width: 38px;
	height: 38px;
	top: 0px;
	right: 0px;
	margin: 0px;
	border-style: none;
	padding: 6px 6px 6px 6px;
	opacity: 0.9;
}





@media print {

	body {
		padding: 0px;	/* Knock down the wasted space when printing */
		color: black;
	}

	.ffbodyud, .ffbodyts {
		color: black;
	}

}



@media screen and (max-width:700px) {	/* NEW 14/5/15 */

	/* less than 700 wide, lose the big padding */

	body {
		padding: 20px 8px;
	}

	/* Strip out borders/margins in ep guide tables */

	.eg_wholewrap {
		table-layout: auto;
	}

	.eg_credbox, .eg_titbox, .egns_credbox, .egns_titbox {
		padding: 0px;
	}

	.eg_titbox :first-child, .eg_credbox :first-child {	/* First-child gets the top item in the box, on top of which we want no space */
		margin-top: 0px;
	}

	.egns_titbox :first-child, .egns_credbox :first-child {
		margin-top: 0px;
	}

	.eg_titbox :last-child, .eg_credbox :last-child {	/* Last-child gets the bottom item in the box, on the bottom of which we want no space */
		margin-bottom: 0px;
	}

	.egns_titbox :last-child, .egns_credbox :last-child {
		margin-bottom: 0px;
	}

	/* Put in new reduced paddings */

	.eg_titbox, .egns_titbox, .eg_credbox, .egns_credbox {
		padding: 8px 12px;
	}

	/* Justified text looks bad when we have little horiz space, so... */

	.bodytextjust, .smalltext, .caption, .eg_rubrik, .eg_syn, .eg_crednote {
		text-align: left;
	}

}
