/********* style for tab navigation **********/
#menu_tab ul
{
	list-style: none;
	padding: 0;
	margin: 0;
}
#menu_tab li
{
	float: left;
	margin: 0 0.15em;
}
#menu_tab li a
{
	height: 2em;
	line-height: 2em;
	float: left;
	width: 9em;
	display: block;
	border: 0.1em solid #dcdce9;
	color: #0d2474;
	text-decoration: none;
	text-align: center;
	background-color:#D3D6FF;
	border:1px solid #22749B;
} 
#menu_tab li a:hover
{
	border: 0.1em solid #dcdce9;
	text-decoration: none;
	background-color:#fff;
}
.active_tab a
{
	height: 2em;
	line-height: 2em;
	float: left;
	width: 9em;
	display: block;
	border: 0.1em solid #dcdce9!important;
	color: #0d2474;
	text-decoration: none;
	text-align: center;
	text-decoration: none;
	background-color:#fff!important;
} 
/* Hide from IE5-Mac \*/
#menu_tab li a
{
	float: none
}
/* End hide */ 
#menu_tab 
{
	width:60em;
	margin:10px 0 25px 0px;
}

/********* style for tab navigation end **********/



.Dcat-img{ width:200px; height:200px;}
.Dcat-img img{ padding:auto 0; azimuth:center;}






