/*************************Default Portal CSS***********************/
body, td, th {
	color: #FFFFFF;
	font: 10px Geneva, Arial, Helvetica, sans-serif;
	z-index: 10;
	margin: 0;
}
body {
	background-color: #777777;
}
a {
	text-decoration: none;
	color: #FFFFFF;
}
a:hover {
	text-decoration: underline;
	color: #8292A1;
}
form {
	margin: 0px;
	padding: 0px;
}
td.dirtable {
	border-bottom-width: 0px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
}
td.filecell {
	padding: 2px;
	width: 160px;
	height: 180px;
}
table.imgbox {
	width: 100%;
	border: 1px solid #777777;
}
table.batch {
	background-color: #777777;
	margin: 4px;
	border: 1px solid #FFFFFF;
}
td.imgbox {
	width: 100%;
	height: 126px;
}
td.iconcell {
	width: 100px;
	height: 100px;
}
td.iconbox {
	width: 100%;
	height: 40px;
}
div.imageinfo {
	position:absolute;
	left:10px;
	top:250px;
	width:700px;
	height:300px;
	z-index:auto;
	visibility: hidden;
}
div#tab1 {
	position:absolute;
	left:0px;
	top:195px;
	width:700px;
	height:23px;
	visibility: hidden;
	border-right-style: solid;
	border-right-width: 0px;
	border-right-color: #FFFFFF;
}
div#tab2, div#tab3, div#tab4, div#tab5, div#tab6 {
	position:absolute;
	left:0px;
	top:195px;
	width:700px;
	height:23px;
	visibility: hidden;
}
td.tabs {
	border-right-width: 0px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
	padding-right: 0px;
	padding-left: 0px;
	padding-top: 1px;
}
td.tabless {
	padding-right: 0px;
	padding-left: 0px;
	padding-top: 1px;
}
td.tabs a, td.tabless a {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	text-decoration: none;
}
td.tabs a:hover, td.tabless a:hover {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	text-decoration: underline;
}
div#imgcell {
	margin: 0px;
	padding: 0px;
	text-align:center;
	vertical-align:middle;
}
div#switch_controls {
	margin: 2px;
	text-align:center;
	vertical-align:middle;
}
.leftarrow, .rightarrow {
	border:0px solid red;
	margin: 10px;
	vertical-align:middle;
}
.control_count {
	margin: 2px;
	vertical-align:bottom;
}
td.errormsg {
	font-size: 12px;
	color: #FF8533;
}
/*************************For Customizing the Login Page***********************/
.logintb { /*background on login table*/
	background-color: #777777;
	width:100%;
}
.logintdtop { /*company name on login page*/
	background-image:url(images/CompanyName.png);
	background-repeat:no-repeat;
	background-position:top center;
	}
