/* CSS FOR PAYTECH LTD WEBSITE */

@charset "utf-8";
@import url('reset.css');


/* ======== Default Styles ======== */

/* NEW Timesheet Banner */
	  #timesheet_banner {
	  margin:0 0 50px 0;
	  padding:0;
	  height:70px;
	  color:#fff;
	  }


body
	{
	background: #5E6167 url('../img/body.jpg') top left repeat-x;
	border-top: 4px solid #75A6FB;
	}

body, td
	{
	font: normal normal 12px/1.8em "Microsoft Sans Serif", Arial, Helvetica, sans-serif;
	color: #85868A;
	line-height: 1.8em;													/* Safari Shorthand Bug */
	}

h1
	{
	font-weight: normal;
	font-size: 28px;
	letter-spacing: -2px;
	color: #007469;
	background: url('../img/dotted-g.gif') bottom left repeat-x;
	padding-bottom: .7em;
	margin-bottom: .7em;
	}

h2
	{
	font-weight: bold;
	font-size: 28px;
	letter-spacing: -1px;
	color: #007469;
	}

h3
	{
	font-weight: normal;
	font-size: 18px;
	letter-spacing: -1px;
	color: #007469;
	margin-bottom: 1em;
	margin-top: 1em;
	}

h4
	{
	font-weight: bold;
	font-size: 14px;
	letter-spacing: -1px;
	color: #007469;
	}

h5
	{
	font-weight: bold;
	font-size: 13px;
	letter-spacing: -1px;
	padding-bottom: .7em;
	margin-bottom: .7em;
	color: #007469;
	background: url('../img/dotted-g.gif') bottom left repeat-x;
	}

h6
	{
	font-weight: bold;
	font-size: 12px;
	color: #007469;
	}

dt
	{
	padding-bottom: 16px;
	background: url('../img/dotted-g.gif') bottom left repeat-x;
	font-weight: bold;
	font-size: 18px;
	letter-spacing: -1px;
	color: #007469;
	}

dd
	{
	padding-top: 12px;
	}

p
	{
	margin-bottom: 1.4em;
	}	

a:link, a:visited
	{
	color: #007469;
	}

a:hover, a:active
	{
	color: #007469;
	}


/* ======== Content Image Aligning ======== */

img.center, img[align="center"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding: 2px 2px 2px 2px;
	background:#fff;
	border: solid 1px #C0C0C0;
	}
	
img.alignright, img[align="right"], .alignright {
	margin: 5px 5px 15px 20px;
	display: inline;
	padding: 2px 2px 2px 2px;
	background:#fff;
	float:right;
	border: solid 1px #C0C0C0; 
	}

img.alignleft, img[align="left"], .alignleft {
	margin: 5px 20px 15px 5px;
	display: inline;
	padding: 2px 2px 2px 2px;
	background:#fff;
	float:left;
	border: solid 1px #C0C0C0; 
	}

img.noborder {
	border: none !important;
	}

/* ======== Download Styles ======== */
.download
	{
	margin: 0px 0px 15px 0px;
	padding: 8px 20px 0px 20px;
	background: #F8F2DA;
	border: 1px solid #cccccc;
	}

.pdfs
	{
	background:url(../img/file_pdf.gif) no-repeat 0 0;
	padding:2px 0 10px 27px;
	font: normal 16px Georgia;
	}
.pdfs a
	{
	text-decoration:none;
	}
	
/* ======== Clears List Styles for Last Item ======== */
.last
	{
	border-right: none !important;
	background: none !important;
	}

/* ======== Template Styles ======== */

#page
	{
	position: relative;
	width: 950px;
	text-align: left;													/* Compensate for IE5 Centering Fix */
	margin: 0 auto;
	background: #eeeeee url('../img/page.gif') top left repeat-y;
	overflow: hidden;													/* Prevents Floats from Breaking Background */
	}
	
#c1
	{
	position: relative;
	float: left;
	width: 260px;														/* For IE 5 */
	w\idth: 190px;														/* For Others */
	height: 620px;														/* For IE 5 */
	h\eight: 570px;														/* For IE 6 */
	min-height: 570px;													/* For Others */
	padding: 50px 40px 30px 30px;
	background: url('../img/main_bg.jpg') top left no-repeat;
	}
	html>body #c1 { height: auto; }										/* Compensate for IE6 Fix */
	
#c2
	{
	position: relative;
	float: right;
	width: 690px;														/* For IE 5 */
	w\idth: 650px;														/* For Others */
	height: 620px;														/* For IE 5 */
	h\eight: 570px;														/* For IE 6 */
	min-height: 570px;													/* For Others */
	padding: 50px 40px 30px 0;
	background: url('../img/main_bg.jpg') top right no-repeat;
	}	
	html>body #c2 { height: auto; }										/* Compensate for IE6 Fix */

	
	
#logo
	{
	position: relative;
	height: 160px;
	overflow: hidden;
	background: none;
	margin: 0;
	padding: 0;
	text-indent: -8888px;		 										/* Image Replacement */
	}
	
/* ======== Bullets ======== */

#content ul, #content ol {
	margin-bottom:15px;
	line-height:20px;
	}
