html, body{ 
 margin:0; 
 padding:0; 
 font: 100% Verdana, Arial, Helvetica, sans-serif;
 text-align:center; 
 background: #D8ECF2 url(/images/body_bg.jpg) repeat-x top;
}
 
a {
	text-decoration: none;
}
a:link {
	color: #65B3C9;
}
a:visited {
	color: #03016E;
} 
a:active {
	color: #FF9900;
}
a:hover {
	text-decoration:underline;
}
#maincol h2 {
	color: #FFB366;
	margin-bottom: .2em;
	margin-left:10px;
	border-bottom: 2px dotted #D6D6D6;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
}


#pagewidth{ 
 width:800px; 
 text-align:left;  
 margin-left:auto; 
 margin-right:auto;  
} 
 
#siteid{
	position:relative;
	height:120px;
	width:100%;
	background: #fff url(/images/header_bg.jpg) repeat-x top;
} 
 
#leftcol{
 width:175px; 
 float:left; 
 position:relative; 
}

#twocols{
 width:625px; 
 float:right; 
 position:relative;
  }
 
#rightcol{
 width:175px; 
 float:right; 
 position:relative;
 }
 
#maincol{
 background-color: #fff;  
 float: left; 
 display:inline; 
 position: relative; 
 width:100%; 
}
 
#footer{
	text-align:center;
	font-size:75%;
	clear:both;
	padding-top: 30px;
} 

ul.list li {
	list-style:url(/images/bulllet-1.gif) circle outside;
}   

img {
	border: 0px none #000000;
}

/*#nav:before {
	line-height: 0.1;
	font-size: 1px;
	background: transparent url("/images/key-point_tr.gif") no-repeat top right;
	margin: 0;
	height: 9px;
	display: block;
	border-bottom: 1px solid #ddd;
	content: url("/images/key-point_tl.gif");
}*/
/*#nav:after {
	display: block;
	padding-top: 0;
	line-height: 0.1;
	font-size: 1px;
	content:  url("/images/key-point_bl.gif");
	margin: 0 0 0 0;
	height: 8px;
	background: transparent url("/images/key-point_br.gif") scroll no-repeat bottom right ;
	border-top: 1px solid #fff;
}*/

#nav, #nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#nav {
	background: #EFF7F8;
	margin-bottom: 1em;
	margin-top: 10px;
	width:95%;
}	
#nav li {
	display: inline;
	padding: 0;
	margin: 0;
}
#nav li span { /* used for un-linked menu items */
	display: block;
	padding: 3px 5px;
	font-weight: bold;
	color: #991800;
}
/*
#nav li span#configParent, #nav li span #configuration {
	display: inline;
	font-weight: normal;
	padding: 0;
}
*/
#nav li a {
	display: block;
	padding: 4px 5px;
	text-decoration: none;
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #fff;
	border-right: 1px solid #ddd;
}
#nav li a:hover {
	background: #DCEAEB;
}

#nav li li span { /* used for un-linked menu items */
	padding: 2px 4px 2px 10px;
}

#nav li li a {
	padding: 3px 4px 3px 10px;
}


#treat {
	float:right;
	position: absolute;
	width: auto;
	margin: 0;
	padding: 0 20px 0 0;
	top: 39px;
	left: 690px;
}


/* This kind of bordering is hard to remove from images that appear in 
   A without using special markup just for that so not doing this now.
a {
	border-bottom-width:1px;
	border-bottom-style:dotted;
	text-decoration: none;
}
a:hover {
	border-bottom-style:solid;
}
*/

 /* *** Float containers fix:
 http://www.csscreator.com/attributes/containedfloat.php *** */ 
.clearfix:after {
 content: "."; 
 display: block; 
height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  


 
/*printer styles*/ 
@media print{ 

/*hide the right column when printing*/ 
#leftcol,#rightcol{display:none;} 
#twocols, #maincol{width:100%; float:none;}
}

#maincol input {
	background: #F4F9FC;
	margin: 0px;
	padding: 2px;
	border: 1px solid #ADD7E3;
}

