
body {
	padding: 0px;
	margin: 0px;
	text-align: left;
	color:#505050;
	background-color: #ffffff;
	min-width:800px;
	font-size: small;
	font-family:Helvetica, Arial, sans-serif;
	background:url(../../resources/assets/bg_rpt_pageoutline.jpg) repeat-y;
}

* html body {
	font-size: x-small; /* for IE5/Win */
	f\ont-size: small; /* for other IE versions */
}


/* GENERIC CLASSES FOR LEFT AND RIGHT COLUMNS - THESE ARE USED
THROUGHOUT THE SITE AND STYLED INDIVIDUALLY THROUHG OTHER DIVS
--------------------------------------------------------------*/
.left {
	float: left;
}

.right {
	float: right;
}

.clearboth{
	clear: both;
}

.leftclear{
	clear: left;
}
.rightclear{
	clear: right;
}

/* GENERIC TEXT STYLES
OTHER TEXT STYLES ARE SPECIFICALLY DEFINED ELSEWHERE
----------------------------------------------------*/
a {
color:#505050;
text-decoration:underline;
}

a:hover {
color: #FCAF17;
text-decoration:underline;
}

h1 {
	font-size: 150%;
	padding: 0px;
	margin: 0px;
}

h2 {
	font-size: 90%;
	font-weight: bold;
}

p {
	font-sze: 90%;
}

.orange{
	font-weight: bold;
	color: #FCAF17;
	padding: 0px;
	margin: 0px;
}

.greylink {
	color: #505050;
	text-decoration: underline;
}
.greylink:hover{
	color: #000000;
	text-decoration: underline;
}

/* ADVERT - ABSOLUTELY POSITIONED AS A SEPARATE ELEMENT SO IT DOES NOT
AFFECT THE LAYOUT OF THE SITE - SHOULD BE ABLE TO HAVE ANY WIDTH & HEIGHT
------------------------------------------------------------------------- */
#advert img {
	position: absolute; top:86px; left: 857px;
}

/* CONTENT WRAPPER BOX FOR THE WHOLE SITE
---------------------------------------------------------------- */
#contentwrapper{
	margin: 0px 0px 20px 45px;
	padding: 0px;
	width: 800px;
}


/* HEADER CONTAINING THE LOGO AND SEARCH FACILITY
SEARCH FORM NOT CODED IN YET SO THINGS MIGHT CHANGE HERE.
---------------------------------------------------------------- */
#header{
	margin: 20px 44px 0px 0px;
	padding: 0px;
}

#header .left {
	width: 165px;
}

#header .right {
        margin:30px 0 0 0;
	text-align: right;
}

#header .right label{ font-size: 80%; font-weight: bold;  color: #848484;}
#header .right #but_search{ position: relative; top: 5px;}

/* MASTHEAD CONTAINS THE LARGE IMAGE AT THE TOP OF THE PAGE
---------------------------------------------------------------- */
#masthead{
	width: 756px;
	margin: 0px;
	padding: 0px;
}

/*#masthead img{ border: 1px solid #333;}*/

/* NEWS
NEWS TICKER NOT CODED YET SO THINGS MIGHT CHANGE HERE
---------------------------------------------------------------- */
#news{
	padding: 0px;
	margin: 0px;
	width: 756px;
	height: 23px;
	color: #999999;
	background-color: #505050;
	font-size: 80%;
}

#news em{
	color: #ffffff;
	background-color: #505050;
	font-weight: bold;
	font-style:normal;
}

#news p{
	padding: 0px;
	margin: 0px;
}

#news img{
	padding: 0px;
	margin: 0px;
	vertical-align: middle;
}

/* News Ticker */
#news a {
color:#999999;
text-decoration:none;
}

#news a:hover {
color:#999999;
text-decoration:none;
}

#news a:visited {
color:#999999;
text-decoration:none;
}

#news a:active {
color:#999999;
text-decoration:none;
}





