/* set defaults */
body {
	font-family: verdana, trebuchet, arial, helvetica, sans-serif;
	font-size: 62.5%;
	margin: 0;
	padding: 0;
	text-align: center;
	background: #fff url(../images/bgs/body-bg.gif) left top no-repeat;
	min-width:720px;
}

* { 
	font-size: 1em; 
	line-height: 1.5em;
}
div, form{
	margin:0;
	padding:0;
	border:0;
}

p, ul, ol, dl { 
	margin: 0 0 0.8em 0;  
} 
h1, h2, h3, h4, h5, h6{
	margin: 0 0 .1em 0;
}	
h1{
	font-size: 1.6em;
}
h2{
	font-size: 1.5em;
}
h3 {
	font-size: 1.4em;
}
h4 {
	font-size: 1.3em;
}
h5 {
	font-size: 1.2em;
}
h6 {
	font-size: 1.1em;
}
p{
	font-size: 1.1em;
}

ul, ol, dl, li, dt, dd {
	list-style: none;
	padding:0;
}

li, dt, dd {
	margin:0;
	font-size: 1.1em;
}

a {
	color:#1A9BA7;
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}

img, a img {
	border: none;
}		

input{
	margin:0;
	padding:0;
}
a.skiplink {
	font-size: 8px;
	font-weight:normal;
	color: #FFFFFF;
	text-decoration: none;
}
.skiplink:active, .skiplink:focus {
	color: #0000FF;
	text-decoration: underline;
}

/* boxes */
#wrapper{
	border-top:25px solid #1A9BA7;
}
#header{
	position:relative;
	width:710px;
	margin: 0px auto;
	padding-top:4px;
}
#content {
	height:auto !important;
	height:400px; 
	min-height:400px;
	width:710px;
	margin: 0px auto;
	padding:10px 0;
	text-align: left;
}

#footer{
	width:100%;
	padding-top:10px;
	min-height:25px;
	height: auto !important;
	height:25px;
	background: #1A9BA7;
	color:#fff;
	clear:both;
}
#userpanel{
}



/* header stuff */
#header h1{
	margin-top:40px;
	text-align: left;
	background: url(../images/headings/pixelbox-networks-logo.gif) left top no-repeat;
}
#header .homelink{
	height:25px;
}
#header h1 span{
	position:absolute;
	left:-10000px;
	text-indent: -20000px;
}


/* menu stuff */
#menu {
	position:absolute;
	top:30px;
	left:0;
	width:100%;
	margin:0;
	height:30px;
	background: url(../images/bgs/menu-bg.gif) left top repeat-x;
}
#menu ul{
	position:relative;
	top:0;
	height:25px;
	width:710px;
	padding:0 0px;
	margin: 0px auto;
	text-align:center;
}
#menu li {
	display:inline;
	display:block;
	float:left;
	position:relative;
	padding:3px 0 5px 0;
	height:17px;
	line-height:17px;
	text-transform:uppercase;
	border-left:4px solid #fff;
}
#menu li a{
	height:25px;
	font-size:12px;
	padding:0px 12px;
	text-decoration:none;
	color:#fff;
}
#menu li.aboutNav{
	background:#BC0D11;
}
#menu li.packagesNav{
	background:#D11A64;
}
#menu li.helpNav{
	background:#F4551D;
}
#menu li.accountNav{
	background:#BC0D11;
}
#menu li.contactNav{
	background:#904E0F;
}
#menu li.homeNav{
	background:#453897;
	border-right:4px solid #fff;
}

#login{
	display:none;
}
.index #login, .account #login {
	display:block;
}

#login{
	position:relative;
	width:710px;
	text-align:left;
	margin:0 auto;
}
#login h3{
	color:#1A9BA7;
	padding:40px 0 0 10px;
	font-weight:normal;
	text-transform:uppercase;
	width:250px;
	float:right;
}
#login form{
	clear:both;
	background:#1A9BA7;
	padding:5px 10px;
	color:#fff;
	width:240px;
	float:right;

}
#login form label{
	float:left;
	width: 80px;
	clear:right;
}
#login form input#username,
#login form input#password{
	width: 153px;
	padding:1px;
	border:1px solid #fff;
	margin:1px 0;
}
#login form a.forgotpass{
	padding-left:82px;
	color:#fff;
	text-decoration:none;
}
#login form a.forgotpass:hover{
	text-decoration:underline;
}
#login form .submitbutton{
	float:right;
	padding:1px 2px;
}


