/**
 * Kit-Catalogue Stylesheet.
 *
 * @version 1.1.0
 */



/* ==================================================================================
 * CSS Reset
 * (http://meyerweb.com/eric/tools/css/reset/)
 *
 * + Clearfix
 * ==================================================================================
 */


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
images, ins, kbd, q, s, samp, small, strike, strong, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary, time, mark,
audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

sub { font-size: 0.8em; vertical-align: sub; }
sup { font-size: 0.8em; vertical-align: super; }



/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }


/* Clearfix */
.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }
.cf { zoom: 1; }



/* ==================================================================================
 * Page Layout
 * ==================================================================================
 */


body {
	font: 12px/1.6em Helvetica, Arial, sans-serif;
	color: #444;
	background: #f5f5f5 url(../images/system/body_bk.png) repeat-x;
	zbackground: #f5f5f5;
	position: relative;
	padding: 0;
}

#wrapper {
	border: 1px solid #CFD9E7;
	border-top: none;
	background: #fFF url(../images/system/top_green_bar.png) repeat-x;
	width: 960px;
	margin: 0 auto;
	padding: 0 10px 10px 10px;
	overflow: hidden;
	
}

#header {}

#top {
	margin-bottom: 18px;
	overflow: hidden;
	border-bottom: 1px dotted #B7CDE6;
}

#footer {
	clear: both;
	margin: 1.5em 0 0 0;
	padding: 0.3em 0;
	font-size: 11px;
	color: #999;
	text-align: center;
	border: 1px solid #fff;
	background: #ddd url(../images/system/footer_bk.png) no-repeat left top;
}

#footer p {color:#555;margin:0.3em;padding:0;}
#footer p a.link {background: url(../images/system/email.png) no-repeat top left;padding-left:3em;color:#FFF;padding-top:0.5em;font-weight:bold;}



/* ==================================================================================
 * Typography & Common Classes
 * ==================================================================================
 */


p {	margin-bottom: 1.6em; }
strong { font-weight: bold; }
em { font-weight: bold; font-style: italic; }
dfn { font-style: italic; }


dl { margin: 1em; }
dl dt { font-weight: bold; }
dl dd { margin-left: 1em; }
dl dd + dt { margin-top: 1.5em; }