/* NAVIGATION
NAVIGATION NOT CODED YET SO THINGS MIGHT CHANGE HERE
---------------------------------------------------------------- */
/*#navigation{
	padding: 0px;
	margin: 0px;
	width: 736px;
	height: 23px;
	color: #FCAF17;
	background-color: #505050;
}*/

.chromestyle{
	width: 99%;
	font-weight: normal;
	font-size:0.8em;
	font-family: Arial, Helvetica, Verdana;
}

.chromestyle:after{ /*Add margin between menu and rest of content in Firefox*/
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.chromestyle ul{
	width: 756px;
	height: 10px;
	color: #000;
	background-color: #505050;
	/*width: 75%;
	background: url(greybg.gif) center center repeat-x; /*THEME CHANGE HERE*/
	padding: 4px 0;
	margin: 2px 0;
	text-align: center; /*set value to "left", "center", or "right"*/
}

.chromestyle ul li{
	display: inline;
}

.chromestyle ul li a{
	color: #fcaf17;
	padding: 4px 17px;
	margin: 0;
	text-decoration: none;
}

.chromestyle ul li a:hover{
	color: #fcaf17;
        text-decoration: none;
	background: url(chromebg-over.gif) center center repeat-x; /*THEME CHANGE HERE*/
}

.chromestyle a[rel]:before{ /*HTML to indicate drop down link*/
/*	content: ": : ";
	
	content: " " url(../../resources/assets/downimage-k.gif); */
}




/* ######### Style for Drop Down Menu ######### */

.dropmenudiv{
position:absolute;
top: 0;
margin: 0 0 0 13px;
border: 1px solid #999; /*THEME CHANGE HERE*/
border-bottom-width: 0;
font:normal 10px arial;
line-height:18px;
z-index:100;
background-color: #ededed;
width: 200px;
visibility: hidden;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=4); /*Add Shadow in IE. Remove if desired*/
}


.dropmenudiv a{
width: auto;
display: block;
text-indent: 3px;
border-bottom: 1px solid #999; /*THEME CHANGE HERE*/
padding: 2px 0px;
text-decoration: none;
font-weight: normal;
color: #333;
}

.dropmenudiv a[rel]:before{ /*HTML to indicate drop down link*/
	/*content: ": : ";
	content: " " url(downimage.gif); /*uncomment this line to use an image instead*/
}

* html .dropmenudiv a{ /*IE only hack*/
width: 100%;
}

.dropmenudiv a:hover{ /*THEME CHANGE HERE*/
/*background-color: #fcaf17;*/
text-decoration: none;
}

/* BREADCRUMB TRAIL
BREADCRUMB NOT CODED YET SO THINGS MIGHT CHANGE HERE
---------------------------------------------------------------- */
#breadcrumb{
	padding: 0px;
	margin: 0px;
	width: 756px;
	color: #999999;
	background-color: #ffffff;
}

#breadcrumb p{
	padding: 5px 0px 5px 0px;
	margin: 0px;
	font-size: 80%;
}

#breadcrumb a { text-decoration: none; }
#breadcrumb a:hover { color: #FCAF17;}

/* CONTENT THIN - CONTAINER & COLUMNS FOR THIN LEFT COLUMN AND FAT RIGHT COLUMN
------------------------------------------------------------------------------- */
#contentthin{
	padding: 0px 0px 10px 0px;
	margin: 0px;
	width: 756px;
	/*background: url(../../resources/assets/hr_756wide.gif) no-repeat bottom;*/
}

#contentthin .left {
	width: 456px;
	text-align: left;
}

#contentthin .left h4{margin:0; padding:0;}
#contentthin .left a{ text-decoration: none; color:#FCAF17;}
#contentthin .left a:hover{ color:#666;}

#contentthin .right {
	width: 290px;
	text-align: right;
}

