#planner-content {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		width: 800px;
		padding-left: 30px;
		padding-top: 20px;
		font-size: 12px;
		color: #333;
		margin-left: 100px;
	}
	#planner-content h2, .device
		{ color: #a90023;
		font-weight: bold;}
	#planner-content h3 { font-size: 1.5em; }

	#planner-content a, #planner-content a:visited { color: #555; text-decoration: underline;}
	#status a, #status a:visited { color: #A90023; text-decoration: underline; font-size: 11px;}
	#status	a.share, #status a:visited.share
	{ color: blue;  text-decoration: underline; font-size: 12px; }
	#status hr { margin-bottom: 10px;}
	.stat { width: 100px; float:right;
		background-color:#e6e6e6;
		border: 1px solid #e2e2e2;
		text-align:center;
		margin-right: 10px;
		padding: 10px;
		background-image: url(/mockups/statsgradient.png);
		}
	.stat h1 {color: #a90023; margin-bottom: 4px; margin-top: 0px;}
	#planner-title {
		margin:auto;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		color: #a90023;
		letter-spacing: 1.2em;
		font-size: 16px;
		text-align:center;
		width: 820px;
		border-top: solid 2px #888;
		border-bottom: solid 2px #888;
		margin-top: 5px;
		margin-left: 100px;
	}
	#status .planner-title {font-size: 1.6em; color: #3a3a3a; font-weight: bold; }
	#planner-content table {
		border-collapse: collapse;
		width: 780px;
		border-bottom: 1px solid #BBB;
		font-size: 1.5em;
	}
	#planner-content table .pinrow {
		border-left: solid 1px #BBB;
		border-right: solid 1px #BBB;
	}
	#planner-content .devicerow {
		border-bottom: 1px solid #BBB;
		padding-top: 15px;
	}
	#planner-content table th {
		font-weight:normal;
		border-bottom: 1px dashed #BBB;
		font-size: .6em;
		background-color: #EFEFEF;
		padding: 5px 7px 5px 7px;
		text-align:left;
	}
	#planner-content table td {
		padding: 5px 7px 5px 7px;
		font-size: .8em;
		text-align:left;
	}
	.category, .section {
		color: #AAA;
		font-size: 1em;
		font-style: italic;
		border-bottom: solid 1px #BBB;
		margin-bottom: 5px;
		margin-top: 10px;
		width: 60%;
	}
	.device {
		margin-top: 10px;
		margin-bottom: 5px;
	}
	.device a { color: #555; }
	.alt { background-color: #EEE;}
	.section {
		width: 100%;

		border-bottom: solid 1px #AAA;
		font-size:1.4em;
		font-style: normal;
		color: #555;
		margin-top: 20px;
	}

	/* begin css tabs */

ul#tabnav { /* general settings */
text-align: left; /* set to left, right or center */
margin: 1em 0 0 0; /* set margins as desired */
font: bold 11px verdana, arial, sans-serif; /* set font as desired */
border-bottom: 1px solid #6c6; /* set border COLOR as desired */
list-style-type: none;
padding: 3px 10px 3px 10px; /* THIRD number must change with respect to padding-top (X) below */
}

ul#tabnav li { /* do not change */
display: inline;
}

#tabnav .on { /* settings for selected tab */
border-bottom: 1px solid #fff; /* set border color to page background color */
background-color: #fff; /* set background color to match above border color */
}

#tabnav .on a { /* settings for selected tab link */
background-color: #fff; /* set selected tab background color as desired */
color: #000; /* set selected tab link color as desired */
position: relative;
top: 1px;
padding-top: 4px; /* must change with respect to padding (X) above and below */
}

ul#tabnav li a { /* settings for all tab links */
padding: 3px 4px; /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
border: 1px solid #6c6; /* set border COLOR as desired; usually matches border color specified in #tabnav */
background-color: #cfc; /* set unselected tab background color as desired */
color: #666; /* set unselected tab link color as desired */
margin-right: 0px; /* set additional spacing between tabs as desired */
text-decoration: none;
border-bottom: none;
}

