body {
	margin : 0px ;
	padding : 0px ;
	font-size : 11px ;
	font-family : "Arial", "Helvetica" "sans-serif" ;
	background : black ;
	color : white ;
	min-width : 1000px ;
}

a, a:hover, a:visited, a:active {
	color : white ;
	text-decoration : none ;
}

a.guidelinesLink {
	text-decoration : underline ;
}

a.guidelinesLinkHome {
	text-decoration : underline ;
	color: #99CCFF;
}

span.actionable a {
	color : inherit ;
}

a img, a:hover img, a:visited img, a:active img {
	border : none ;
}

br.brclear, div.brclear {
	clear: both;
	visibility : hidden ;
}

*.actionable {
	cursor : pointer ;
}

div.indent {
	margin-left : 15px ;
	margin-bottom : 3px ;
}

span.small {
	font-size : 90% ;
}


/*** Side menu ***/

#bbfb_logo {
	/*border: solid 1px red;*/
}

div#sideMenuContainer {
/*	float : left ; */
	position : absolute ;
	top : 0px ; /* was originaly 115 */
	left  : 0px ;
	width : 220px ;
	font-size : 8pt ;
	padding-top :0px ;
	/*background-image : url("/images/global/bbfb-gradient-banner.gif") ;*/
	/*background-repeat : no-repeat ;*/
}

div#sideMenuContainer ul {
	padding-left : 0px ;
	background : black ;
	margin : 0px ;
}

div#sideMenuContainer li {
	border-top : 1px solid #222 ;
	margin : 0px ;
	padding : 0px ;
	margin-left : -200px ;
	padding-left : 200px ;
	line-height : 14pt ;
	text-indent : 5px ;
	list-style-type : none ;
}


div#sideMenuContainer li.selected {
	background : #555 ;
	border-top : 1px solid #555 ;
}


div#sideMenuContainer li.selected li {
	border-top : 1px solid #555 ;
	background : black ;
}


div#sideMenuContainer li.selected li.selected {
	background : #333 ;
}

div#sideMenuContainer ul.submenu {
	padding-left : 15px ;
}

div#sideMenuBottomGradient {
	line-height : 120px ;
	background-color : black ;
	background-image : url("/images/global/menu-bottom-gradient.gif") ;
}

ul#sideMenu li a {
	display : block ;
	width : 100%;
}

/*** rest of page ***/
div#rightContainer {
	margin-left : 220px ;
}

/** Top banner **/
div#topBanner {
	background-image : url("/images/global/gradient-banner.gif") ;
	background-repeat : repeat-x ;
	margin-bottom : 3px ;
}

div#topBanner img#bbf-logo {
	margin-left : 20px ;
	display : block ;
}


/** coloured borders **/

div#colourStrip {
	background : black ;
	padding : 2px 0px 2px 2px ; 
	margin : 0px ;
	background-repeat : repeat-y ;	
	
	/*actually in the html file as firefox has issues with caching*/
	/*background-image : url("/brandDispatch.php?name=colourGradient.gif&type=image") ; */
}

div#greyBorder {
	background : #222 ; 
	margin : 0px ; 
	border : 15px solid #222 ;
	border-bottom : 1px solid #222 ;
}

div#contentContainer {
	border : 1px solid #DDD ;
	height : 100% ;
	position : relative ;
	top : 0px ;
	left : 0px ;
}

/** footer **/
div#footerBar {
	text-align : center ;
	line-height : 11px ;
	font-size : 8pt ;
	padding : 2px ;
	color : #DDD ;
}

div#footerBar a {
	padding : 0px 20px 0px 20px ;
}

div#bottomGradient {
	line-height : 65px ;
	background-repeat : repeat-x ;	
	background-image : url("/images/global/gradient-footer.gif") ;
	margin-top : 3px ;
}