.LocationItem img{float:left; width: 100px; margin:10px 10px 0 0;}
.LocationItem { margin: 0; padding: 0 0 10px 0; border-bottom:1px dashed #000;} 
.LocationItem h4 a {
        text-decoration: none; 
        margin: 0px;
	padding: 0px 0px 0px 10px;
	font-size: 120%;
        _font-size: 100%;
	color: #FCAF17;
	background: url(../../resources/assets/h4_arrow.gif) no-repeat left;
}

.NewsItem { margin: 0; padding: 0 0 10px 0; border-bottom:1px dashed #000;} 

.NewsItem h2 a {
        text-decoration: none; 
        margin: 0px;
	padding: 0px 0px 0px 10px;
	font-size: 120%;
	color: #FCAF17;
	background: url(../../resources/assets/h4_arrow.gif) no-repeat left;
}

.PartnerItem { margin: 0; padding: 0 0 10px 0; border-bottom:1px dashed #000;} 

#printReady a{ 
        margin: 0px;
	padding: 0px 0px 0px 10px;
	font-size: 120%;
        font-weight: bold;
	background: url(../../resources/assets/h4_arrow.gif) no-repeat left;
}

#printReady a:hover{ color: #FCAF17;}

#multimap{ 
	padding: 0px 0px 0px 10px;
	font-size: 120%;
        font-weight: bold;
	background: url(../../resources/assets/h4_arrow.gif) no-repeat left;
        color:;
}

.printBtn2{ position:absolute; left: 350px;}




/* CONTENT FAT - CONTAINER & COLUMNS FOR FAT LEFT COLUMN AND THIN RIGHT COLUMN
------------------------------------------------------------------------------ */
#contentfat{
	padding: 0px 0px 20px 0px;
	margin: 0px;
	width: 756px;
	/*background: url(../../resources/assets/hr_756wide.gif) no-repeat bottom left;*/
}

#contentfat .left {
	width: 576px;
	text-align: left;
}

#contentfat .right {
	width: 170px;
	text-align: right;
}

p.contentfat_hr {
	padding: 0px 0px 20px 0px;
	margin: 0px;
	background: url(../../resources/assets/hr_576wide.gif) no-repeat bottom left;
}

#contentfat ul, li {
	margin: 0px 0px 0px 5px;
	padding: 0px 0px 0px 5px;
}

/* QUESTIONS PAGE
---------------------------------------------------------------- */
.Question {
        border-top: 1px dashed #000;
}

.Question input, .Question label {position: relative; left: 350px;}

#next{ position: relative; left: 350px;}


/* BOXES - TOPS AND BOTTOMS FOR ALL ROUND CORNER BOXES
---------------------------------------------------------------- */

/* FAT SOLUTIONS BOX CONTAINER
---------------------------------- */
#box_solutions {
	text-align: left;
	width: 290px;
	background: url(../../resources/assets/box_solutionsbottom.jpg) no-repeat bottom left; /* expandable bottom graphic */
}

#box_solutionstop {
	background: url(../../resources/assets/box_solutionstop.gif) no-repeat top left; /* expandable top graphic */
}

/* TEXT STYLES FOR THE SOLUTIONS BOX */
#box_solutions p {
	font-size: 80%;
_font-size: 70%;
}

#box_solutions h3 {
	margin: 0px;
	padding: 10px;
	font-size: 150%;
	background: url(../../resources/assets/4stars.gif) no-repeat right;
}

#box_solutions h4 {
	margin: 0px;
	padding: 0px 0px 0px 10px;
	font-size: 100%;
	color: #FCAF17;
	background: url(../../resources/assets/h4_arrow.gif) no-repeat left;
}

/* EACH ELEMENT WITHIN THE SOLUTIONS BOX IS A SEPARATE DIV */
.solutions_list {
	padding: 0px 0px 15px 0px;
        _padding: 0px 0px 18px 0px;
	margin: 0px 0px 0px 10px;
	background: url(../../resources/assets/hr_270wide.gif) no-repeat left bottom;
}