#siteid h1 {
	padding:0px;
	margin:0px;
	display:block;
	height:111px;
	width:800px;
	background: url(/images/header_tl.jpg) no-repeat left top;
	font-size: 2em;
	text-transform: capitalize;
	color: #666666;
	letter-spacing: 1em;
	word-spacing: .5em;
}
#siteid h2 {
	padding:0px;
	margin:0px;
	display:block;
	font: italic bold 16px "Trebuchet MS", Arial, sans-serif;
	color: #FF9900;
	z-index: 100;
	width: 80%;
	left: 10%;
	top: 15px;
	position: absolute;
	text-align: center;
}
#siteid h2:after {
 content:"\2122";
}
#siteid h1 a {
  display:block;
  float:right;
  width:161px;
  height:100px;
  background: url(/images/header_tr.jpg) no-repeat right top;
  text-indent:-700em;
  text-decoration:none;
  border:0;
}


#footer ul {
	margin: 0 0 1em 0;
	padding: 0;
}

#footer li {
	display: inline;
	padding: 0 20px 0 0;
	margin: 0;
	white-space: nowrap;
}

#footer p {
	margin: 0.6em 0;
}
p,h1,pre {
	margin:0px 10px 10px 10px;
}

h1 {
	font-size:2em;
	font-style:italic;
	font-weight:normal;
	font-family:Georgia;
	clear:left;
}

h1.section
{
	background: url(/images/dot1.gif) repeat-x bottom;
	padding-bottom: .1em;
	color: #006600;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	font-size: 150%;
  font-style: italic;
}

#feature-content h2 {
	text-transform: uppercase;
	color: #666666;
	letter-spacing: .3em;
	word-spacing: .4em;
	border-bottom: none;
	font: bold 1.7em Arial, Helvetica, sans-serif;
}


.key-point > h1:first-child,
.key-point > h2:first-child,
.key-point > h3:first-child,
.key-point > h4:first-child,
.key-point > h5:first-child,
.key-point > h6:first-child {
	margin-top: 0;
}
.key-point {
	background: #DCEAED;
	padding: 15px;
	margin-bottom: 1em;
	border: 1px solid #BAD6DC;
}
	
.key-point h2, .key-point h3, .key-point h4, .key-point h5 {
	border: none;
	margin-top: 0;
	color: #4C5C5C;
}

#front-feature {
  margin-top:10px;
}
#front-feature h2 {
	display:block;
	height:25px;
}
#front-feature h2>a { float:right;text-indent:-700em; }

/*.front-feature-support { background: transparent url("/images/boxbg3.gif") no-repeat right top; }*/
.front-feature-thinlayer { background: transparent url("/images/boxbg4.gif") no-repeat right top; }