/** top menu **/
div#bodyHeaderStrip {
	background : black ;
	border-bottom : 1px solid #DDD ;
	font-size : 10pt ;
	line-height : 25px ;
	height : 30px ;
}

div#bodyHeaderStripTitle {
	padding : 3px 3px 3px 9px;
	font-size : 19px ;
	font-weight: bold;
}

div#topMenuLinks {
	margin : 0px ;
	padding-top : 3px ;
	padding-bottom : 3px ;
	background-image : url("/images/global/bodyTopMenuGradient.gif") ;
	background-repeat : repeat-x ;
	background-position : 50% 0% ;
	float : right ;
	height : 24px ;
}

div#topMenuLinks a {
	border-left : 1px solid #555 ;
	margin : 0px ;
	padding : 9px 13px 7px 13px ;
	font-size : 8pt ;
}


/*** brand info content layout ***/
	
#staticTable
	{
	border-collapse: collapse;
	}
		
td#staticImage
	{
	padding: 0px;
	margin: 0px;
	vertical-align: top;
	}
	
td#staticImage img
	{
	width: 230px;
	display: block;
	}
	
#staticContent
	{
	border-left: 1px solid #FFF;
	vertical-align: top;
	padding: 20px 40px 20px 50px;
	font-size : 12px ;
	}
	
#staticContent h1
	{
	font-size: 11px;
	font-weight: bold;	
	font-size : 14px ;
	}
	
#staticContent h3
	{
	font-size: 11px;
	font-weight: bold;	
	margin-top : 25px ;
	margin-bottom : 0px ;
	font-size : 13px ;
	}	
	
#staticContentNoFloat
	{
	padding: 15px 15px 15px 30px;
	font-size : 12px ;
	}
	
#staticContentNoFloat h1
	{
	font-weight: bold;
	background-color: #333;
	border-top: 1px solid #808080;
	padding: 4px 4px 4px 12px;
	}

/* ** */


div#bodyContentContainer {
	/*should be here but due to FF caching isses, has been moved into the html */
	/*background-image : url('/brandDispatch.php?name=contentBackground.jpg&type=image') ;*/
	background-position : center top ;
	background-repeat : no-repeat ;
	height : 100% ;
	min-height : 350px ;
}

/*** Asset Browsing ***/

/** nav bar **/
div#assetNavigationBar {

}

div#breadcrumb {
	color : #FFF ;
	font-weight: bold;
	font-size: 11px;
	border-bottom: 1px solid #707070;
	padding: 7px 12px 7px 29px;	
}

div#breadcrumb span.currentBreadcrumbItem {
	color : white ;
}

div#adminControls {
padding: 18px 10px 1px 30px;
float: left;
}

div#navControls {
	padding: 18px 2px 1px 2px;
	float : right ;
	text-align : center ;
	min-width : 200px ;
}

div#navControls span.nextPrevious {
	color : #555 ;
}

div#navControls span.enabledPageSelector {
	color : #DDD ;
}

div#navControls span.currentPageSelector {
	font-size : 1.1em ;
	color : white ;
}

div.assetNewBadge {
	position : absolute ;
	width : 56px ;
	height : 16px ;
	top : -18px ;
	left : -3px ;
	background-image : url("/images/global/new.gif") ;
}

div.assetInfoNewBadge {
	position : absolute ;
	width : 56px ;
	height : 16px ;
	top : -8px ;
	left : 5px ;
	z-index : 2 ;
	background-image : url("/images/global/new.gif") ;
}	

/** asset layout **/

div.assetBlock {
	padding : 30px ;
	border-bottom : 1px solid #DDD ;
	float : left ;
	width : 285px ;
}

div.assetThumbnail {
	position : relative ;
	top : 0px ;
	left : 0px ;
	float : left ;
	width : 114px ;
	height : 114px ;
	border : 3px double #DDD ;
	text-align : center ;
	vertical-align : middle ;
	line-height : 112px ;
}

