/* 
--------------------------------------------------------------------------------
	SONY PICTURES HOME ENTERTAINMENT - BASE
	Author(s): Music Bay AB, www.musicbay.se
	Created: 2007-01-22
	Last modified: 2007-01-25
--------------------------------------------------------------------------------
*/

* {
	margin: 0; padding: 0;
}

body {
	background: #2f2f3b;
	color: #000;
	text-align: center;
}

/* ----------------------------------------------------------------------------- 
	GLOBALS
----------------------------------------------------------------------------- */

body, p, input, select, textarea {font: 12px Arial, Helvetica, Verdana, sans-serif;}

p {line-height: 16px; padding: 0 0 5px 0;}

.padder {padding: 10px 15px 10px 15px; clear: both;}
.marginTop {margin-top: 20px;}

.show {display: block;}
.hide {display: none;}

.clear {
	height: 0;
	clear: both;
	line-height: 0;
	font-size: 0;
}

.noBorder {border: 0;}

img {border: 0;}
img.border {padding: 1px; border: 1px solid #b2b2b2;}

input[type=text]:focus, input[type=password]:focus, select:focus { /* Later browser versions only textarea:focus,  */
	border: 1px solid #b3190e;
}

input, select {
	padding: 2px;
	border: 1px solid #a0a0a1;
	font-size: 12px;
}

.colRight input {margin-bottom: 5px;}

h1, h2, h3 {margin-bottom: 5px;}
h1 {font-size: 13px;}
h2 {font-size: 12px; margin: 5px 0 5px 0;}
h3 {font-size: 11px;}

a {text-decoration: none; color: #000;}
a:hover {text-decoration: underline; color: #b3190e;}

a.arrow {
	padding-left: 12px;
	font-size: 11px;
	font-weight: bold;
	float: left;
	background: url(../design/btns/link_arrow_idle.gif) no-repeat;
}
a.arrow:hover {background: url(../design/btns/link_arrow_active.gif) no-repeat;}

a.border {display: block; padding: 1px; border: 1px solid #b2b2b2;}
a.border:hover {border: 1px solid #b3190e;}

img.pointer { cursor: pointer; }

address {font-style: normal;}


/* ----------------------------------------------------------------------------- 
	START
----------------------------------------------------------------------------- */

#startBody {background: #1c1c20; color: #fff;}

	#start {
		width: 354px;
		height: 120px;
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -60px auto auto -177px;
		background: url(../design/sphe.gif) no-repeat;
		text-align: left;
	}
	
		#start #usrSel {
			padding: 60px 0 0 120px;
		}
		
		#start #usrSel span {
			display: block;
			clear: left;
			padding: 5px 0 0 7px;
		}
		
		#start #usrSel span {font-size: 11px;}
		#start #usrSel span input {margin-right: 5px;}
		
			#start #usrSel ul {
				list-style: none;
				float: left;
			}
			
			#start #usrSel ul li {
				float: left;
				padding: 0 5px 0 5px;
			}
			
				#start #usrSel ul li a {display: block; border: 1px solid #1c1c20; margin-top: 5px;}
				#start #usrSel ul li a:hover {border: 1px solid #75758b;}
				
				#start #usrSel input.btnGo {
					border: 0;
					width: 46px;
					height: 21px;
				}

/* ----------------------------------------------------------------------------- 
	PRIMARY NAVIGATION
----------------------------------------------------------------------------- */

#wrapTop {
	height: 63px;
	background: url(../design/top/bg.jpg) repeat-x;
}

	#top {
		margin: 0 auto;
		width: 890px;
		height: 63px;
		background: url(../design/top/logo_sphe.jpg) no-repeat;
	}
		
		#langSel {
			float: right; 
			height: 38px;
			margin-right: 103px;
			background: url(../design/top/lang/divider.gif) no-repeat;
		}
			
			#langSel ul {
				float: left;
				list-style: none;
				padding-left: 13px;
			}
			
				#langSel ul li {
					float: left;
					padding: 13px 10px 0 0;
				}
				
				#langSel ul li.active {
					background: url(../design/top/lang/arrow.gif) no-repeat 25% 0;
				}
				
					#langSel ul li a {
						padding: 1px;
						display: block;
						background: #c6c6c6;
					}
					
					#langSel ul li a:hover {
						background: #a7a7a7;
					}
		
		#primaryNav {
			clear: both;
			text-align: left;
			padding-left: 90px;
		}
		
			#primaryNav ul {
				list-style: none;
				float: left;
			}
			
				#primaryNav ul li {
					float: left;
					padding: 0 2px 0 0;
					height: 25px;
					font-size: 0;
					background: url(../design/top/nav/divider.gif) no-repeat top right;
				}
				
				#primaryNav ul li.last {background: none;}
				
				