a:link,
a:visited { color: #485F24; zcolor: #669900; text-decoration: none; }
a:hover,
a:active { color: #485F24; text-decoration: underline; }

a > img { border: 0; }

a.back-arrow {
	width: 100px;
	display: block;
	margin-bottom: 25px;
	font-size: 11px;
	padding-left: 20px;
	background: url(../images/system/bg-arrow-left.gif) no-repeat left 7px;
}

a.back-arrow:link,
a.back-arrow:visited {
	color: #999;
	text-decoration: none;
}
a.back-arrow:hover,
a.back-arrow:active {
	color: #690;
	text-decoration: underline;
	background-position-y: -13px;
}



h1, h2, h3, h4, h5, h6 {
	margin: 0.75em 0 0.75em 0;
	
	font-weight: bold;
	line-height: 1.2em;
}

h1 { font-size: 1.8em; }


h2 { font-size: 1.5em; }


h3 { font-size: 1.2em; }


h4, h5, h6 { font-size: 1em; }



.white-box {
	margin-bottom: 25px;
	padding: 20px;
	border: 1px solid #ddd;
	background: #fff;
}


.page-intro {
	padding-bottom: 0;
}

.note {
	color: #666;
	font-size: 0.95em;
	font-style: italic;
	margin-bottom: 0.3em;
}



.feedback_error ,
.feedback_info ,
.feedback_success ,
.feedback_warning { width: 600px; margin: 0 auto; auto; padding: 1em; }

.feedback_error > .title ,
.feedback_info > .title ,
.feedback_success > .title ,
.feedback_warning  > .title { margin: 0; padding: 0; font-weight: bold; text-align: center; }


.feedback_error {
	border: 1px solid #c96;
	background: #fec; 
	color: #a62;
}

.feedback_info {
	border: 1px solid #ccc;
	background: #eee; 
	color: #333;
}

.feedback_success {
	border: 1px solid #ace;
	background: #eef; 
	color: #05b;
}

.feedback_warning {
	border: 1px solid #c96;
	background: #fec; 
	color: #a62;
}



.signin_warning {
	clear: both;
	margin: 0 auto;
	padding: 0.5em;
	background-color: #ffd;
	border:1px solid #FFCC00;
	font-size:0.9em;
	text-align: center;
}

.signin_warning p { margin: 0.5em 0; line-height: 1.1em; }

.signin_warning a { text-decoration: underline; }



/* Table styles */



th { text-align:left }



table.layout {}



table.fields {}

table.fields th,
table.fields td {
	font-size: 11px;
}

table.fields th {
	min-width: 100px;
	padding-right: 1em;

	font-weight: bold;
	
	text-transform: uppercase;
}



table.grid { border: 1px solid #999; }

table.grid tr > th,
table.grid tr > td { padding: 0.2em; border: 1px solid #999; }

table.grid tr > th { background-color: #ccc; font-weight: bold; }



table.rowhover > tbody > tr:hover > th,
table.rowhover > tbody > tr:hover > td { background-color: #ffc !important; }



table.form { border-collapse: separate; border-spacing: 5px; }
table.form th { padding-right: 1em; font-weight: bold; }



table.checkbox_grid th { padding: 1px 3em 0 0.5em; vertical-align: top; }
table.checkbox_grid td { vertical-align: top; }



table.dmyt_grid td > select { margin-right: 1em; }



td.name { padding-right: 2em !important; }
td.checkbox { text-align: center !important; }



/* Lists */


ul li { margin-bottom: 0.4em; }


ul.hozmenu { margin: 0; padding: 0; list-style-type: none; }
ul.hozmenu li { display: inline; margin: 0; padding: 0; }
ul.hozmenu li a { text-decoration: none; }



div#delete_button_container { float: right; margin-left: 2em; padding: 1em; }



/* ==================================================================================
 * Header & Footer Styles
 * ==================================================================================
 */
 

/* Header */

.header-wrapper {
	width: 960px;
	margin: 0 auto;
	zpadding: 20px 0 10px 0;
	padding: 10px 0 4px 0;
	overflow: hidden;
}

.logo {
	float: left;
	outline: none; /* Removes dotted border in FireFox */
}

.institution {
	float: right;
	outline: none; /* Removes dotted border in FireFox */
}


/* Footer */

#footer a:link,
#footer a:visited {
	color: #669900;
	text-decoration: none;
}

#footer a:hover,
#footer a:active {
	color: #669900;
	text-decoration: underline;
}

.kc-logo-bw { margin-bottom: 10px; }

.kc-logo-bw images {
	margin-bottom: 10px;
}



/* ==================================================================================
 * Navigation / Breadcrumb / Search Styles
 * ==================================================================================
 */


/* Navigation */

#nav {
	margin-bottom: 1em;
	overflow: hidden;
	background: transparent url(../images/system/menubar_bk.png) repeat-x;
	border-radius: 4px;
}


#topnav li {
	height:36px;
	float: left;
	margin: 0;
	padding: 0;
	line-height: 1em;
	font-weight: bold;
	color: #fff;
	border-right:1px solid #3A3A3A;
	border-left:1px solid #5B5B5B;
}

#topnav li:first-child {
	border-left:none;
}

	
#topnav li a {
	padding: 1.1em 1.5em;
	display: block;
}


#topnav li a:link,
#topnav li a:visited { color: #fff; text-decoration: none;}
#topnav li a:hover,
#topnav li a:active { 
	color: #fff;
	background: url(../images/system/menubar_bk_hover.png) repeat-x;
}

#topnav li.user { border-right:none; }

