body { 
margin:0;
padding:0;
background:transparent url("bg1.gif") no-repeat top left;
color:#000; 
font-family:"Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif; 
font-size:86%; 
}

/* Image replace formatting for heading ---------------------------- */

h1 { 
padding: 51px 0 0 0;
overflow: hidden;
background-image: url("h1.gif"); 
background-repeat: no-repeat;
height: 0px !important; /* for most browsers */
height /**/:51px; /* for IE5.5's bad box model */
border:none;
}

h2 { 
padding:0; 
margin:0; 
font-size:1em; 
font-weight:bold; 
border-bottom: 1px dashed #dbdce2;
}

#examples h2 a:hover {
border-bottom:1px dashed;
}

h3 {
padding:0;
margin:0;
font-size:1em;
font-weight:bold;
border-bottom: 1px dashed #dbdce2;
}

p  { 
padding:0.5em; 
margin: 0; 
font-size: 1em; 
}

p.feed {
border-bottom:1px dashed #dbdce2;
}

a {
color:#174992;
text-decoration:none;
border-bottom:1px solid #174992;
}

a:hover {
color:#c00;
border-bottom:1px solid #c00;
text-decoration:none;
}

a:hover.titleim {
text-decoration:none;
border-bottom:none;
}

span.date {
font-size:0.9em;
color:#c0c0c0;
float:right;
}

table th {
text-align:left;
border-bottom:1px solid;
}

table td.package {
width:250px;
}

.detail {
text-align:justify;
}

.detail img {
float:right;
margin:5px;
padding:5px;
border:1px solid #dbdce2;
overflow:visible;
}

.detail a img {
border:1px solid #dbdce2;
}

.detail a:hover img {
border: 1px solid #c00;
}

.detail a.supanames img {
float:left;
}

.clear { 
clear:both; 
}

.right {
text-align:left;
}

.clear {
clear:both;
}

.wrapper { 
min-width:400px; 
}
/* Allways good to have on full width liquid CSS layouts, 
google "min-width IE" for JS solutions there */

.wrapper {  
margin: 0 -1px; 
}
/* this is a border with marginal compensation to stop scroll bars */



/* Setup (This all looks neater when it isn't put on display!) */

.wrapper {
width: 100%;               /* total width */
background:transparent;
}      

.outer {
border-left-width: 95px;  /* left column width */
border-left-color: transparent;   /* left column colour */
	
border-right-width: 250px; /* right column width */
border-right-color: transparent;  /* right column colour */
	
background-color: transparent; /* center column colour */
}

.left {
width: 95px;              /* left column width */
margin-left: -100px;       /* _negative_ left column width */
}

.right {
width: 250px;              /* right column width */
margin-right: -250px;      /* _negative_ right column width */
}

.wide {
background:transparent;
}



/* Main code */

.wrapper {
background:transparent url("footer_bg.gif") bottom right no-repeat;
}

.outer { 
width:auto; 
border-left-style:solid; 
border-right-style:solid; 
margin-top:23px;
}

.inner { 
margin:0;
width:100%; 
background:transparent;
}

.left { 
float:left; 
position:relative; 
z-index:10; 
}

.right { 
float:left; 
position:relative; 
z-index: 11; 
padding-top:85px;
background:transparent;
}

.center { 
float:left; 
width:100%; 
position:relative; 
z-index:12; 
margin:0;
padding:0;
background:transparent;
}

.detail {
margin:0 20px 20px 0;
padding:0;
background:transparent;
}

.wide { 
width:100%; 
position:relative;
z-index:13; 
}

.footer {
text-align:center;
color:#174992;
background:transparent;
padding:0 85px 20px 0;
text-align:right;
}

.footer a {
text-decoration:none;
color:#174992;
}

.footer a:hover {
color:#969696;
border-bottom:1px solid #969696;
}

#w3c {
float:left;
height:20px;
}

#contactform {
text-align:center;
border:2px solid;
padding:10px;
}


/* Contact form formatting  ---------------------------- */

.response {
height:300px;
}

form {
padding:15px;
width:500px;
border:2px solid #325e9f;
margin:auto;
background:#f0f3f8;
}

form p {
clear:both;
padding:2px 5px;
width:500px;
}

form p label {
float:left;
width:200px;
}

form p label.required {
background-image:url("red_bullet.gif");
background-repeat:no-repeat;
background-position:center right;
}

form p input {
float:left;
}

form p select {
float:left;
}

form textarea {
font-family:"Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif; 
}

.radio {
float:none;
}


/* Sitemap list formatting --------------------------------- */

.sitelist {
list-style-type:none;
}

.sitelist a:hover {
font-weight:bold;
}

/* Mozilla code */
.outer > .inner { border-bottom: 1px solid white; }
.left { margin-right: 1px; }
.right { margin-left: 1px; }
.center { margin: 0 -3px 0 -2px; }



/* navigation ---------------------------------------------*/

#navcontainer {
text-align:center;
width:150px;
margin:auto;
padding-top:5px;
padding-bottom:20px;
}

#navcontainer h3 {
padding: 18px 0 0 0;
overflow: hidden;
background-image: url("h3.gif"); 
background-repeat: no-repeat;
background-position:top center;
height: 0px !important; /* for most browsers */
height /**/:18px; /* for IE5.5's bad box model */
border:none;
}

ul#navlist {
padding:15px 0 0 0;
margin:auto;
}

#navlist li {
list-style-type: none;
padding:20px 0 5px 0;
background:url("list_bg.gif") no-repeat top center;
text-align:center;
margin:auto;
}

#home ul#navlist li a.home,
#examples ul#navlist li a.examples,
#contact ul#navlist li a.contact,
#hosting ul#navlist li a.hosting,
#help ul#navlist li a.help
{
background-image:url("red_bullet.gif");
}

#navlist a {
color:#174992;
text-decoration:none;
background-image:url("blue_bullet.gif");
background-repeat:no-repeat;
background-position:0 7px;
padding:0 0 0 20px;
margin:0;
border:none;
font-weight:bold;
}

#navlist li a:hover {
color: #969696;
border-bottom:1px solid #969696;
background-image:url("grey_bullet.gif");
}

a img {
border:none;
}


/* Popup calendar formatting -------------------------- */


.detail form#calendar_test a {
border:none;
}

.detail form#calendar_test img {
float:none;
border-bottom:0;
}

.detail form#calendar_test a img {
border:none;
padding:0;
margin:0;
text-decoration:none;
}

.detail form#calendar_test div table {
float:none;
}

.detail form#calendar_test input {
float:none;
}