/* footer stuff */
#footer a{
	color:#fff;
}


/* userpanel stuff */
#userpanel .greeting{
	margin-bottom:0;
}
#userpanel ul{
	font-size:1em;
	padding-bottom:1em;
}
#userpanel li{
	display:inline;
}





/* content styles */
.feature li{
	padding: 0 12px;
}





/* index page styles */
.index #header{
	height:210px;
}
.index #header h1{
	float:left;
	display:inline;
	width:445px;
	margin-top:90px;
	background: url(../images/headings/pixelbox-networks-logo-index.gif) left top no-repeat;
}
.index #header .homelink{
	display:block;
	height:70px;
	width:360px;
}
.index #content{
	width:100% !important;
	margin: 0px auto;
	padding:0;
	text-align: center;
	background:  url(../images/bgs/index-content-bg.gif) center top repeat-x;
}
.index .feature{
	width:100%;
	min-width:700px;
	background: url(../images/bgs/index-feature-bg.jpg) center top no-repeat;
	padding-top:50px;
	color: #195797;
}
.index .feature .intro{
	width:270px;
	padding:0 0px 0 440px;
	margin: 0px auto;
	text-align: left;
	height:171px;
}
.index .feature .address{
	width:710px;
	padding:10px 0px;
	margin: 0px auto;
	text-align: left;
	font-size:.9em;
}
.index .address span {
	color:#1A9BA7;
	padding-right:6px;
}


/*  about page styles */
.about .feature .blue,
.about .feature .red{
	float:right;
}
.about .address h3{
	font-size: 1.2em;
	font-weight:normal;
}



/* package page styles */
.packages .feature{
	background: url(../images/bgs/packages-feat-bg.gif) left top repeat-y;
}
.packages .feature .mega,
.packages .feature .tera,
.packages .feature .extra{
	float:right;
}
.packages .feature .hello{
	border-bottom:0;
}
.packages .feature .blue{
	border-bottom:0;
}
.packages .twoColumn .item li{
	padding:0;
	background: url(none);
}
.packages .feature .domains{
	width:702px;
	background:  #F4EDE7 url(../images/bgs/brown-702x36-h-bg.gif) left top no-repeat;
	border-bottom:0;
	border-top:8px solid #fff;
}
.packages .feature .domains h3{
	background: url(none) 15px 5px no-repeat;
}
.packages .feature .domains h4{
	background: url(../images/icons/brown-arrow.gif) 15px 5px no-repeat;
	font-weight:normal;
}

.packages .feature .item .price{
	float:right;
	margin:0 -17px 5px 10px;
}
.packages .feature .item .enquire a{
	text-transform:uppercase;
	text-decoration:none;
}


/* help page styles */
.help #content {
	padding-top:0;
}
.help .subitem {
	float:left;
}
.help .feature {
	width:500px;
	float:right;
}
.help .searchbox{
	float:right;
	width: 330px;
	height:32px;
	text-align:right;
	background: #D11A64 url(../images/bgs/help-searchbox-bg.gif) left top no-repeat;
	margin:0 0 5px 0;
}
.help .searchbox label,
.help .searchbox input
{
	float:left;
}
.help .searchbox label{
	font-size:1.8em;
	color:#fff;
	padding:0px 15px;
	margin-top:2px;
}
.help .searchbox #search{
	background:#E376A2;
	border:0;
	padding:4px 2px 0 2px;
	margin-top:5px;
	height:18px;
}
.help .searchbox .submitbutton{
	float:right;
	height:32px;
}


.help dl {
margin:0 0 0 20px;
padding:0 !important;

}

.help dl dt {
font-weight:bold;
margin:0;
padding:0;
}

.help dl dd {
font-weight:normal;
margin:0 0 0 2em;
padding:0;
}