/* ----------------------------------------------------------------------------- 
	CONTENT BACKGROUND & MAIN COLUMNS
----------------------------------------------------------------------------- */

#bg {
	width: 768px;
	margin: 0 auto;
}

	.bg1 {background: #fff url(../design/bg_1.gif) repeat-y top center;} /* 2 columns light left */
	.bg2 {background: #fff url(../design/bg_2.gif) repeat-y top center;} /* 2 columns dark left */
	.bg3 {background: #fff url(../design/bg_3.gif) repeat-y top center;} /* 3 columns dark right */
	.bg4 {background: #fff url(../design/bg_4.gif) repeat-y top center;} /* 3 columns light right */
	
	.bgWhiteCover {background: #fff url(../design/bg_white_cover.gif) repeat-y !important; padding-top: 0px !important;}

	#content {
		margin: 0 4px 0 4px;
		text-align: left;
	}
		
		.dividerRight {background: url(../design/divider_right_dark.gif) no-repeat bottom;}
		
		#secondaryNav {
			float: left;
			width: 190px;
			padding-top: 3px;
			background: url(../design/bg_top_shadow_dark.gif) repeat-x top;
		}
		
		#main {
			float: right;
			width: 570px;
		}
		
			#main .colLeft {
				float: left;
				width: 360px;
				background: url(../design/bg_top_shadow_light.gif) repeat-x top;
				padding-top: 3px;
			}
			
			#main .colLeftWide {
				float: left;
				width: 405px;
				background: url(../design/bg_top_shadow_light.gif) repeat-x top;
				padding-top: 3px;
			}
			
			#main .colRight {
				float: right;
				width: 210px;
				padding-top: 3px;
				background: url(../design/bg_top_shadow_dark.gif) repeat-x top;
			}
			
			#main .colRightSmall {
				float: right;
				width: 165px;
				background: url(../design/bg_top_shadow_light.gif) repeat-x top;
				padding-top: 3px;
			}
			
			#main .colWide {
				clear: left;
				background: url(../design/bg_top_shadow_light.gif) repeat-x top;
				padding-top: 3px;
			}

		#secondaryNav, .colLeft, .colLeftWide, .colRight, .colRightSmall, .colWide {padding-bottom: 10px;}

/* ----------------------------------------------------------------------------- 
	HEADER ELEMENTS
----------------------------------------------------------------------------- */

.header {height: 40px;}
.header h1 {padding: 8px 15px 0 15px; margin-right: 10px; float: left;}
.header a {float: right; margin: 8px 10px 0 0;}

.colLeft .header {
	background: url(../design/headers/bg_header_360.gif) no-repeat;
}

.colLeftWide .header {
	background: url(../design/headers/bg_header_405.gif) no-repeat;
}

.colRight .header {
	background: url(../design/headers/bg_header_210.gif) no-repeat;
}

.colRightSmall .header {
	background: url(../design/headers/bg_header_165.gif) no-repeat;
}

.colWide .header {
	background: url(../design/headers/bg_header_570.gif) no-repeat;
}

/* ----------------------------------------------------------------------------- 
	SECONDARY NAVIGATION MAIN SUB ELEMENTS
----------------------------------------------------------------------------- */

#secondaryNav, #secondaryNav li, #secondaryNav p {font-size: 11px;}
#secondaryNav h1 {color: #b3190e; padding: 0 10px 1px 10px;}

#menu {
	background: #d9d9d9;
	padding: 8px 0 5px 0;
}

	#menu ul {
		list-style: none;
		border-top: 1px solid #c6c6c6;
	}
	
		#menu ul li {
			height: 26px;
			line-height: 26px;
			font-size: 0;
			border-bottom: 1px solid #c6c6c6;
			background: url(../design/left/menu/bg.gif) repeat-x 0 50%;
		}
		
		#menu ul li.active {background: url(../design/left/menu/bg_active.gif) repeat-x 0 50%;}
		
			#menu ul li a {
				display: block;
				padding-left: 10px;
				height: 26px;
				font-weight: bold;
				font-size: 11px;
			}
			
			#menu ul li a:hover {
				text-decoration: none;
				background: url(../design/left/menu/bg_active.gif) repeat-x 0 50%;
			}
			
				#menu ul li a span {float: left;}
				
				#menu ul li a span.icon {
					float: right; 
					padding-right: 20px;
				}
				
				#menu ul li a span.icoDocNew {background: url(../design/icons/doc_new.gif) no-repeat left center;}
				#menu ul li a span.icoSettings {background: url(../design/icons/settings.gif) no-repeat left center;}
				#menu ul li a span.icoUserNew {background: url(../design/icons/user_new.gif) no-repeat left center;}
				#menu ul li a span.icoUserAll {background: url(../design/icons/user_all.gif) no-repeat left center;}
				#menu ul li a span.icoMailNew {background: url(../design/icons/mail_new.gif) no-repeat left center;}
				#menu ul li a span.icoMailAll {background: url(../design/icons/mail_all.gif) no-repeat left center;}