.scroll_box {
	
    min-height: 21px;
	max-height:180px;
    overflow-x: hidden;
    overflow-y: hidden;
    width: 274px; color:#4b7693; font-size:12px;
}
.boxINDUSTRY{width: 274px; padding:12px; margin:-13px 0 9px 0;  background-color:#FFFFFF; border: 1px solid #c4d9e9; -moz-border-radius: 3px; border-radius: 3px;}
.boxSTYLE{width: 274px; padding:12px; margin:-13px 0 9px 0;  background-color:#FFFFFF; border: 1px solid #c4d9e9; -moz-border-radius: 3px; border-radius: 3px;}
.boxPRODUCT{width: 274px; padding:12px; margin:-13px 0 9px 0;  background-color:#FFFFFF; border: 1px solid #c4d9e9; -moz-border-radius: 3px; border-radius: 3px;}
.boxSize{width: 274px; padding:12px; margin:-13px 0 9px 0;  background-color:#FFFFFF; border: 1px solid #c4d9e9; -moz-border-radius: 3px; border-radius: 3px;}
.boxColours{width: 274px; padding:12px; margin:-13px 0 9px 0;  background-color:#FFFFFF; border: 1px solid #c4d9e9; -moz-border-radius: 3px; border-radius: 3px;}
.boxLOGOTYPE{width: 274px; padding:12px; margin:-13px 0 9px 0;  background-color:#FFFFFF; border: 1px solid #c4d9e9; -moz-border-radius: 3px; border-radius: 3px;}
.sidebar_options{ width:300px; float:left;}

.sidebar_options h3{ border:1px solid #c4d9e9; -moz-border-radius: 3px; border-radius: 3px; color:#4b7693; font-size:14px; font-family: 'Neo Sans W01 Medium'; cursor:pointer; line-height:40px; padding:0 12px; background-color:#f8f8f8; margin-bottom:9px;}
.sidebar_options h3::active { background: none;}

#designs-cat{width:auto; height:300px; padding:10px; float:left;}
#designs-cat img{border:1px solid #e4e4e4; }
#designs-cat p strong span{ font-family: lucida console; font-weight:bold;}
#designs-cat p strong{ font-size:14px; margin-top:5px;}
#designs-cat p{ width:200px; color:#4b7693; font-size:12px; margin-bottom:0px;}
#designs-cat p a{ font-size:11px;}
#designs-cat:hover{ background-color:#FFFFFF; border:1px solid #999999; padding:9px}

/*----------------------- INDUSTRY ----------------------------*/

  /* Height & width for the container - The rest is done by the jQuery part. */
  div[rel='scrollcontent_INDUSTRY'] { width: 100%; height: 180px;}
  
  /* Basic CSS for the elements - If rel is "scrollcontent1", style its scrollbar by referring to ".scrollcontent-content", ".scrollcontent-bar", etc. */
  .scrollcontent_INDUSTRY-content { /* background: #eee; */ } /* for vertical content, no explicit width is required for inner DIV */
  .scrollcontent_INDUSTRY-bar { width: 6px; background: #fff; border-radius: 4px; box-shadow: inset 0px 0px 5px #ccc; overflow: hidden; }
  .scrollcontent_INDUSTRY-drag { background: #4b7693; border-radius: 4px; cursor: pointer; }
  
  /* Not needed elements */
  #contentwrap { padding: 5px; border: 1px #444444 solid; display: block; width: 300px; border-radius: 10px; }
  .scrollcontent_INDUSTRY-content p{margin:0; padding:0}

/*----------------------- STYLE ----------------------------*/

  /* Height & width for the container - The rest is done by the jQuery part. */
  div[rel='scrollcontent_STYLE'] { width: 100%; height: 180px;}
  
  /* Basic CSS for the elements - If rel is "scrollcontent1", style its scrollbar by referring to ".scrollcontent-content", ".scrollcontent-bar", etc. */
  .scrollcontent_STYLE-content { /* background: #eee; */ } /* for vertical content, no explicit width is required for inner DIV */
  .scrollcontent_STYLE-bar { width: 6px; background: #fff; border-radius: 4px; box-shadow: inset 0px 0px 5px #ccc; overflow: hidden; }
  .scrollcontent_STYLE-drag { background: #4b7693; border-radius: 4px; cursor: pointer; }
  
  /* Not needed elements */
  .scrollcontent_STYLE-content p{margin:0; padding:0}

/*----------------------- PRODUCT ----------------------------*/

  /* Height & width for the container - The rest is done by the jQuery part. */
  div[rel='scrollcontent_PRODUCT'] { width: 100%; height: 180px;}
  
  /* Basic CSS for the elements - If rel is "scrollcontent1", style its scrollbar by referring to ".scrollcontent-content", ".scrollcontent-bar", etc. */
  .scrollcontent_PRODUCT-content { /* background: #eee; */ } /* for vertical content, no explicit width is required for inner DIV */
  .scrollcontent_PRODUCT-bar { width: 6px; background: #fff; border-radius: 4px; box-shadow: inset 0px 0px 5px #ccc; overflow: hidden; }
  .scrollcontent_PRODUCT-drag { background: #4b7693; border-radius: 4px; cursor: pointer; }
  
  /* Not needed elements */
  .scrollcontent_PRODUCT-content p{margin:0; padding:0}





/*----------------------- Size ----------------------------*/

  /* Height & width for the container - The rest is done by the jQuery part. */
  div[rel='scrollcontent_Size'] { width: 100%; height: 180px;}
  
  /* Basic CSS for the elements - If rel is "scrollcontent1", style its scrollbar by referring to ".scrollcontent-content", ".scrollcontent-bar", etc. */
  .scrollcontent_Size-content { top:0; /* background: #eee; */ } /* for vertical content, no explicit width is required for inner DIV */
  .scrollcontent_Size-bar { width: 6px; background: #fff; border-radius: 4px; box-shadow: inset 0px 0px 5px #ccc; overflow: hidden; }
  .scrollcontent_Size-drag { background: #4b7693; border-radius: 4px; cursor: pointer; }
  
  /* Not needed elements */
  .scrollcontent_Size-content p{margin:0; padding:0}
  
/*----------------------- Colours ----------------------------*/

  /* Height & width for the container - The rest is done by the jQuery part. */
  div[rel='scrollcontent_Colours'] { width: 100%; height: 180px;}
  
  /* Basic CSS for the elements - If rel is "scrollcontent1", style its scrollbar by referring to ".scrollcontent-content", ".scrollcontent-bar", etc. */
  .scrollcontent_Colours-content { /* background: #eee; */ } /* for vertical content, no explicit width is required for inner DIV */
  .scrollcontent_Colours-bar { width: 6px; background: #fff; border-radius: 4px; box-shadow: inset 0px 0px 5px #ccc; overflow: hidden; }
  .scrollcontent_Colours-drag { background: #4b7693; border-radius: 4px; cursor: pointer; }
  
  /* Not needed elements */
  .scrollcontent_Colours-content p{margin:0; padding:0}
  
  
  
  
  
  
  
  
  
/*.scroll_box:not(#foo) > input[type='checkbox']{opacity: 0; float: left; width: 18px;}
.scroll_box:not(#foo) > input[type='checkbox'] + label { margin: 0; clear: none; padding: 5px 0 4px 24px; cursor: pointer; background: url(../check-box.jpg) left center no-repeat;}
.scroll_box:not(#foo) > input[type='checkbox']:checked  + label { background-image:url(../check-box-select.jpg);}*/


/*----------------------- SideBar Up Down Arrow Icon Class ----------------------------*/

.up_icon{
	background:url(../UH3-bg.png) right no-repeat #f8f8f8;
}
.down_icon{
	background:url(../DH3-bg.png) right no-repeat #f8f8f8;
}

/*----------------------- Loading Bar Icon----------------------------*/

.loading_text {
    background: url("../loading.gif") no-repeat scroll 20px 50% transparent;
    padding: 30px 30px 30px 70px;
}