#content ul li ul, #content ol li ol{
	margin-bottom:0px;
	padding-top:3px;
	}
#content ul li {
	list-style:disc inside !important;
	margin-left:15px;
	padding:3px 0px;
	}
#content ul li ul li {
	list-style:disc inside !important;
	}
#content ol li {
	list-style:decimal inside !important;
	padding:3px 0px;
	}
#content ol li ol li {
	list-style:decimal-leading-zero inside !important;
	}
	
/* ======== Main Navigation Styles ======== */

#mainnav
	{
	position: relative;
	height: 265px;
	overflow: hidden;													/* Prevents Too Many Nav Buttons From Breaking Layout */
	margin: 45px 0 0 0;
	padding: 0;
	list-style-type: none;
	font-size: 14px;
	line-height: 1em;
	}	
	
#mainnav a:link, #mainnav a:visited
	{
	display: block;
	oveflow: hidden;
	height: 35px;
	line-height: 30px;												/* Vertical Centres Nav Text */
	padding-left: 24px;
	background: url('../img/arrow-sb.gif') left no-repeat;
	color: #ffffff;
	text-decoration: none;
	}	
	
#mainnav a:hover, #mainnav a:active
	{
	background-image: url('../img/arrow-sw.gif');
	color: #002969;
	}

#mainnav li
	{
	margin: 0; padding: 0;
	background: url('../img/dotted-w.gif') bottom left repeat-x;
	}

/* ======== Flash Intro Styles ======== */

#intro
	{
	padding-left: 7px;
	z-index:0;
	position: relative;
	color: #fff;
	}

/* ======== Home Styles ======== */

#home-boxes
	{
	position: relative;
	margin: 40px 0 70px 0;
	color: #eeeeee;
	height: 190px;
	overflow: hidden;													/* Prevents Too Much Text from Breaking Layout */
	}

#home-boxes .box
	{
	float: left;
	width: 214px;														/* For IE 5 */
	w\idth: 164px;														/* For Others */
	padding: 0 25px;
	background: url('../img/dotted-w.gif') top right repeat-y;
	}
	
#home-boxes dt
	{
	background: url('../img/dotted-w.gif') bottom left repeat-x;
	}
	
#home-boxes dt a:link, #home-boxes dt a:visited 
	{
	display: block;
	padding-right: 30px;
	background: url('../img/arrow-lbdg.gif') right no-repeat;
	color:#002969;
	text-decoration: none;
	}
	
#home-boxes dt a:hover, #home-boxes dt a:active 
	{
	color: #ffffff;
	background-image: url('../img/arrow-lw.gif');
	}

#home-boxes dd
	{
	padding-top: 12px;
	}
	
#home-boxes dd a, #home-boxes dd a:link, #home-boxes dd a:visited
	{
	display: block;
	color: #eeeeee;
	text-decoration: none;
	}	

#home-boxes dd a:hover, #home-boxes dd a:active
	{
	color: #ffffff;
	}	

/* ======== Home Feature Styles ======== */

#contact, #contact h3, #contact h2
	{
	color: #ffffff;
	position: relative;													/* Fixes Disappearing in IE 5&6 */
	}

#contact dt
	{
	background-image: url('../img/dotted-w.gif');
	}
	
#registration
	{
	position: relative;
	background: url('../img/dotted-g.gif') top right repeat-y;
	float: left;
	width: 325px;														/* For IE 5 */
	w\idth: 255px;														/* For Others */
	padding: 0 40px 0 30px;
	}	

#registration h4 a:link, #registration h4 a:visited
	{
	color: #007469;
	text-decoration: none;
	}

#registration h4 a:hover, #registration h4 a:active
	{
	color: #007469;
	}

#registration a:link, #registration a:visited
	{
	color: #85868A;
	text-decoration: none;
	}

#registration a:hover, #registration a:active
	{
	color: #007469;
	}

#paye
	{
	position: relative;
	width: 322px;													/* For IE 5 */
	w\idth: 252px;													/* For IE 6 3px Bug */
	padding: 0 40px 0 30px;
	float: right;													/* For All But IE  */
	*float: none;													/* For IE Only Extra Space Below Float Bug */
	}
	html>body #paye { width: 255px; }								/* For IE7 & Good Browsers */
	
#paye a:link, #paye a:visited
	{
	color: #85868A;
	text-decoration: none;
	}

#paye a:hover, #paye a:active
	{
	color: #007469;
	}
	
/* ======== Footer Styles ======== */

#footer
	{
	position: relative;
	clear: both;
	height: 78px;														/* For IE */
	min-height: 68px;													/* For Others */
	padding: 50px 30px;
	background: #5E6167 url('../img/footer.gif') top left no-repeat;
	text-align: center;
	color: #A8A9AC;
	}
	html>body #footer { height: inherit; }								/* Compensate for IE Fix */

#footer a:link, #footer a:visited
	{
	padding-left: 12px;
	margin-left: 8px;
	border-left: 1px solid #A8A9AC;
	color: #ffffff;
	text-decoration: none;
	}	

#footer a:hover, #footer a:active
	{
	color: #A8A9AC;
	}	