.solutions_list a{ text-decoration: none; color:#fcaf17;} 
.solutions_list a:hover { text-decoration: none; color:#666;} 

.solutions_list p{
	padding: 0px 50px 0px 0px;
	margin: 0px 10px 0px 0px;
}

.solutions_list_base { /* THE BOTTOM DIV HAS THE DOTTED LINE REMOVED */
	padding: 0px 0px 10px 0px;
	margin: 0px 0px 0px 10px;
}

.solutions_list_base p{
	padding: 0px 50px 0px 0px;
	margin: 0px 10px 0px 0px;
}

.solutions_list .solutionsImg {position: relative; left:220px; bottom:20px;}

/* SEPARATE STYLES FOR EACH PARAGRAPH WITH LOGO'S AS BG IMAGES
------------------------------------------------------------------- */
.imanage {
	background: url(../../resources/assets/logo_imanage.gif) no-repeat right;
}
.canonpluselite {
	background: url(../../resources/assets/logo_canonpluselite.gif) no-repeat right;
}
.uniflow {
	background: url(../../resources/assets/logo_uniflow.gif) no-repeat right;
}
.invu {
	background: url(../../resources/assets/logo_invu.gif) no-repeat right;
}
.emaintenance {
	background: url(../../resources/assets/logo_emaintenance.gif) no-repeat right;
}
.totalcost {
	background: url(../../resources/assets/logo_totalcost.gif) no-repeat right;
}

/* THIN BOX CONTAINER FOR LINKS IN THE RIGHT COLUMN
--------------------------------------------------- */
#sub_boxright {
	text-align: left;
	width: 170px;
	background: url(../../resources/assets/sub_boxright_bottom.gif) no-repeat bottom left; /* expandable bottom graphic */
}

#sub_boxrighttop {
	background: url(../../resources/assets/sub_boxright_top.gif) no-repeat top left; /* expandable top graphic */
}

/* TEXT STYLES FOR THE THIN BOX */
#sub_boxright p {
	font-size: 80%;
}

#sub_boxright h4 {
	margin: 0px;
	padding: 0px 0px 0px 10px;
	font-size: 110%;
	color: #FCAF17;
	background: url(../../resources/assets/h4_arrow.gif) no-repeat left;
}

#sub_boxright a{ text-decoration: none;}
#sub_boxright a:hover{ color: #FCAF17;} 

/* EACH ELEMENT WITHIN THE THIN BOX IS A SEPARATE DIV */
.boxright_list {
	padding: 0px 0px 20px 0px;
	margin: 0px 0px 0px 10px;
	background: url(../../resources/assets/hr_150wide.gif) no-repeat left bottom;
}

.boxright_list p{
	padding: 0px 50px 0px 0px;
	margin: 0px 10px 0px 0px;
}

.boxright_list_base { /* THE BOTTOM DIV HAS THE DOTTED LINE REMOVED */
	padding: 0px 0px 20px 0px;
	margin: 0px 0px 0px 10px;
}

.boxright_list_base p{
	padding: 0px 50px 0px 0px;
	margin: 0px 10px 0px 0px;
}

/* HOMEPAGE BOXES - CONTAINER & COLUMNS
---------------------------------------------- */
#homepageboxes{
	margin: 10px 0 0 0;
	_margin: 0px;
	padding: 0px;
	width: 756px;
        border-top: 1px dashed #000;
}

.col1 { /* FASTLINKS */
	float: left;
	text-align: left;
	width: 223px;
	margin-top: 10px;
	margin-right: 10px;
}

.col2 { /* HIGHLIGHTS */
	float: left;
	text-align: left;
	width: 223px;
	margin-top: 10px;
	margin-right: 10px;
}

.col3 { /* BESPOKE SOLUTION */
	float: left;
	text-align: left;
	width: 290px;
	margin-top: 10px;
}

