/* Copyright 2010 by Ray Yates -- pcinet.com */

html,
body {
   margin:0;
   padding:0;
   height:100%;
}

body {
	font-size: small;
	background: url(images_site/bg_shadow.png) repeat-y center top #DAF3FD;
	font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
	line-height: 1.3em;
	color: #000;
}

a {
	color: #006699;
}
a:hover {
	color: #e7881e;
	text-decoration: underline;
}

h1, h2, h3, h4, h5, td, table, div, form { padding: 0; margin: 0; }
p, ul, ol { margin-top: 0; margin-bottom: 12px; }
img { border: 0; }

h1 { color: #006699; font-size: 1.5em;}
h2 a, h2, h4, h5 { font-size: 1em; }
h2 a:hover { color: #1b2853; }
h3 { font: normal .85em Arial, Helvetica, sans-serif; }
h5 { display: inline; }

form { display:inline; }
select {  }

.clear { clear:both;}
.floatleft { float: left; }
.floatright { float: right; }
.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }

.pad10 { padding:10px; }

/* slightly enhanced, universal clearfix hack */
.clearfix:after {  /* Use this on the container div instead of <br class="clear" /> */
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
}
.clearfix { display: inline-block; } /* for IE/Mac See ie.css */
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */



/* Layout */

#pcinet { /* Site Wrapper */
	background: url(images_site/bg_header.jpg) no-repeat scroll left top transparent;
	width: 980px;
	margin: 0 auto;
	min-height:100%;
	position:relative;
	padding: 0 8px;
}

#mainbody,
#mainbody_account {
	background-color:transparent;
	font-size:1em;
	margin:0 auto;
	position:relative;
	width:100%;
	clear: both;
}
#content {
	float:right;
	padding:22px 10px 0;
	width:760px;
}
#content_account {
	padding:10px 10px 0;
}
#content_account h1 {
	margin-bottom: 10px;
}

#global_footer {
	clear: both;
	background:url("images_site/bg_footer.png") repeat-x scroll left bottom #DAF3FD;
	height:150px;
	margin:-150px auto 0;
	width:980px;
	position: relative;
}


/* Global header */

#topbar {
	width: 100%;
	margin: 0 auto;
	position:relative;
}

#logo {
	background:url("images_site/pcinet_logo2.png") no-repeat scroll 0 0 transparent;
	display:block;
	float:left;
	height:129px;
	margin-top:2px;
	width:119px;
	color: #000;
	text-decoration: none;
	cursor: pointer;
}

#logo h1 {
	color:#000000;
	display:block;
	font-size:19px;
	margin-left:137px;
	margin-top:49px;
	width:215px;
}


#logobar {
	padding:0 10px;
}

/* Top NAVBAR */

#logobar #topnav {
	color: #006699;
	float:right;
	margin-top: 10px;
}
#logobar #topnav a {
	color: #006699;
	text-decoration: none;
}
#logobar #topnav a:hover {
	color: #e7881e;
	text-decoration: underline;
}
#search {
	position:absolute;
	top:42px;
	left: 374px;
	width:232px;
	border:1px solid #c4e8f6;
	width:232px;
	padding: 1px;
	background-color: #ffffff;  /* the background          */
	filter:alpha(opacity=70);   /* Internet Explorer       */
	opacity: 0.7;               /* newer Mozilla and CSS-3 */
}

#search #searchbutton{
	float: right;
	background-color: #D8F0FA;
}
#searchtext {
	border-style: none;
	border-width: 0;
	color: #000;
	font-size: 11px;
	width: 200px;
	padding: 3px;
	background-color: transparent;
}
h2#tagline {
	clear:right;
	color:#000000;
	float:right;
	margin-top:17px;
}

/* NAVBAR */

#nav {
	background-color:#FFFFFF;
	clear:right;
	float:left;
	font-weight:bold;
	left:139px;
	padding:4px 8px;
	position:absolute;
	top:74px;
}
#nav a, #nav b {
	color: black;
	display:block;
	float:left;
	font-size:1.2em;
	font-weight:bold;
	padding-left:20px;
	text-decoration:none;
	/*
	filter:alpha(opacity=100);
	opacity: 1;
	*/
}
#nav a:first-child {
	padding-left: 0;
}
#nav a:hover, #nav b:hover {
	color: #e7881e;
	text-decoration: underline;
	cursor: pointer;
}
.over {
	filter:alpha(opacity=80);
	opacity: 0.80;
}
.out {
	filter:alpha(opacity=50);
	opacity: 0.5;
}