#quickSearch {
	background: #d9d9d9;
	padding: 10px;
	line-height: 16px; /* "Peekaboo" fix for IE6  */
}

	#quickSearch input {width: 160px; font-size: 11px; margin-bottom: 5px;}
	#quickSearch input.btnSearch {width: 40px; height: 21px; border: 0;}
	#quickSearch input.press {width: 110px; float: left;}
	#quickSearch select {float: left; width: 120px; font-size: 11px;}
	#quickSearch img {float: right;}
	
#folderNav {
	background: url(../design/left/folders/bg.gif) repeat-x;
}
	
	#folderNav #folders {
		height: 35px;
	}
		#folderNav #folders a {float: left;}
		
	#folderNav ul {
		clear: left;
		list-style: none;
		border-top: 1px solid #e6e6e6;
	}
	
		#folderNav ul li {
			display: block;
			height: 53px;
			font-size: 0;
			overflow: hidden;
			border-bottom: 1px solid #e6e6e6;
		}
		
			#folderNav ul li a {
				font-size: 11px;
				height: 53px;
				padding: 10px 10px 0 10px;
				display: block;
				background: url(../design/left/folders/bg_list.gif) repeat-x;
			}
			
			#folderNav ul li a:hover {
				background: url(../design/left/folders/bg_list_odd.gif) repeat-x;
			}
			
				#folderNav ul li a span {font-weight: bold;}

/* ----------------------------------------------------------------------------- 
	RIGHT COLUMNS, NORMAL & SMALL
----------------------------------------------------------------------------- */

.colRight, .colRight p, .colRightSmall, .colRightSmall p {font-size: 11px; padding: 0;}

.colRight span, .colRightSmall span {font-weight: bold; padding-right: 5px;}

/* ----------------------------------------------------------------------------- 
	HOT SPOT
----------------------------------------------------------------------------- */

.colRight .hotSpot {
	border-top: 1px solid #e5e5e5;
	background: #fff;
	margin: 5px;
	padding: 5px;
	clear: both;
	line-height: 16px;
}

	.colRight .hotSpot img {
		padding-bottom: 5px;
	}

/* ----------------------------------------------------------------------------- 
	QUICK FACTS
----------------------------------------------------------------------------- */

#quickFact .packshot {text-align: center; margin-bottom: 10px;}

/* ----------------------------------------------------------------------------- 
	SORT DATA
----------------------------------------------------------------------------- */

#sortData {
	float: right;
	padding: 3px 10px 0 0; 
}
	
	#sortData span {
		padding: 0 0 0 20px;
		font-size: 11px;
	}
	
	#sortData select {
		font-size: 11px;
	}
	
	#sortData select.sortBy {width: 100px;}
	#sortData select.amount {width: 40px;}
	
	
/* ----------------------------------------------------------------------------- 
	PAGE NAVIGATION FOR LISTS
----------------------------------------------------------------------------- */