div.assetThumbnail img {
	vertical-align : middle ;
}


div.assetDetails {
	margin-left : 125px ;
	padding-top : 5px ;
	font-size: 11px ;
}

div.assetControls {
	line-height : 25px ;
	font-size : 7.5pt ;
	text-align : left ;
	clear : left ;
	padding-top : 10px ;
}

div.assetControls span {
	margin : 5px 20px 5px 0px ;
}

div.assetControls span img {
	line-height : 25px ;
	vertical-align : middle ;
	padding-right : 5px ;
}

span.assetReorderPosition input {
	width  : 30px ;
}


/*** Modal Overlay ***/
div#overlayContainer{
	position : absolute ;
	top : 0px ;
	left : 0px;
	z-index : 3 ;
	margin:0px;
	padding:0px ;
	width:100px;
	height:100px;
	text-align : center ;
}

div#overlayBackground{
	position : absolute ;
	top : 0px ;
	left : 0px ;
	bottom : 0px ;
	right : 0px ;
	width : 100%;
	height : 100% ;
	margin:0px;
	padding:0px ;
	background : black ;
	filter:alpha(opacity=85);
	opacity:.85;
}

div#overlayContent{
	border : 1px solid white ;
	position : relative ;
	top : 0px ;
	left : 0px ;
	margin-left : auto;
	margin-right : auto ;
}



/*** Asset Info ***/
div#assetInfo {
	height : 100% ;
	font-size: 11px;
}

/*
IE positioning hack, part 1
IE has problems with an additional 1px right margin on absolutely positioned,
right-edge-aligned divs so we force a 0 padding and margin then offset the right margin by -1 
see part 2 below
*/
div#overlayContent div {
	margin : 0px ;
	padding : 0px ;
	margin-right : -1px ;
}

div#assetInfoThumbnail {
	position : absolute ;
	top : 0px ;
	left : 0px ;
}

div#assetInfoThumbnail img {
	vertical-align : middle ;
}

div#assetInfoDetailsContainer {
	border-left : 1px solid white ;
	position : absolute ;
	right : 0px;
	width : 299px ;
	top : 0px ;
	bottom : 0px ;
	text-align : left ;
	margin : 0px ;
	padding : 0px ;
	height : 100% ;
}


div#assetInfoDetails {
	position : relative ;
	top : 40px ;
	bottom : 40px ;
	left : 10px ;
	right : 10px ;
}

span.assetLabel {
	line-height : 1.3em ;
	font-weight: bold ;
}

div.assetValue {
	overflow : auto ;
	max-height : 70px ;
	width : 270px ;
}

div#assetInfoDetails textarea {
	width : 270px ;
	margin-left : 10px ;
	vertical-align : top ;
}

div#assetInfoTitle {
	position : absolute ; 
	top : 0px ;
	right : 0px ;
	width : 299px ;
	height : 30px ;
	line-height : 28px ;
	vertical-align : middle ;
	text-align : center ;
	padding-right : 30px ;
}

div#assetInfoClose {
	position : absolute ;
	top : 0px ;
	right : 0px ;
	height : 30px ;
	width : 30px ;
	line-height : 28px ;
	vertical-align : middle ;
}	

div#assetInfoControls {
	position : absolute ;
	bottom : 0px ;
	right : 0px ;
	width : 299px ;
	height : 30px ;
	line-height : 25px ;
	font-size : 7.5pt ;
	text-align : right ;
	clear : left ;
	padding-right : 10px ;
}


/*
IE positioning hack, part 2
All other browsers need to compensate for the hack above
and, as IEE can't cope with the '>' specification whe use it
to correct the relative margin offsets of specific containers
*/
div#assetInfo > div#assetInfoDetailsContainer,
div#assetInfoDetailsContainer > div#assetInfoTitle,
div#assetInfoDetailsContainer > div#assetInfoControls {
	right : 1px ;
}