#topnav li.user a.signin {
	border-right:none;
	zbackground-color:red;
	color:#A4BC6E;
	text-decoration:italic;
	font-weight:normal;
}

#topnav li a.signin:hover { 
	background: none;
	text-decoration:underline;
}


/* User bar */

#userbar {
	margin: 0;
	overflow: hidden;
	background-color: #fff;
}

#usernav li {
	float: right;
	display: block;
	
	margin: 0;
	zpadding: 0.5em 1em;
	padding: 0.5em 1em 0.2em 0.5em;
	
	line-height: 1em;
	color: #000;
}

#usernav li > a { color: #58742D; zfont-weight: bold; }


/* Breadcrumb */

#breadcrumbs {
	zmargin-top: 5px;
	float: left;
	overflow: hidden;
	padding-left:5px;
	margin-bottom:5px;
	
}

#breadcrumbs li {
	margin-left: 8px;
	padding-left: 14px;
	display: inline;
	font-size: 12px;
	background: url(../images/system/bg-breadcrumb.gif) no-repeat left center;
}

#breadcrumbs li:first-child {
	margin-left: 0;
	padding-left: 0;
	background: none;
}

#breadcrumbs li a:link,
#breadcrumbs li a:visited { color: #344D6D; text-decoration: none; }
#breadcrumbs li a:hover,
#breadcrumbs li a:active { zcolor: #690; text-decoration: underline; }


/* Search */

#search-box {
	float: right;
	margin-top: 3px;
	margin-right:6px;	
	padding: 0 4px 4px 4px;
	zborder: 1px solid #bbb;
	zvertical-align: middle; 
}

#search {
	width: 150px;
	padding:0.5em 0.2em;
	border: 0;
	color: #666;
	font: 0.9125em Helvetica, Arial, sans-serif;
	background-color:#FFF;
	outline: none;
}

#search.hint {
	color: #666;
}



/* ==================================================================================
 * Forms
 * ==================================================================================
 */