.pageNav {
	padding-bottom: 10px;
	margin: 5px 5px 10px 5px;
	border-bottom: 1px solid #d2d2d2;
	text-align: center;
	font-weight: bold;
	height: 20px;
}

	.pageNav a, .pageNav span  {padding: 0 5px 0 5px;}
	.pageNav span {color: #d9d9d9;}
	.pageNav a.active {color: #d9d9d9;}
	
/* ----------------------------------------------------------------------------- 
	DATA LISTS
----------------------------------------------------------------------------- */

.listTxt, .listPackshot, .listSm {
	padding-left: 5px;
}

	.listTxt ul, .listPackshot ul {
		list-style: none;
		width: 530px;
	}
	
	.listSm ul {
		list-style: none;
		width: 365px;
	}
	
		.listTxt ul li, .listPackshot ul li, .listSm ul li {
			line-height: 0;
			font-size: 0;
			background: url(../design/lists/bg_even.gif) repeat-x 0 50%;
		}
		
		.listTxt ul li {}
		.listPackshot ul li {height: 54px;}
		.listSm ul li {height: 28px;}
		
		.listTxt ul li.odd, .listPackshot ul li.odd, .listSm ul li.odd {
			background: url(../design/lists/bg_odd.gif) repeat-x 0 50%;
		}
		
			.listTxt ul li table, .listPackshot ul li table {width: 530px; padding: 0; margin: 0; font-size: 11px;}
			.listSm ul li table {width: 365px; padding: 0; margin: 0; font-size: 11px;}
		
				.listTxt ul li table td {line-height: 24px;}
				.listPackshot ul li table td {height: 54px; vertical-align: middle; line-height: 16px;}
				.listSm ul li table td {line-height: 24px;}
			
				.listTxt ul li table td.tdTitle {
					padding-left: 10px;
					width: 380px;
					font-weight: bold;
				}
				
				.listTxt ul li table td.tdTitleSm {
					padding-left: 10px;
					font-weight: bold;
					width: 150px;
					overflow: hidden;
				}
				
				.listTxt ul li table td.tdSubscribers {
					width: 150px;
				}
				
				.listPackshot ul li table td.tdTitle {padding-left: 10px;}
				.listPackshot ul li table td.tdTitle span, .listSm ul li table td.tdTitle span {font-weight: bold;}
				.listSm ul li table td.tdTitle {padding: 0; width: 315px;}
				.listTxt ul li table.tblUserList td.tdTitle {width: 150px;}
				.listTxt ul li table.tblUserList td.tdCompany {width: 150px;}
				.listTxt ul li table.tblUserList td.tdAccount {width: 100px;}
				
				.listSm ul li table td.tdIcon, .listTxt ul li table td.tdIcon {
					width: 25px;
					text-align: center;
				}
				
				.listTxt ul li table td.tdDate {
					text-align: right;
				}
				
				.listTxt ul li table td.tdEdit, .listPackshot ul li table td.tdEdit {
					text-align: right;
					padding-right: 10px;
				}
				
				.listTxt ul li table td.tdEdit a, .listPackshot ul li table td.tdEdit a {
					padding-left: 4px;
				}
				
				.listPackshot ul li table td.tdPackshot {
					padding-left: 2px;
					width: 40px;
				}

/* ----------------------------------------------------------------------------- 
  PRESS IMAGES
----------------------------------------------------------------------------- */

/*.imgDownload {width: 405px;}
.logoDownload {width: 570px;}*/
.imgDownload, .logoDownload {font-size: 11px;}
.imgDownload {margin-left: 3px;}
.logoDownload {margin-left: 20px;}
.imgDownload .item , .logoDownload .item {width: 132px;}
.imgDownload .item:hover , .logoDownload .item:hover {background: #e5e5e5;}

	.imgDownload .item, .logoDownload .item {
		height: 160px;
		overflow: hidden;
		float: left;
		border-bottom: 1px solid #e5e5e5;
		text-align: center;
	}
	
		.imgDownload .item div, .logoDownload .item div {
			padding: 8px;
			text-align: left;
		}
		
		.imgDownload .item div a.border, .logoDownload .item div a.border {
			margin: 5px 0 5px 0;
			width: 114px;
		}

/* ----------------------------------------------------------------------------- 
  PREVIEW HIGHLIGHT
----------------------------------------------------------------------------- */

#previewHighlight {
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #e5e5e5;
}
	
	#previewHighlight img {float: left; padding-right: 20px;}
	
/* ----------------------------------------------------------------------------- 
  VCARDS
----------------------------------------------------------------------------- */

#vCards {
	margin-top: 10px;
	padding-top: 9px;
	border-top: 1px solid #e5e5e5;
}

	#vCards table {
		width: 540px;
		padding: 0;
		margin: 0;
	}
	
		#vCards table td {
			width: 270px;
			line-height: 18px;
			padding-bottom: 20px;
		}
		
		#vCards table td span {color: #b3190e; font-size: 11px;}
		
/* ----------------------------------------------------------------------------- 
  PACKSHOT LIST LARGE
----------------------------------------------------------------------------- */

.packshotListLarge {
	text-align: center;
	background: url(../design/bg_packshot_lines.gif) repeat-y;
}

	.packshotListLarge .item {
		float: left;
		width: 142px;
	}
	
		.packshotListLarge .item .packshot {
			padding: 5px 17px 5px 15px;
		}
		
		.packshotListLarge .item .packshot a.border {
			width: 105px;
		}
		
			.packshotListLarge .item .packshot p {
				font-size: 11px;
				font-weight: bold;
				padding: 10px 0 10px 0;
			}
			
/* ----------------------------------------------------------------------------- 
	MAIN FORMS FOR ADD & EDIT
----------------------------------------------------------------------------- */

