body {font: 13px "Trebuchet MS", "Helvetica", Arial, Verdana, sans-serif; border: 0; margin: 0; padding: 0; text-align: center; background: #fff url('images/background.png') repeat-x top; color: #666;}

h1, h2, h3, h4, p, ul, ol{border: 0; margin: 0; padding: 0; text-align: left;}
a{text-decoration: none; color: #b4c50f}
a:hover{color: #666;}
img{border: 0; margin: 0; padding: 0;}
.DPbtn{font: 1.1em "Trebuchet MS", Arial, Helvetica, sans-serif; border: 1px solid #bbb; margin: 5px;}
h3{font-size: 20px; color: #b4c50f; background: transparent; margin-bottom: 10px;}
h4{font-size: 14px;}
p{text-align: justify; padding-bottom: 20px; line-height: 1.7em;}

ul{list-style: square;}
ul, ol{padding-bottom: 20px;}
ol li, ul li{margin: 5px;}
ol ul li{margin: 10px 30px;}
table.tblBugForm {border:solid 1px #B4C50F;}
#header, #content, #footer, #threecols, #home_header, #content_header{border: 0; margin: 0; padding: 0; width: 100%; height: auto; text-align: left;}

#header{margin-top: 75px;}

#logo{width: 210px; height: 42px; background: transparent url('images/logo.png') no-repeat center; position: absolute; top: 20px; margin-left: 20px;}
#logo span{display: none;}
#dvLoggedIn {float:right; top:8px; right:5px; position:absolute;}
/* ad-hoc style for the rollover effects */
div.home_header{background: #fff url('images/home_header_sprite.png') no-repeat; height: 285px; text-align: center;}
div.roll_left { display: block; background:url('images/home_header_sprite.png') -820px 0 no-repeat; height: 285px; text-align: center; }
div.roll_centre { display: block; background:url('images/home_header_sprite.png') -1640px 0 no-repeat; height: 285px; text-align: center; }
div.roll_right { display: block; background:url('images/home_header_sprite.png') -2460px 0 no-repeat; height: 285px; text-align: center; }

.home_header div.header_home {background: #fff url('images/home_topheader_sprite.jpg') 0 0 no-repeat; margin-left: 20px; height: 250px; width: 760px;}
.home_header div.header_roll_left {background:#fff url('images/home_topheader_sprite.jpg') -760px 0 no-repeat; width: 760px; height: 250px; text-align: center; }
.home_header div.header_roll_centre {background:#fff url('images/home_topheader_sprite.jpg') -1520px 0 no-repeat; width: 760px; height: 250px; text-align: center; }
.home_header div.header_roll_right {background:#fff url('images/home_topheader_sprite.jpg') -2280px 0 no-repeat; width: 760px; height: 250px; text-align: center; }

#maincontent_header{background: #fff url('images/content_header.png') no-repeat; height: 215px;}
#content_header{background: #fff url('images/home_topheader_sprite.jpg') no-repeat; height: 215px;}

#content1{background: #fff url('images/1col.png') repeat-y; padding: 10px 30px 0 10px; text-align: left;}

div.colmenu{position: absolute; top: 130px; width: 170px; float: left;}
div.colmain{position: relative; margin-top: -200px; margin-left: 190px;}
div.colmain ul{padding: 0 30px;}

ul#menu{list-style: none;}
ul#menu li{background: url('images/menu_sep.png') no-repeat top left; padding: 5px; margin: 0;}

ul#menu ul li{background: transparent; margin: 0 0 0 10px; padding: 2px; list-style: none;}
ul#menu ul li a{color: #666; background: transparent;}
ul#menu ul li a:hover{color: #b4c50f; background: transparent;}

p.breadcrumbs{position: absolute; right: 0; margin-right: 30px; margin-top: -20px;}

#content3 .selected{background: url('images/3cols_sprite.png') repeat-y; }
#content3 .selected div{width: 240px;} 

#content3 .selected-l{background: url('images/3cols_sprite.png') -820px 0 repeat-y; }
#content3 .selected-l div{width: 240px;} 

#content3 .selected-c{background: url('images/3cols_sprite.png') -1640px 0 repeat-y; }
#content3 .selected-c div{width: 240px;} 

#content3 .selected-r{background: url('images/3cols_sprite.png') -2460px 0 repeat-y; }
#content3 .selected-r div{width: 240px;} 

div.coll{float: left; padding: 10px 5px 0 32px; min-height: 380px;}
div.colc{margin: 0 200px 0 270px; padding: 10px 17px 0 27px; min-width: 170px; position: relative; left: -3px; min-height: 380px; z-index: 1; }
    div.colc p { padding-right: 30px;}
div.colr{float: right; padding: 10px 10px 0 0; position: relative; left: -19px; min-height: 380px; margin: 0px; z-index: 2; }
div.coll ul, div.colc ul, div.colr ul{list-style: none;}

div.fixed_width{border: 0; margin: 0 auto; padding: 0; width: 820px;}

p.contact{margin-left: 30px;}

#map {width: 450px; height: 650px}

#footer{background: #fff url('images/footer_background.png') repeat-x top; height: 200px;}
/* #footer div.footer3{background: transparent url('images/footer3_top.png') no-repeat top; height: 200px;} */
#footer div.footer3{background: url('images/footer3_top_sprite.png') no-repeat top left; height: 200px; width: 820px;}
#footer div.footer3-l{background: url('images/footer3_top_sprite.png') -820px 0 no-repeat; width: 820px;}
#footer div.footer3-c{background: url('images/footer3_top_sprite.png') -1640px 0 no-repeat; width: 820px; }
#footer div.footer3-r{background: url('images/footer3_top_sprite.png') -2460px 0 no-repeat; width: 820px;}

#footer div.footer1{background: transparent url('images/footer1_top.png') no-repeat top; height: 200px;}
#footer p{padding: 50px 0 0 0;}
#footer li{display: inline; margin-right: 15px;}
#footer li.twitter { float: right; position: relative; top: -35px;}

.dropdown{padding: 0 80px; background: #fff url('images/quote_down_arrow.png') no-repeat left top; color: inherit;}
.dropdown p{text-align: right;}
.dropdown div{display:none;}

.item {overflow: auto; width: 100%; margin: 20px 0; padding:10px 0;}
.item img{display: none;}
.item h3{margin-left: 100px;}
.item p{margin-left: 100px; display:block;}
.item a{display: block; width: 82px; height: 40px; background: url('images/read_more.png')}
.item a span{display: none;}

#largehead {color: #aaa; font-size: larger; padding: 30px;}

#development{background: url('images/icons/development_icon.png') no-repeat top left;}
#trackissue{background: url('images/icons/TrackIssue_icon.png') no-repeat top left;}
#ChangePassword{background: url('images/icons/change_password_icon.png') no-repeat top left;}

#crm{background: url('images/icons/crm_icon.png') no-repeat top left;}
#analysis{background: url('images/icons/information_icon.png') no-repeat top left;}
#hosting{background: url('images/icons/hosting_icon.png') no-repeat top left;}
#support{background: url('images/icons/support_icon.png') no-repeat top left;}
#training{background: url('images/icons/training_icon.png') no-repeat top left;}
#consultancy{background: url('images/icons/consultancy_icon.png') no-repeat top left;}

#design{background: url('images/icons/design_icon.png') no-repeat top left;}
#cms{background: url('images/icons/cms_icon.png') no-repeat top left;}
#ecommerce{background: url('images/icons/ecommerce_icon.png') no-repeat top left;}
#accessibility{background: url('images/icons/accessibility_icon.png') no-repeat top left;}
#seo{background: url('images/icons/seo_icon.png') no-repeat top left;}
#hosting{background: url('images/icons/hosting_icon.png') no-repeat top left;}
#support{background: url('images/icons/support_icon.png') no-repeat top left;}
#copywriting{background: url('images/icons/copywriting_icon.png') no-repeat top left;}
#branding{background: url('images/icons/branding_icon.png') no-repeat top left;}
#marketing{background: url('images/icons/marketing_icon.png') no-repeat top left;}

#itsetup{background: url('images/icons/setup_icon.png') no-repeat top left;}
#itsupport{background: url('images/icons/support_icon.png') no-repeat top left;}
#itmanagement{background: url('images/icons/management_icon.png') no-repeat top left;}
#security{background: url('images/icons/security_icon.png') no-repeat top left;}
#communications{background: url('images/icons/connectivity_icon.png') no-repeat top left;}
#procurement{background: url('images/icons/procurement_icon.png') no-repeat top left;}
#greenit{background: url('images/icons/greenit_icon.png') no-repeat top left;}

/* Form Input */
div.formInput {border-bottom: 0px solid #ddd; padding: 2px; margin-left: 10px; font-family:"Trebuchet MS", "Helvetica", Arial, Verdana, sans-serif}
div.alt{background-color: #eee; color: inherit;}
	div.formInput span{display: block; width: 30%; float: left; margin-top: 5px;}
	div.formInput .error{display: block; border: 1px solid #f00; width: 90%; padding: 10px;}
div.subInput {margin-left: 20px;}
div.triage, div.final{width: 470px;float: left;}
div.final{clear: right;}

div.formInputLogin {border-bottom: 1px solid #ddd; padding: 2px; margin-left: 10px; margin-top:10px; font-family:"Trebuchet MS", "Helvetica", Arial, Verdana, sans-serif;}
div.alt{background-color: #eee; color: inherit;}
	div.formInputLogin span{display: block; width: 20%; float: left; margin-top: 5px; margin-left:40px;}
	div.formInputLogin .error{display: block; border: 1px solid #f00; width: 90%; padding: 10px;}

div.formInputCP {border-bottom: 1px solid #ddd; padding: 2px; margin-left: 10px; margin-top:10px; font-family:"Trebuchet MS", "Helvetica", Arial, Verdana, sans-serif;}
div.alt{background-color: #eee; color: inherit;}
	div.formInputCP span{display: block; width: 30%; float: left; margin-top: 5px; margin-left:40px;}
	div.formInputCP .error{display: block; border: 1px solid #f00; width: 90%; padding: 10px;}


textarea{ font-family:"Trebuchet MS", "Helvetica", Arial, Verdana, sans-serif; font-size:13px; }
p.error { position: relative;top: 0.5em;float: left; margin-left:10%; color: #DF0D3D; margin-bottom: 10px; width: 200px; display: block;}

.dpButton{background: #fff url('images/DPButton.png') no-repeat}
.lblBorder{border:1px solid #ddd; width:100%;}

/* */
.boxgrid{ width: 270px; height: 140px; float:left; overflow: hidden; position: relative;margin: 11px;border: 1px solid #ccc;}
        .boxgrid img{ position: absolute; top: 0; left: 0; border: 0; }
	    .boxgrid h4 { text-align: center;color: #b3c50f;}
        div.content {float: left; position: absolute; background: #2d363b;padding: 5px; height:140px;width: 260px; opacity: .9; /* For IE 5-7 */filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);/* For IE 8 */-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";display:none;}/*display:block*/
        div.content div.content-main {padding: 0px;margin: 5px;color: #fff;height: 83px;}
        p.caption-bottom {text-align: center;}
        p.caption-bottom a:hover{ color: #fff;}