body {
	margin: 5px;
	background-color: #E5E5E5;
	color: #000;
	font: 12px "Verdana", Arial, Helvetica, sans-serif;
}
p, li {
	font: 12px "Verdana", Arial, Helvetica, sans-serif;
}
form {
	margin: 0;
	padding: 0;
}
cite { text-decoration: none; }
small {
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 0.9em;
	line-height: 1.5em;
}
small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike {
	color: #777;
}
blockquote cite {
	margin: 5px 0 0;
	display: block;
}
.commentlist cite, .commentlist cite a {
	font-weight: bold;
	font-style: normal;
	font-size: 1.1em;
}
.nocomments {
	text-align: center;
	margin: 0;
	padding: 0;
}
.post {
	margin: 0 0 40px;
	text-align: justify;
}
input, select, textarea {
	font: 11px "Verdana", Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
}
/****** Yellow Button *******/
#supportbuttons {
	float: right;
	width: 180px;
	margin: 0 0 10px 10px;
	border-left: 1px dotted #ccc;
	padding-left: 10px;
}
#supportbuttons p {
	padding: 10px 20px 0 10px;
}
#supportbuttons a {
	font-size:12px;
	font-weight:bold;
	color:#000;
	text-decoration:none;
	margin:0 10px 5px 0;
	width: 170px;
	height:40px;
	line-height:40px;
	float:left;
	display:block;
	background:url("../images/btn_support_a.jpg") right top no-repeat;
	padding-right:5px;
}
#supportbuttons a span {
	background:url("../images/btn_support_span.jpg") left top no-repeat;
	height:40px;
	display:block;
	padding-left:15px;
}
#supportbuttons a:hover {
	background:url("../images/btn_support-on_a.jpg") right top no-repeat;
}
#supportbuttons a:hover span {
	background:url("../images/btn_support-on_span.jpg") left top no-repeat;
}
/****** Yellow Button End *******/
.roundedCornerSpacer {
    margin: 0; padding: 0; border: 0;
    clear: both;
    font-size: 1px; line-height: 1px;
}
/* In the CSS below, the numbers used are the following:
    1px: the width of the border
    3px: a fudge factor needed for IE5/win (see below)
    4px: the width of the border (1px) plus the 3px IE5/win fudge factor
    14px: the width or height of the border image
*/
.borderTL, .borderTR, .borderBL, .borderBR {
    width: 14px; height: 14px;
    padding: 0; border: 0;
    z-index: 99;
}
.borderTL, .borderBL { float: left; clear: both; }
.borderTR, .borderBR { float: right; clear: right; }
.borderTL { margin: -1px 0 0 -1px; }
.borderTR { margin: -1px -1px 0 0; }
.borderBL { margin: -14px 0 0 0; }
.borderBR { margin: -14px 0 0 0; }
/* IE5-5.5/win needs the border scooted to the left or right by an
   additional 3px! Why? */
.borderTL {
    margin-left: -4px;
    ma\rgin-left: -1px;
}
html>body .borderTL {
    margin-left: -1px;
}
.borderTR {
    margin-right: -4px;
    ma\rgin-right: -1px;
}
html>body .borderTR {
    margin-right: -1px;
}
.borderBL {
    margin-left: -3px;
    ma\rgin-left: 0;
}
html>body .borderBL {
    margin-left: 0;
}
.borderBR {
    margin-right: -3px;
    ma\rgin-right: 0;
}
html>body .borderBR {
    margin-right: 0;
}