ul#tabnav a:hover { /* settings for hover effect */
background: #fff; /* set desired hover color */
}

/* end css tabs */

#planner-content .button {
    padding: 5px 10px;
    display: inline;
    background: #777 url(/mockups/button.png) repeat-x bottom;
    border: none;
    color: #fff;
    cursor: pointer;
    font-weight: bold;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    text-shadow: 1px 1px #666;
    text-decoration:none;
    margin-left: 40px;
    }
 #planner-content a:visited.button { color: #fff;}
#planner-content .button:hover {
    background-position: 0 -48px;
    }
#planner-content .button:active {
    background-position: 0 top;
    position: relative;
    top: 1px;
    padding: 6px 10px 4px;
    }
#planner-content .button.red { background-color: #a90023; }
#planner-content .button.purple { background-color: #9400bf; }
#planner-content .button.green { background-color: #58aa00; }
#planner-content .button.orange { background-color: #ff9c00; }
#planner-content .button.blue { background-color: #2c6da0; }
#planner-content .button.black { background-color: #333; }
#planner-content .button.white { background-color: #fff; color: #000; text-shadow: 1px 1px #fff; }
#planner-content .button.small { font-size: 75%; padding: 3px 7px; }
#planner-content .button.small:hover { background-position: 0 -50px; }
#planner-content .button.small:active { padding: 4px 7px 2px; background-position: 0 top; }
#planner-content .button.large { font-size: 125%; padding: 7px 12px; }
#planner-content .button.large:hover { background-position: 0 -35px; }
#planner-content .button.large:active { padding: 8px 12px 6px; background-position: 0 top; }

.pins .label { width: 300px; float:left; clear:left; margin-top: 3px;}
.pins .texter { width: 50px; font-size: 16px; font-weight:bold; color: #a90023; text-align:center; margin-right: 5px; margin-bottom: 3px;}
.pins .textname { width: 250px; font-size: 12px;color: #333;  margin-right: 5px; margin-bottom: 3px;}
.message { color: #F00; font-weight: bold; border: solid 1px #a90023; font-size: 14px;
-moz-border-radius: 15px;
border-radius: 15px;
padding: 20px;
width: 600px;
background-image: url(/mockups/statsgradient.png);
background-repeat: repeat-x;
margin-top: 20px;}
.wire { font-size: 1.4em; color: #a90023; margin-top: 20px;}

.register {

width: 350px;
margin-left: 20px;
float:right;
padding: 10px;
}
.register label, .login label { width: 120px; float:left; clear:left; display:block; }
.register input, .login input { margin-bottom: 2px;  }
.login {
	border: 1px solid #888;
	width: 350px;
	margin-left: 20px;
	float:right;
	padding: 10px;
	margin-top: 40px;
}
.login input.textbox { width: 250px; }
.login h2 { margin-top: 3px; font-size:1em; }
.systempin {}
#tabnav .currenttab a { font-size: 16px; color: #333; background-color: #FFF; }

#planner-content dd { margin-left: 0px; }

.settings_label { float:left; width: 200px; font-weight: bold; }
.pinnotes { padding-left: 50px; border-bottom: 1px solid #CCC; }
.pinnotes input { width: 600px; margin-bottom: 10px;}
#share { display:none; padding:10px; margin: 5px; border: 1px solid #AAA; width:500px; }
#share a { font-weight:bold; font-size: 1.2em; }
#share h2 { margin-top: 0px; margin-bottom: 5px; color: #888; font-size: 1em; }
#allpins td { vertical-align: top; }

.diagram_pin {  width: 250px;font-size: 11px;position:absolute;}
#updateform { display:none;position:absolute; left: 220px; }

.intro { font-size: 16px; }
.intro ol { margin-bottom: 30px; margin-top: 10px; }
.intro li { margin-bottom: 10px; }
.intro .sublist { list-style-type: lower-alpha; font-size: 14px; }