body {
	border-top-width: 0px; padding-right: 0px; padding-left: 0px; border-left-width: 0px; font-size: 100%; background: url("images/bggre.gif") #eee repeat; border-bottom-width: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px; font-family: Verdana, sans-serif; text-align: center; border-right-width: 0px
}
img {
	border-top-width: 0px; padding-right: 0px; display: block; padding-left: 0px; border-left-width: 0px; border-bottom-width: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px; border-right-width: 0px
}
img.left {
	float: left;
}
img.right {
	float: right;
}
blockquote {
	width: 200px; padding-right: 0px; padding-left: 0px; background: url("images/topquote.gif") #c6d1dd no-repeat left top; padding-bottom: 0px; margin: 10px 10px 5px 10px; padding-top: 0px; 
}
hr {
	margin-left: 20px; width: 90%
}
H3 {
	padding-right: 15px; padding-left: 15px; font-weight: bold; font-size: 12px; background: url(images/bullet.gif) #c6d1dd no-repeat left center; padding-bottom: 5px; margin: 10px 20px 5px; text-transform: uppercase; color: #333; padding-top: 5px; border-bottom: #999 1px solid
}
H2 {
	padding-right: 20px; padding-left: 20px; font-weight: bold; font-size: 12px; padding-bottom: 0px; margin: 0px; color: #333; padding-top: 10px
}
H4 {
	padding-right: 0px; padding-left: 0px; font-weight: bold; font-size: 12px; padding-bottom: 0px; margin: 20px 20px 5px; color: #708dab; padding-top: 0px
}
H1 {
	text-align: right; border-bottom: 1px #708dab dashed; padding-right: 0px; padding-left: 0px; font-weight: bold; font-size: 22px; padding-bottom: 0px; margin: 0px 20px 5px; color: #708dab; padding-top: 0px; font-family: palatino, Times New Roman, Times, Georgia, serif
}
p {
	margin: 0; color: #333; line-height: 1.4em
}
#content p {
	padding-right: 20px; padding-left: 20px; font-size: 12px; padding-bottom: 0px; padding-top: 5px
}
#quote p {
	padding-right: 15px; padding-left: 15px; font-size: 12px; padding-bottom: 0px; padding-top: 5px
}
#folio p {
	padding-right: 20px; padding-left: 20px; font-size: 70%; padding-bottom: 0px; padding-top: 5px
}
#header p {
	padding-right: 20px; padding-left: 0px; font-size: 10px; float: right; padding-bottom: 0px; color: #FFFFFF; line-height: 1.75em; padding-top: 20px
}
a:link, a:visited {
	color: #708dab; text-decoration: underline; 
}
a:hover {
	color: #708dab; text-decoration: none; 
}
.invis a, .invis a:hover, .invis a:visited {
	text-decoration: none; 
}
.hoverinfo, .hoverinfo:link, .hoverinfo:hover {
	cursor: help; color: #990000; padding: 0 15px 0 0;
	background: url("images/icons/icon_mini_faq.gif") no-repeat 100% 0;
/*
	background: url("images/icons/16-comment-square-question.png") no-repeat 100% 0; 
	background: url("images/icons/comment.gif") no-repeat 100% 0; 
*/
}
#header a:link {
	color: #fff
}
#footer a:link {
	color: #fff
}
#header a:visited {
	color: #fff
}
#footer a:visited {
	color: #fff
}
#header a:hover {
	color: #ccc
}
#footer a:hover {
	color: #e6e6e6
}
#footer a.invis, #footer a.invis:hover, #footer a.invis:visited {
	text-decoration: none; 
}