.content {
    margin: 0;
    padding: 0;
    border: 1px solid #28539C;
	background-color: #FFF;
}
.content li {
	margin: 0 0 10px;
}
.content p {
	line-height: 16px;
}
.content h1 {
	font: bold 16px "Arial", Helvetica, sans-serif;
}
.content h2 {
	font: bold 14px "Arial", Helvetica, sans-serif;
	background-color:#EEEEEE;
	padding: 8px 0px 8px 2px;
	border-bottom: 1px solid #FFF;
}
.content h3 {
	font: bold 13px "Arial", Helvetica, sans-serif;
}
.content h4 {
	font: bold 12px "Arial", Helvetica, sans-serif;
}
.content h5 {
	font: bold 12px "Arial", Helvetica, sans-serif; text-align:center;
}
.content strong {
	font: bold 12px "Verdana", Arial, Helvetica, sans-serif;
}
h1.pagetitle {
	font: bold 20px "Arial", Helvetica, sans-serif;
	padding-left: 15px;
	color:#003399;
}
h1.pagetitleblog {
	font: bold 20px "Arial", Helvetica, sans-serif;
	padding-left: 10px;
	padding-bottom:0px;
	margin-bottom:0px;
	color:#003399;
}
#mainbody {
	padding: 0 20px;
	margin-left: 151px;
}

#mainbody2 {
	padding: 0 20px;
	margin-left: 0px;
}

#mainbodywebexamples {
	padding: 0 20px;
}


#mainbodysearch {
	padding: 0 20px;
	margin-left: 20px;
}

.smalltext {
	font: normal 10px "Verdana", Arial, sans-serif;
}
.shadowbox {
  background: #eee;
  position: relative;
  top: 2px;
  left: 2px;
}
.shadowbox div {
  background: #ccc;
  border: 1px solid #999;
  font-size: 12px;
  font-weight: bold;
  color: #000;
  padding: 5px;
  position: relative;
  top: -2px;
  left: -2px;
  margin-top: 30px;
}
.shadowboxblog {
  background: #eee;
  position: relative;
  top: 2px;
  left: 2px;
}
.shadowboxblog div {
  background: #ccc ;
  border: 1px solid #999;
  font-size: 14px;
  font-weight: bold;
  color: #000;
  padding: 5px;
  position: relative;
  top: -2px;
  left: -2px;
  margin-top: 30px;
}
#leftbar {
	float: left;
	width: 150px;
	padding: 0 10px;
}
#leftbar a {
	font-size: 11px;
}
#leftbar li {
	font-size: 11px;
}
#leftbar h2 {
	font: bold 14px "Arial", Helvetica, sans-serif;
	background-color:#FFF;
	padding: 0;
	margin: 0;
}
.footer {
    margin: 0;
    padding: 0;
    border: 1px solid #28539C;
	background-color: #FFF;
}
.footer p {
	font: normal 10px "Verdana", Arial, Helvetica, sans-serif;
	margin: 7px 0;
}
#menu {
	background: #FFF url("../images/menu_bkgrd.gif") repeat-x 0 0;
	height: 25px;
	margin: 1.4em 0; padding: 0 15px;
	border-bottom: 1px solid #FFF;
}
#menu .outer {
	float: left;
	width: 95px; height: 25px;
	margin: 0 1px 0 0;
	background:  url("../images/bars.gif") top left no-repeat;
}
#menu .outer a:link, #menu .outer a:visited, #menu .outer a:active {
	display: block;
	margin: 0; padding: 0;
	width: 100%; height: 100%;
	overflow: hidden;
	font: 12px "Arial", Helvetica, sans-serif;
	color:#FFF;
	text-decoration: none;
	background:  url("../images/bars.gif") 0 -50px no-repeat;
}
#menu .outer span {
	display: block;
	margin:0; padding: 7px 0 0 0;
	text-align: center;
}
#menu .outer a:hover {
	background:  url("../images/bars.gif") 0 -100px no-repeat;
	color: #000;
}
#menu .outer a#current {
	background-image: none;
	font-weight: bold;
	cursor: default;
	color: #000;
}
#navlist {
	margin: 0;
	padding: 5px 10px;
}
#navlist ul, #navlist li {
	margin: 0;
	padding: 0;
	display: inline;
	list-style-type: none;
	font: 12px "Arial", Helvetica, sans-serif;
}
#navlist a:link, #navlist a:active, #navlist a:visited {
	float: left;
	line-height: 14px;
	font-weight: bold;
	border-bottom: 2px solid #fff;
	padding-bottom: 2px;
	margin: 0 10px 5px 10px;
	text-decoration: none;
	color: #000;
}
#navlist a:hover { color: #000; }
#navlist a:link#current, #navlist a:visited#current, #navlist a:hover {
	border-bottom: 2px solid #000;
}
#screenshot { }
#screenshot img { border: 3px solid #FFF; }
#screenshot a:link, #screenshot a:visited, #screenshot a:active { color: #28539C; text-decoration: none; }
#screenshot a:hover { text-decoration: underline; }
#screenshot a:hover img, #screenshot a:active img { border: 3px solid #28539C; }