/* Help main category / feature styles */
.category{ /* red - default color */
	clear:both;
	background-color: #F8E6E7;
	padding-bottom:5px;
	margin-bottom:5px;
}
.category a{ /* red */
	color:#BC0D11;
}
.category h1{ /* red */
	background:#BC0D11 url(../images/bgs/red-500x32-h-bg.gif) left top no-repeat;
	color:#fff;
	height:26px;
	font-size:1.8em;
	padding: 3px 12px;
}
.category .description{ /* red */
	background: url(../images/icons/red-arrow.gif) left center no-repeat;
	padding: 2px 10px 2px 12px;
	margin-left:15px;
	margin-top:5px;
}
.category ol{ 
	list-style: decimal inside;
	padding: 0px 15px;
}
.category ol li{ 
	list-style: decimal inside;
	padding: 0px 12px;
}
.category ol li a{ 
	font-weight:bold;
}
.category .knowledgeitem {
}


.category .knowledgeitem ul li {
margin-bottom:1em;
}




.category .knowledgeitem h3 {  /* red */
    padding: 5px 15px;
	font-family: arial, helvetica, sans-serif;
	margin-bottom:5px;
}
.category .knowledgeitem h3 .num{
	width:10px;
	margin-right:10px;
	height:30px;
	font-size:1.3em;
	vertical-align:middle;
}
.category .knowledgeitem p {
    padding:  0 15px 0px 37px;
}
.category .knowledgeitem ul{
    padding:  0 15px 0px 37px;
}
.category ol li{ 
	background: url(none) left center no-repeat;
}
.category .knowledgeitem li{ /* red */
    padding:  0 12px;
}

/*Category colour variations*/
/* red */
.help .color2 h1{ 
	background:#D11A64 url(../images/bgs/pink-500x32-h-bg.gif) left top no-repeat;
}
.help .color2 .description{ 
	background: url(../images/icons/pink-arrow.gif) left center no-repeat;
}

/* orange */
.help .color3 h1{ 
	background:#F4551D url(../images/bgs/orange-500x32-h-bg.gif) left top no-repeat;
}
.help .color3 .description{ 
	background: url(../images/icons/orange-arrow.gif) left center no-repeat;
}

/* tan */
.help .color4 h1{ 
	background:#CE7D10 url(../images/bgs/tan-500x32-h-bg.gif) left top no-repeat;
}
.help .color4 .description{ 
	background: url(../images/icons/tan-arrow.gif) left center no-repeat;
}

/* brown */
.help .color5 h1{ 
	background:#904E0F url(../images/bgs/brown-500x32-h-bg.gif) left top no-repeat;
}
.help .color5 .description{ 
	background: url(../images/icons/brown-arrow.gif) left center no-repeat;
}

/* navy */
.help .color6 h1{ 
	background:#105194 url(../images/bgs/navy-500x32-h-bg.gif) left top no-repeat;
}
.help .color6 .description{ 
	background: url(../images/icons/navy-arrow.gif) left center no-repeat;
}

/* blue */
.help .color7 h1{ 
	background:#1A9BA7 url(../images/bgs/blue-500x32-h-bg.gif) left top no-repeat;
}
.help .color7 .description{ 
	background: url(../images/icons/blue-arrow.gif) left center no-repeat;
}


/* Help - subitem styles */
.help .subitem {
	width:180px;
	padding-top:17px;
}
.help .subitem ul a{
	color:#fff;
	font-size:1.1em;
	font-weight:bold;
	text-decoration:none;
}
.help .subitem li{
	padding:3px 15px;
	margin:1px 0;
	height:20px;
}
.help .subitem li.list1{ /* red */
	background:#BC0D11;
}
.help .subitem li.list2{ /* pink */
	background:#D11A64;
}
.help .subitem li.list3{ /* orange */
	background:#F4551D;
}
.help .subitem li.list4{ /* tan */
	background:#CE7D10;
}
.help .subitem li.list5{ /* brown */
	background:#904E0F;
}
.help .subitem li.list6{ /* navy */
	background:#105194;
}
.help .subitem li.list7{ /* blue */
	background:#1A9BA7;
}





