/* Base Styles */

body { font-family: verdana, helvetica, sans-serif; background-color: #ffffff; background-image: url(../images/body_bg.gif); background-repeat: repeat-x; margin-top: 10px; margin-bottom: 10px; }

a:link { font-style: italic; color: #292929; text-decoration: underline; }
a:visited { font-style: italic; color: #292929; text-decoration: underline; }
a:hover { font-style: italic; color: #ddac4c; text-decoration: underline; }
a:active { font-style: italic; color: #292929; text-decoration: underline; }

p { font-size: 11px; line-height: 15px; color: #292929; margin: 0px 0px 9px 0px;  }
img { border: 0px; }
form { display: inline; }
td { vertical-align: top; }

h1 { margin: 0px 0px 15px 0px; padding: 0px 0px 5px 0px; border-bottom: 1px solid #dbdbdb; color: #7db171; font-size: 16px; }

h2 { margin: 0px 0px 9px 0px; color: #7db171; font-size: 12px; }

h4 { margin: 0px 0px 3px 0px; color: #7db171; font-size: 11px; }

#googleadwords { margin-top: 6px; margin-left: auto; margin-right: auto; }

h4 img { float: left; margin-right: 8px; }

div.firefox { width: 88px; margin: 0px auto 6px auto; }

abbr { cursor: help; border-bottom: 1px dotted #292929; }

td img { display: block; }

table#main { margin-left: auto; margin-right: auto; }

p.keytext { font-size: 9px; font-style: normal; line-height: normal; color: #ffffff; margin: 0px 0px 8px 0px; text-align: center; }
p.keytext a:link { font-size: 9px; font-style: normal; color: #ffffff; text-decoration: none; }
p.keytext a:visited { font-size: 9px; font-style: normal; color: #ffffff; text-decoration: none; }
p.keytext a:hover { font-size: 9px; font-style: normal; color: #ffffff; text-decoration: underline; }
p.keytext a:active { font-size: 9px; font-style: normal; color: #ffffff; text-decoration: none; }

td#headerlinks { width: 752px; height: 26px; background-image: url(../images/h_00.gif); background-repeat: no-repeat; }
p.headerlinks { font-size: 10px; color: #ffffff; text-align: center; margin: 7px 4px 0px 380px; }
p.headerlinks a:link { font-size: 10px; font-style: normal; color: #ffffff; text-decoration: none; }
p.headerlinks a:visited { font-size: 10px; font-style: normal; color: #ffffff; text-decoration: none; }
p.headerlinks a:hover { font-size: 10px; font-style: normal; color: #ffffff; text-decoration: underline; }
p.headerlinks a:active { font-size: 10px; font-style: normal; color: #ffffff; text-decoration: none; }

h3.home { margin: 0px 0px 6px 0px; color: #8493cb; font-size: 12px; font-style: normal; }
h3.home a:link { color: #8493cb; font-size: 12px; font-style: normal; text-decoration: none; }
h3.home a:visited { color: #8493cb; font-size: 12px; font-style: normal; text-decoration: none; }
h3.home a:hover { color: #7db171; font-size: 12px; font-style: normal; text-decoration: underline; }
h3.home a:active { color: #8493cb; font-size: 12px; font-style: normal; text-decoration: none; }

h3.navlinks { margin: 6px 0px 6px 0px; color: #7db171; font-size: 12px; font-style: normal; }

.navlinks ul { font-size: 11px; list-style-type: none; margin: 0px; padding: 0px; }
.navlinks ul li { display: block; color: #8493cb; line-height: 18px; margin-left: 6px; }
.navlinks ul li a:link { color: #8493cb; font-style: normal; text-decoration: none; }
.navlinks ul li a:visited { color: #8493cb; font-style: normal; text-decoration: none; }
.navlinks ul li a:hover { color: #7db171; font-style: normal; text-decoration: underline; }
.navlinks ul li a:active { color: #8493cb; font-style: normal; text-decoration: none; }

td#portfolio { width: 137px; height: 51px; background-image: url(../images/h_04.gif); background-repeat: no-repeat; }
#portfolio a:link { width: 137px; height: 51px; display: block; }
#portfolio a:visited { width: 137px; height: 51px; display: block; }
#portfolio a:hover { width: 137px; height: 51px; background-image: url(../images/h_04_x.gif); background-repeat: no-repeat; display: block; }
#portfolio a:active { width: 137px; height: 51px; display: block; }

td#services { width: 137px; height: 51px; background-image: url(../images/h_06.gif); background-repeat: no-repeat; }
#services a:link { width: 137px; height: 51px; display: block; }
#services a:visited { width: 137px; height: 51px; display: block; }
#services a:hover { width: 137px; height: 51px; background-image: url(../images/h_06_x.gif); background-repeat: no-repeat; display: block; }
#services a:active { width: 137px; height: 51px; display: block; }

td#contact { width: 137px; height: 51px; background-image: url(../images/h_08.gif); background-repeat: no-repeat; }
#contact a:link { width: 137px; height: 51px; display: block; }
#contact a:visited { width: 137px; height: 51px; display: block; }
#contact a:hover { width: 137px; height: 51px; background-image: url(../images/h_08_x.gif); background-repeat: no-repeat; display: block; }
#contact a:active { width: 137px; height: 51px; display: block; }

td#content { background-image: url(../images/m_01.gif); background-repeat: repeat-y; }
td#leftcolumn { width: 570px; }
div.paddingLC { padding: 0px 24px 0px 24px; }

td#rightcolumn { width: 182px; }
div.paddingRC { padding: 0px 10px 0px 13px; }

span.green { color: #7db171; }
span.blue { color: #8493cb; }
span.red { color: #990000; }
span.yellow { color: #ffd700; }
span.grey { color: #656565; }

div.divider { width: 138px; height: 1px; margin: 12px 13px 12px 12px; text-align: center; background-image: url(../images/div_h.gif); background-repeat: no-repeat; }

td#footer { width: 752px; height: 28px; background-image: url(../images/footer.gif); background-repeat: no-repeat; }
p.footer { font-size: 10px; color: #ffffff; margin: 5px 0px 0px 12px; }
p.footer a:link { color: #ffffff; font-style: normal; text-decoration: none; }
p.footer a:visited { color: #ffffff; font-style: normal; text-decoration: none; }
p.footer a:hover { color: #ffffff; font-style: normal; text-decoration: underline; }
p.footer a:active { color: #ffffff; font-style: normal; text-decoration: none; }

.cssButton, .cssButtonHover { width: 100px; background-color: #ddac4d; color: #292929; border: 1px outset #f4f4f4; font-family: verdana, helvetica, sans-serif; font-size: 11px; text-align: center; white-space: nowrap; text-decoration: none; padding: 2px; text-transform: uppercase; }
.cssButtonHover { border-style: inset; text-decoration: none; }

/* Tutorial Styles */

.code1 { border: 1px solid #dddddd; background-color: #f4f4f4; padding: 6px; width: 503px; margin: 0px 0px 9px 0px; height: 100px; overflow: auto; font-size: 11px; font-family: courier new, courier, monospace; }
.code2 { border: 1px solid #dddddd; background-color: #f4f4f4; padding: 6px; width: 503px; margin: 0px 0px 9px 0px; height: 30px; overflow: auto; font-size: 11px; font-family: courier new, courier, monospace; }

.samplecode { width: 503px; border: 1px solid #dddddd; padding: 6px; margin: 0px 0px 9px 0px; }

#print { width: 24px; margin: 18px auto 3px auto; }
#previous { float: left; }
#next { float: right; }

#samplecode h1,h2,h3,h4,h5,h6 { border-bottom: none; text-align: left; margin-top: 0px; margin-bottom: 6px; font-size: 11px; line-height: 15px; }

table.tuttable { margin-left: auto; margin-right: auto; border: 1px solid #dddddd; margin-bottom: 9px; font-size: 11px; line-height: 15px; }
td.headcol1 { background-color: #f4f4f4; border-bottom: 1px solid #dddddd; border-right: 1px solid #dddddd; text-align: center; font-weight: bold; }
td.headcol2 { background-color: #f4f4f4; border-bottom: 1px solid #dddddd; text-align: center; font-weight: bold; }
td.textcol1 { border-bottom: 1px solid #dddddd; border-right: 1px solid #dddddd; }
td.textcol2 { border-bottom: 1px solid #dddddd; }
td.textcolnb { border-right: 1px solid #dddddd; }
td.textcol1c { border-bottom: 1px solid #dddddd; border-right: 1px solid #dddddd; text-align: center; }
td.textcol2c { border-bottom: 1px solid #dddddd; text-align: center; }
td.textcol3c { border-right: 1px solid #dddddd; text-align: center; }
td.textcol4c { text-align: center; }

span.redx { color: #990000; font-size: 12px; font-family: arial black, helvetica, sans-serif; }
span.yellowx { color: #ffd700; font-size: 12px; font-family: arial black, helvetica, sans-serif; }
span.greyx { color: #656565; font-size: 12px; font-family: arial black, helvetica, sans-serif; }