#frame {
	margin: 0px auto; width: 720px; background-color: #fff; border-top: 0px #777777 solid; 
	border-bottom: 0px #777777 solid; border-left: 1px #777777 solid; border-right: 1px #777777 solid; 
}
#container {
	margin: 0px 11px; width: 702px; background-color: #fff
}
#header {
	/* background: url(images/tagline.gif) */
	background: url("images/tagline/tagline.php") #708dab no-repeat right top; width: 700px; border-bottom: #fff 1px solid; height: 80px; text-align: right
}
#homeBanner {
	border-top: #fff 1px solid; margin-top: 1px; background: url("images/puppy2.jpg") #eee no-repeat left top; width: 700px; height: 220px; text-align: left
}
#banner {
	border-top: #fff 1px solid; margin-top: 1px; width: 700px; height: 180px; background-color: #eee; text-align: left
}
#wrap {
	background: url("images/wrapBG.gif") #efefd0 repeat-y left top; padding-bottom: 30px; margin: 0px; width: 700px
}
#content {
	float: right; width: 475px; text-align: left
}
#sidebar {
	float: left; width: 225px; text-align: left
}
#footer {
	clear: both; padding-right: 0px; margin-top: 10px; padding-left: 0px; padding-bottom: 0px; width: 700px; padding-top: 0px; background-color: #708dab; text-align: left
}
#folio {
	width: 700px; background: url("images/portBG.gif") #fff repeat-y left top; text-align: left
}
#header img {
	padding-right: 0px; padding-left: 0px; float: left; padding-bottom: 0px; margin: 5px 0px 0px 10px; padding-top: 0px
}
#folio img {

}
#content ul li {
	padding-right: 0px; padding-left: 0px; font-size: 12px; padding-bottom: 0px; line-height: 1.75em; padding-top: 0px; list-style-type: square
}
#content ul li a { color: #708dab; font-weight: bold; text-decoration: none;}
#content ul li a:hover { color: #333333; font-weight: bold;}
#content ul ul li {
	font-size: 12px; line-height: 1.75em; list-style-type: square
}
#content ul ul li a { color: #708dab; font-weight: bold; text-decoration: none;}
#content ul ul li a:hover { color: #333333; font-weight: bold;}
#content ul li.desc {
	padding-bottom: 1em
}
.clear {
	clear: both
}
/* HEADER IMAGES */
.home { background: url("images/headers/home.jpg") #fff no-repeat left top }
.forsale { background: url("images/headers/forsale.jpg") #fff no-repeat left top }
.whyhaveawebsite { background: url("images/headers/whyhaveawebsite.jpg") #fff no-repeat left top }
.about { background: url("images/headers/about.jpg") #fff no-repeat left top }
.why { background: url("images/headers/why.jpg") #fff no-repeat left top }
.privacy { background: url("images/headers/privacy.jpg") #fff no-repeat left top }
.questions { background: url("images/headers/questions.jpg") #fff no-repeat left top }
.portfolio { background: url("images/headers/portfolio.jpg") #fff no-repeat left top }
.contact { background: url("images/headers/contact.jpg") #fff no-repeat left top }
.thankyou { background: url("images/headers/mail.jpg") #fff no-repeat left top }
.error { background: url("images/headers/error.jpg") #fff no-repeat left top }
.newshead { background: url("images/headers/newshead.jpg") #fff no-repeat left top }
.services { background: url("images/headers/services.jpg") #fff no-repeat left top }
.serviceswebdesign { background: url("images/headers/serviceswebdesign.jpg") #fff no-repeat left top }
.servicesdomain { background: url("images/headers/servicesdomain.jpg") #fff no-repeat left top }
.servicesseo { background: url("images/headers/servicesseo.jpg") #fff no-repeat left top }
.serviceshosting { background: url("images/headers/serviceshosting.jpg") #fff no-repeat left top }
.serviceslogo { background: url("images/headers/serviceslogo.jpg") #fff no-repeat left top }
.servicesgraphic { background: url("images/headers/servicesgraphic.jpg") #fff no-repeat left top }
.servicesadvert { background: url("images/headers/servicesadvert.jpg") #fff no-repeat left top }
.servicescards { background: url("images/headers/servicescards.jpg") #fff no-repeat left top }
.servicesphoto { background: url("images/headers/servicesphoto.jpg") #fff no-repeat left top }
.specialoffer { background: url("images/headers/specialoffer.jpg") #fff no-repeat left top }

#navigationcontainer {
	padding-right: 0px; padding-left: 0px; padding-bottom: 0px; margin: 0px; border-left: #fff 1px solid; width: 704px; padding-top: 0px; height: 25px; background-color: #fff
}
#navigationcontainer ul {
	border-top-width: 0px; padding-right: 0px; padding-left: 0px; border-left-width: 0px; border-bottom-width: 0px; padding-bottom: 1px; padding-top: 0px; margin: 1px 1px 1px -1px; list-style-type: none; text-align: center; border-right-width: 0px
}
#navigationcontainer ul li {
	padding-right: 0px; display: block; padding-left: 0px; float: left; padding-bottom: 0px; margin: 0px; padding-top: 0px; text-align: center
}
#navigationcontainer ul li a {
	border-right: #fff 2px solid; padding-right: 0px; display: block; padding-left: 0px; background: #708dab; padding-bottom: 0px; font: bold 10px/18px Verdana, arial, Helvetica, sans-serif; width: 115px; color: #FFFFFF; padding-top: 0px; line-height: 25px; text-align: center; text-decoration: none
}
#navigationcontainer ul li a:hover {
	color: #708dab; background: #c6d1dd 
}
#navigationcontainer a:active {
	background: #c6d1dd; color: #708dab
}
#navigationcontainer li#active a {
	background: #efefd0; color: #708dab
}
#sidebar ul li {
	font-size: 11px; margin-left: 5px; color: #333; line-height: 1.75em; list-style-type: square
}
#sidebar img {
	border-right: #FFFFFF 5px solid; border-top: #FFFFFF 5px solid; margin: 15px; border-left: #FFFFFF 5px solid; border-bottom: #FFFFFF 5px solid
}
#sidebar a img {
	border: #FFFFFF 5px solid; margin: 15px;
}
#sidebar a:hover img {
	border: #FFFFFF 2px solid; padding: 3px; margin: 15px;
}
#sidebar ul li a {
	letter-spacing: -1px; font-weight: bold; font-weight: bold; color: #777777; text-decoration: underline;
}
#sidebar ul li a:hover {
	letter-spacing: -1px; font-weight: bold; font-weight: bold; color: #ffffff; text-decoration: none;
}
.date{
	font-weight: bold; font-size: 10px; margin: 10px 0px 0px 20px; color: #708dab
}
.news {
	padding-left: 0px; font-weight: normal; font-size: 10px; margin: 0px 20px; color: #333; line-height: 1.5em
}
.news ul, .news ul li{
	margin: 10px 0px 0px 200px; 
	font-size: 10px;
}
.news a, .news a:visited{
	color: #708dab; text-decoration: none; font-weight: bold; 
}
.news a:hover{
	color: #708dab; text-decoration: underline; 
}
.news a.read, .news a.read:hover{
	color: #708dab; text-decoration: underline; font-weight: bold; 
}
.morenews {
	text-align: right; padding-right: 0px; font-weight: normal; font-size: 10px; margin: 0px 20px; color: #333; line-height: 1.5em
}
.morenews a, .morenews a:visited{
	color: #333; text-decoration: none; font-weight: bold; 
}
.morenews a:hover{
	color: #333; text-decoration: underline; 
}
.morenews a.read, .morenews a.read:hover{
	color: #333; text-decoration: underline; font-weight: bold; 
}
.comment {
	font-size: 11px; margin: 10px 15px 10px 15px; color: #333; line-height: 2em
}
#commentimg{
	margin-left: auto; margin-right: auto; text-align: center
}
#commentimg img{
	margin-left: auto; margin-right: auto; text-align: center
}
.portimg{
	margin-left: auto; margin-right: auto; text-align: center
}
.portimg img{
	margin-left: auto; margin-right: auto; text-align: center
}
.special {
	padding-right: 20px; padding-left: 0px; font-weight: bold; font-size: 65%; padding-bottom: 0px; color: #699; padding-top: 3px; text-align: right
}
.quote {
	padding-right: 10px; padding-left: 10px; font-size: 14px; background: url("images/botquote.gif") no-repeat right bottom; padding-bottom: 10px; margin: 0px; color: #333; line-height: 1.5em; padding-top: 10px; font-style: italic; font-family: palatino, Times New Roman, Times, Georgia, serif
}
.client {
	padding-right: 20px; padding-left: 20px; font-size: 12px; padding-bottom: 0px; padding-top: 5px
}
.arrowsmall {
	padding-right: 15px; background: url("images/arrow_sm.gif") #fff no-repeat left center
}
.info {
	font-weight: normal; font-size: 11px; margin-left: 20px; padding-top: 10px
}
.foliobox {
	background: #FFFFFF; border-right: #708dab 2px solid; border-top: #708dab 2px solid; margin: 20px; border-left: #708dab 2px solid; width: 650px; border-bottom: #708dab 2px solid
}
#foliobox2 img {
	display: block; background: #efefd0; border-right: #777 1px solid; padding-right: 5px; border-top: #777 1px solid; padding-left: 5px; padding-bottom: 5px; margin-bottom: 10px; margin-top: 10px; margin-left: 15px; margin-right: 15px; border-left: #777 1px solid; padding-top: 5px; border-bottom: #777 1px solid
}
.folioimg {
	float: right; background: #efefd0; border-right: #777 1px solid; padding-right: 5px; border-top: #777 1px solid; padding-left: 5px; padding-bottom: 5px; margin: 20px; border-left: #777 1px solid; padding-top: 5px; border-bottom: #777 1px solid
}
.folioimg_cards {
	float: left; background: #ffffff; padding-right: 5px; padding-left: 5px; padding-bottom: 5px; margin: 20px; padding-top: 5px; 
}
.folioimg1 {
	float: left; background: #FFFFFF; border: none; padding: 0px; margin: 20px; 
}
.folioimg2 {
	float: right; background: #FFFFFF; border: none; padding: 0px; margin: 20px; 
}
.folioimg3 {
	float: left; background: #FFFFFF; border: none; padding: 0px; margin: 10px; 
}
.folioimg4 {
	float: right; background: #FFFFFF; border: none; padding: 0px; margin: 10px; 
}
.folioimg5 {
	float: left; background: #FFFFFF; border: none; padding: 0px; margin: 5px; 
}
.folioimg_icon {
	display:inline; border: none; padding: 0px; margin: 0px; 
}
#footer p {
	padding-right: 10px; padding-left: 10px; font-weight: normal; font-size: 10px; padding-bottom: 10px; color: #eee; padding-top: 10px
}

#footer { height: 20px; line-height: 20px; clear: both; padding-right: 0px; margin-top: 10px; padding-left: 0px; padding-bottom: 5px; width: 700px; padding-top: 5px; background-color: #708dab; text-align: left }

#footerleft { padding-left: 10px; font-size: 11px; float: left; text-align: left; color: #FFFFFF; line-height: 20px;}

#footerright { padding-right: 10px; font-size: 11px; float: right; text-align: right; color: #FFFFFF; line-height: 20px; }
#footerright a { color: #FFFFFF; text-decoration: none;}
#footerright a:hover { color: #FFFFFF; text-decoration: underline;}

#centerimg {
	margin-left: auto; margin-right: auto; text-align: center
}
.center {
	font-weight: bold; text-align: center
}
.bold {
	font-weight: bold
}
.foliotype {
	color: #708dab; padding: 10px; font-weight: bold; text-align: center; font-size: 22px; background: #FFFFFF; border-right: #708dab 2px solid; border-top: #708dab 2px solid; margin: 20px; border-left: #708dab 2px solid; width: 630px; border-bottom: #708dab 2px solid
}
.foliotype p{
	color: #708dab; 
}
.foliotype a, .foliotype a:visited{
	font-weight: bold; text-decoration: none; padding-left: 8px; padding-right: 8px; 
}
.foliotype a:hover{
	text-decoration: underline; 
}
.title {
	padding-right: 10px; padding-left: 0px; font-weight: bold; font-size: 26px; padding-bottom: 0px; color: #708dab; padding-top: 70px; font-family: Verdana, sans-serif; text-align: right
}
.subtitle {
	padding-right: 10px; padding-left: 10px; font-size: 16px; padding-bottom: 0px; color: #666; line-height: 1em; padding-top: 0px; font-family: Verdana, sans-serif; text-align: right
}
.redbold {
	font-weight: bold; font-size: 16px; color: #708dab
}
.bluebold {
	font-weight: bold; color: #708dab
}
.red {
	color: #990000
}
.red a{ color: #990000; text-decoration: underline; }
.red a:hover{ color: #990000; text-decoration: none; }
a.red{ color: #990000; text-decoration: underline; }
a.red:hover{ color: #990000; text-decoration: none; }

.more {
	padding-right: 10px; padding-left: 0px; font-size: 11px; padding-bottom: 0px; color: #333; padding-top: 10px; text-align: right
}
.spacer {
	margin: 5px 0px 10px 20px
}
.hide {
	display: none
}
dl {
	padding-right: 20px; padding-left: 40px; padding-bottom: 0px; padding-top: 0px; font-family: Verdana, sans-serif
}
dt {
	font-weight: bold; font-size: 12px; margin: 10px 0px 0px; color: #336699
}
dt a, dt a:link, dt a:visited {
	font-weight: bold; font-size: 12px; color: #336699; text-decoration: none;
}
dt a:hover {
	text-decoration: underline;
}
DD {
	font-weight: normal; font-size: 12px; margin: 0px; color: #333
}
#content legend {
	margin-top: 10px; font-weight: bold; font-size: 110%; color: #699
}
#content fieldset {
	font-size: 11px; margin-left: 25px; border-top-style: none; padding-top: 5px; border-right-style: none; border-left-style: none; border-bottom-style: none
}
#content label {
	clear: both; display: block; font-weight: bold; color: #333; padding-top: 10px
}
#content textarea {
	width: 400px; border: 1px solid #777777; clear: right; padding-right: 2px; display: block; padding-left: 2px; font-weight: normal; font-size: 100%; padding-bottom: 2px; margin: 5px 0px 0px; padding-top: 2px; 
}
#content input {
	width: 400px; border: 1px solid #777777; clear: right; padding-right: 2px; display: block; padding-left: 2px; font-weight: normal; font-size: 100%; padding-bottom: 2px; margin: 5px 0px 0px; padding-top: 2px; 
}
#content input.button { 
	margin-top: 10px; width: auto; height: auto; color:#333333; background-color:#FFFFFF; border:solid #777777 1px; 
}
#content input.hidden { 
	display: none;
}
#content select {
	width: 406px; border: 1px solid #777777; clear: right; padding-right: 2px; display: block; padding-left: 2px; font-weight: normal; font-size: 100%; padding-bottom: 2px; margin: 5px 0px 0px; padding-top: 2px; 
}
.smtxt{
	margin: 10px 0px 0px 20px;
	font-size: 11px;
}
.smtxt a {
	font-size: 11px;
}
.smsmall, .smsmall a {
	font-size: 9px; letter-spacing: 0px;
}
#newsspacer {
	height: 200px; width: 1px; 
}
#content .italic{ font-style: italic; }
#content .smallprint { font-size: 9px; }
#content .reduced { font-weight: bold; color: #FF0000}
#content .required { font-size: 9px; color: #FF0000}