/* FASTLINKS & HIGHLIGHTS
------------------------- */
#box_fastlinks, #box_highlights {
	text-align: left;
	width: 223px;
	min-height: 125px;
	_min-height: 120px;
        background: url(../../resources/assets/box_quotes_bottom.jpg) no-repeat bottom left; /* expandable bottom graphic */
}

#box_fastlinks h3, #box_highlights h3 {
	margin: 0px;
	padding: 10px;
	font-size: 150%;
	background: url(../../resources/assets/box_quotes_top.gif) no-repeat top left; /* expandable top graphic */
}

#box_fastlinks ul, #box_highlights ul {
	font-size: 80%;
	list-style: none;
	margin: 0px;
	padding: 0px 0 13px 0;
        _padding: 0px;
	background: url(../../resources/assets/quotes.gif) no-repeat top right; /* quote graphic as a bg */
}

#box_fastlinks li, #box_highlights li {
	margin: 0px 0px 0px 10px;
}

#box_highlights a:hover{ color: #000;}

/* bespoke
------------------ */
#box_bespoke {
	text-align: left;
	width: 290px;
	height: 145px;
        _min-height: 120px;
	background: url(../../resources/assets/box_green_bottom.jpg) no-repeat bottom left; /* expandable bottom graphic */
}

#box_bespoke h3 {
	margin: 0px;
	padding: 10px;
	font-size: 150%;
	background: url(../../resources/assets/box_green_top.jpg) no-repeat top left; /* expandable top graphic */
}

#box_bespoke ul {
        position: relative;
        _top:-20px;
	margin: 0px 0 0 0px;
	padding: 0px 50px 30px 0px;
	font-size: 90%;
	list-style-type:none; 	
}

/*#box_bespoke #cog{
        position: absolute;
        left: 740px;
	display: block;
        height: 50px;
        width: 50px;
        background: url(../../resources/assets/cog.gif) no-repeat top right; /* cog graphic as a bg */
}*/

.bespoke_radio{
	list-style-type:none; 
	margin:5px 0 0 4px;
}

.bespoke_radio input{
	margin:0px 5px -3px 5px;
}

/* PRODUCTS BOXES - GREY GRADIENT THAT SPANS THE FAT LEFT COLUMN
---------------------------------------------------------------- */
.box_products { /* this spans the width of the fat left column */
	text-align: left;
	width: 576px;
	min-height: 105px;
        padding: 20px 0 0 0;
        margin: 0 0 10px 0;
	background: url(../../resources/assets/box_products_bg.jpg) no-repeat top left; /* gradient bg that is 105px high */
}

.box_products p {
	margin: 0px;
	padding: 0px;
	font-size: 90%;
}

.productsleftcol { /* this is for the left column of products */
	width: 268px;
	text-align: left;
	float: left;
	padding: 0 0 10px 10px;
        /*font-size:90%;*/
}

.productsrightcol { /* this is for the right column of products */
	width: 268px;
	text-align: left;
	float:right;
        margin: 10px 0 0 0;
	padding: 10px 10px 20px 40px;
        /*font-size:90%;*/
}

.productimg_right { /* floats the product image to the left */
	float: left;
	width: 100px;
        margin: 0 0 0 20px;
        padding: 20px 0 0 0;
}


.productimg { /* floats the product image to the left */
	float: left;
	width: 100px;
        padding: 20px 0 0 0;
}

.productsrightcol .productimg{ position: relative; top: 20px;}

.producttext { /* floats the product text to the right */
	float: right;
	width: 168px;
}

.producttext_right { /* floats the product text to the right */
	float: right;
	width: 168px;
        padding: 0 0 10px 0;
}
.producttext h2 a { 
        text-decoration: none; 
        margin: 0px;
	padding: 0px 0px 0px 10px;
	font-size: 120%;
        _font-size: 100%;
	color: #FCAF17;
	background: url(../../resources/assets/h4_arrow.gif) no-repeat left;}