/* Universal "item" colour styles - set numerically to match database output */
.red, .color1 { /* red  */
	background-color: #F8E6E7;
}
.red a, .color1 a{
	color:#BC0D11;
}
.red h1, .color1 h1{ 
	background-color:#BC0D11;
	color:#fff;
}
.red h3, .color1 h3{ 
	background:#E6A4A6;
}
.red .li, .color1 .li{ 
	background: url(../images/icons/red-arrow-light.gif) left 2px no-repeat;
}
.red .arrow, .color1 .arrow{
	background: url(../images/icons/red-arrow.gif) 15px 5px no-repeat;
}


.pink, .color2{ /* pink */
	background:#FAE8EF;
}
.pink a, .color2 a{
	color:#D11A64;
}
.pink h1, .color2 h1{ 
	background-color:#D11A64 ;
}
.pink h3,.color2 h3 {
	background:#EEAAC5;
}
.pink li, .color2 li { 
	background: url(../images/icons/pink-arrow-light.gif) left 2px no-repeat;
}
.pink .arrow, .color2 .arrow{
	background: url(../images/icons/pink-arrow.gif) 15px 5px no-repeat;
}


.orange,.color3 { /* orange */
	background:#FEEEE8;
}
.orange a, .color3 a{
	color:#F4551D;
}
.orange h1,.color3 h1{ 
	background-color:#F4551D ;
}
.orange h3, .color3 h3{
	background:#FBC0AB;
}
.orange li, .color3 li { 
	background: url(../images/icons/orange-arrow-light.gif) left 2px no-repeat;
}
.orange .arrow, color3 .arrow{
	background: url(../images/icons/orange-arrow.gif) 15px 5px no-repeat;
}


.tan, .color4{ /* tan */
	background:#FAF2E7;
}
.tan a, .color4 a{
	color:#CE7D10;
}
.tan h1, .color4 h1{ 
	background-color:#CE7D10;
}
.tan h3, .color4 h3{
	background:#EDCFA6;
}
.tan li, .color4 li{ 
	background: url(../images/icons/tan-arrow-light.gif) left 2px no-repeat;
}
.tan .arrow, color4 .arrow{
	background: url(../images/icons/tan-arrow.gif) 15px 5px no-repeat;
}

.brown, .color5{ /* brown */
	background:#F4EDE7;
}
.brown a, .color5 a{
	color:#904E0F;
}
.brown h1, .color5 h1{ 
	background-color:#904E0F;
}
.brown h3, .color5 h3 {
	background:#D6BDA6;
}
.brown li, .color5 li{ 
	background: url(../images/icons/brown-arrow-light.gif) left 2px no-repeat;
}
.brown .arrow, color5 .arrow{
	background: url(../images/icons/navy-arrow.gif) 15px 5px no-repeat;
}


.navy,.color6{ /* navy */
	background:#ECEBF4;
}
.navy a, .color6 a{
	color:#105194;
}
.navy h1, .color6 h1{ 
	background-color:#105194 ;
}
.navy h3, .color6 h3 {
	background:#A6BED7;
}
.navy li, .color6 li{ 
	background: url(../images/icons/navy-arrow-light.gif) left 2px no-repeat;
}
.navy .arrow, .color6 .arrow{
	background: url(../images/icons/navy-arrow.gif) 15px 5px no-repeat;
}


.blue, .color7{ /* blue */
	background:#E8F5F6;
}
.blue a, .color7 a{
	color:#1A9BA7;
}
.blue h1, .color7 h1{ 
	background-color:#1A9BA7;
}
.blue h1, .color7 h3 {
	background:#AADADE;
}
.blue li, .color7 li{ 
	background: url(../images/icons/blue-arrow-light.gif) left 2px no-repeat;
}
.blue .arrow, .color7 .arrow{
	background: url(../images/icons/blue-arrow.gif) 15px 5px no-repeat;
}