.mainForm, .smallForm {
	padding: 10px;
	background: #fbfbfb;
}
	
	.smallForm table {width: 355px}
	.mainForm table {width: 520px;}
		
		.mainForm table td, .smallForm table td {
			background: #eaeaea;
			padding: 10px;
			border-bottom: 5px solid #fbfbfb;
			border-spacing: 0;
			vertical-align: top;
		}
		
		.fieldSmall {width: 80px;}
		.fieldMed {width: 300px;}
		.fieldLarge {width: 350px;}
		
		.mainForm table td.tdTitle, .smallForm table td.tdTitle {font-weight: bold;}
		.mainForm table td.tdAction, .smallForm table td.tdAction {text-align: right;}
		

.sendTip input {margin: 3px 0 5px 0; width: 170px;}

/* ----------------------------------------------------------------------------- 
		BUTTONS
----------------------------------------------------------------------------- */

button.btnRed, button.btnGreen, button.btnBlue, button.btn {
	font-size: 9px;
	font-weight: normal;
	color: #fff;
	padding: 3px;
}

button.btnRed:hover, button.btnGreen:hover, button.btnBlue:hover, button.btn:hover {
	border: 1px solid #000;
}

button.btnRed:active, button.btnGreen:active, button.btnBlue:active, button.btn:active {
	color: #ccc;
}

button.btnRed {
	border: 1px solid;
	background: #a2271e url(../design/btns/bg_red.gif) repeat-x;
	border-top-color: #5b0c06;
	border-right-color: #8e160d;
	border-bottom-color: #8e160d;
	border-left-color: #5b0c06;
}

button.btnGreen {
	border: 1px solid;
	background: #51904b url(../design/btns/bg_green.gif) repeat-x;
	border-top-color: #356131;
	border-right-color: #63a65c;
	border-bottom-color: #63a65c;
	border-left-color: #356131;
}

button.btnBlue {
	border: 1px solid;
	background: #4a4a55 url(../design/btns/bg_blue.gif) repeat-x;
	border-top-color: #252531;
	border-right-color: #686875;
	border-bottom-color: #686875;
	border-left-color: #252531;
}

button.btn {
	border: 1px solid;
	background: #cecece url(../design/btns/bg_grey.gif) repeat-x;
	border-top-color: #9a9999;
	border-right-color: #e2e2e2;
	border-bottom-color: #e2e2e2;
	border-left-color: #9a9999;
}



/* ----------------------------------------------------------------------------- 
  UPDATE WINDOW
----------------------------------------------------------------------------- */

.infoBox {
	padding: 10px 10px 10px 50px;
	margin: 10px;
	border: 1px solid #e5e5e5;
	color: #606060;
	font-size: 11px;
	font-weight: bold;
}

	.error {background: #fff url(../design/infobox/error.gif) no-repeat 0 6px;}
	.ok {background: #fff url(../design/infobox/ok.gif) no-repeat 0 6px;}
	
	.infoBox ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
		.infoBox ul li {
			border-bottom: 1px solid #e5e5e5;
			padding: 3px 0 3px 0;
		}
	
/* ----------------------------------------------------------------------------- 
  TEXT EDITOR
----------------------------------------------------------------------------- */
	
.textEditor .header input.textEditor_title, .textEditor input.textEditor_title {
	margin: 5px;
	width: 198px;
	float: left;
}

.textEditor textarea.textEditor_content {
	width: 200px;
	height: 80px;
	margin: 5px;
	float: left;
}

.floatNone textarea.textEditor_content {
	width: 400px;
	height: 200px;
}

.floatNone textarea.textEditor_content, .floatNone input.textEditor_title {
	clear: both !important;
}

.textEditor .textEditorAction a {float: right; width: 16px;}

.textEditor .textEditorSave {padding: 5px;}

.textEditor .textEditorCancel {padding: 5px;}

.textEditor .textEditorEdit {}

/* ----------------------------------------------------------------------------- 
	FOOTER
----------------------------------------------------------------------------- */

#footer {
	clear: both;
	height: 46px;
	margin: 0 4px 0 4px;
	text-align: left;
	background: url(../design/footer/bg_trans.gif) no-repeat top left;
}
	
	.footerWhite {
		background: url(../design/footer/bg.gif) no-repeat top left !important;
	}
	
	#footer ul {
		float: left;
		padding: 27px 0 0 10px;
		list-style: none;
	}
	
		#footer ul li {
			float: left;
			padding: 0 6px 0 5px;
			background: url(../design/footer/divider.gif) no-repeat center right;
		}
		
		#footer ul li.first {padding: 0 15px 0 0;}
		
	#footer #intLink {float: right; padding-right: 10px;}