/* TABS CSS START */
.graphdes { text-align:center; margin: 0px 10px 0px 20px; padding: 0; width: 650px; height: 21px; /* border-bottom: 5px solid #2d546c; */ background: transparent; voice-family: "\"}\""; voice-family: inherit; }
span.label { padding: 0; border: 0px #000 solid; padding-top: 4px; float: left; display: block; font: bold 11px Arial; color: #777777; text-decoration: none; margin: 0 5px 0 0; background: transparent; }
.graphdes ul { margin:0; margin-left: 0px; /*margin between first menu item and left browser edge*/ padding: 0; list-style: none; }
.graphdes li { display: inline; margin: 0 3px 0 0; padding: 0; /* text-transform:uppercase; */ font: bold 11px Arial; color: #777777; }
.graphdes a { /*border-bottom: 1px solid #efefd0;*/ border: #c6d1dd 1px solid; float: left; display: block; font: bold 11px Arial; color: #708dab; text-decoration: none; margin: 0 1px 0 0; /*Margin between each menu item*/ padding: 3px 3px; background: transparent; }
.graphdes a:hover { border: #c6d1dd 1px solid; background: #c6d1dd; color: #708dab; text-decoration: none; }
.graphdes a.selected, #content .graphdes a:hover.selected { /*currently selected tab*/ background: #708dab; color: #FFFFFF; border-color: #708dab; text-decoration: none; }
.graphdesline { margin-left: 10px; margin-right: 10px; padding-right: 0px; border-top: #708dab 2px solid; padding-left: 0px; padding-bottom: 5px; width: 455px; padding-top: 0px; height: auto; background-color: transparent; }
.folioboxtab { background: #FFFFFF; border: #708dab 2px solid; margin: 20px; width: 650px; display:none; }
@media print { .folioboxtab { display:block !important; } }
/* TABS CSS END */

/* TABS CSS START */
#content .pricemenu { margin-top: 10px; margin-left: 10px; padding: 0; width: 465px; height: 21px; /* border-bottom: 5px solid #2d546c; */ background: transparent; voice-family: "\"}\""; voice-family: inherit; }
#content .pricemenu ul { margin:0; margin-left: 0px; /*margin between first menu item and left browser edge*/ padding: 0; list-style: none; }
#content .pricemenu li { display: inline; margin: 0 2px 0 0; padding: 0; /* text-transform:uppercase; */ }
#content .pricemenu a { float: left; display: block; font: bold 11px Arial; color: #708dab; text-decoration: none; margin: 0 1px 0 0; /*Margin between each menu item*/ padding: 3px 8px; background: transparent; border-bottom: 1px solid #efefd0; }
#content .pricemenu a:hover { background: #c6d1dd; color: #708dab; text-decoration: none; }
#content .pricemenu a.selected, #content .pricemenu a:hover.selected { /*currently selected tab*/ background: #708dab; color: #FFFFFF; border-color: #708dab; text-decoration: none; }
#content .pricemenuline { margin-left: 10px; margin-right: 10px; padding-right: 0px; border-top: #708dab 2px solid; padding-left: 0px; padding-bottom: 5px; width: 455px; padding-top: 0px; height: auto; background-color: transparent; }
.tabcontent { display:none; }
@media print { .tabcontent { display:block !important; } }
/* TABS CSS END */

/* TOOLTIP CSS START */
#dhtmltooltip{ position: absolute; width: 150px; border: 1px dotted #777777; padding: 2px;
background-color: #e6e6e6; visibility: hidden; z-index: 100; font-size: 11px;
/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135); }
/* TOOLTIP CSS END */

.todobox { background-color: #EFEFEF; border: 1px solid #ffffff; position: relative; margin-left: 20px; margin-bottom: 10px; width: 300px; }
.todobox .amount { background-color: #6ABC42; height: 15px; line-height: 15px; }
.todobox .amount span { position: absolute; left: 10px; width: 300px; color: #555555; padding-left: 10px; font-size: 10px; font-weight: bold; }

.todoboxsml { background-color: #EFEFEF; border: 1px solid #ffffff; position: relative; margin-left: 0px; margin-bottom: 0px; width: 148px; }
.todoboxsml .amount { background-color: #6ABC42; height: 15px; line-height: 15px; }
.todoboxsml .amount span { position: absolute; left: 5px; width: 100px; color: #555555; padding-left: 0px; font-size: 9px; font-weight: bold; }
