body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: x-small;/* for IE5/win */
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: small; /* for all other browsers */
	margin: 0;
	padding: 0;
	color: #000000;
	background: #9B9B9B url(../images/bgimages/bg_body_all.gif) repeat-y left;
}
html>body{ /* for Opera */
	font-size: small;
}

a {
	text-decoration: none;
	color: #3E6E96;
	font-weight: bold;
}
a:hover {
	color: #000033;
}
ul{
	padding: 0;
	margin: 0;
}
li{
	list-style-type: square;
	padding: 0;
}
p{
	padding: 0;
	margin: 0;
}
img {
	border: none;
}

/* Clear2Pay title */
h1{
	margin: 0;
	padding: 0;
	font-weight: normal;
	font-size: 100%;
	color: #000033;
}
h1 p{
	margin-left: -500px;
	/* sets the title text, which is used for SEO, off the screen */
}
/* the white title in the upper right corner */
h2{
	text-align: right;
	margin: 0 20px 0 0;
	padding: 0;
	color: #FFFFFF;
	text-transform: uppercase;
	font-weight: normal;
	font-size: 250%;
	letter-spacing: 0.2em;
	line-height: 22px;
}
/* title block on top of the page */
h3{
	padding: 0;
	margin: 0;
	font-weight: normal;
	background: #25426e url(../images/bgimages/title_company_bottles.jpg);
}
/* standaard background voor solution titles */
#solutions_selection div{
	background: #25426e url(../images/bgimages/title_company_bottles.jpg);
}

/* grey block under page title */
h4{
	padding: 0;
	margin: 0;
	font-weight: normal;
}
/* select list styles */
select{
	width: 200px;
	font-size: 100%;
}
/* style to make the listitems of a sublist in a page gray */
#textarea ul li ul{
	margin: 0.5em 10px 0.5em 10px;
	padding: 0 0 0 10px;
	color:#999999;
}
/* when a table is used for data */
table{
	margin-left: 20px;
}
td{
	padding-right: 2em;
}

/* class to center something */
.center{
	text-align: center;
}
/* class to align text right */
.right{
	text-align: right;
}
/* class to align images left */
#textarea img.left{
	float: left;
	margin: 0 20px 30px 20px;
}
#textarea img.left.grid{
	margin-bottom: 60px; /* larger bottom-margin prevents text to flow under the image, to achieve a grid effect */
}
#textarea img.right{
	float: right;
	margin: 0 20px 0 20px; /* used on events page */
}
/* positions text vertical in the middle of the image */
#textarea img.middle{
	vertical-align: middle;
	margin: 0; /* used on Newsletter page */
}
/* used on the events page, floats images right, text flows around it */
#textarea .events img.right{
	float: right;
	margin: 0 15px 0 10px;
}
/* used on the management page, floats images right, text flows around it */
#textarea .photo{
	float: right;
	margin: 0pt 15px 10px;
}
/* class to color something */
.colored{
	color: #3E6E96;
}
/* class to clear floated items, used on an item under the floated items */
.clearer{
	clear:both;
}

/* PAGE STRUCTURE */
/* main div, determines width */
#container{
	font-size: 85%;
	width: 950px;
}
/* wrapper contains menu & page content */
#wrap{
	float: right;
	width: 847px;
}
/* CLaer2Pay logo */
#logo{
/*	background:url(../images/bgimages/logo.gif) top left;*/
	width: 103px;
	height: 110px;
	float: left;
}
/* menu styles */
#menu{
	background: #FFF;
	width: 135px;
	float: left;
	margin: 0;
	margin-top: 22px;
	padding: 10px 0 10px 7px;
}
/* content of the page, includes pagetitle and footer */
#content{
	float: right;
	width: 705px;
	margin: 0 0 25px 0;
}
/* styles for navigation */
ul#nav {
	margin: 0;
}
#nav{
	background: url(../images/bgimages/bg_nav.gif) #3e6e96 top left repeat-y;
	color: #FFFFFF;
	font-weight: bold;
	padding: 5px 0 5px 0;
}
#nav li{
	list-style: none;
	padding: 0;
}
#nav li a{
	color: #FFFFFF;
	padding: 2px 0 0 15px;
	display: block; /* block needed for backgroundimage, otherwise image would stop at end of navtext */
	height: 18px;
}
#nav li a:hover{
	background:url(../images/bgimages/bg_menulink.gif) top left no-repeat;
	display: block;
	height: 18px;
}
/* the active menu item */
.menu_active {
	background:url(../images/bgimages/bg_menulink.gif) top left no-repeat;
	display: block;
	height: 18px;
}
/* styles for the submenu */
#subnav{
	margin: 0;
	padding: 0;
}
#subnav li a{
	padding: 1px 0 0 25px;
	display: block;
	font-weight: normal;
	color: #CCC;
}
#subnav li a:hover{
	background:url(../images/bgimages/bg_submenulink.gif) top left no-repeat;
	color: #FFF;
	display: block;
	height: 18px;
}
/* the active submenu item */
.submenu_active{
	background:url(../images/bgimages/bg_submenulink.gif) top left no-repeat;
	color: #FFF;
	display: block;
	height: 18px;
}