.front-feature-hsn { background: #E4ECEC url("/images/front-feature-hsn.jpg") bottom right no-repeat; }
.front-feature-hsn p { padding-right:130px; }
.front-feature-hsn h2 { background: url("/images/head-hsn.gif") no-repeat left top; }

.project-feature-bpi { background: #E4ECEC url("/images/project-feature-bpi.jpg") bottom right no-repeat; }
.project-feature-bpi p { padding-right:130px; }
.project-feature-bpi h2 { background: url("/images/head-bpi.gif") no-repeat left top; }

.project-feature-bushbaby { background: #E4ECEC url("/images/project-feature-bushbaby.jpg") bottom right no-repeat; }
.project-feature-bushbaby p { padding-right:130px; }
.project-feature-bushbaby h2 { background: url("/images/head-bushbaby.gif") no-repeat left top; }

/*.front-feature-hosting { background: #E4ECEC url("/images/front-feature-hosting.jpg") bottom right no-repeat; }*/
.front-feature-hosting p { padding-right:120px; }
.front-feature-hosting h2 { background: url("/images/head-hosting.gif") no-repeat left top; }

.front-feature-yell { background: #E4ECEC url("/images/front-feature-yell.jpg") bottom right no-repeat; }
.front-feature-yell p { padding-right:130px; }
.front-feature-yell h2 { background: url("/images/head-yell.gif") no-repeat left top; }

/*.front-feature-portfolio { background: #E4ECEC url("/images/front-feature-portfolio.jpg") bottom right no-repeat; }*/
.front-feature-portfolio p { padding-right:130px; }
.front-feature-portfolio h2 { background: url("/images/head-portfolio.gif") no-repeat left top; }

/*.front-feature-design { background: #E4ECEC url("/images/front-feature-design.jpg") bottom right no-repeat; }*/
.front-feature-design p { padding-right:130px; }
.front-feature-design h2 { background: url("/images/head-design.gif") no-repeat left top; }

/*.front-feature-domains { background: #E4ECEC url("/images/front-feature-domains.jpg") bottom right no-repeat; }*/
.front-feature-domains p { padding-right:130px; }
.front-feature-domains h2 { background: url("/images/head-domains.gif") no-repeat left top; }

.productFeature h3 {
	font-size: 98%;
}
.productFeature h3 :link,
.productFeature h3 :visited,
.productFeature h3 :link:active, .product_hsn h3 :visited:active {
	color: #997972;
}

.productFeature h3 :link:hover, .productFeature h3 :visited:hover {
	color: #156B01;
}
	
.productFeature li, .serviceFeature li {
	padding: 0;
	margin: 0;
}
.productFeature ul, .serviceFeature li {
	margin-top: 0;
	margin-bottom: 0;
	padding-bottom: 0;
}
.productFeature .other a:hover { color: #000; }
/*
.productFeature:before {
	line-height: 0.1;
	font-size: 1px;
	margin: -15px -15px 0 -15px;
	height: 15px;
	display: block;
	border: none;
	content: url("/images/product_tl.gif");
}
*/
.productFeature {
	background: #FFCC99 url(/images/product_back.gif) no-repeat right top;
	padding: 15px 45px 15px 15px;
	margin-bottom: 0.5em;
	margin-left:5px;
}
/*
.productFeature:after {
	display: block;
	padding-top: 15px;
	line-height: 0.1;
	font-size: 1px;
	content:  url("/images/product_bl.gif");
	margin: -10px -45px -15px -15px;
	height: 8px;
	background: transparent url("/images/product_br.gif") scroll no-repeat bottom right ;
}
*/
.productFeature p. serviceFeature p {
	margin: 0px;
}

.product_hsn {
	background: #FFCC99 url("/images/product_hsn.gif") top right no-repeat;
}
.product_firefox {
	background: #FFCC99 url("/images/product_firefox.gif") top right no-repeat;
}
.productFeature input {
	border: 1px solid #FF9932;
	background: #FFE5CC;
}

.product_domains {
	background: #FFCC99 url("/images/product_domains.gif") top right no-repeat;
}
.product_protect {
	background: #FFCC99 url("/images/product_protect.gif") top right no-repeat;
}


.serviceFeature {
	padding: 0px;
	margin: 0px;
	list-style: none;
}
.serviceFeature li {
	width:33%;
	float:left;
	height:100pt;
	border-bottom: 1px solid #BAD6DC;
	border-left: 1px solid #DDEBEE;
	border-top: 1px solid #DDEBEE;
	border-right: 1px solid #BAD6DC;
	background: #E4ECEC;
}
.serviceFeature a {
	position:relative;
	bottom:5px;
	padding-left:10px;
}
.serviceFeature h3 {
	font:bold 18pt/22pt Georgia, "Times New Roman", Times, serif;
	padding:0px 0px 0px 10px;
	color: #9DC4CC;
	margin: 0px;
}
/*
.service_hosting {
	background: #BAD6DC url("/images/service_hosting.gif") no-repeat right top;
}
.service_design {
	background: #BAD6DC url("/images/service_design.gif") no-repeat right top;
}
.service_domains {
	background: #BAD6DC url("/images/service_domains.gif") no-repeat right top;
}
.service_hsn {
	background: #BAD6DC url("/images/service_hsn.gif") no-repeat right top;
}
*/
input:hover, input:focus { background: #fff; }


#sitenav ul {
	width:auto;
	position:relative;
	height:25px;
	left:0;
	margin: 0;
	top: -40px;
	padding: 0;
	list-style: none;
	font-size: 10px;
}
#sitenav li {
	display: inline;
	white-space: nowrap;
	float: left;
	margin: 0;
}
#sitenav ul a {
	background: url(/images/body_bg.jpg) repeat-x 0px -90px;
	height:25px;
	float: left;
	display: block;
	font-weight: bold;
	color: #01046B;
	text-decoration: none;
	padding: 5px 20px;
	margin:0;
	font-size: 10px;
	border-top: 1px solid #F6FAFB;
	border-right: 1px solid #B2D8E5;
	border-bottom: 0;
	border-left: 1px solid #F6FAFB;
}

#sitenav ul li:hover a { background-position: 0 -97px; }

body.sectionDomain li#menu_domain a,
body.sectionDesign li#menu_design a,
body.sectionPortfolio li#menu_portfolio a,
body.sectionHosting li#menu_hosting a {
	color: #FF9932;
	background-color:#fff;
	background-position: 0 0;
}
	
body.sectionDomain li#menu_domain:hover a,
body.sectionDesign li#menu_design:hover a,
body.sectionPortfolio li#menu_portfolio:hover a,
body.sectionHosting li#menu_hosting:hover a {
	color: #FF9932;
	background-color:#fff;
	background-position: 0 0;
}	

/* Drop the left menu on the home page */
body.sectionWelcome #leftcol { display:none; }
body.sectionWelcome #twocols {  width:100%; float:left; }
/*body.sectionWelcome #maincol {  width:625px; }*/
body.sectionWelcome #rightcol { float:right; }


#feature-content h2 a { display:none; }
.quot:before {content:no-open-quote;content:"\201C"}
.quot:after {content:no-close-quote;content:"\201D"}


a.external {
	background: url(/images/arrow-extlink.gif) no-repeat left center;
	padding-left: 15px;
	border-bottom: none;
}
a.external:link {
	background-image: url(/images/arrow-extlink.gif);
}
a.external:visited {
	background-image: url(/images/arrow-extlink-2.gif);
}
a.external:hover {
	background-image: url(/images/arrow-extlink-1.gif);
}

/* Neat trick but cant think of a /good/ use yet. 
a.external:visited:after {
	content: " (" attr(title) ") ";
	font-size:80%;
}
*/

/* H2 needs fixing in the main content
#maincol h2 {
	color: #FFB366;
	margin-bottom: .2em;
	margin-left:10px;
	border-bottom: 2px dotted #D6D6D6;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
}
*/
abbr, acronym {
	border-bottom: 1px dotted #CCCCCC;
}

div#portfolio ul{list-style-type: none;margin:0 15px;padding:0px;}
div#portfolio li{float:left;width:45%;margin:10px 10px 10px 10px;background:#D8ECF2;}
div#portfolio li div{display: block;margin:10px;}
div#portfolio h3{font-size:200%;font-weight:normal;font-family: Georgia, "Times New Roman", Times, serif;margin:0px;}
div#portfolio img{display:block;border:0px;float:right;}

p.bullet
    {
    padding:1em 30px;
    background-repeat: no-repeat;
    background-position: 10px center;
	font-family: Georgia, "Times New Roman", Times, serif;
    font-weight:bold;
	font-size:120%;
    }
p.star
    {
    background-image:url(/images/award_star_gold_3.gif);
    }
a.information
    {
    padding:.5em 20px;
    background:url(/images/information.gif) left center no-repeat;
    }
div.projectBox
    {
    margin:2em;
    }
.projectBox h2
    {
    font-size:200%;
    font-family: Georgia, "Times New Roman", Times, serif;
	color: #006600;
	background: url(/images/dot1.gif) repeat-x bottom;
    }
.projectBox h2 a:link,h2 a:visited
    {
	color: #006600;
    }
.newsBox
    {
    float:right;
    width:30%;
    border:1px solid #DCEAEB;
    padding:1em;
    }