/* SFNT */
 /* Carousel Wrapper */

#featured {
	height: 240px;
	background: url("images_site/bg_featured.jpg") no-repeat scroll left top transparent;
}
#fshadow {
	clear: left;
	height: 5px;
	width: 100%;
	background: url(images_site/bg_shadow_bot.png) repeat-x scroll left top #eee;
}
#featured #fleft,
#featured #fmid,
#featured #fright {
	height: 240px;
	float: left;
}
#featured #fleft {
		width: 422px;
}
#featured #fmid {
	color: #fff;
	width: 270px;
	padding-left: 10px;
	font-size: 19px;
	line-height: 22px;
}
#featured #fmid h2 {
	font-size: 28px;
	margin: 58px 0 14px;
}
#featured #fright {
	width: 278px;
}

#featured #frighttop,
#featured #frightbot {
	padding: 10px;
	margin: 10px 10px 10px 0;
	padding: 28px 10px 42px;
}
#featured #fright img {
	float: right;
}
#featured #fright a {
	color: #000;
	text-decoration: none;
}
#featured #fright a:hover {
	color: #666;
	text-decoration: underline;
}

 /* SFNT Image Carousel */
.carousel {
    margin-top: 8px;
}
.carousel img {
    border-right: 3px solid transparent;
    border-left: 3px solid transparent;
}
#fleft button {
    background:url("images_site/btn_carousel.png") repeat scroll 0 0 transparent;
    border-style:none;
    display:block;
    float:left;
    height:49px;
    width:21px;
    font-size: 0;
    padding: 0;
    margin: 95px 6px;
}
#fleft button.prev {
    background-position: left -49px;
}
#fleft .shadow {
    float: left;
    width: 356px;
    height: 220px;
	margin: 10px 0;
}
.carousel li img {
margin:0 10px;
}

#consoleGray {
	width: 100%;
}

#consoleGray .topL,
#consoleGray .topR,
#consoleGray .botL,
#consoleGray .botR {
	float: left;
	width: 50%;
	height: 8px;
}
#consoleGray .topL {
	background: url(images_site/bg_grey.png) no-repeat scroll left top #fff;
}
#consoleGray .topR{
	background: url(images_site/bg_grey.png) no-repeat scroll right top #fff;
}
#consoleGray .botL {
	background: url(images_site/bg_grey.png) no-repeat scroll left bottom #fff;
}
#consoleGray .botR {
	background: url(images_site/bg_grey.png) no-repeat scroll right bottom #fff;
}
#consoleGray .mid {
	clear: left;
	background-color: #f0f0f0;
	min-height: 200px;
	padding: 0 8px;
}


/* NAVBAR */



/* CTGY */

.breadcrumbs {
	padding: 4px;
	background-color: #fff;
	border-top: 1px solid #D2E2EC;
	border-bottom: 1px solid #D2E2EC;
	margin-bottom: 8px;
}
.breadcrumbs a { text-decoration:none; }

#nextbutton {
	clear:both;
	float:right;
	margin-top: 20px;
	}

#prevbutton {
	position: relative;
	top: 25px;
	clear:left;
    float:left;
	}

.catrow {
	clear:both;
    width:600px;
    }

.prodbutton {
	margin-top: 4px;
	}

.prodbutton form {
	display:block;
	}

.prodcolumn {
    float:left;
	width:290px;
	padding-right: 10px;
	text-align:center;
	color:#000;
	}

.prodcolumn h2 { margin: 3px auto; }

.thumb {
	margin: 20px auto 0 auto;
}


/* ACCOUNT PAGES */
#table_2cols td {
	padding:10px 0 10px 58px;
}
#table_2cols td.first {
	border-right:2px solid #fff;
}
#table_2cols * h2 {
	background-color:#587992;
	color:#FFFFFF;
	display:block;
	margin:0 0 5px;
	padding:5px 5px 5px 10px;
}
#table_2cols form {
	line-height: 2.0em;
}

.account_column {
	width: 50%;
	float:left;
	}

.account_column h5 { width: 180px; clear: both; }
.account_column input { margin-bottom: 3px; display:block; margin-left: 180px; }
.account_column select { margin-bottom: 3px; display:block; margin-left: 180px; }

.paymentdetail {
	width: 130px;
	display:block;
	height: 26px;
	float:left;
	}

.invalid {
	color: #FF0000;
	}

.pad {
    margin-top: 25px;
	}


/* BASKET */