fieldset { margin-top: 1em; background-color: #f6f6f6; border: 1px solid #999; }

fieldset > legend { padding: 0.1em 0.7em; font-size: 1.2em; font-weight: bold; background-color: #fff; border: 1px solid #999; }


dl.form { margin-bottom: 1em; }
dl.form dt { color: #333; font-weight: bold; }
dl.form dd { margin-left: 1em; }
dl.form dd + dt { margin-top: 1.5em; }


fieldset, fieldset.collapsible {
        padding: 10px;
        border: 1px solid #e1e1e1;
        border-bottom-width: 1px;
        border-left-width: 1px;
        border-right-width: 1px;
        margin-bottom: 1em;
}

fieldset.collapsed {
        border-bottom-width: 0;
        border-left-width: 0;
        border-right-width: 0;
        margin-bottom: 0;
        margin-left: 3px;
}



input[type="submit"] + input[type="submit"] { margin-left: 6em; }

input { font-family: sans-serif; }   /* Fix IE's weird input-width bug */


div.button_bar { margin: 0.5em 0; text-align: center; }

div.button_bar input + input { margin-left: 6em; }


.admin-link ,
.admin_link {
	float: right;
	height:23px;
	background: url(../images/system/button_bk.png) no-repeat right top;
	color:#FFF;
}
a.admin_link {color:#FFF;padding:0.2em 1.5em 0 1em;}



/* ==================================================================================
 * Side-Bar
 * ==================================================================================
 */


.side-bar {
	clear: left;
	float: left;
	width: 15em;
	
	margin: 1em 1.5em 2em 0;
	
	background: #fff;
	border: 6px solid #F1F0EE;
	border-top: 1px solid #F1F0EE;
}

.side-bar h4 {padding-left:0.5em;font-size: 1em; font-weight: bold; margin: 0 0 0.5em 0;background-color:#F1F0EE;line-height:2em;}
.side-bar ul { margin: 0 1em; }
.side-bar ul li + li { border-top: 1px solid #F1F0EE; line-height:2em; }
.side-bar ul#tree li + li { border: 0; }



/* ==================================================================================
 * Homepage
 * ==================================================================================
 */


#homepage-list {
	margin: 0 auto;

}


#homepage-list > li {
	width: 400px;
	min-height: 14em;
	float: left;
	margin: 10px;
	zpadding: 1em;

	border: 10px solid #F1F0EE;
	border-top: 1px solid #F1F0EE;
}

#homepage-list > li h2 { padding-left:0.5em;font-size: 1.2em; font-weight: bold; margin: 0 0 0.5em 0;background-color:#F1F0EE;line-height:2.4em; }

#homepage-list > li h2 a { color: #555; }

#homepage-list ul { margin: 0 1em; }

#homepage-list ul li { border-top:1px solid #F1F0EE; line-height:2em; }
#homepage-list ul li:first-child {border-top:none; }

span.count {color:#70767E;}



/* ==================================================================================
 * Categories List
 * ==================================================================================
 */



ul#categories-list {
	width: 930px;
	margin-right: -12px;
	overflow: hidden;
}

ul#categories-list li {
    margin: 0 12px 12px 0;
    outline: none;
    float: left;
    font-size: 13px;
    font-style: italic;
}

ul#categories-list li a:link,
ul#categories-list li a:visited { text-decoration: none; color: #690; }

ul#categories-list li:hover { background: #838f9a; text-decoration: none; }
ul#categories-list li:hover a { color: #fff; }

ul#categories-list li a {
	display: block;
	padding: 5px 10px;
}

ul#categories-list li.active { background: #8cb23f; }
ul#categories-list li.active a { color: #fff; }



/* ==================================================================================
 * Item List
 * ==================================================================================
 */


h2.divider { margin-top: 1em; border-bottom: 1px solid #ccc; }


ul.item-list {
	overflow: hidden;
	margin: 0 0 0 2em;
}

ul.item-list li.item {
	overflow: hidden;
	min-height: 12.5em;
	margin: 10px;
	margin-bottom:20px;
	zpadding: 1em;
	background: #fff;
	border: 1px solid #D7D8D2;
}

ul.item-list li .item-content { overflow: hidden; padding-left:1em;border-left:1px dotted #666; }
ul.item-list li .item-thumb { width: 110px; float: left; padding: 5px 5px 0 5px; }
ul.item-list li .item-title { font-size: 15px; line-height:2.5em;padding-left:1em; margin-left:-1.0em;margin-top: 0; zmargin-bottom: 13px;background: url(../images/system/list_item_title_bk.png) repeat-x;border-bottom:1px solid #EBEBEC; }
ul.item-list li .item-desc { margin-bottom: 13px; color:#000;}
ul.item-list li .item-desc a {color:#6372AB;}

li.item > a.admin_link { zmargin: -1em -1em 0 0 !important; }


ul.item-list li .item-title a {
	
	-webkit-transition: color 0.3s linear;
		   -moz-transition: color 0.3s linear;
		     -o-transition: color 0.3s linear;
		        transition: color 0.3s linear;
}

ul.item-list li .item-title a:link,
ul.item-list li .item-title a:visited { color:#58742D; text-decoration: none; }
ul.item-list li .item-title a:hover,
ul.item-list li .item-title a:active { color: #8cb23f; text-decoration: none; }

ul.item-list li ul.item-meta li { font-size: 0.8125em; overflow: hidden; }

ul.item-list li ul.item-meta li.tags { 
	margin-top: 13px;
	padding-left: 22px;
	color: #9f9f9f;
	background: url(../images/system/icon-tags.png) no-repeat left center;
}



/* ==================================================================================
 * Item Details
 * ==================================================================================
 */
 
 
div.item {margin-left:2em;}
.item h2 {background-color:#F3F1E2;margin:0 0 1em 0;padding: 0.3em 1em 0.2em 0.8em;font-size:1.2em;color:#000;}

div.item-header {margin-bottom:1em;border-bottom:dotted 1px #EDF3DC;}
div.item-header h1 {zcolor:#523865;color:#445B24;}

div.rightbox-info {width:13%; float:right;}

div.item-body {width:85%;padding-bottom:4em;padding-left:1em;zfloat:left;}

div.item div.side-bar {margin-top: 0.2em; margin-bottom:0;}
div.item div.side-bar + div.side-bar { margin-top: 2em; }

div.item div.tags {border-color:#F3F1E2; margin-top:2em;}
div.item div.tags h4 {background-color:#F3F1E2;}

div.item table.fields td {font-size:1em;}
div.item table.fields th {color:#000;}

	
.item-detail-left {
	float: left;
	margin-bottom: 1em; 
	width: 25%;
	
}

	
.item-detail-right {
	float: right;
	width: 72%;
}
.item-detail-right a {color:#3169A8;}
.item-detail-right a.admin_link {color:#FFF;}

.item-detail-right table {margin:0 1em;}
.item-detail-right table td {padding:0.2em;}


div.contact  {background-color:#f1f0ee;padding:1px;border:2px solid #D7D8D2;margin-bottom:2em;}
div.contact h2 {margin-bottom:0.4em;color:#FFF;background-color:#898873;}


a.enquire-link {
	float: right;
	margin: 0.7em;
	color: #fff;
}


div.usage { border: 1px solid #D7D8D2; margin-bottom: 2em; }
div.usage h2 { margin-bottom: 0.4em; font-size: 15px; line-height: 2em; padding-left: 1em; background: url(../images/system/list_item_title_bk.png) repeat-x; border-bottom: 1px solid #EBEBEC; }


.item-body ul,
.item-body ol {
	margin: 0 0 1em 2em;
	list-style: square;
}

div.images { border-bottom: 1px dotted #CCC; margin-bottom: 2em; padding-bottom: 1em; }
div.images img { border: 1px solid #EFEFEF; }
div.extra-image img { opacity: 0.6; filter: alpha(opacity=60); /* For IE8 and earlier */ }
div.extra-image img:hover { opacity: 1; filter: alpha(opacity=100); /* For IE8 and earlier */ }


.item-description,
.item-specification,
.item-embedded-content { margin-left: 1em; margin-bottom: 1em; }


.item-description h1 ,
.item-specification h1 { margin-top: 2em; font-size: 1.2em; font-style: italic; }

.item-description h2 ,
.item-specification h2 { margin-top: 2em; font-size: 1.15em; font-style: italic; }

.item-description h3 ,
.item-specification h3 { margin-top: 2em; font-size: 1.1em; font-style: italic; }

.item-description h4 ,
.item-specification h4 { margin-top: 1.5em; font-size: 1.05em; font-style: italic; }

.item-description h5 ,
.item-description h6 ,
.item-specification h5 ,
.item-specification h6 { margin-top: 1em; font-size: 1em; font-style: italic; }

.item-description td,
.item-specification td { padding-right: 1em !important; border-bottom: 1px solid #ccc !important; }





.extra-image { float: left; border: 2px solid #fff; }


.item-resources { margin-left: 1em; }
.item-resources ul { list-style: none; }
.item-resources ul li.file { height: 2em; background: url(../images/system/file.gif) no-repeat; }
.item-resources ul li.link { height: 2em; background: url(../images/system/link.gif) no-repeat; }
.item-resources a { padding-left: 2em; }


.item-children ul.item-list { margin: 0; }

.item-id { margin-top: 1em; border-top: 1px solid #ccc;  }
.item-date-updated { }


.socialnetworkbuttons { clear: both; float: left; margin-top: 2em; }




/* ==================================================================================
 * Item Browsing
 * ==================================================================================
 */


ul.selected-list { margin-top: -1em; }
ul.selected-list li { margin-left: 2em; }

.clipped-list {
	font-size: 0.9em;
}

.clipped-list ul { margin-bottom: 2em; }

.clipped-toggleinfo {
	margin-top: -2em;
	padding: 0.5em 0 0.2em 0;
	color: #485F24;
	cursor: pointer;
	font-size: 0.9em;
	font-weight: bold;
	text-align: center;
}


.selected-list .remove ,
.clipped-list .remove { color: #f00; font-weight: bold; }



/* ==================================================================================
 * Manufacturer A-Z
 * ==================================================================================
 */


ul#atoz { list-style: none; margin: 0; padding: 0; }
ul#atoz li { float: left; margin: 0 0 0 3px; padding: 0; }

ul#atoz li a,
ul#atoz li span { min-width: 1.3em; display: block; padding: 0.4em; text-align: center; }

ul#atoz li a { background-color: #d4edb5; font-weight: bold; }
ul#atoz li span { background-color: #f6f6f6; border: 1px solid #dd9; color: #999; font-weight: bold; }

ul#atoz li.active span { padding-bottom: 8px; border: 1px solid #ddd; border-bottom: 0; background-color: #fff !important; }

ul#atoz li.noitems span { background-color: #eee; border: 0; color: #aaa; font-weight: normal; }


div.atoz-bottom-line { height: 1em; z-index: -10; margin-top: -1px; padding-bottom: 1px; border-top: 1px solid #ddd; }


.atoz-item-list { width: 70%; }



/* ==================================================================================
 * UL Tree Lists 
 * ==================================================================================
 */
 
 
#tree ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#tree ul ul {
	background: url(../images/system/tree_line.png) repeat-y;
	margin-left: 10px;
}

#tree ul ul>li {
	margin: 0;
	padding: 0 0 0 14px;
	line-height: 20px;
	background: url(../images/system/tree_node.png) no-repeat;
}

#tree ul ul li.last_child {
	background: #fff url(../images/system/tree_lastnode.png) no-repeat;
}

#tree ul ul li:last-child {
	background: #fff url(../images/system/tree_lastnode.png) no-repeat;
}



/* ==================================================================================
 * Modal Windows 
 * ==================================================================================
 */


#modalwindow_mask {
	position: absolute;
	display: none;
	z-index: 9000;
	background-color: #000;
}

.window {
	position: fixed;
	display: none;
	width: 500px;
	height: auto;
	z-index: 9999;
	padding: 1em;
	background-color: #e0e0e0;
	border: 1px solid #999;
	border-radius: 10px;
}

.window a.modalwindow_close {
	float: right;
	margin: -0.8em -0.5em 0 0;
	color: #666;
	font-weight: bold;
}

#modalwindow_desc {
	clear: both;
}



/* ==================================================================================
 * Lightbox 
 * ==================================================================================
 */


#lightbox { display: none; width: 608px; background-color: #ddd; border: 2px solid #999; }

#lightbox_top { text-align: right; }
#lightbox_top a { float: none; margin: 0; } 

#lightbox_imagecontainer { display: table-cell; clear: both; width: 604px; height: 604px; margin: 0 8px; background-color: #000; text-align: center; vertical-align: middle; }
#lightbox_image { max-width: 600px; max-height: 600px; }

#lightbox_list {
	min-width: 608px;
	overflow: hidden;
	-ms-overflow-x: auto;
	-ms-overflow-y: hidden;
	overflow-x: auto;
	overflow-y: hidden;
	margin: 2px 0;
	white-space: nowrap
}

#lightbox_list img { padding: 2px; }
#lightbox_list img + img { margin: 0 2px; }

#lightbox_list img { border: 2px solid #ddd; }
#lightbox_list img.active { border-color: #000; }



/* ==================================================================================
 * Administration
 * ==================================================================================
 */


.admin-box {
	float: right;
	clear: right;
	width: 300px;
	margin: 0 0 1.5em 1.5em;
	padding: 1.5em;
	border: 1px solid #ddd;
	background: #fff;
}


.admin-box > h3 { margin-top: 0;}