.logintdtopl { /*company name on login page*/
	background-image:url(images/login_header.png);
	background-repeat:no-repeat;
	background-position:top center;
}
.logintdbottom { /*logo on login page*/
	background-image:url(images/IO-logo.png);
	background-repeat:no-repeat;
	background-position:top center;
}
.errormsg {
	font-size: 12px;
	color: #FF8533;
}
.logininputtb input {
	border: 0px solid #FFFFFF;
	outline-width:1px;
	outline-color:#8292A1;
	-webkit-focus-ring-color:#8292A1;
}
.loginbutton {
	border: none;
	outline-width:1px;
	background: url('images/up.png') no-repeat top left;
}
.loginnavbottombar {/* the bar at the bottom of the page */
	position:absolute;
	left:0px;
	right:0px;
	bottom: 0px;
	background-color:#777777;
	text-align:right;
}
.loginnavbottombar a {/* the bar at the bottom of the page */
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
}
.authlinks a { /*can be used to style links for IO Access*/
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
}
.authlinks a:hover {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #8292A1;
	text-decoration: underline;
}
/*************************Customization for the Logout Page***********************/
.logout {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
}
.logout a {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
}
.logout a:hover {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #8292A1;
	text-decoration: underline;
}
/**********************Customization for the Header******************************/
table#header { /*background of header template*/
	background-color: #777777;
	width:100%;
	-webkit-box-shadow:2px 5px 5px #333;
}
td.leftofpage {	/*left slice of header image*/
	background-image:url(images/IO-logo.png);
	background-repeat:no-repeat;
	background-position:top left;
}
td.rightofpage { /*right slice of header image*/
	background-image:url(images/CompanyName.png);
	background-repeat:no-repeat;
	background-position:bottom right;
}
/************************Customization for the Tool Tips***********************/
#toolinfo { /*information thats displays under the nav buttons when you hover over an object */
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;  /*990000*/
	position: relative;
	float: left;
	margin-bottom: 2px;
	margin-left: 5px;
	margin-top: 2px;
	padding: 0px;
	font-weight: bold;
}
/********************Customization for the Navigation Tabs*********************************/
#navContainerVS {  /* css for the VS tab */
	display: block;
	background-position: top left;
	background-image: url(images/button_tab.gif);
	background-repeat: no-repeat;
	width: 100px;
	height: 24px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 1px;
	position: relative;
	float: left;
	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-webkit-box-shadow:2px 3px 5px #333;
}
#navContainer {  /* the main css for the basic tabs */
	display: block;
	background-position: top left;
	background-image: url(images/button_tab.gif);
	background-repeat: no-repeat;
	width: 100px;
	height: 24px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 1px;
	position: relative;
	float: left;
	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-webkit-box-shadow:2px 3px 5px #333;
}
#navContainer a:hover {
	display: block;
	background-repeat: no-repeat;
	color: #333333;
	text-decoration: none;
}
#nav {
	display: block;
	margin-top:4px;
	padding: 0px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align: center;
	font-size: 10px;
	text-decoration: none;
	color: #FFFFFF;
}
.nav {
	display: block;
	margin-top:2px;
	padding: 0px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align: center;
	font-size: 10px;
	text-decoration: none;
	color: #FFFFFF;
}
.nav:hover {
	color: #333333;
}
.topbar {
	padding-left: 7px;
}
/***********************Customization for Custom/Fast Search*******************/
#searchContainer {
	float: right;
	width: 260px;
	margin-right: -7px;
	padding: 0;
}
#advsearchContainer {
	float: right;
	width: 108px !important;
	width: 118px;
	margin-right: -7px;
	padding: 0;
}
.search { /* this deals with the fast search input text box */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 15px;
	margin-top: -1px;
	margin-left: 2px;
	margin-right: 2px;
	margin-bottom: 5px;
	color: #A9A9A9;
	border: thin;
	border-color: #333333;
	border-style: solid;
	width: auto;
	height: 25px;
	position: relative;
	float: left;
	outline-color: #666666;
	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-webkit-box-shadow:2px 3px 5px #333;
	-webkit-focus-ring-color: #8292A1;
}
/*************************Customization for Top Level**************************/
.toplevelwelcome { /* welcome message and user's name at top level and the current directory name in browse*/
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: bold;
	color: #FFFFFF;
}
.VolumeGraphic { /* position the volume graphic */
	position: absolute;
	z-index: 10;
	float: left;	/* float so the search icon sits next to the graphic */
	clear: left;	/* clear so the next item (volume graphic) can sit underneath */
	height: 80px;	/* Height of div, increase to space out */
	width: 124px;
	padding-left: 100px; /* Sets up how far from the left the graphic starts */
	padding-bottom: 5px; /* Add some padding between images */
	overflow: visible; /* make sure we see all the image, like bleed in print */
}
.VolumeSearchIcon { /* volume search icon */
	position: absolute;
	z-index: 10;
	float: left;	/* float so the volume name sits next to the graphic */
	height: 100px;
	left: 200px;	/* distance from the left of the window */
	padding-top: 35px; /* adjust vertical placement of image so it looks centered */
	padding-right: 20px;
}
.VolumeTextName { /* volume name text */
	position: absolute;
	z-index: 10;
	padding-top: 38px;
	left: 210px; /* distance from the left of the window */
	height: 80px;
}
.VolumeDummy { /* do not remove, required to show all volumes */
	position: relative; /* If this hack was not here then all volumes would stack on top of each other */
	padding-top: 18px;
	padding-left: 240px;
	height: 80px;
}
.volumename { /* volume name text*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #FFFFFF;
	text-decoration: none;
	display: block;
}
.volumename a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #8292A1;
	text-decoration: none;
	display: block;
}
td.navbottombar {/* bottom bar */
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
	background-color:#777777;
	-webkit-border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;
	-webkit-box-shadow:2px 5px 5px #333;
}
td.navbottombar a {/* bottom bar */
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
	text-decoration: none;
}
/**********************Customization for the Navigation Bar**********************/
tr.navtbrow {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;/*	background-image:url(images/navtb_bg.gif);
	background-repeat:repeat;*/
}
td.navtb {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;/*	background-image:url(images/navtb_bg.gif);
	background-repeat:repeat;*/
}
td.navtb a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;/*	background-image:url(images/navtb_bg.gif);
	background-repeat:repeat;*/
}
td.navtb a:link {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	text-decoration: none;
}
tr.navtb a:link {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	text-decoration: none;
}
/****************************Customization for the Dir Paging Links******************************/
.resultsdir {
	font: 11px Geneva, Arial, Helvetica, sans-serif;
	float:left;
	text-align:center;
	vertical-align:middle;
	color: #8292A1;
}
.resultsdir a:hover {
	color: #666666;
}
.pageLinksdir {
	font: 11px Geneva, Arial, Helvetica, sans-serif;
	float:left;
	text-align:center;
	vertical-align:middle;
}
.pageLinksdir a:link {
	font: 11px Geneva, Arial, Helvetica, sans-serif;
	float:left;
	text-align:center;
	vertical-align:middle;
}
.nowatcurrentdir {
	color: #FFFFFF;
	float:left;
	text-align:center;
	vertical-align:middle;
}
div#AssestNextGroupDirLinks, AssestPrevGroupDirLinks {
	position: relative;
	left:50px;
	float:left;
	margin-left: 5px;
	margin-top: -3px;
}
#resultsdropdir {
	width:100%;
	height:20px;
	clear:right;
	-webkit-box-shadow:2px 5px 5px #333;
}
/****************************Customization for the Directory Name and Links******************************/
.filenamesmall { /*for the text browse/ad to cart that appears under each directory*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
	text-decoration: none;
}
td.directory_name {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color:#FFFFFF;
}
td.directory_name a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color:#FFFFFF;
}
/****************************Customization for the Sort/Filter Options for AT/OLA Modules*****************************/
/* These next two rules hide the sortmenu and sortoption on browse template to be hidden on first view, they get change in javascipt when a user clicks on the buttons */
#sortMenu {
	display: none;/* Hide from user on initial load */
	z-index:300;
}
#sortOptions { /* Hide from user on initial load */
	display: none;
	z-index:300;
	background-position: top left;
	background-image: url(images/button_tab.gif); /* background image to load */
	background-repeat: repeat-x;
	width: 545px;
	height: 24px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 1px;
	padding-left:10px;
	color:#FFFFFF;
	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-webkit-box-shadow:2px 3px 5px #333;
}
#fixatsort {
	position:relative;
	float:left;
	margin-right:16px;
}
/****************************Customization for the File Paging Links******************************/
.results {
	font: 11px Geneva, Arial, Helvetica, sans-serif;
	float:left;
	text-align:center;
	vertical-align:middle;
}
.results A:hover {
	color: #999999;
}
.pageLinks {
	font: 11px Geneva, Arial, Helvetica, sans-serif;
	float:left;
	text-align:center;
	vertical-align:middle;
}
.pageLinks a:link {
	font: 11px Geneva, Arial, Helvetica, sans-serif;
	float:left;
	text-align:center;
	vertical-align:middle;
	color: #999999;
}
.nowatcurrentpage {
	color: #FFFFFF;
	float:left;
	text-align:center;
	vertical-align:middle;
}
div#AssestNextGroupPageLinks, AssestPrevGroupPageLinks {
	position: relative;
	left:50px;
	float:left;
	margin-left: 5px;
	margin-top: -3px;
}
#resultsdrop {
	height:20px;
	clear:right;
	-webkit-box-shadow:2px 5px 5px #333;
}
/***********************Customization for the Lightbox*******************************************/
.lightbox {/* section that deals with the look and feel of the light box text 'lightbox' that sits above the iframe */
	font-weight: bold;
	font-size: 14px;
	color: #FFFFFF;
	text-align: Left;
	padding-right: 5px;
	margin-bottom: 4px;
	margin-top: 0px;
	padding-bottom: 0px;
}
.rtop, .artop {
	display: none
}
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
	This next section is from a free library @ Dynamic Drive, Where the 
	bases of the preview comes from. The library as been edited substantially to work with portal,
	please see the site for infromation http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm
	Edit at your own risk. There product lightbox as nothing to do with portal lightbox pure coincidence