div.tableContainer {
	border: 1px solid #28539C;
	height: 225px;
	overflow: auto;
	width: 580px
}

/* Reset overflow value to hidden for all non-IE browsers. */
html>body div.tableContainer {
	overflow: hidden;
	width: 580px
}

/* define width of table. IE browsers only                 */
div.tableContainer table {
	float: left;
	width: 564px
}

/* define width of table. Add 16px to width for scrollbar.           */
/* All other non-IE browsers.                                        */
html>body div.tableContainer table {
	width: 580px
}

/* set table header to a fixed position. WinIE 6.x only                                       */
/* In WinIE 6.x, any element with a position property set to relative and is a child of       */
/* an element that has an overflow property set, the relative value translates into fixed.    */
/* Ex: parent element DIV with a class of tableContainer has an overflow property set to auto */
thead.fixedHeader tr {
	position: relative;
	white-space: nowrap;
}

/* set THEAD element to have block level attributes. All other non-IE browsers            */
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
html>body thead.fixedHeader tr {
	display: block
}

/* make the TH elements pretty */
thead.fixedHeader th {
	background: #3C7BE8;
	border-left: 1px solid #57B0FF;
	border-right: 1px solid #28539C;
	border-top: 1px solid #57B0FF;
	font-weight: bold;
	color: #FFF;
	padding: 4px 3px;
	text-align: left;
	
}

/* make the A elements pretty. makes for nice clickable headers   */             
thead.fixedHeader a, thead.fixedHeader a:link, thead.fixedHeader a:visited {
	color: #FFF;
	display: block;
	text-decoration: none;
	width: 100%
}

/* make the A elements pretty. makes for nice clickable headers                */
/* WARNING: swapping the background on hover may cause problems in WinIE 6.x   */
thead.fixedHeader a:hover {
	color: #FFF;
	display: block;
	text-decoration: underline;
	width: 100%
}

/* define the table content to be scrollable                                              */
/* set TBODY element to have block level attributes. All other non-IE browsers            */
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
/* induced side effect is that child TDs no longer accept width: auto                     */
html>body tbody.scrollContent {
	display: block;
	height: 203px;
	overflow: auto;
	width: 100%
}

/* make TD elements pretty. Provide alternating classes for striping the table */
/* http://www.alistapart.com/articles/zebratables/                             */
tbody.scrollContent td, tbody.scrollContent tr.normalRow td {
	background: #FFF;
	border-bottom: none;
	border-left: none;
	border-right: 1px solid #CCC;
	border-top: 1px solid #DDD;
	padding: 2px 3px 3px 4px;
	font-size: 11px;
}

tbody.scrollContent tr.alternateRow td {
	background: #EEE;
	border-bottom: none;
	border-left: none;
	border-right: 1px solid #CCC;
	border-top: 1px solid #DDD;
	padding: 2px 3px 3px 4px;
	font-size: 11px;
}