div#assetInfoControls span {
	margin : 5px 15px 5px 0px ;
}

div#assetInfoControls span img {
	line-height : 25px ;
	vertical-align : middle ;
	padding-right : 5px ;
}

/*** Stage components ***/
div.stageLabel {
	float : left ;
	width : 200px ;
	height : 20px ;
	line-height : 19px ;
	vertical-align : middle ;
	text-align : center ;
	border : 1px solid white ;
	margin-top : 10px ;
	margin-bottom : 10px ;	
	color: #666;
	border : 1px solid #555 ;
	font-size : 11px;
	/*actually in the html file as firefox has issues with caching*/
	/*background: url("/brandDispatch.php?name=activeStageGradient.jpg&type=image");*/
}

div.currentStage {
	color: white;
	font-weight : bold;
	font-size : 11px;
	border-color : white ;
	/*actually in the html file as firefox has issues with caching*/
	/*background: url("/brandDispatch.php?name=stageGradient.jpg&type=image");*/
}

div.stageButton, div.formButton  {
	width : 100px ;
	height : 20px ;
	line-height : 20px ;
	vertical-align : middle ;
	text-align : center ;
	border : 1px solid gray ;
	font-size : 11px ;
	font-weight: bold;
	color : black ;
	background : white ;	
}

div.stageButton {
	float : left ;
	margin-top : 10px ;
	margin-bottom : 10px ;
	margin-left : 2px ;
}

div.formButton  {
	margin-left: 0px;
	margin-top: 0px;
}

div.stageTitle {
	padding : 3px 10px 3px 10px  ;
	margin-bottom : 10px ;
	margin-top : 10px ;
}


/*** basket ***/
div#basketContainer {
	padding : 10px 10px 10px 10px;
}

div#basketProgesss{
	padding-top: 10px;
}


/** custom downloading **/

div.downloadCustomOptionGroup {
	margin-top : 10px ;
}

div.downloadCustomOption {
	width : 180px ;
	line-height : 25px ;
}

div.indent div.indent div.downloadCustomOption {
	width : 165px ;
}

div.downloadCustomOption input {
	float : right ;
	width : 40px ;
}


div.downloadCustomOption select {
	float : right ;
	width : 85px ;
}

div#downloadAdvancedOptions {
	display : none ;
}


/*** Uploading ***/

div#uploadContainer {
	padding : 10px 10px 10px 30px;
}


iframe {
	border : none ;
	background : transparent ;
	overflow : hidden ;
}

div.uploadContainer {
	border-top : 1px solid gray ;
	padding-left : 10px ;
	padding-top : 5px ;
	margin-top : 5px ;
	position : relative ;
	top : 0px ;
	left : 0px ;
	height : 45px ;	
}

div.uploaderInfoBar {
	display : none ;
}

div#uploadAddUploader {
	padding : 10px ;
}

div.uploadedAsset {
	border-bottom : 1px solid #555 ;
}

div.uploadedAsset div.assetDetails {
	float : left ;
	padding : 0px 15px 10px 25px ;
	margin-left : 0px;
}

div.assetName {
	padding-top : 15px ;
	padding-bottom : 5px ;
}


/*** search ***/
div#searchOptionsContainer {
	margin : 15px 10px 15px 20px ;
}

div.searchOption {
	position : relative ;
	top : 0px ;
	left : 0px ;
	margin-bottom : 5px ;
}

span.searchRemove {
	display : block ;
	position : absolute ;
	top : 5px ;
	left : -20px ;
}
	

div#searchControls {
	margin : 15px 10px 20px 0px  ;
}


/* standard styles for input elements */
.formButton
	{
	border: none;
	}
	
.errorText
	{
	color: #FE0000;
	font-style: italic;
	font-weight: bold;	
	}

.inputElement
	{
	font-size: 11px;
	background-color: #000;
	color: #FFF;
	border: 1px solid #FFF;
	padding-left: 2px;
	}