#basket-contents.non-editable,
#basket-contents.editable{
	width:100%;
	border-left:1px solid #ffffff;
	border-top:1px solid #ffffff;
}
#basket-contents.non-editable table,
#basket-contents.editable table{
	border-collapse:collapse;
	width: 100%;
}
#basket-contents.non-editable td,
#basket-contents.editable td{
	background-color:#f0f0f0;
	border-bottom:1px solid #ffffff;
	border-right:1px solid #ffffff;
	vertical-align:top;
	padding: 4px;

}
#basket-contents table #basket-heading td{
	background-color:#587992;
	color:#fff;
	font-weight:bold;
	text-align:center;
	font-size:1em;
	white-space:nowrap;
}
#basket-contents .basket-qty-input{ width:34px; }
#basket-contents .item-remove{
	width:8%;
	vertical-align:middle;
}
#basket-contents.editable .item-quantity{
	width:13%;
	text-align:center;
	white-space:nowrap;
}
#basket-contents.non-editable .item-quantity{
	width:6%;
	text-align:center;
}
#basket-contents .item-options .item-description{ padding-left:16px; }
#basket-contents.non-editable .item-description{ width:59%; }
#basket-contents.editable .item-description	{ width:66%; }
#basket-contents table #basket-heading td.item-description{ text-align:left; }
#basket-contents .item-price{
	width:10%;
	text-align:right;
}
#basket-contents .item-total{
	width:10%;
	text-align:right;
}

#basket-contents .basket-charges .charge-description{
	font-style:italic;
	text-align:right;
}
#basket-contents .basket-charges .formatted-charge{
	font-style:italic;
	text-align:right;
}
#basket-contents #basket-totals td {
	background-color: #fff;
	border-top: 2px solid #587992;
}
#basket-contents #basket-totals .total-prompt{
	font-weight:bold;
	text-align:right;
	font-size: 1.2em;
}
#basket-contents #basket-totals .formatted-total{
	font-weight:bold;
	text-align:right;
	font-size: 1.2em;
}
#basket-contents .item-options td{}
.checkout .item-quantity		{ width:8% !important; }
.checkout .item-description		{ width:64% !important; }
#fields-key{ margin:16px 0; }
.checkout-button{
	margin:12px 0;
	text-align:right;
}
.baskettext_right {
	text-align:right;
}
.total {
	font-size:1.1em;
	font-weight:bold;
	text-align:right;
	border-top:2px solid #587992;
}

/* PRODUCT PAGES */

h1#prodname {
	display:block;
	line-height:1.2em;
}

#prodadd {
	display:inline;
	margin-left: 5px;
	position:relative;
	top: 6px;
	}

.prodimage {
	margin: 0 20px 5px 0;
	float:left;
	border: 1px solid #1b2853;
	}


/* PRODUCT LIST */

.alt_row_color {
	background: #fff;
	}

.listheader {
	background-color: #587992;
	color: #fff;
    height:20px;
    padding: 4px 5px;
	}
.listheader h4 {
	margin-top: 2px;
}

.productlist_row {
	padding: 4px 6px;
	float:right;
	width: 98%;
	}

.productlist_row form { display:inline; float:right; margin-left: 3px; }

.productrow_text{
	width: 565px;
	padding-top: 2px;
	float:left;
	}

.productrow_text .floatleft {
	max-width: 480px;
	width: 480px;
	overflow: hidden;
}


/* CATTREE */
#subnav {
	float: left;
	width: 200px;
	overflow: visible;
	margin-top: 14px;
}

#category-tree,
#category-tree-header,
#category-tree-footer {
	padding: 0 4px;
}
#category-tree { }
#category-tree-header {  }
#category-tree-footer{ }

#category-tree a {
	display:block;
	padding:4px 6px;
	text-decoration:none;
	color:#3a6b9d;
	background-color:#ffffff;
	font-weight:bold;
	font-size: 1em;
	border-bottom:1px solid #d2e2ec;
}
#category-tree .spacer1 {
	width: 0px;
	float: left;
}
#category-tree .spacer2 {
	width: 10px;
	float: left;
}
#category-tree .spacer3 {
	width: 20px;
	float: left;
}
#category-tree .spacer4 {
	width: 30px;
	float: left;
}

#category-tree .subcategory-link a{
	padding:4px;
	font-weight:normal;
	color:#333333;
}
#category-tree a:hover {
	background-color:#f0f0f0;
	color: #e7881e;
}
#category-tree a.active {
	background-color: #f0f0f0;
}