<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
#lightbox {
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#lightbox a img {
	border: none;
}
#outerImageContainer {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#imageContainer {
	padding: 10px;
}
#loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#hoverNav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#imageContainer>#hoverNav {
	left: 0;
}
#hoverNav a {
	outline: none;
}
#prevLink, #nextLink {
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
}
#prevLink {
	left: 0;
	float: left;
}
#nextLink {
	right: 0;
	float: right;
}
#prevLink:hover, #prevLink:visited:hover {
	background: url(images/prevlabel.gif) left 15% no-repeat;
}
#nextLink:hover, #nextLink:visited:hover {
	background:url(images/nextlabel.gif) right 15% no-repeat;
}
#imageDataContainer {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
}
#imageData {
	padding:0 10px;
}
#imageData #imageDetails {
	width: 70%;
	float: left;
	text-align: left;
}
#imageData #caption {
	font-weight: bold;
}
#imageData #numberDisplay {
	display: block;
	clear: left;
	padding-bottom: 1.0em;
}
#imageData #bottomNavClose {
	width: 66px;
	float: right;
	padding-bottom: 0.7em;
}
#overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
* html>body .clearfix {
	display: inline-block;
	width: 100%;
}
* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;/* End hide from IE-mac */
}
/********************Customization for the preview box **************************/
#loader_container {
	text-align:center;
	position:absolute;
	top:40%;
	width:100%
}
#loader {
	font-family:"Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
	font-size:12px;
	color:#666666;
	background-color:#FFFFFF;
	padding:10px 0 16px 0;
	margin:0 auto;
	display:block;
	width:135px;
	border:1px solid #6A6A6A;
	text-align:left;
	z-index:255;
}
#progress {
	height:5px;
	font-size:1px;
	width:1px;
	position:relative;
	top:1px;
	left:10px;
	background-color:#9D9D94
}
#loader_bg {
	background-color:#EBEBE4;
	position:relative;
	top:8px;
	left:8px;
	height:7px;
	width:113px;
	font-size:1px
}
.title_h2 {
	width:300px;
	padding:12px 0 0 18px;
	text-align: left;
	color: #666666;
}
.border_preview {
	z-index:100;
	position:absolute;
	background: #fff;
	border: 2px solid #cccccc;
}
.preview_temp_load {
	vertical-align:middle;
	text-align:center;
	padding: 10px;
}
.preview_temp_load img {
	vertical-align:middle;
	text-align:center;
}
/******************************Customization for Short View*****************************/
#thumbContainer { /* this is the master container for each file cell this holds everything */
	display: block;
	background-position: top left; /*make sure we have alignment */
	background-image: url(images/gradient.png); /* background image */
	background-repeat: repeat-x;
	line-height: 1.1;
	float: left;
	margin: 7px;
	width: 240px;
	height:auto;
	background-color: #B4B5B5;
	border: 0px;
	border-color: #FFFFFF;
	border-style: solid;
	padding: 0px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	z-index:100;
	-webkit-border-radius:10px;
	-webkit-box-shadow:2px 3px 5px #333;
}
.thumbContainerColor {
	color: #F0F0F0;
}
#thumbBox { /*The box that holds the image thumbnail in the file cell */
	float: left;
	width:129px;
	height: 129px;
	background-position: top left;
	background-image: url(images/IG3_Img_BG.gif); /* background image for small preview */
	background-repeat: no-repeat;
	margin-top: 2px;
	margin-left: 12px !important; /*Safari firefox will obay important rule*/
	margin-left: 6px;				/*used by IE6 as it does not understand important rule*/
	margin-bottom: 12px;
	margin-right: 12px;
	padding-top: 5px;
	overflow:hidden;
}
#thumbBox div {
	padding-top: 4px;
	padding-bottom: 6px;
}
#celltopfilename { /*File Name in short view placed at the top of each asset cell block*/
	color:#FFFFFF;
	display: block;
	width: 240px;
	background-color: #8292A1;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	border-bottom: 0px #FFFFFF solid;
	-webkit-border-top-right-radius:11px;
	-webkit-border-top-left-radius:11px;
}
a#celltopfilename:link { /*File Name in short view placed at the top of each asset cell block linked*/
	color: #FFFFFF;
	display: block;
	width: 240px;
	background-color: #777777;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	border-bottom: 0px #FFFFFF solid;
	text-decoration: none;
}
#detailsbox { /* This is the outer container for all the file cell buttons, just lines it up with the image but you could do more */
	margin-top: 12px;
}
#archivestatus { /* how the archive icon will display in the file cell */
	position: relative;
	top:0;
	left: 0px;
	height:8px;
	z-index:500;
	float:right;
}
#approvalstatus { /*floating div for approval icon*/
	position: relative;
	overflow: visible;
	top: -175px;
	left: 2px;
	height: 1px;
	z-index: 200;
	float:left;
}
#iconapprovalstatus { /*floating div for approval icon*/
	position: relative;
	overflow: visible;
	top: -175px;
	left: 22px;
	height: 1px;
	z-index: 200;
	float:left;
}
#longapprovalstatus { /*floating div for approval icon*/
	position: relative;
	overflow: visible;
	top: 20px;
	left: 2px;
	height: 1px;
	z-index: 200;
	float:left;
}
/***************************Customization for the File Cell Buttons************************/
#ButtonContainer {  /*each button look in short view, ie. preview,details,dl-hires etc */
	display: block; /* makes the entire tab a link not just the text */
	background-position: top left; /*make sure we have alignment */
	background-image: url(images/button_tab_sm.png); /* background image to load */
	background-repeat: no-repeat; /* tell tab graphic to only appear once */
	width: 75px !important; /*Safari firefox will obay important rule*/
	width: 79px;  /* just for IE */
	height: 14px;
	margin-top:2px;
	margin-left: 0px;
	margin-right: 0px;
	border: 0px solid #666666;
	/* background-color: #777777;*/
	-webkit-border-radius:4px;
	-webkit-box-shadow:1px 1px 2px #333;
}
#ButtonContainer a:hover { /*File cell Button hover state */
	color: #666666;
	border: 0px solid #EA621B;
	text-decoration: none;
}
div.buttontext { /* the rule for the active text on an active button in the file cells */
	display: block;
	padding: 0px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 9px;
	text-decoration:none;
	text-align: center;
	color: #FFFFFF;
}
.buttontext { /* the rule for the active text on an active button in the file cells */
	display: block;
	padding: 1px !important; /*Safari firefox will obay important rule*/
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 9px;
	text-decoration:none;
	text-align: center;
	color: #FFFFFF;
}
.buttontextdisabled { /* the rule for the disabled text on a disabled button in the file cells when an option is not avilable for that asset */
	display: block;
	padding: 1px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 9px;
	text-decoration: none;
	text-align: center;
	color: #999999;
}
/*****************************Customization for the File Cell 'info...'**************************/
#bottomicon { /*file icon bottom left in file cell */
	clear:left;
	height: 1px;
	position: relative;
	bottom: +5px;
	text-align: left;
	padding-left: 12px;
}
#bottominfobutt { /*div container that holds the info.... text/button */
	clear:left;
	height: 15px;
	position: relative;
	bottom: 0px;
	padding-left: 30px;
}
/*#bottomapporval { /*div container that holds the info.... text/button 
 	height: 5px;
 	font-size: 9px;
}*/
#bottominfobutt a:hover { /*formats the hover color of the info text*/
	color: #FFF;
}
.extraButton { /*formats the info text*/
	font-size: 10px;
	/*font-weight: bold;*/
	color: #333;
	text-align: left;
	padding-left: 0px;
	margin-bottom: 4px;
	margin-top: 0px;
	padding-bottom: 0px;
}
/*.extraButton a:hover {/*the class that describes the look and feal of the text info link, you could add another for hover and change the hover state 
	text-decoration: none;
	font-size: 10px;
	color: #FFF;
}*/
/*****************************Customization for the Top Tabs in PopUp Windows**************************/
.previewNabTab {
	display: block; /* makes the entire tab a link not just the text */
	background-position: top left; /*make sure we have aligenment */
	background-image: url(images/button_tab.gif); /* back ground image to load relative to portal.css(orange tab)*/
	background-repeat: repeat-X; /* tell tab graphic to only appear once */
	height: 24px;
	width: 400px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FFFFFF;
	background-color:#777777;
	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-webkit-box-shadow:2px 3px 5px #333;
}
.previewNabTab td, a {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FFFFFF;
}
#navContainerBasket {  /* the main css for the basic tabs */
	display: block; /* makes the entire tab a link not just the text */
	background-position: top left; /*make sure we have aligenment */
	background-image: url(images/button_tab.gif); /* back ground image to load relative to portal.css(orange tab)*/
	background-repeat: no-repeat; /* tell tab graphic to only appear once */
	width: 38px; /* These 5 lines Sets size of tabs window  and margins (placement)*/
	height: 24px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 1px;
	position: relative;
	padding-top:0px;
	float: left; /* this tells the next tab that it can sit next to this one, otther wise they would be underneath each other */
	text-align: center;
	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-webkit-box-shadow:2px 3px 5px #333;
}
#innerframe {
	clear: left;
	height:34px;
}
/*#navContainer A:HOVER {
	display: block;
	background-repeat: no-repeat; 
	color: #bed8ec;
 }*/
