/*************************Default Portal CSS***********************/
body,td,th {
	color: #FFFFFF;
	font: 10px Geneva, Arial, Helvetica, sans-serif;
	z-index: 10;
	margin: 0;
}
body {
	background-color: #616265;
}
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 #616265;
}
table.batch {
	background-color: #616265;
	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: 1px;
	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: 6px;
}
td.tabless {
	padding-right: 0px;
	padding-left: 0px;
	padding-top: 6px;
}
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: #616265;
	width:100%;
}
.logintdtop { /*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/login_logo_chicago.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:8px;
	right:0px;
	bottom: -49px;
	background-color:#616265;
	text-align:right;
	height: 166px;
}
.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: #616265;
	width:100%;
	-webkit-box-shadow:2px 5px 5px #333;
}
td.leftofpage {	/*left slice of header image*/
	background-image:url(images/spacer.gif);
	background-repeat:no-repeat;
	background-position:center left;
}
td.rightofpage { /*right slice of header image*/
	background-image:url(images/logo_interior_brand.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;	
	clear: left;	
	height: 51px;	/* height of div, increase to space out */
	width: 26px; 
	padding-left: 100px; /* distance from the left of the window */
	padding-bottom: 2px; 
	overflow: visible; 	
}
.VolumeSearchIcon { /* volume search icon */
	position: absolute; 
	z-index: 10;	
	float: left;	
	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: 10px;
	left: 240px; /* distance from the left of the window */
	height: 100px;
}
.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: 38px;
	padding-left: 240px;
	height: 100px;
		
}
.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:#616265;
	-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: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: #949494;
}
.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******************************/
#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: #616265;
	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;
}
.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: #949494;
	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: #616265;
	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,Get File 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: #616265;*/
	-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: #969696;
}
/*****************************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:#616265;
	-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: 23px; 
	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: #616265;
	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: #949494;
	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: #949494;
	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: #616265;
	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: #949494;
	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 { /*image slice for repeat in background of header template*/
	background-color: #616265;
	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: #616265;
	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;
}
/* CSS Rule set for IOI's Batch File Manager. You may copy the contents of this file and append
it to portal.css and remove the referance to this file in the template.
Note the dirTreeframe overflow value is set to scroll. Auto would be better and is fine in IE and
firefox but as of OSX Safari Version 2.0.4 (419.3), there is a bug that will cause some tree nodes
to vanish when the overflow changes from hidden to scroll*/
body, td, th {
	color: #FFFFFF;
	font: 12px Geneva, Arial, Helvetica, sans-serif;
}
body {
	background-color: #616265;
}
a {
	text-decoration: none;
	color: #FFFFFF;
}
a:hover {
	text-decoration: none;
	color: #BEDBDB;
}
#dirTreeframe { /*div thats displays the directory tree*/
	width: 300px;
	height: 90%;
	float: left;
	background-color: #616265;
	overflow: auto; /* do not use auto safaris as bug*/
	margin-right: 20px;
	border-right: 1 solid #666666;
	padding-top: 10px;

} 
.parentNode { /*Directory tree names */
 color: #FFFFFF;
 font-size: 8pt;
 font-family:Verdana,Arial,Helvetica;
 }

.parentNode:hover {
	color: #BEDBDB;
	font-size: 8pt;
 	font-family:Verdana,Arial,Helvetica;
}

#mainFrame { /* frame that holds the form*/
	padding-top: 10px;

}
#previewframe { /*frame that holds the basket content preview*/
	position: absolute;
	height:100%;
	top: 200px;
	left: 325px;
}
div.fmdisplaycell { /*The outer div for each preview*/
	float: left;
	width: 200px;
	height: 237px;
	margin: 5px 3px;
	background-image: url('images/bground_image.png'); /*Landscape slide image*/
}
div.pt {
	background-image: url('images/bground_image.png'); /*if Portrait image, swap to pt slide image */
}
div.fmdisplaycell img { /*preview image, border creates shadow*/
/*	border: 1px solid;
	border-color: #444 #AAA #AAA #444;*/
}
div.ls img { /*position image in on landscape slide background */
	Height: 96px;
	width: 128px;
	margin-left: 15px;
	margin-top: 30px;
}
div.pt img{ /*position image in on portrait slide background */
	Height: 128px;
	width: 96px;
	margin-left: 30px;
	margin-top: 15px;
}
.fmdisplaynamept { /*file name displayed under each prevew */
	text-align: center;
	padding-top: 2.5px;
	font: 9px Geneva, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
}
.fmdisplaynamels { /*file name displayed under each prevew */
	text-align: center;
	padding-top: 10px;
	font: 9px Geneva, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
}
div#waitForMe { /* this is the spinner that appears in browse window while your waitting */
	position: absolute;
	left: 760px;
	top: 70px;
	height:32px;
	width: 32px;
	z-index: 10000;
	display: block;
	visibility: hidden;
}
.error {
	font: 10px Geneva, Arial, Helvetica, sans-serif;
	margin-left: 3px;
	margin-right: 3px;
}