/* define width of TH elements: 1st, 2nd, and 3rd respectively.          */
/* Add 16px to last TH for scrollbar padding. All other non-IE browsers. */
/* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
html>body thead.fixedHeader th {
	width: 257px
}
html>body thead.fixedHeader th + th {
	width: 67px
}
html>body thead.fixedHeader th + th + th {
	width: 67px
}
html>body thead.fixedHeader th + th + th + th {
	width: 67px
}
html>body thead.fixedHeader th + th + th + th + th {
	width: 86px
}

/* define width of TD elements: 1st, 2nd, and 3rd respectively.          */
/* All other non-IE browsers.                                            */
/* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors        */
html>body tbody.scrollContent td {
	width: 257px;
}
html>body tbody.scrollContent td + td {
	width: 67px;
}
html>body tbody.scrollContent td + td + td {
	width: 67px;
}
html>body tbody.scrollContent td + td + td + td {
	width: 67px;
}
html>body tbody.scrollContent td + td + td + td + td {
	width: 86px;
}
.navigation {
	font: normal 10px Verdana, Arial, Helvetica, sans-serif;
	width: auto;
	display: block;
	background-color: #eee;
	margin-top: 15px;
	padding: 3px 0;
}
/*.post {
	padding: 0;
	margin: 0;
}*/
.entrytext {
	margin-top: 5px;
}
.entrytext p {
	color: #000;
	margin: 0 0 5px;
}
div.post {
	margin: 0;
}

div.shadowbox {
  background: #eee;
  position: relative;
  top: 2px;
  left: 2px;
}
div.shadowbox h2 {
  background: #ccc;
  border: 1px solid #999;
  font-size: 12px;
  font-weight: bold;
  color: #000;
  padding: 5px;
  position: relative;
  top: -2px;
  left: -2px;
  margin: 20px 0 0;
}
div.shadowbox h2 a:link {
  color: #000;
  text-decoration: none;
}
div.shadowboxblog {
  background: #eee;
  position: relative;
  top: 2px;
  left: 2px;
}
div.shadowboxblog h2 {
  background: #f4f4f4;
  border: 1px solid #999;
  font-size: 14px;
  font-weight: bold;
  color: #003399;
  padding: 5px;
  position: relative;
  top: -2px;
  left: -2px;
  margin: 20px 0 0;
}
div.shadowboxblog h2 a:link {
  color: #000;
  text-decoration: none;
}
div.post small {
	color: #999;
}
p.postmetadata small {
	color: #000;
}

/* Blog Styles */

/*** Sidebars ***/

#leftside,#rightside {
	margin: 0;
	width:155px;
	background: #fff;
}

#leftside {
	float:left;
}

#rightside {
	float:right;
}

#rightside img {
	border: 0;
}

/*** Sidebar menu ***/

#leftside h2, #rightside h2 {
    color: #000;
	margin: 0;
	padding: 10px 5px 5px 0;
	background-color: #fff;
}

#leftside ul, #rightside ul {
	padding-left: 0;
	margin: 0;
	background-color:#FFFFFF;
}

#leftside li, #rightside li {
	list-style: none;
	font-size: 10px;
}

li#categories li a, li#archives li a, li.pagenav li a {
	background:#fff;
    font-weight: bold;
	border:1px solid #ccc;
	display:block;
	margin: 0 0 5px;
	padding:5px 4px 4px 10px;
	position:relative;
	text-transform: capitalize;
	width:140px;
}

li#categories li a:hover, li#archives li a:hover, li.pagenav li a:hover {
	background:#fff;
	border:1px solid #666;
	color:#000;
	text-decoration:none;
}

li#categories ul.children li a, li#archives ul.children li a, li.pagenav ul.children li a {
	font-size:0.8em;
	margin:3px 0 2px 10px;
	padding:4px 2px 2px 8px;
	width:125px;
}

li#categories ul.children li li, li#archives ul.children li li, li.pagenav ul.children li li {
	padding-left: 10px;
}

li#categories ul.children li li a, li#archives ul.children li li a, li.pagenav ul.children li li a {
	width: 115px;
}

li.feed {
	background: url("images/rss.gif") no-repeat left top;
	padding: 2px 0 8px 20px;
}

li#recent-comments ul li {
	padding-bottom: 5px;
}

li#recent-posts ul li {
	padding-bottom: 5px;
}

/*** Content ***/

#contentblog {
	background-color:#fff;
	border:1px solid #eee;
	border-right:0;
    border-top: 0;
    border-bottom: 0;
	color:#000;
	padding:10px 10px 5px;
	margin:0 20px 0 180px;
}

