@import url("base.html");
@import url("menu.html");
@import url("feedControl.html");

/* GLOBAL RESET
-----------------------------------------------------*/
* { margin: 0; padding: 0; }
ul { list-style: none; }
ol { padding-left: 25px;}
ol li { padding: 4px 0;}
table { border-collapse: collapse; border-spacing: 0; }
caption,th { text-align: left; }

html { min-height: 100%; margin-bottom: 1px; }

body {
	font: 11px/18px Verdana, Arial, Helvetica, sans-serif;
	background: #F1F1F1 /* #FAF7EF #F3F1E9 #D6DBDE url('/images/body-bg.gif') repeat-x*/ ;
}


/* TEXT-FORMATTING
-----------------------------------------------------*/
a { outline: none; }				/* gets rid of those dotted borders around links */
a:link 	  { color: #005CA3;	text-decoration: none;}
a:visited { color: #005CA3; text-decoration: none; }
a:active  { text-decoration: none; color: #D71F1F; }
a:hover   { text-decoration: underline; }
a.underline { text-decoration: underline; }

/* appends relevant icons to file links */
a[href $='.pdf'] { padding-right: 20px; background: transparent url('../images/icons/doc-pdf.html') no-repeat right 50%; }
a[href $='.doc'] { padding-right: 20px; background: transparent url('../images/icons/doc-doc.html') no-repeat right 50%; }

h1, h2, h3, h4 {
    margin: 0 0 .5em 0;
    padding: 3px 0;
}

h1 { font-size:1.95em; color:#C00; font-weight:normal; }
h1.alt { border-bottom:1px solid #CED2D2;}

h2 { font-size:1.6em; color:#333; font-weight:normal; border-bottom:1px solid #CED2D2; }
h2.alt { border: none; }

h3 { font-size:1.25em; color:#2E5282 /*#002953*/; background: url('../images/dots-x.html') repeat-x bottom;}
h3.alt { background: none; }

h4 { font-size:1.05em; }

p { margin-bottom: 15px; line-height: 1.8em; }


/* CONTENT SPECIFIC FORMATTING:			
-----------------------------------------------------*/
#header h1 {border: none; margin:0; padding:0;}

/* sidebar add-ons
-----------------------------------------------------*/
#sidebar div { margin-bottom: 20px; background: #F3F3F3 url('../images/sidebar-btm.html') no-repeat bottom;}
#sidebar h2	 { margin: 0; padding: 6px 0; font-size: 11px; font-weight:bold; color:#383A2E; text-align:center; background: url('../images/sidebar-top.html') no-repeat; }
#sidebar ul  { padding-bottom: 15px; }	
#sidebar li  { border-bottom: 1px solid #AAA; background: url('../images/sidebar-mid.html') }
#sidebar li:hover { background: #FFF url('../images/sidebar-mid.html') }

#sidebar li a { display: block; width: 183px; margin: 0 1px; padding: 5px 0 5px 15px; background: url('../images/arrow-gray-small.html') no-repeat 5px 10px; }
#sidebar li a:hover { background:#FFF  url('../images/arrow-black-small.html') no-repeat 5px 10px;} 
#sidebar li.login a span { display: block; width: 183px; color:#CC0000; cursor:pointer; background: url('../images/icons/key.html') no-repeat 96% 50%;} 


/*-- highlights the current section on the sidebar -- */
/* ipcom */
#sidebar ul.background li#background a,
#sidebar ul.what-we-do li#what-we-do a,
#sidebar ul.clients li#clients a,
#sidebar ul.privacy li#privacy a,
#sidebar ul.contact li#contact a,

/* pad */
#sidebar ul.overview li#overview a,
#sidebar ul.defensive-publishing li#defensive-publishing a,
#sidebar ul.searching li#searching a,
#sidebar ul.prior-art-database-journal li#journal a,
#sidebar ul.pricing li#pricing a,
#sidebar ul.demo li#demo a,
#sidebar ul.faq li#faq a,

/* iq */
#sidebar ul.solutions li#solutions a,
#sidebar ul.components li#components a,
#sidebar ul.features li#features a,
#sidebar ul.benefits li#benefits a,
#sidebar ul.req-demo li#req-demo a,

/* tech pub lib */
#sidebar ul.how-it-works li#how-it-works a,
#sidebar ul.demo li#demo a,

/* search services  */
#sidebar ul.patentability-novelty-search li#patentability-novelty-search a,
#sidebar ul.invalidity-search li#invalidity-search a,
#sidebar ul.freedom-to-operate li#freedom-to-operate a,
#sidebar ul.state-of-the-art li#state-of-the-art a,
#sidebar ul.technology-analysis li#technology-analysis a,

/* ipcom-uk */
#sidebar ul.representative li#representative a,
#sidebar ul.training-programs li#training-programs a,
#sidebar ul.events li#events a { background:#FFF  url('../images/arrow-black-small.html') no-repeat 96% 50%;}

 
/*-- sidebar submenu -- 
#sidebar li ul.submenu li { border: none; }
#sidebar li ul.submenu li a { display: block; width: 158px; margin: 0 1px; padding-left: 40px; background: url('/images/bullet-blue.gif') no-repeat 25px 10px; }
#sidebar li ul.submenu li a:hover { background: url('/images/bullet-red.gif') no-repeat 25px 10px; }
*/


/* MAINCONTENT ADD-ONS
-----------------------------------------------------*/
#maincontent { color: #333; }
#maincontent .primary p { text-align: justify;}

/* ------ Header Graphic For Each Section ------ */
#maincontent h1 {
    clear: left;
    height: 40px;
    overflow: hidden;
    padding: 10px 0 0 16px;
	margin-bottom: 10px;
    font-size: 12px; 
    color: #FFFFFF; 
    font-weight: bold; 
    border-bottom: 0px;
}

body.ipcom #maincontent h1				{ background: #003366 url('../images/section-header-ip.html') no-repeat; }	/* blue */
body.innovationQ #maincontent h1 		{ background: #003366 url('../images/section-header-iq.html') no-repeat; }	/* blue */
body.prior-art-database #maincontent h1 { background: #663333 url('../images/section-header-pad.html') no-repeat; }	/* brown */
body.creative-registry #maincontent h1 	{ background: #663366 url('../images/section-header-cr.html') no-repeat;}	/* purple */
body.technical-publication-library #maincontent h1 	{ background: #663333 url('../images/section-header-tpl.html') no-repeat;}	/* maroone */
body.patent-search-services #maincontent h1	{ background: #336633 url('../images/section-header-search.html') no-repeat; }	/* green */
body.uk #maincontent h1					{ background: #003366 url('../images/section-header-ip-uk.html') no-repeat; }	/* blue */
body.cn #maincontent h1					{ background: #003366 url('../images/section-header-ip-cn.html') no-repeat; }	/* blue */
body.newsletter #maincontent h1			{ background: #003366 url('../images/section-header-ip.html') no-repeat; }	/* blue */


/* ------ maincontent columns ------ */
#maincontent .full, 
#maincontent .threefourth,
#maincontent .onehalf, 
#maincontent .onethird, 
#maincontent .twothirds, 
#maincontent .onefourth { margin-bottom: 20px; -moz-border-radius: 6px; }


/* ------ maincontent lists ------ */
#maincontent ul li { padding: 4px 0 4px 30px;}
#maincontent ul li { background: url('../images/bullet-blue.html') no-repeat 16px 8px; }
#maincontent ul.check li { background: url('../images/check.html') no-repeat 16px 8px; }
#maincontent ul li ul li { background: url('../images/arrow-orange-small.html') no-repeat 8px 11px; }

#homecontent ul li { padding: 4px 0 4px 22px;}
#homecontent ul li { background: url('../images/bullet-blue.html') no-repeat 8px 8px; }
#homecontent ul li ul li { background: url('../images/arrow-orange-small.html') no-repeat 8px 11px; }


/* footer add-ons
-----------------------------------------------------*/
#footer a { color:#777;}
#footer a:hover   { text-decoration: underline; color:#000; }

#footer .directory {background: #FFF; border:1px solid #DEE1E4; -moz-border-radius:5px;}
#footer .directory h3 { font-size:95%; background:none; }
#footer .directory ul { text-align:center; }
#footer .directory ul li { display: inline; padding: 0 10px; border-left: 1px solid #CCC; }
#footer .directory ul li.first { border: none }

#footer .copyright { clear: both; padding: 10px 2px; color: #AAA; text-align: center;}
#footer .copyright a { text-decoration: underline; }
a.rss { padding: 1px 18px 1px 0; background:url('../images/icons/feed.html') no-repeat right -14px; }
a:hover.rss { background:url('../images/icons/feed.html') no-repeat right 1px; }



/* DEFINITION LISTS FORMATING 
-----------------------------------------------------*/
dl { width: 100%; overflow: auto; margin: 0 0 1em; }
dt { margin: 5px 0; font-weight: bold; clear: both; }
dd { margin-bottom: 10px; }
dd.date { margin-top: -20px; padding-bottom: 10px; text-align: right; background: url('../images/dots-x.html') repeat-x 0 bottom; clear: both; }


/* TAB 				(creates tabs with rounded-top)
----------------------------------------------------- */
.tab {
    background: url('../images/tab-left.html') no-repeat 0 0;
    border-bottom: 2px solid #88C87E;
    clear: left;
	height: 25px;
	overflow: hidden;
    padding-left: 5px;
}

.tab h1,
.tab h2,
.tab h3,
.tab h4 {
    letter-spacing: normal;
    font-size: 105% !important;
    font-weight: bold !important;
    color: #fff;
    margin: 0;
    background: url('../images/tab-right.html') no-repeat 100% 0;
}

/* ---------- tab addons ------------- */
.primary .tab { background:#88C87E url('../images/tab-left.html') no-repeat 0 0; border-bottom: 2px solid #88C87E;}
.primary .tab h1,
.primary .tab h2,
.primary .tab h3,
.primary .tab h4 { background:#88C87E url('../images/tab-right.html') no-repeat 100% 0;}

.secondary .tab { background:#5588BB url('../images/tab-left.html') no-repeat 0 0; border-bottom: 2px solid #5588BB;}
.secondary .tab h1,
.secondary .tab h2,
.secondary .tab h3,
.secondary .tab h4 { background:#5588BB url('../images/tab-right.html') no-repeat 100% 0;}


/* PRONAV:		(creates a top right horizontal menu )
------------------------------------------------------
	Example:
	<div id="pronav">
		<ul>
			<li class="first"><a href="#">One</a></li>
			<li><a href="#">two</a></li>
			<li class="last"><a href="#">three</a></li>
		</ul>			
	</div>
---------------------------------------------------- */
#pronav 	{ float:right; }
#pronav ul { margin: 0; padding: 0; }
#pronav ul li { float: left; margin: 0; padding: 0; list-style:none;}

#pronav li a { 
	display:block;
	float: left;
	padding:4px 10px;
	border-left:1px solid #fff;
	background:#C8C9CA;
	text-align:center;
	color:#fff;
	text-decoration:none;
	white-space:nowrap;
}
#pronav li a:hover { background:#A6A9AB; }

#pronav li.first a 		 { background:#C8C9CA url('../images/p-leftcap.html')  no-repeat left 0; }
#pronav li.last a 		 { background:#C8C9CA url('../images/p-rightcap.html') no-repeat right 0; }
#pronav li.first a:hover { background:#A6A9AB url('../images/p-leftcap.html')  no-repeat left -26px; }
#pronav li.last a:hover  { background:#A6A9AB url('../images/p-rightcap.html') no-repeat right -26px; }


/* FORM ELEMENTS
-----------------------------------------------------*/
form { margin: 0; padding:5px;}
#sidebar form { border: 1px solid #C1C7A6; background:#DEE1CE;}
.secondary form { border: 1px solid #E5E5FF; background: #F6F6FF;}

label { display: block; width: 25%; float:left; text-align: left; margin-right: 2px; padding-top: 3px; }
.required { color:#D00; }

input,
select,
textarea {margin: 2px; padding: 3px; border-top: 1px solid #A9B1B9; border-right: 1px solid #CCD2D7; border-bottom: 1px solid #CCD2D7; border-left: 1px solid #A9B1B9; }

input, 
textarea { width: 64%; }
select 	 { width: 65%; }

textarea { font: 12px Verdana, Geneva, Arial, sans-serif; min-height:105px;}
textarea.expanding { _width:331px; height:110px; }
html>body textarea.expanding { margin-left: 25.59%; }

input:active,
input:hover,
textarea:hover { border: 1px solid #AAA; }

.btn {
	width: auto !important;
	cursor: pointer;
	padding: 2px 3px;
	color: #555;
	border: 1px solid #888; 
	background: url('../images/btn-bg.html') no-repeat right 1px;
}
.btn:hover		{ border: 1px solid #555; background: url('../images/btn-bg.html') no-repeat right -24px; color:#000; }

/* ---------- prev/next buttons ------------- */
.next 			{ padding-right: 15px; background: url('../images/btn-bg.html') no-repeat right 1px; }
.search 		{ padding-left: 20px; background: url('../images/icons/search.html') no-repeat 1px 50%; }
.previous 		{ padding-left: 15px; background: url('../images/btn-bg.html') no-repeat left 1px; }
.previous:hover	{ padding-left: 15px; background: url('../images/btn-bg.html') no-repeat left -22px; }


/* TABLE ELEMENTS
-----------------------------------------------------*/

table {	border-collapse: collapse;	border-color: #C1C1C1; }
	
thead { background:	#C7DEED; }

th { text-align: left; }

thead th,
thead td { font-weight: bold; border-bottom: 1px solid #C1C1C1; padding: 2px 5px; }

td { vertical-align: top; }

caption { text-align: left; color: #F35400; font-weight:bold; }



.dataTable { border-collapse: collapse; margin:10px 0; text-align: left; width: 100%; }

.dataTable thead tr th,
.dataTable thead tr td,
.dataTable tfoot tr th,
.dataTable tfoot tr td { background:#D6E3E3 ; padding: 6px 5px; border-right: 1px solid #fff; }

.dataTable td { padding: 5px; border-bottom: 1px solid #E6EEEE; vertical-align: top; }

.dataTable tbody tr.even td { background:#F2F7FB; }		/* row color for even rows */
.dataTable tbody tr.over td { background:#E9F1F8; }		/* row color on mouse-over */


/* FLASH ELEMENTS
-----------------------------------------------------*/
#swf { text-align: center; }


/* COLORS
-----------------------------------------------------*/
.red, a.red { color: #D71F1F; }
.orange {color: #F35400}
.yellow	{ color: #FDBE00}
.green {color: #080}
.blue {color: #06C}
.black {color: #000}
.gray {color: #333}
.white { color: #FFF }


/* PROMOTIONS
-----------------------------------------------------*/
.promo {
	width: auto; 		/* scales to whatever width u want */
	background: url('../images/brick2.html') no-repeat right;
}

.promobody {
	height: 170px;
	overflow: hidden;
	padding:10px 5px;
	background: url('../images/brick2.html') no-repeat left;
	margin-right: 5px	!important;
}
.promobody h2 {padding: 5px;}
.promobody img.thumb {
	height: 120px;
	float:left;
}

.box { width: 980px; background: url('../images/box.html') no-repeat bottom left; clear:both; overflow:hidden; line-height: 2em;}
.top { width: 100%; height: 41px; background: url('../images/box.html') no-repeat top left; }
.top h1 {font-size: 13pt; margin:0; padding:10px;}

.shell { background: #FFF url('../images/homesection-back.html') no-repeat top left; }
.shell-last { background: url('../images/homesection-back.html') no-repeat top left; }

.shell h1 {font-size: 11pt; margin:0; padding:10px; color: #333333; font-weight: bold; border-bottom: 0px;}
.shell p {font-size: 8pt; margin:0; padding:10px;}
.shell-last h1 {font-size: 11pt; margin:0; padding:10px; color: #333333; font-weight: bold; border-bottom: 0px;}
.shell-last p {font-size: 8pt; margin:0; padding:10px;}
.shell ul li,
.shell-last ul li { padding: 4px 0 4px 34px;}
.shell ul li,
.shell-last ul li { background: url('../images/arrow-gray-small.html') no-repeat 16px 8px; }


/* IMAGES 
-----------------------------------------------------*/
img, 
img a { border: 0;}
img.pic {
	margin: 4px;
	padding: 4px;
	background: #FFF;
	border: 1px solid #CCC;
	background: url('../images/loading-03.html') no-repeat 50%; 
}

/*  THUMBNAILS
	Masks large images so they appear as thumbnails w/o having to manually create a thumbnail. 
	If no image is specified within the "url(...)", show default IP.com graphic thumbnail.
	Else, display the thumbnail. 
	
	example usage:
	<div class="thumbnail"><span style="background-image: url(/images/your-image.gif);"></span></div>
*/

.thumbnail {
	padding: 4px 0;
	min-width: 68px;
	min-height: 54px;
	display: block;
	background: url('../images/thumbnail.html') no-repeat 50%;
}

.thumbnail span {
	width: 100%;
	height: 60px;
	display: block;
	background-repeat: no-repeat;
	background-position: 0 50%;
}



/* MISC STYLES
-----------------------------------------------------*/
.left 	{ float: left; }
.right 	{ float: right; }
.strong { font-weight: bold; }
.clear 	{ clear:both;}
.hide	{ display: none; background:#EFEBE0; border:1px solid #AAA; padding:10px; }
.date 	{ display:block; width: 100%; text-align: right;  color:#999; }

.more 	{ display: block; width: 90%; text-align: right; padding:0 10px; color:#C00; font-weight:bold;}
a.more, 
.more a { color:#C00; }

.close,
a.close { display: block; float: right; margin: 3px 0 3px 7px; padding: 2px 0 2px 18px; color: #666;	background: url('../images/icons/delete.html') no-repeat left center; }

blockquote {
	margin: 5px 0;
	padding: 10px;
	background: #FFE;
	border: 1px solid #D8CE9E;	
}

/* ampersand */
.amp { font-family:Baskerville,"Goudy Old Style","Palatino","Book Antiqua",serif; font-size:110%; font-style:italic; }

hr { height:2px; background: url('../images/hr.html') no-repeat top; border:none;}
.separator { clear: both; margin:10px; border-bottom: 1px solid #96B1CB; }

/* SITE MAP
-----------------------------------------------------*/
#site_map {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 968px;
	padding: 5px;
	border: 1px solid #CCC;
	background: #FFF;
	filter: revealTrans(duration="0.2", transition="1");
	z-index: 20;
}
.site_map h1 { border: none; }
.site_map h2 { margin: 12px 0 5px; padding: 5px 0; border-bottom: 1px solid #CCC; }
.site_map h3 { background:none; font-size:95%; }
.site_map ul li  { padding: 4px 0 4px 20px; background: url('../images/bullet-blue.html') no-repeat 2px 8px; }
.site_map ul li ul li { background: url('../images/arrow-orange-small.html') no-repeat 2px 11px; }
.site_map .myaccount { float:right; font-size: 10px; }
.site_map .myaccount a{ color:#D71F1F; padding: 0 0 0 10px;}


/* Loading icon
-----------------------------------------------------*/
#loading {
	position: absolute;
	top: 5%;
	left: 35%;
	display: block;	
	padding: 30px 50px;
	text-align: center;
	color: red;
	filter: revealTrans(duration="0.2", transition="2"); progid:DXImageTransform.Microsoft.Shadow(color="#999999", Direction=135, Strength=4);
	z-index: 15;
}

/* ERROR MESSAGES AND ALERTS
-----------------------------------------------------
	First display a generic alert box using ".alert" 
	then specify the alert type to be displayed
	
	Example usage:
	<div class="alert warning">
		<h2>Alert Title</h2>
		<p>	The page you are looking for died last week.</p>
	</div>
*/
.alert {
	display: block;
	margin: 10px 0;
    padding: 5px 20px 5px 45px;
    border: 1px solid #CCC;
	background:#EFEBE0;
	-moz-border-radius: 5px;
}

.error 	 { background:#F6F5C8 url('../images/icons/exclamation.html') no-repeat 15px 50%; }
.warning { background:#EFEBE0 url('../images/icons/exclamation.html') no-repeat 15px 50%; }
.success { background:#D6ECD2 url('../images/icons/information.html') no-repeat 15px 50%; border: 1px solid #88C87E; }
.info 	 { background:#E1EEF6 url('../images/icons/information.html') no-repeat 15px 50%; }
.announcement 	 { background:#EFEBE0 url('../images/icons/mic.html') no-repeat 10px 50%; padding: 5px 20px 5px 70px; }

.error h2 	{ color:#C00; }
.warning h2 { color:#B63; }
.success h2 { color:#080; }
.info h2 	{ color:#36C; }

	

/* HOME-PAGE
-----------------------------------------------------*/
.home-info li { padding-left: 8px; background: url('../images/arrow-black-small.html') no-repeat 0 11px;}
.home-info li a { display: block; _width:99%; padding: 5px 0; }

.home-products {
	clear:both;
	margin: 15px 0;
	padding: 10px;
	width: 960px;
	height: 60px;
	background:url('../images/home-products-bg.html') no-repeat;
}

.home-products h2 { border: none; }

.home-products a:link,
.home-products a:visited { color: #FFFFFF; }

.rndbox {
	float:right;
	display:block;	
	width: 140px; 
	height: 15px;
	padding: 5px 10px;
	background: url('../images/home-products-rnd.html') no-repeat 50%;
	text-align:center;
}

.rndbox a:link,
.rndbox a:visited { margin: 0 5px; padding-left: 8px; background:url(../images/arrow-black-small.html) no-repeat 0 50%; color: #000; font-weight:bold; }