/* ======== Secondary Page Template Styles ======== */

#main
	{
	width: 640px;
	}	

#header
	{
	z-index:0;
	position: relative;
	height: 185px;
	color: #fff;
	}	

#content
	{
	position: relative;
	background: #ffffff url('../img/content-footer.gif') bottom left no-repeat;
	padding: 50px 70px 20px 60px;
	}

/* ======== Secondary Page Tab Styles ======== */

#tabs
	{
	position: absolute;
	top: 205px;														/* Bottom: 0 Caused IE 5&6 1px Bug */
	right: 50px;
	margin: 0; padding: 0;
	list-style-type: none;
	z-index:99;
	}	

#tabs li
	{
	padding: 0;
	margin: 0;
	width: 130px;
	height: 30px;
	float: left;
	line-height: 30px;												/* Centre Button Labels Vertically */
	text-align: center;
	background: url('../img/tab-off.gif') top left no-repeat;
	margin-left: 1px;
	}
	
#tabs a, #tabs a:link, #tabs a:visited
	{
	text-decoration: none;
	color: #ffffff;
	font-weight: bold;
	font-size: 12px;
	}
	
#tabs a:hover, #tabs a:active
	{
	color: #002969;
	}

#tabs .selected
	{
	background: url('../img/tab-on.gif') top left no-repeat;
	}

#tabs .selected a:link, #tabs .selected a:visited
	{
	color: #002969;
	}	
		
/* ======== Content Footer Styles ======== */

#content-footer
	{
	margin-top: 40px;
	background: url('../img/dotted-g.gif') top left repeat-x;
	}

#content-footer a, #content-footer a:link, #content-footer a:visited
	{
	color: #007469;
	font-weight: bold;
	text-decoration: none;
	}

#content-footer a:hover, #content-footer a:active
	{
	color: #007469;
	font-weight: bold;
	text-decoration: none;
	}

#breadcrumbs
	{
	position: relative;															/* Fixes IE 5-6 Disappearing Bug */
	float: left;														
	padding: 8px 0;
	font-size: 12px;
	width: 60%;																	/* Safari Text Wrap Bug */
	}

#utility-links
	{
	padding: 8px 0;
	font-size: 12px;
	text-align: right;
	}
	
/* ======== Sidebar Contact Links ======== */

.lnkC1, .lnkC1:link, .lnkC1:visited
	{
	padding-left: 12px;
	color: White;
	text-decoration: none;
    font-size: medium;
    font-weight: bold;
	background: url('../img/arrow-sb.gif') left no-repeat;

	}
	
 .lnkC1:hover, .lnkC1:active
	{
	color: #007469;	
	background-image: url('../img/arrow-sw.gif');		
	}
	
.lnkC2, .lnkC2:link, .lnkC2:visited
	{
	padding-left: 12px;
	color: #fff;
	text-decoration: none;
    font-size: medium;
    font-weight: bold;
	background: url('../img/arrow-sw.gif') left no-repeat;
	}
	
 .lnkC2:hover, .lnkC2:active
	{
	color: #293A54;	
	background-image: url('../img/arrow-sb.gif');				
	}

/* ======== Makes text dark blue ======== */
.darkblue
	{
	color: #293A54 !important;
	}	
	
/* ======== Makes text light blue ======== */
.lightblue
	{
	color: #4796d8 !important;
	}
	
/* ======== Puts Dotted Grey Line to the Right of Item  ======== */
.divided
	{
	background: url('../img/dotted-g.gif') top right repeat-y;
	padding-right: 16px;
	margin-right: 8px;
	}

/* ======== Puts Large Blue Arrow to Right of Selection for Items on Dark Grey Backgrounds  ======== */
.arrow-lbdg
	{
	display: block;
	padding-right: 30px;
	background: url('../img/arrow-lbdg.gif') right no-repeat;
	}

/* ======== Puts Large Blue Arrow to Right of Selection for Items on Blue Backgrounds  ======== */
.arrow-lbb
	{
	display: block;
	padding-right: 30px;
	background: url('../img/arrow-lbb.gif') right no-repeat;
	}

/* ======== Puts Large Blue Arrow to Right of Selection for Items on Light Grey/White Backgrounds  ======== */
.arrow-lbg
	{
	display: block;
	padding-right: 30px;
	background: url('../img/arrow-lbg.gif') right no-repeat;
	}

/* ======== Puts Large White Arrow to Right of Selection for Items on Dark Grey Backgrounds  ======== */
.arrow-lw
	{
	display: block;
	padding-right: 30px;
	background: url('../img/arrow-lw.gif') right no-repeat;
	}

/* ======== Puts Small Blue Arrow to Right of Selection for Items on Dark Grey Backgrounds  ======== */
.arrow-sb
	{
	display: block;
	padding-right: 30px;
	background: url('../img/arrow-sb.gif') right no-repeat;
	}

/* ======== Puts Small White Arrow to Right of Selection for Items on Dark Grey Backgrounds  ======== */
.arrow-sw
	{
	display: block;
	padding-right: 30px;
	background: url('../img/arrow-sw.gif') right no-repeat;
	}