/* twoColumn (two equal column width) page styles */
.twoColumn {
	float:left;
	padding:0 4px;
	margin-bottom:10px;
}
.twoColumn .item{
	width:348px;
	float:left;
	padding-bottom:10px;
	border-bottom:8px solid #fff;
}
.twoColumn .tan h2{
	background: #FAF2E7 url(../images/bgs/tan-348x36-h-bg.gif) left top no-repeat;
}
.twoColumn .orange h2{
	background: #FEEEE8 url(../images/bgs/orange-348x36-h-bg.gif) left top no-repeat;
}
.twoColumn .red h2{
	background: #F8E6E7 url(../images/bgs/red-348x36-h-bg.gif) left top no-repeat;
}
.twoColumn .navy h2{
	background: #ECEBF4 url(../images/bgs/navy-348x36-h-bg.gif) left top no-repeat;
}
.twoColumn .blue h2{
	background:  url(../images/bgs/blue-348x36-h-bg.gif) left top no-repeat;
}
.twoColumn .pink h2{
	background:  url(../images/bgs/pink-348x36-h-bg.gif) left top no-repeat;
}
.twoColumn .brown{
	background:  #F4EDE7 url(../images/bgs/brown-348x36-h-bg.gif) left top no-repeat;
}
.twoColumn .item h2{
	padding:7px 0 10px 15px;
	color:#fff;
	text-transform:uppercase;
}
.twoColumn .item h3,
.twoColumn .item h4,
.twoColumn .item h5,
.twoColumn .item p,
.twoColumn .item ul
{
	padding: 0 25px;
}





/* IMPORTANT! sIFR import styles for screen & print media */

@media screen {
/* These are standard sIFR styles... do not modify */

	.sIFR-flash {
		visibility: visible !important;
		margin: 0;
	}
	
	.sIFR-replaced {
		visibility: visible !important;
	}
	
	span.sIFR-alternate {
		position: absolute;
		left: 0;
		top: 0;
		width: 0;
		height: 0;
		display: block;
		overflow: hidden;
	}


/* These "decoy" styles are used to hide the browser text before it is replaced... add and alter as necessary for individual site */
/* Letter spacing can be used to make the browser text metrics match up with the sIFR text metrics... settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

	.sIFR-hasFlash #topMenu li{
	}
}

@media print {
/* This is the print stylesheet to hide the Flash headlines from the browser... regular browser text headlines will now print as normal */

	.sIFR-flash, .sIFR-flash object, .sIFR-flash embed {
		display: none !important;
		height: 0;
		width: 0;
		position: absolute;
		overflow: hidden;
	}
	
	span.sIFR-alternate {
		visibility: visible !important;
		display: block !important;
		position: static !important;
		left: auto !important;
		top: auto !important;
	}

}






/* dreamgirl CMS styles*/
.buttonContainer
{
		display: inline;
}

#dgInlineFeedback {
        width: 259px;
        height: 242px;
        color: #000;
        background: url(../dreamgirl/images/success.png) !important;
        background: url(../dreamgirl/images/success.gif);
        }


.dgInlineForm {
        width: 400px;
        border: 0px;
        margin: 0px;
        position: absolute;
        margin-left: -200px;
        z-index: 100;
        margin-top: 12px;
        visibility: visible;
        overflow: hidden;
        
}

iframe {
		position:absolute;
        width: 400px;
        border: 0px;
        padding: 0px;
        margin: 0px;
}

.dgInlineButton {
        border: 0px;
        background-color: transparent;
}

.dgInlineButtonActivated {
        background-color: #ccc;
        margin-right: 3px;
}

.dgActiveElement {
		border: 1px dashed #eebddc;
}

.dgInactiveElement {
        background-color: transparent;
}

.dgButtonLink {
        border: 0px;
        margin-right: 3px;
}



.row {
	padding-top: 5px;
	padding-bottom: 5px;
	clear:both;
}

.row label {
	position:relative;
	display:inline;
	float:left;
	width: 160px;
	padding-right:6px;
	font-weight: bold;
	text-align: right;
}
.row input, .row textarea {
	width:260px;
	text-align: left;
}
.textareacontrols{
	display:block;
	text-align:right;
	padding:2px 13px 0 0;
}
ul.row input{
	margin-left:56px;
	width:auto;
	float:left;
}
ul.row label{
	width:auto;
	clear:right;
}

.inputError {
        margin-left: 5px;
        color: red;
}
/* specific edit form div etc styling/adjustments */

.date label {
}
.row .inputgroup input{
	width:175px;
	margin:0;
}
label.filedescription{
	clear:left;
	font-weight:normal;
}