/* One image file, many buttons */
.submit60, .submit80, .submit100, .submit120, .submit140, .submit160, .submit180, .submit200 {
	height: 24px;
	color: #000000;
	border: none;
	font: bold 11px Arial, Helvetica, sans-serif;
	text-align: center;
	cursor: pointer;
	padding: 0 0 2px 0;
	margin: 0;
}
.submit60 {
	width: 60px;
	background: url('images_site/buttons.gif') left 0 no-repeat;
}
.submit80 {
	width: 80px;
	background: url('images_site/buttons.gif') left -24px no-repeat;
}
.submit100 {
	width: 100px;
	background: url('images_site/buttons.gif') left -48px no-repeat;
}
.submit120 {
	width: 120px;
	background: url('images_site/buttons.gif') left -72px no-repeat;
}
.submit140 {
	width: 140px;
	background: url('images_site/buttons.gif') left -96px no-repeat;
}
.submit160 {
	width: 160px;
	background: url('images_site/buttons.gif') left -120px no-repeat;
}
.submit180 {
	width: 180px;
	background: url('images_site/buttons.gif') left -144px no-repeat;
}
.submit200 {
	width: 200px;
	background: url('images_site/buttons.gif') left -168px no-repeat;
}

#category-tree a {
background-color:#FFFFFF;
border-bottom:1px solid #D2E2EC;
color:#3A6B9D;
display:block;
font-size:1em;
font-weight:bold;
padding:4px 6px;
text-decoration:none;
}

/* Toolbelt documentation styles */
#categories {
	padding:0 5px;
	margin: 16px 0 0 0;
	color: #3A6B9D;
	font-weight: normal;
}

#categories ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

#categories ul li {
	font-size:1em;
	font-weight:bold;
	padding: 0px 3px;
	cursor: pointer;
}

#categories ul li ul {
	padding:0 0 0 12px;
}
#categories li.topcat span{
	display: block;
	font-style:italic;
	margin-top: 12px;
}

.toolbelt table {
	border-collapse:collapse;
	border: 1px solid #444444;
}
.toolbelt th {
	background-color: #587992;
	color: #ffffff;
	padding: 3px;
}
.toolbelt td {
	padding: 2px;
}

.toolbelt h2 {
	line-height:1.2em;
	color:#006699;
	font-size:1.3em;
	font-style:italic;
}
.toolbelt h3 {
	color: #006699;
	font: bold 15px Arial, Helvetica, sans-serif;
}
.toolbelt pre {
	background-color:#ffffff;
	border:1px inset #666666;
	display:block;
	font-size:11px;
	margin:6px 12px;
	overflow:auto;
	padding:5px;
	font-family: Consolas,"Andale Mono",Monaco,"Courier New",Courier,monospace;
}
#toolbelt_content2 {
	background-color: #F0F0F0;
	margin-left:-208px;
}
.toolbelt .totop {
	float:right;
	font-size:13px;
	font-weight: normal;
	font-style:normal;
}

.tb_index {
	float: right;
	font-weight: normal;
	margin-left: 16px;
	margin-top: -1px;
	font-size: 13px;

}
#tbtoc {
	width: 790px;
	height: 545px;
	position: relative;
	color:#3A6B9D;
	font-weight:normal;
	font-size: 13px;
	margin: 0;
	padding:0;
	line-height: 19px;
}
#tbtoc * span {
	font-weight: bold;
	font-style:italic;
}
#tbtoc ul {
	list-style-type:none;
	margin:0;
	padding:0 1px 0 0;
}

#tbtoc ul li {
	font-size:1em;
	padding: 0px;
	cursor: pointer;
}

#tbtoc ul li ul {
	padding:0 0 0 8px;
	list-style-type:none;
}
#tbtoc li.topcat span{
	display: block;
}

#tbtoc .group {
	width: 130px;
	height: auto;
	float: left;
}

.func td, .varlist td {
	padding: 2px;
	background-color: #ffffff;
	font-family: Consolas,"Andale Mono",Monaco,"Courier New",Courier,monospace;
}

/* contact form */
.email_error {
	color: #990000;
	font-weight: bold;
}
.email_message{
	color: #006699;
	font-weight: bold;
}

.contactus {
	margin: 0 auto;
	width: 510px;
	background-color: #f8f8f8;
	padding: 16px 32px;
	line-height: 24px;
}
.contactus br {
	clear: both;
}
.contactus label {
	display: block;
	float: left;
	font-weight: bold;
	width: 180px;
	text-align: right;
	margin-right: 16px;
}
.contactus label.optional {
	font-weight: normal;
	font-style: italic;
}
.contactus label.left {
	text-align: left;
}