/* styles for the second submenu B */
#subbnav{
	margin: 0;
	padding: 0;
}
#subbnav li a{
	background:url(../images/bgimages/bg_subcmenulink.gif) top left no-repeat;
	padding: 1px 0 0 32px;
	display: block;
	font-weight: normal;
	color: #DDD;
}
#subbnav li a:hover{
	background:url(../images/bgimages/bg_subbmenulink.gif) top left no-repeat;
	color: #FFF;
	display: block;
	height: 18px;
}
/* the active secondsubmenu item B */
.subbmenu_active{
	background:url(../images/bgimages/bg_subbmenulink.gif) top left no-repeat;
	color: #FFF;
	display: block;
	height: 18px;
}
/* the white area that contains the text and titles on the page */
#textarea{
	background: #FFFFFF url(../images/bgimages/bg_page.gif) repeat-y right top;
	padding: 10px 10px 20px 15px;
	width: 680px;
}

/* style for divs containing downloads */
.box{
	background: #EBEBEB url(../images/bgimages/bg_downloads.gif) top left repeat-y;
	margin: 20px;
}

/* style for divs board */
.boxboard{
	background: #EBEBEB url(../images/bgimages/bg_downloads.gif) top left repeat-y;
	margin: 20px;
}

/* footer on the bottom of the page */
#footer{
	margin: 10px 0 0 20px;
	padding: 0;
	overflow: auto; /* places footer always below the items above it */
	clear: both; /* cleared float left and float right so that the footer always is placed the same way */
}
/* footertext (Clarity In Payments) */
#footer blockquote{
	color: #666;
	font-weight: bold;
	letter-spacing: 0.1em;
	float: left;
	margin: 0;
	padding: 0;
}
/* footer menu */
#footer{
	padding-top: 10px;
}
#footer ul{
	float: right;
	margin: 0;
	margin-right: 10px;
	list-style: none;
}
#footer ul li{
	float: left;
	list-style: none;
}
#footer ul li a{
	font-weight: bold;
	color: #3E6E96;
	background: url(../images/listitem_square.gif) center left no-repeat;
	padding-left: 10px;
	padding-right: 10px;
}
#footer ul li a:hover{
	color: #000033;
}

/* CORPORATE PROFILE PAGE */
#textarea .corporate_solutions{
	margin: 1em 25px;
}
#textarea .corporate_solutions li{
	list-style: none;
	margin-bottom: 10px;
}
/* gives the "more"-urls some space */
#textarea .corporate_solutions li strong{
	margin-right: 10px;
}

/* THREE BLOCK STRUCTURE on home and solutions */

#itemrow{
	overflow: hidden;
	margin-top: 10px;
}
#textarea #itemrow ul{
	margin: 0 5px 0 20px;
	padding: 0;
	float:left;
}
/* list of the 3 products in the picture */
#itemrow #items li{
	float: left;
	list-style: none;
	display: block;
	background: #EBEBEB url(../images/bgimages/bg_downloads.gif) top left repeat-y;
	width: 207px;
	height: 110px;
	margin: 0;
	margin-right: 12px;
}
/* product titles */
#itemrow #items h3{
	color: #FFF;
	font-weight: bold;
	letter-spacing: 0em;
	font-size: 135%;
	text-align: right;
	margin: 0 0 0 1px;
	padding: 35px 25px 0 0;
	display: block;
	height: 25px;
	min-height: 25px;
}
#itemrow #items h3 a{
	color: #FFFFFF;
}

#itemrow #items h3.alt{ /* apply the alt class when a h3 is spread over 2 lines */
	padding: 18px 20px 17px 10px;
	min-height: 0;
}
#itemrow #items #item3{
	margin-right: 10px;
}

/* link list per product (more information, ...) */
#itemrow #items ul{
	margin: 10px 20px;
}
#itemrow #items ul li{
	background: none;
	width: 150px;
	height: 15px;
	width: 100%;
	font-size: 95%;
}
#itemrow #items ul li a{
	background: url(../images/listitem_square.gif) center left no-repeat;
	padding-left: 10px;
}


/* CONTACT PAGE */
.salescontact li a{
	position: absolute;
	left: 450px;
}

/* CONTACT PAGE */
#textarea .adresses{
	overflow: hidden;
	width: 650px;
}
#textarea .adresses ul{
	padding: 0;
	list-style: none;
}
#textarea .adresses ul li{
	list-style: none;
	margin-bottom: 20px;
	padding-left: 0px;
}
#textarea .adresses ul li img{
	position: absolute;
	margin-left: -30px;
	margin-top: 0;
}
#textarea .listleft{
	float: left;
	width: 250px;
}
#textarea .listright{
	float: right;
	width: 265px;
}
#textarea .lower{
	margin-top: 173px;
}
#textarea .smalllower{
	margin-top: 174px;
}

/* CLIENT PAGE */
#textarea #client_logos{
	margin: 0;
	padding: 0 30px;
}
#textarea #client_logos img{
	margin: 10px 15px;
}
#textarea #client_logos a.lastline{
	margin-left: 150px;
}

/* CBK REFERENCES */



/* JOB PAGE */
#textarea ul ul li{
	background: url(../images/listitem_square_grey.gif) no-repeat left 7px;
	padding: 0 0 0 1em;
	margin: 0;
	list-style: none;
	color:#000000;
}
#textarea ul.sublist{ /* makes the second ul in a detail jobpage jump a bit to the left */
	margin: 0.5em 0;
	padding-left: 1em;
}