.producttext h2 a:hover { color: #333;}
.producttext_right h2 a { 
        text-decoration: none; 
        margin: 0px;
	padding: 0px 0px 0px 10px;
	font-size: 120%;
        _font-size: 100%;
	color: #FCAF17;
	background: url(../../resources/assets/h4_arrow.gif) no-repeat left;
}
.producttext_right h2 a:hover { color: #333;}

.product_btns{
       position:absolute; 
       top:340px; 
       left:460px; 
       width:160px;
}

.product_btns2{
       position:absolute; 
       top:340px; 
       left:330px; 
       width:160px;
}

.product_btns a img{margin:0 0 5px 0;}

/* BIG GREEN SOLUTIONS BOX AT THE TOP OF THIN LEFT COLUMN
---------------------------------------------------------*/
#newsolution {
	background:url(../../resources/assets/box_recommend_top.gif) top left no-repeat; /* EXPANDABLE TOP GRAPHIC - the button come later in the CSS */
	width: 457px;
	padding: 0px;
	margin: 0px;
}
/* text styles for the big green box */
#newsolution h1 {
	font-size: 130%;
	padding: 10px 10px 0px 10px;
}

#newsolution p {
	font-size:90%;
	padding: 0px 10px;
}

/* EACH PRODUCT IS PUT INTO IT'S OWN DIV */
.products_list {
	padding: 10px 0px 60px 0px;
	margin: 0px;
	background: url(../../resources/assets/hr_456wide.gif) no-repeat left bottom; /* dotted line at the bottom of each product */
}

.products_list p{
	padding: 0px;
	margin: 0px;
}

.products_list_base { /* the bottom oe has no dotted line */
	padding: 10px 0px 20px 0px;
	margin: 0px;
}

.products_list_base p{
	padding: 0px 50px 0px 0px;
	margin: 0px 10px 0px 0px;
}



/* BUTTONS - on and off state within the same image
uses coordinates to display over state on rollover
---------------------------------------------------*/
/* PRINT */
a#printbtn {
    display: block;
	float: right; /* remove float if you need it aligned to the left */
    width:146px;
    height: 28px;
    background: url(../../resources/assets/btn_print.gif) no-repeat 0 0;
}
a#printbtn:hover {
    background: url(../../resources/assets/btn_print.gif) no-repeat 0 -28px;
}
#printbtn span {display:none;}

/* READMORE */
a#readmorebtn {
    display: block;
	float: right; /* remove float if you need it aligned to the left */
    width:106px;
    height: 38px;
    background: url(../../resources/assets/btn_readmore.gif) no-repeat 0 0;
    margin: 0 auto;
}
a#readmorebtn:hover {
    background: url(../../resources/assets/btn_readmore.gif) no-repeat 0 -38px;
}
#readmorebtn span {display:none;}

/* NEWSOLUTION */
a#newsolutionbtn {
    display: block;
    width:457px;
    height: 81px;
    background: url(../../resources/assets/btn_newsolution.gif) no-repeat 0 0;
    margin: 0 auto;
}
a#newsolutionbtn:hover {
    background: url(../../resources/assets/btn_newsolution.gif) no-repeat 0 -81px;
}
#newsolutionbtn span {display:none;}

/* FORM
------------------ */

.formError {
	color:red;
	weight:bold;
}


/* FOOTER
------------------ */
#footer {
	width: 756px;
	padding: 5px 0px 5px 0px;
	margin: 10px 0px 0px 0px;
	background-color: #505050;
	color: #999999;
	font-size: 80%;
}

#footer .left {
	margin: 0px;
	padding: 0px 0px 0px 10px;
	text-align: left;
}

#footer .right {
	margin: 0px;
	padding: 0px 10px 0px 0px;
	text-align: right;
}

#footer p{
	padding: 0px;
	margin: 0px;
}

#footer p a{ color:#999; text-decoration: none; padding:0 0 0 5px;} 

/* CSS Document */


