/* DianeV.com CSS */
html {font-size:100%}
body {margin:0 auto; padding:14px 0 40px 0; color:#191d26; font-size:16px; font-size:.8em; text-align:center; font-family:Arial, Helvetica, sans-serif; background:#fff url(images/l9/bk-leaves.jpg) center top no-repeat; background-attachment:fixed} /* leave font-size here and adjust at bottom */

h1,h2,h3,p,ul,ol {margin-top:0} /* for Opera */
table, td, form {margin:0; padding:0; border:none}
table.tableform td {vertical-align:top; padding:1px}
/*table.tableform td input:required {border:1px solid #000}*/
table.tableform td.tableformrequired, .highlightfuschia {color:#af197b} /* color fuschia */

#pagewrap {width:1000px; margin:auto; text-align:center}
/* HEADER -- bk image moved to bottom */
#headerwrap {width:100%; height:200px; margin:auto; background:#668ebf url(images/l9/bk-header9.jpg) top center no-repeat; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#headerwrap div.dmxNivoSlider {float:right; width:316px; height:200px; padding:0; margin-right:4px}
#pagewrap #headerwrap #slider1 .nivoSlider img {width:316px; height:200px}

#headershadow     {width:100%; height:55px; text-align:center; background: url(images/l9/bk-headerbtm.png) no-repeat}
#headershadow img {width:100%; height:55px}

/* CONTENT          */
#contentwrap     {clear:both; width:100%; margin:auto; padding-bottom:40px; text-align:left} /* holds content and lnav */
#thecontent      {float:right; width:750px; margin-top:-5px; padding-bottom:20px; line-height:1.6em}

/* LNAV -  contains LOGO */
#lnav {float:left; width:200px; margin-top:-36px; color:#000}

	#thelogo     {width:200px; height:157px; padding-left:2px}
	#thelogo img {width:200px; height:157px}
	#thelogo a img {text-decoration:none; border:none}

	#lnav ul#lnavmain {list-style:none; margin:3px 0 18px 0; padding:0; font-size:13px}
	#lnav #lnavmain li a {color:#2D3544; display:block; text-decoration:none; padding:1px 10px; border-bottom:1px solid #dedede}
	#lnav #lnavmain li.lnavhighlight a {color:#005988; display:block; padding:1px 10px; text-decoration:none; border-bottom:1px solid #dedede}
	#lnav #lnavmain li a:hover {color:#fff; text-decoration:none; background:#3994BE; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}

	#lnav ul#lnavmain li#lnavbtngetquote {margin:4px 0}
	#lnav ul#lnavmain li#lnavbtngetquote a {color:#fff; display:block; padding:6px 10px; font-weight:bold; text-decoration:none; background:#5695bc url(images/l9/bk-btn.jpg); border-bottom:none; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; box-shadow: 0px 10px 10px #bbb}
	#lnav ul#lnavmain li#lnavbtngetquote a:hover {color:#fff; text-decoration:none; background:#3994BE; box-shadow:none}

/* #lnav li#lnavaboutus {margin-top:10px}*/
	.lnav1 {padding-left:75px}
	.lnav2 {padding-left:43px}
	.lnav3 {padding-left:24px}
	.lnav4 {padding-left:8px}

	/* editable area under/inside #lnav */
	#leftcol {clear:left; padding-top:1em; font-size:1em}
	#leftcol ul {list-style:none; margin:32px 0 18px 0; padding:0; font-size:12px; font-size:1em; border-top:1px solid #dedede}
	#leftcol ul li a {color:#2D3544; display:block; text-decoration:none; padding:4px 10px; border-bottom:1px solid #dedede}
	#leftcol ul li a:hover {color:#fff; text-decoration:none; background:#3994BE}
	#leftcol {margin-left:10px}

/* FOOTER  */
#footercont {clear:both; width:100%; margin:auto; padding:32px 0 3px 0; text-align:center; background: url(images/l9/bk-btm9.png) top center no-repeat}

#footercallsticky {float:left; width:265px; height:203px; margin-right:12px}
#footercallsticky img {width:265px; height:203px}
#footercallsticky a, #footercallsticky:link, #footercallsticky:visited {border:none; text-decoration:none}

#thefooter {width:860px; margin:auto}
  div#theaddycont {float:left; width:390px; padding-top:20px; color:#333; font-size:12px; line-height:1.5em; text-align:left}
  div#theaddycont p {margin-top:0}
  div#theaddycont a {color:#333; text-decoration:underline}
  div#theaddycont a:hover {color:#333; text-decoration:none}
	ul#addyul {float:right; width:140px; color:#ccc; margin-top:0}
		ul#addyul li.tellmelink a {color:#005988}

div#ftrbtngetquote ul {float:right; width:190px; list-style:none; margin:18px 0 0 0; padding:0; font-size:14px}
div#ftrbtngetquote li a {color:#fff; display:block; padding:5px 10px; font-weight:bold; text-decoration:none; background:#5695bc; border-bottom:none; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; box-shadow: 0px 10px 10px #bbb}
#ftrbtngetquote li a:hover {color:#fff; text-decoration:none; background:#3994BE; box-shadow:none}

#theccont {clear:both; width:980px; margin:auto; padding:0px 0 2px 0}
#thec {clear:both; width:980px; margin:0 auto 10px auto; color:#696969; font-size:11px; line-height:1.2em; text-align:center; font-family:Verdana, Arial, Helvetica, sans-serif}
#thec a {color:#696969; text-decoration:underline}
#thec a:hover {color:#696969; text-decoration:none}

/* END LAYOUT STYLES                                                   */
div#breadcrumbs h1 {margin-top:0}
div#breadcrumbs p {color:#7D7863; font-size:11px; letter-spacing:1px; margin:0}
div#breadcrumbs p a {color:#7D7863; font-size:11px; letter-spacing:1px; text-decoration:none; border-bottom:1px dotted #7D7863}
div#breadcrumbs p a:hover {color:#7D7863; text-decoration:none; border-bottom:none}

/*                                 */
h1,h2,h3,h4,.h1,.h2,.h3,.h4 {color:#252B38; font-weight:bold; line-height:1em; letter-spacing:-1px; font-family:Arial, Helvetica, sans-serif}
h1,.h1 {font-size:26px; /*text-shadow:4px 4px 2px #ccc;*/}
h2,.h2 {font-size:20px}
h3,.h3,h4,.h4 {font-size:17px}

#pagewrap h3 a, #pagewrap .h3 a {color:#000}
#pagewrap h3 a:hover, #pagewrap .h3 a:hover {color:#005988}

.b {font-weight:bold}
.i {font-style:italic}
.bi {font-weight:bold; font-style:italic}
.new {color:#c06; font-weight:bold; font-style:italic}
.fuschia {color:#af197b /*C2126E*/}
.gold {color:#83823C}
.dv {color:#FF3333; font-weight:bold; font-style:italic}
.mb0 {margin-bottom:0}
.mt0 {margin-top:0}

.testimonials {font-size:.85em; line-height:1.6em; font-family:Verdana, Arial, Helvetica, sans-serif}
.formtiny {color:#888; font-size:11px; line-height:1em}
.fee {color:#C37B93; font-size:12px; font-weight:bold; background-color:transparent}

ul.ul1 li {margin-bottom:1em}
ul.ul15 li {margin-bottom:1.5em}

/*ul.ulnext {margin:2.5em 0 15px 25px; padding-left:25px; background:url(images/b/dab.gif) no-repeat}*/
ul.ulnext {margin:2.5em 0 1em 25px; padding:0 0 15px 35px; background:url(images/b/carrow.gif) no-repeat}
ul.ulnext li {list-style:none}

/* HOME PAGE */
	/* portfolio slide show on home page */
	#homeshowthumbs {width:300px; margin-bottom:1px}
	#homeshowthumbs img {width:67px; height:48px}
	#homeshowthumbs a img {border:2px solid #ddd; text-decoration:none}

#homeleftcol   {float:left; width:416px}
#homerightcol {float:right; width:296px}
#cl {} /* in home right col */
.bluetopicbox {margin:10px 0 16px 0; padding:5px 10px; background:#fff; border:1px solid #abb9cb; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
.bluetopicbox h1   {margin:-16px 0 6px 16px; font-size:21px}
.bluetopicbox h1 a {color:#000; padding:0 4px; text-decoration:none; background:#fff}
.bluetopicbox h2 {color:#4975ad; font-size:24px}

.portfoliobuttons {width:268px; margin:-10px auto 20px auto; text-align:center}

	a#gotoportfoliotour       {width:268px; height:37px; display:block; background: url(images/b/portfolio-tour.gif) no-repeat; text-decoration:none}
	a#gotoportfoliotour:hover {width:268px; height:37px; background: url(images/b/portfolio-tour-on.gif) no-repeat; text-decoration:none}

	a#gotoportfolio       {width:268px; height:37px; display:block; background: url(images/b/portfolio-visit.gif) no-repeat; text-decoration:none}
	a#gotoportfolio:hover {width:268px; height:37px; background: url(images/b/portfolio-visit-on.gif) no-repeat; text-decoration:none}

	a#gototestimonials {width:147px; height:32px; margin:auto; line-height:32px; display:block; background: url(images/b/testimonials.gif) no-repeat; text-decoration:none}
	a#gototestimonials:hover {width:147px; height:32px; background: url(images/b/testimonials-on.gif) no-repeat; text-decoration:none}

/* TESTIMONIALS PAGE */
.testimonialboxon, .testimonialboxoff {clear:both; width:95%; padding:3%; margin-bottom:20px}
.testimonialboxon {border:1px solid #B6B584}
.testimonialboxon img, .testimonialboxoff img {float:left; margin-right:10px; margin-bottom:10px}

/* PORTFOLIO INDEX */
.portfolioindex {text-align:center; width:763px}
.portfolioindex div {float:left; width:180px; height:157px; color:#5f5f5f; font-size:11px; line-height:1em; margin:0 5px 12px 5px; text-align:center}
.portfolioindex div img         {width:180px; height:133px; border:none}
.portfolioindex div a img  {border:none; text-decoration:none}
.portfolioindex div h2     {color:#bbb; padding-top:42px; margin:0}

	/* individual portfolio pages */
	#portfolioreview {float:left; width:510px}
	#portfolioreview img.portfolioimg, #portfolioreview a img.portfolioimg {width:510px; height:376px; border:none}
	#portfolioimglg {text-align:center}

	/* portfolio nav links */
	ul#portfoliolist {float:right; width:170px; list-style-type:none; margin-left:0; padding-left:30px; font-size:11px; line-height:1.3em; border-left:1px solid #cdcdcd}
	#portfoliolist li a b {font-size:13px}
	#portfoliolist li a {width:155px; display:block; color:#666; padding:1px 0 1px 5px; text-decoration:none}
	#portfoliolist li a:hover   {color:#fff; text-decoration:none; background:#3994BE; -moz-border-radius:4px; border-radius:4px; -webkit-border-radius:4px; border-radius:4px}

.clientquote {margin:auto; background:url(images/b/leftquote.gif) top left no-repeat; padding-left:60px}

	/* clists for sitemap */
	#clistsitemap #portfoliolist, #clistsitemap #popclist {float:none; padding:0; font-size:12px; line-height:1.3em; text-align:left; border:none}
	#clistsitemap #portfoliolist {float:none; float:left}
	#clistsitemap #popclist {float:none; float:right; text-align:right}

/* site map */
#sitemap a, #sitemap #clistsitemap a {color:#000; text-decoration:underline}
#sitemap a:hover, #sitemap #clistsitemap a:hover {color:#005988; text-decoration:none; background:none}

/* inquiry page(s) */
fieldset.emailform {padding:5px; margin-bottom:10px; border:1px solid #ccc; background:#fff}
fieldset.emailform legend {color:#000; padding-left:10px; padding-right:10px; font-weight:bold; background:#bdb8a4}
fieldset.emailform label.emailformrequired {color:#af197b} /* color fuschia */
fieldset.emailform label {display:inline-block; width:160px}
.emailform input            {width:300px; margin-bottom:2px}
.emailform input.inputradio, .emailform input.inputcheckbox  {width:20px; margin-bottom:2px}
fieldset.emailform textarea {width:360px; height:210px}
fieldset.emailform h2 {margin:1em 0; font-size:18px;}

.resptableform td {padding:1px 5px; vertical-align:top}
.resptableform tr:nth-of-type(odd), .resptableform tr:nth-child(odd) {background:#eee}

/* table chart (hosting, etc.) */
table.hostingtblchart {width:460px; margin-bottom:10px; border:1px solid #CED4E0}
table.hostingtblchart th {color:#333; text-align:center; padding:2px 3px; border-bottom:none; background:#efefef; border-bottom:1px solid #DADFE8}
table.hostingtblchart td {text-align:left; padding:2px 3px 2px 5px; border-bottom:1px solid #DADFE8}

.servicelist h2, .servicelist h3 {margin-bottom:5px}
.servicelist p {line-height:1.3em}

/* TABBIES */
#tabbies {width:100%; margin-bottom:2em}
#tabbies ul {line-height:30px; list-style:none; margin:0; padding:0}
#tabbies li {display:inline; color:#fff; font-weight:bold; font-size:1em}
#tabbies li a {color:#777236; padding:4px 18px; margin-right:-3px; text-decoration:none; border:1px solid #ccc; background:url(images/b/tabbytop.jpg) repeat-x; -moz-border-radius:4px 4px 0 0; -webkit-border-radius:4px 4px 0 0; border-radius:4px 4px 0 0}
#tabbies li.tabbyon a {border:1px solid #ccc; border-bottom:none; background:transparent}
#tabbies ul li a:hover {color:#fff; background:#88814D}

div.clearboth {clear:both; margin:0; height:1px; line-height:.1em}
.center {text-align:center}
.left   {text-align:left}
.right  {text-align:right}
.bordernone {border:none}

/*  fuschia:CC0066 D41174 C91A70  purple:302d4c khaki:83823C  turquoise:558EAC   */
#thecontent p.btngetquote {margin-top:30px; margin-bottom:20px}
#thecontent p.btngetquote a {color:#fff; padding:4px 10px; font-size:18px; font-weight:bold; text-align:center; text-decoration:none; background:#5695bc url(images/l9/bk-btn.jpg); border-bottom:none; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; box-shadow:0px 10px 10px #bbb}
#thecontent p.btngetquote:hover a {color:#fff; text-decoration:none; background:#3994BE; box-shadow:none}

p.minibutton a {color:#fff; padding:1px 4px; background:#5695bc}

a img {border:none; text-decoration:none}

a, a:link, a:visited  {color:#005988 /*575325*/; text-decoration:underline}
a:hover {color:#005988; text-decoration:none}



/* for mobiles - portrait -- 240px - 20em                                                                                           */
@media screen and (min-width:200px) and (max-width:319px) {
body {width:240px; font-size:16px; font-size:.8em; margin:0 auto; padding:0; border:0; background:#fff; background-image:none}
#pagewrap {width:100%; background-image:none}
#headerwrap {width:100%; height:200px; background:#668ebf url(images/l9/bk-header9-240.jpg) top left no-repeat; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#headerwrap div.dmxNivoSlider, #pagewrap #headerwrap #slider1 .nivoSlider img, #headershadow {width:20px; display:none}
#headershadow, #headernavimg {width:20px; background-image:none; display:none; height:0}
#contentwrap  {width:240px; padding:0; margin:auto}
#lnav       {width:230px; clear:left; float:none; margin-left:6px}
#thelogo    {width:200px; height:157px; margin-top:3em; padding-left:0}
#lnav ul#lnavmain {font-size:.9em; padding-bottom:1em}
#lnav ul#lnavmain li a, 
#lnav ul#lnavmain li.lnav1 a, #lnav ul#lnavmain li.lnav2 a, #lnav ul#lnavmain li.lnav3 a, #lnav ul#lnavmain li.lnav4 a /*{padding:5px 10px} */ 
{float:left; padding:6px; margin:0 .4em .4em 0; border-bottom:none; border:1px solid #ccc; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#lnav ul#lnavmain li.lnav3  {display:none}
#thecontent {width:220px; clear:both; float:none; margin:auto}
#footercont {width:240px; margin:0}
#thefooter  {width:230px; margin:auto; background:url(images/l9/bk-btm-240.png) top center no-repeat} /* the culprit */
#footercallsticky  {clear:both; float:none; width:230px; background:none}
#footercallsticky img {width:100%; height:100%}
#thefooter #theaddycont {width:230px; margin:0 0 0 3px}
#thefooter #theaddycont #theaddy {margin-bottom:0}
#footercont ul#addyul {clear:both; float:none; width:10em}
#footercont div#ftrbtngetquote {clear:both; float:none; margin:0 auto; padding:0; width:180px}
#theccont {width:240px; margin:1em auto 0 auto}
#thec {font-size:.8em; width:200px}
.portfolioindex {width:230px} /* portfolio index page */
#portfolioreview {width:100%}
#portfolioreview img.portfolioimg {width:100%; height:100%}
.testimonialboxon, .testimonialboxoff {padding:1%}
.testimonialboxon img, .testimonialboxoff img {float:none; display:block; width:90%; height:90%}
#tabbies li a {display:block}
table.hostingtblchart {width:230px}
.unfloat {float:none; margin:0}
fieldset.emailform label    {display:inline-block; width:210px}
.emailform input            {width:210px; margin-bottom:2px}
fieldset.emailform textarea {width:210px; height:210px}
.sunshopicons, .upcomingsites {display:none}
.sunshopthumbs {width:96%; margin:10px auto}
.sunshopthumbs img {width:96%; height:96%}
.resptableform {width:100%}
.resptableform td {padding:1px 2px; vertical-align:top}
table.resptableform, table.resptableform thead, table.resptableform tbody, table.resptableformth, table.resptableform tr, table.resptableformtd {dislay:block}
.resptableform tr:nth-of-type(odd), .resptableform tr:nth-child(odd) {background:#ccc}
#homeleftcol {width:220px}
#homerightcol {width:220px}
#cl img {width:100%; height:100%}
#homeshowthumbs {width:230px}
#homeshowthumbs img {width:67px; height:48px}
.portfoliobuttons, #lnavmain li.lnavnoshow240 {display:none}
}

/* for mobiles - portrait -- 320px   */
/* 320 - .iblock320 */
@media screen and (min-width:320px) and (max-width:479px)  {
body {width:320px; font-size:.8em; margin:0 auto; padding:0; border:0; background:#fff; background-image:none}
#pagewrap {width:100%; background-image:none}
#headerwrap {width:100%; height:200px; background:#668ebf url(images/l9/bk-header9-320.jpg) top left no-repeat; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#headerwrap div.dmxNivoSlider, #pagewrap #headerwrap #slider1 .nivoSlider img, #headershadow {width:20px; display:none}
#headershadow, #headernavimg {width:20px; background-image:none; display:none; height:0}
#contentwrap {width:320px; padding:0; margin:auto}
#lnav        {width:304px; clear:left; float:none; margin-left:1em}
#thelogo     {width:200px; height:157px; margin-top:3em; padding-left:0}
#lnav ul#lnavmain {font-size:.9em; padding-bottom:1em}
#lnav ul#lnavmain li a, #lnav ul#lnavmain li.lnav1 a, #lnav ul#lnavmain li.lnav2 a, #lnav ul#lnavmain li.lnav3 a, #lnav ul#lnavmain li.lnav4 a 
{float:left; padding:6px; margin:0 .4em .4em 0; border-bottom:none; border:1px solid #ccc; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#lnav ul#lnavmain li#lnavbtngetquote a {padding:10px 16px}
	.lnav1 {padding-left:0; margin-bottom:0}
	#lnav ul#lnavmain li.lnav3  {display:none}
#thecontent {clear:both; float:none; width:300px; margin:auto; padding-top:1em; border-top:10px solid #8aa8cc}
#footercont {width:320px; margin:0}
#thefooter  {width:300px; margin:auto; background:url(images/l9/bk-btm-240.png) top center no-repeat}
#footercallsticky  {clear:both; float:none; width:300px}
#footercallsticky img {width:90%; height:90%}
#thefooter #theaddycont {width:300px; margin:1em auto 0 auto}
#thefooter #theaddycont #theaddy {clear:both; float:none; margin-bottom:0}
#footercont ul#addyul {clear:both; float:none; width:10em}
#footercont div#ftrbtngetquote {clear:both; float:none; margin:0 auto; padding:0; width:180px}
#theccont {width:320px; margin:1em auto 0 auto}
#thec {font-size:.8em; width:300px}
.portfolioindex {width:310px} /* portfolio index page */
#portfolioreview {width:100%}
#portfolioreview img.portfolioimg {width:100%; height:100%}
.testimonialboxon img, .testimonialboxoff img {float:none; width:90%; height:90%}
#tabbies li a {display:block}
table.hostingtblchart {width:300px}
.unfloat {float:none; margin:0}
fieldset.emailform label    {display:inline-block; width:210px}
.emailform input            {width:280px; margin-bottom:2px}
fieldset.emailform textarea {width:280px; height:210px}
.sunshopicons, .upcomingsites {display:none}
.sunshopthumbs {margin:10px auto}
.sunshopthumbs img {width:96%; height:96%}
.iblock320 {display:inline-block}
table.resptableform, table.resptableform thead, table.resptableform tbody, table.resptableformth, table.resptableform tr, table.resptableformtd {dislay:block}
.resptableform tr:nth-of-type(odd), .resptableform tr:nth-child(odd) {background:#ccc}
#homeleftcol {width:310px}
}

/* for mobiles - landscape -- 480px x 320px   */
@media screen and (min-width:480px) and (max-width:599px) {
body {width:480px; font-size:.8em; margin:0 auto; padding:0; border:0; background:#fff; background-image:none}
#pagewrap {width:100%; background-image:none}
#headerwrap {width:100%; height:200px; background:#668ebf url(images/l9/bk-header9-480x320.jpg) top left no-repeat; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#headerwrap div.dmxNivoSlider, #pagewrap #headerwrap #slider1 .nivoSlider img, #headershadow {width:20px; display:none}
#headershadow, #headernavimg {width:20px; background-image:none; display:none; height:0}
#contentwrap {width:480px; padding:0; margin:auto}
#lnav        {width:430px; clear:left; float:none; margin-left:1em}
#thelogo     {width:200px; height:157px; margin-top:3em; padding-left:0}
#lnav ul#lnavmain {font-size:.9em; padding-bottom:1em}
#lnav ul#lnavmain li a, #lnav ul#lnavmain li.lnav1 a, #lnav ul#lnavmain li.lnav2 a, #lnav ul#lnavmain li.lnav3 a, #lnav ul#lnavmain li.lnav4 a 
{float:left; padding:6px; margin:0 .4em .4em 0; border-bottom:none; border:1px solid #ccc; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#lnav ul#lnavmain li#lnavbtngetquote a {padding:10px 16px}
	.lnav1 {padding-left:0; margin-bottom:0}
	#lnav ul#lnavmain li.lnav3  {display:none}
#thecontent {clear:both; float:none; width:460px; margin:auto; padding-top:1em; border-top:10px solid #8aa8cc}
#footercont {width:480px; margin:0}
#thefooter  {width:460px; margin:0; background:url(images/l9/bk-btm-240.png) top center no-repeat} /* the culprit */
#footercallsticky  {clear:both; float:none; width:100%;}
#footercallsticky img {width:265px; height:203px}
#thefooter #theaddycont {clear:both; width:410px; margin:0 0 0 20px}
#thefooter #theaddycont #theaddy {width:200px; margin:0}
#footercont ul#addyul {width:100px}
#footercont div#ftrbtngetquote {clear:both; float:none; margin:0 auto; padding:0; width:180px}
#theccont {width:440px; margin:1em auto 0 auto}
#thec {font-size:.8em; width:400px}
.portfolioindex {width:460px} /* portfolio index page */
#portfolioreview {width:100%}
#portfolioreview img.portfolioimg {width:100%; height:100%}
#tabbies li a {display:block}
table.hostingtblchart {width:460px}
fieldset.emailform label    {display:inline-block; width:170px}
.emailform input            {width:370px; margin-bottom:2px}
fieldset.emailform textarea {width:370px; height:210px}
.sunshopicons {display:none}
.sunshopthumbs {width:96%; margin:10px auto}
.sunshopthumbs img {width:96%; height:96%}
table.resptableform, table.resptableform thead, table.resptableform tbody, table.resptableformth, table.resptableform tr, table.resptableformtd {dislay:block}
.resptableform tr:nth-of-type(odd), .resptableform tr:nth-child(odd) {background:#ccc}
#homeleftcol {width:460px}
#homerightcol {width:460px}
#cl {width:296px; margin:10px auto}
}

/* small tablet - portrait - 600x800  */
@media screen and (min-width:600px) and (max-width:767px)  {
body {width:600px; font-size:.845em; margin:0 auto; padding:0; border:0; background:#fff}
#pagewrap {width:100%; background-image:none}
#headerwrap {width:100%; height:200px; background:#668ebf url(images/l9/bk-header9-600.jpg) top left no-repeat; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#headerwrap div.dmxNivoSlider, #pagewrap #headerwrap #slider1 .nivoSlider img, #headershadow {width:20px; display:none}
#headershadow, #headernavimg {width:20px; background-image:none; display:none; height:0}
#contentwrap  {width:600px; padding:0; margin:auto}
#lnav       {clear:left; float:none; margin-left:1em; width:560px}
#thelogo    {width:200px; height:157px; margin-top:3em; padding-left:0}
#lnav ul#lnavmain {font-size:.9em; padding-bottom:1em}
#lnav ul#lnavmain li a, #lnav ul#lnavmain li.lnav1 a, #lnav ul#lnavmain li.lnav2 a, #lnav ul#lnavmain li.lnav3 a, #lnav ul#lnavmain li.lnav4 a 
{float:left; padding:5px 10px; border-bottom:none; border:1px solid #dedede; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
	.lnav1 {padding-left:65px; margin-bottom:0}
	#lnav ul#lnavmain li.lnav3  {display:none}
#thecontent {clear:both; float:none; width:560px; margin:auto; padding-top:1em; border-top:10px solid #8aa8cc}
#footercont {width:600px; margin:auto}
#thefooter  {width:600px; margin:auto; background:none}
#footercallsticky  {width:265px; height:203px; margin:0 auto}
#footercallsticky img {width:265px; height:203px}
	#thefooter #theaddycont {width:300px; margin:auto}
	#thefooter #theaddycont #theaddy {float:left; width:180px; margin:0 auto}
	#thefooter ul#addyul {float:right; width:70px}
#footercont div#ftrbtngetquote {clear:both; margin:0 auto; padding:0; width:180px}
#theccont {width:600px; margin:1em auto 0 auto}
#thec {font-size:.8em; width:580px}
.portfolioindex {width:560px} /* portfolio index page */
.portfolioindex div {width:170px; margin-right:5px}
.portfolioindex div img {width:100%; height:76%}
#portfolioreview {width:100%}
#portfolioreview img.portfolioimg {width:100%; height:100%}
#tabbies li a {display:block}
table.hostingtblchart {width:580px}
fieldset.emailform label    {display:inline-block; width:170px}
.emailform input            {width:370px; margin-bottom:2px}
fieldset.emailform textarea {width:370px; height:210px}
.sunshopicons {display:none}
.sunshopthumbs {width:96%; margin:10px auto}
.sunshopthumbs img {width:96%; height:96%}
#homeleftcol {width:570px}
#homerightcol {width:570px}
#cl {width:296px; margin:10px auto}
}

/* tablet - portrait - 768x2014  */
@media screen and (min-width:768px) and (max-width:799px)  {
body {width:768px; font-size:.8em; margin:0 auto; padding:0; border:0; background:#fff}
#pagewrap {width:100%; background-image:none}
#headerwrap {width:100%; height:200px; background:url(images/l9/bk-header9-768.jpg) top left no-repeat; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#headerwrap div.dmxNivoSlider, #pagewrap #headerwrap #slider1 .nivoSlider img, #headershadow {width:20px; display:none}
#headershadow, #headernavimg {width:20px; background-image:none; display:none; height:0}
#contentwrap  {width:768px; padding:0; margin:auto}
#lnav       {clear:left; float:none; margin-left:1em; width:740px}
#thelogo    {width:200px; height:157px; margin-top:3em; padding-left:0}
#lnav ul#lnavmain {font-size:.9em; padding-bottom:1em}
#lnav ul#lnavmain li a, #lnav ul#lnavmain li.lnav1 a, #lnav ul#lnavmain li.lnav2 a, #lnav ul#lnavmain li.lnav3 a, #lnav ul#lnavmain li.lnav4 a 
{float:left; padding:5px 10px; border-bottom:none; border:1px solid #dedede; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
	.lnav1 {padding-left:55px; margin-bottom:0}
#thecontent {clear:both; float:none; width:740px; margin:auto; padding-top:1em; border-top:10px solid #8aa8cc}
#footercont {width:768px; margin:auto}
#thefooter  {width:700px; margin:auto; background:none}
#footercallsticky  {width:265px; height:203px; margin:0 auto}
#footercallsticky img {width:265px; height:203px}
	#thefooter #theaddycont {width:300px; margin:auto}
	#thefooter #theaddycont #theaddy {float:left; width:180px; margin:0 auto}
	#thefooter ul#addyul {float:right; width:70px}
#footercont div#ftrbtngetquote {clear:both; margin:0 auto; padding:0; width:180px}
#theccont {width:580px; margin:1em auto 0 auto}
#thec {font-size:.8em; width:580px}
#portfolioreview {width:100%}
#portfolioreview img.portfolioimg {width:80%; height:80%}
fieldset.emailform label    {display:inline-block; width:180px}
.emailform input            {width:300px; margin-bottom:2px}
fieldset.emailform textarea {width:360px; height:210px}
.sunshopicons {display:none}
.sunshopthumbs {width:96%; margin:10px auto}
.sunshopthumbs img {width:96%; height:96%}
#homeleftcol {float:left; width:364px}
#homerightcol {float:right; width:364px}
#cl {width:296px; margin:10px auto}
}

/* small tablet - landscape - 800x600  */
@media screen and (min-width:800px) and (max-width:1023px)  {
body {width:800px; font-size:.845em; margin:0 auto; padding:0; border:0; background:#fff}
#pagewrap {width:100%; background-image:none}
#headerwrap {width:100%; height:200px; background:url(images/l9/bk-header9-800.jpg) top left no-repeat; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
#headerwrap div.dmxNivoSlider, #pagewrap #headerwrap #slider1 .nivoSlider img, #headershadow {width:20px; display:none}
#headershadow, #headernavimg {width:20px; background-image:none; display:none; height:0}
#contentwrap  {width:800px; padding:0; margin:auto}
#lnav       {clear:left; float:none; margin-left:1em; width:740px}
#thelogo    {width:200px; height:157px; margin-top:3em; padding-left:0}
#lnav ul#lnavmain {font-size:.9em; padding-bottom:1em}
#lnav ul#lnavmain li a, #lnav ul#lnavmain li.lnav1 a, #lnav ul#lnavmain li.lnav2 a, #lnav ul#lnavmain li.lnav3 a, #lnav ul#lnavmain li.lnav4 a 
{float:left; padding:5px 10px; border-bottom:none; border:1px solid #dedede; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}
	.lnav1 {padding-left:55px; margin-bottom:0}
#thecontent {clear:both; float:none; width:760px; margin:auto; padding-top:1em; border-top:10px solid #8aa8cc}
#footercont {width:800px; margin:auto}
#thefooter  {width:700px; margin:auto; background:none}
#footercallsticky  {width:265px; height:203px; margin:0 auto}
#footercallsticky img {width:265px; height:203px}
	#thefooter #theaddycont {width:300px; margin:auto}
	#thefooter #theaddycont #theaddy {float:left; width:180px; margin:0 auto}
	#thefooter ul#addyul {float:right; width:70px}
#footercont div#ftrbtngetquote {clear:both; margin:0 auto; padding:0; width:180px}
#theccont {width:580px; margin:1em auto 0 auto}
#thec {font-size:.8em; width:580px}
#portfolioreview {width:100%}
#portfolioreview img.portfolioimg {width:70%; height:70%}
}

/* views 1024px & above - larger images moved here */
@media screen and (min-width:1000px) {
body {font-size:.85em; background:#fff url(images/l9/bk-leaves.jpg) center top no-repeat; background-attachment:fixed}
/*#headerwrap {background:#668ebf url(images/l9/bk-header9-reno.jpg) top center no-repeat; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px}*/
.div520 {width:520px}
.div620 {width:620px}
.div700 {width:700px}
}