/* Archives/Links Page List styles */

.archives li, .linkspage li {
	list-style: none;
}

.archives ul.children {
	padding-left: 10px;
	margin-left: 10px;
}

/*** comments Form ***/

#comment {
	width: 100%;
	border:1px solid #ccc;
}

#commentform {
	width: 97%;
}

#author {
	border:1px solid #ccc;
}

#email {
	border:1px solid #ccc;
}

#url {
	border:1px solid #ccc;
}

#submit {
	background:#f0f0f0;
	border:1px solid #ccc;
}

#submit:hover {
	background: #e8e9ea;
	border: 1px solid #848484;
	cursor: pointer;
}

/* Image Display */

.entry img, .entrytext img {
	border: 1px solid #ccc;
	margin: 5px;
	padding: 5px;
}

.entry a:hover img, .entrytext a:hover img {
	border: 1px solid #505050;
	padding: 5px;
}

img.wp-smiley {
	border: 0;
	margin: 0;
	padding: 0;
}

.thumbnail {
	background:#fafbfc;
	border:1px solid #ccc;
	margin:0 0 10px 10px;
	padding:5px;
}

.left {
	background:#fafbfc;
	border:1px solid #ccc;
	float:left;
	margin: 5px 15px 6px 0;
	padding:5px;
}

.right {
	background:#fafbfc;
	border:1px solid #ccc;
	float:right;
	margin: 5px 0 6px 15px;
	padding:5px;
}

.noalign {
	background:#fafbfc;
	border:1px solid #ccc;
	margin: 5px 5px 5px 5px;
	padding:5px;
}

/*** Comments Display ***/

.postmetadata {
	background:#e8e9ea;
	font-size: 0.9em;
	border: 1px solid #ccc;
	padding: 10px;
	margin: 0;
}

ol.commentlist li {
	border: 1px solid #ccc;
	padding: 10px;
	margin-bottom: 10px;
}

ol.commentlist li cite {
	text-transform: capitalize;
}

ol.commentlist li p {
	padding-top: 10px;
}

.alt {
	background:#e8e9ea;
}

/*** Text format ***/

.intro {
	font-size:1.1em;
	font-weight:bold;
	letter-spacing:-1px;
}

blockquote {
	border: 1px dashed #ccc;
	padding: 10px;
	margin: 30px;
}

blockquote p {
	padding: 0;
	margin: 0;
}

.small {
	font-size:0.8em;
}

.large {
	font-size:1.4em;
}

.center {
	text-align:center;
}

.category {
	border-top: 1px solid #ccc;
    font-size: 85%;
}

.date {
	margin: -15px 0 0 0;
    padding: 0;
    font-size: 85%;
    color: #666;
}

#page {
	padding-bottom: 10px;
	margin-bottom: 10px;
}

/* Previous/Next Page Navigation */

.navigation {
	margin: 0 0 20px 0;
	padding: 0 0 20px 0;
	border-bottom: 1px dashed #ccc;
}

.bottomnavigation {
	margin: 30px 0 0 0;
	padding: 5px 0 30px 0;
	border-top: 1px dashed #ccc;
}

.alignleft {
	float: left;
	text-align: left;
}

.alignright {
	float: right;
	text-align: right;
}

.post {
    padding-top: 0;
	padding-bottom: 10px;
	margin: 0;
}

/* Fix by Andy Skelton */

.entry, .entrytext {
	overflow: hidden;
}

* html.entry, * html.entrytext {
	overflow: visible;
	height: 1px;
}

* html.entry p, * html.entrytext p {
	width: 99%;
	overflow: hidden;
}

.entrytext {
	padding-top: 0;
}

/*** Various classes ***/

.clearingdiv {
	clear:both;
	height:5px;
	width:1px;
}

.hide {
	display:none;
}


/* Widgets */
.rsswidget {
	border:0;
	vertical-align: bottom;
}
#rightside ul ul li {
	margin: 0 0 10px;
}