/*****************************Customization for Long View**************************/
div#longviewcontents {
	position:relative;
	float:left;
	width:900%;
	border: 0px solid #342111;
}
#longinnerframe {
	height:34px;
}
.longlightbox {/* section that deals with the look and feel of the light box text 'lightbox' that sites above the iframe */
	font-weight: bold;
	font-size: 14px;
	color: #FFFFFF;
	text-align: Left;
	margin-bottom: 4px;
	margin-top: 2px;
	padding-top:2px;
	padding-bottom: 0px;
}
td.filename {
	background-color: #86a6b3;
	color:#FFFFFF;
	font-size:14px;
	font-weight: bold;
	-webkit-box-shadow:0px 2px 5px #888;
}
.keywordname {
	font-weight: bold;
}
#longthumbContainer { /* this is the master container for each file cell this holds everything */
	display: block; /* makes the entire tab a link not just the text */
	background-position: top left; /*make sure we have aligenment */
	background-image: url(images/gradient.png); /* back ground image to load relative to portal.css(orange tab)*/
	background-repeat: repeat-x; /* tell tab graphic to only appear once */
	line-height: 1.1;
	float: left;
	margin: 0 7 7 7;
	width: 240px;
	height:auto;
	background-color: #B4B5B5;
	border: 0;
	border-color: #FFFFFF;
	border-style: solid;
	padding: 0px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	z-index:100;
	-webkit-border-radius:10px;
	-webkit-box-shadow:2px 3px 5px #333;
}
#longcelltopfilename { /*File Name in long view placed at the top of each asset cell block*/
	color:#FFFFFF;
	display: block;
	width: 240px;
	background-color: #8292A1;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	border-bottom: 0PX #FFFFFF solid;
	-webkit-border-top-right-radius:11px;
	-webkit-border-top-left-radius:11px;
}
a#longcelltopfilename:link { /*File Name in long view placed at the top of each asset cell block linked*/
	color: #FFFFFF;
	display: block;
	width: 240px;
	background-color: #8292A1;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	border-bottom: 0px #FFFFFF solid;
	text-decoration: none;
}
table.longtitleshadow {
	-webkit-box-shadow:0px 5px 5px #333;
	border: 0px;
}
#longlightbox {
	margin-left:5px;
	position:relative;
	float:left;
	right:0;
	width:280px;
}
/***************************Customization for Icon View**********************/
#icondetailsbox { /* This is the outer container for the file cell */
	width:193px;
	margin-top: 12px;
}
#iconthumbBox { /*The box that holds the image thumbnail in the file cell */
	position: relative;
	float: left;
	width:129px;
	height: 125px;
	text-align: center;
	background-position: top left;
	background-image: url(images/IG3_Img_BG.gif); /* background image for small preview */
	background-repeat: no-repeat;
	background-color: #F0F0F0;
	margin-top: 2px;
	margin-left: 32px;				/*used by IE6 as it does not understand important rule*/
	margin-bottom: 12px;
	margin-right: auto;
	padding-top: 5px;
	overflow:hidden;
}
#iconthumbBox div {
	padding-top: 4px;
	padding-bottom: 6px;
}
#iconthumbContainer { /* this is the master container for each file cell this holds everything */
	display: block;
	background-position: top left;
	background-image: url(images/gradient.png); /* background image for file cell */
	background-repeat: repeat-x;
	line-height: 1.1;
	float: left;
	margin: 7px;
	width: 195px;
	height:auto;
	background-color: #B4B5B5;
	border: 0;
	border-color: #FFFFFF;
	border-style: solid;
	padding: 0px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	z-index:100;
	-webkit-border-radius:10px;
	-webkit-box-shadow:2px 3px 5px #333;
}
#iconcelltopfilename { /*File Name at the top of each asset cell block*/
	color:#FFFFFF;
	display: block;
	width: 195px;
	background-color: #8292A1;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	border-bottom: 0PX #FFFFFF solid;
	-webkit-border-top-right-radius:11px;
	-webkit-border-top-left-radius:11px;
}
/***************************Customization for Image Info**********************/
/* The next two styles set up the Details/Info window in imageinfo.tmpl.html Looks like frames but set up as Divs via CSS */
#infosidebar { /* left window */
	width: 340px; /* Width of Left Frame */
	height:100%; /* Height of Left Frame */
	float: left;
	display: block;
	padding: 0 0 2px 5px; /* Sets the contents in a little bit from the edge */
}
#imageinfosidebar { /* left window */
	width: 325px; /* Width of Left Frame */
	height:100%; /* Height of Left Frame */
	float: left;
	display: block;
	padding: 0 0 2px 5px; /* Sets the contents in a little bit from the edge */
}
#infomainwindow { /*Main Window */
	position: absolute;
	top: 0px;	/* Gives margin at top for contents */
	left: 345px; /* This is the width of left frame above plus 20 pixels */
	width: 718px;
	height:100%;
	display: block;
	padding-left: 0px; /* Gives marging for contents */
	border-left: 1px solid #333333; /* Border color and width between the two  */
}
#imageinfomainwindow { /*Main Window */
	position: absolute;
	top: 0px;	/* Gives margin at top for contents */
	left: 345px; /* This is the width of left frame above plus 20 pixels */
	width:590px;
	height:100%;
	display: block;
	padding-left: 0px; /* Gives marging for contents */
	border-left: 1px solid #333333; /* Border color and width between the two  */
}
.infopath { /*path table position */
	z-index:2;
	position: absolute;
	top: 200px;	/* Gives marging at top for contents */
	left: 350px; /* This is the width of left frame above plus 20 pixels */
	width: 700px;
	height:29px;
	display: block;
}
.infomidwindow { /*path table position */
	z-index:3;
	position: absolute;
	top: 200px;	/* Gives marging at top for contents */
	left: 350px; /* This is the width of left frame above plus 20 pixels */
	width: 700px;
	height:100%;
	display: block;
}
/***************************Customization for the wait Spinner******************************/
div#waitForMe { /* this is the spinner that appears in browse window while your waitting */
	position: absolute;
	left:48%;
	top: -1px;
	height:32px;
	width: 32px;
	background-image: url('images/WaitTimer.gif');
	background-repeat: no-repeat;
	z-index: 10000;
	display: block;
	visibility: hidden;
}
div#waitForMeBrowse { /* this is the spinner that appears in lightbox window while your waitting */
	position: relative;
	left: 49%;
	top: 5px;
	height:32px;
	width: 32px;
	background-image: url('images/WaitTimer.gif');
	background-repeat: no-repeat;
	z-index: 10000;
	display: block;
	visibility: hidden;
}
.switch_controls {
	position: relative;
	top: -11px;
	margin-top: -60px;
	font-size: 10px;
	color: #666666;
}
.control_count {
	position: relative;
	top: -2px;
}
/***************************Customization for the MView************************************************/
table#mviewpath { 
	background-color: #777777;
	width:100%;
	height: 35px;
	border-bottom:solid 1px #666
}
#mviewthumbContainer { /* this is the master container for each file cell this holds everything */
	display: block; /* makes the entire tab a link not just the text */
	background-position: top left; /*make sure we have aligenment */
	background-image: url(images/gradient.png); /* back ground image to load relative to portal.css(orange tab)*/
	background-repeat: repeat-x; /* tell tab graphic to only appear once */
	line-height: 1.1;
	float: left;
	margin: 7px;
	width: 137px;
	height:auto;
	background-color: #B4B5B5;
	border: 0;
	border-color: #FFFFFF;
	border-style: solid;
	padding: 0px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	z-index:100;
	-webkit-border-top-right-radius:11px;
	-webkit-border-top-left-radius:11px;
	-webkit-border-radius:10px;
	-webkit-box-shadow:2px 3px 5px #333;
}
#mviewdetailsbox { /* This is the outer container for all the file cell buttons, just lines it up with the image but you could do more */
	width:193px;
	margin-top: 12px;
}
#mviewthumbBox { /*The box that holds the image thumbnail in the file cell */
	position: relative;
	float: left;
	width:129px;
	height: 125px;
	text-align: center;
	background-position: top left;
	background-image: url(images/IG3_Img_BG.gif);
	background-repeat: no-repeat;
	background-color: #F0F0F0;
	margin-top: 2px;
	margin-left: 4px;				/*used by IE6 as it does not understand important rule*/
	margin-bottom: 12px;
	margin-right: auto;
	padding-top: 5px;
	overflow:hidden;
}
#mviewthumbBox div {
	padding-top: 4px;
	padding-bottom: 6px;
}