/* CSS Resets */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {border:0;margin:0;padding:0}
article,aside,hgroup,footer,header,nav,section,video,object{display:block}
a img {border:0}
/* The 1140px Grid V2 by Andy Taylor http: //cssgrid.net http: //www.twitter.com/andytlr http: //www.andytlr.com  */
.container {padding-left: 0px; padding-right:0px;}
.row {width: 100%; max-width: 1330px; min-width: 755px; margin: 0 auto; overflow: hidden; background-color: #ffffff;}
.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol {margin-right: 3.8%; float: left; min-height: 1px;}
.row .onecol {width: 4.85%;}
.row .twocol {width: 13.45%;}
.row .threecol {width: 15%;}
.row .fourcol {width: 30.75%;}
.row .fivecol {width: 39.45%;}
.row .sixcol {width: 48%;}
.row .sevencol {width: 56.75%;}
.row .eightcol {width: 65.4%;}
.row .ninecol {width: 81.1%;}
.row .tencol {width: 82.7%;}
.row .elevencol {width: 91.35%;}
.row .twelvecol {width: 100%;}
.last {margin-right: 0px;}
img, object, embed {max-width: 100%;}
img {height: auto;}
img.oint {float:none; margin-left: .25em;}
/* MY STYLES  */
body {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; background-color: #ffffff; font-size: 100%; margin:0; padding: 0; border: none;/* background: -moz-linear-gradient(top, #000000 0%, #cccccc 50%, #ffffff);background: -webkit-gradient(linear, left top, left bottom, from(#cccccc),color-stop(0.5, #ffffff), to(#cccccc)); */ position:relative;}
div.twelvecol {position: relative; background-color: #ffffff;}
/* container below holds image over 300px wide - 300/840 = 36% */
div.imagefloatcontainer {width: 28%; float: right; padding: 0; margin: 0 8px 5% 5%;}
div.imagefloatcontainer img {padding: 1%; max-width: 97%; margin: 0;} 
div.imagefloatcontainerthinner22 {width: 22%; float: right; padding: 0; margin: 0 8px 5% 5%;}
div.imagefloatcontainerthinner22 img {padding: 1%; max-width: 97%; margin: 0;} 
div.imagefloatcontainerthinner20 {width: 20%; float: right; padding: 0; margin: 0 8px 5% 5%;}
div.imagefloatcontainerthinner20 img {padding: 1%; max-width: 97%; margin: 0;} 
/* container below holds image over 200px wide - 200/840 = 24% */
div.imagefloatcontainerthinner {width: 15%; float: right; padding: 0; margin: 0 8px 5% 5%;}
div.imagefloatcontainerthinner img {padding: 1%; max-width: 97%; margin: 0;} 
div.imagefloatcontainerthinner13 {width: 13.5%; float: right; padding: 0; margin: 0 8px 5% 5%;}
div.imagefloatcontainerthinner13 img {padding: 1%; max-width: 97%; margin: 0;} 
div.imagefloatcontainerthinner10 {width: 10%; float: right; padding: 0; margin: 0 8px 5% 5%;}
div.imagefloatcontainerthinner10 img {padding: 1%; max-width: 97%; margin: 0;} 
.noborder {border: 1px #cccccc solid;}
.withborder {border: 2px black solid;}
p.caption {width: 99%; font-size: .75em; color: #2b1a14; font-weight: bold; padding: 4px 0; margin: 0 14px 0 0; text-align: center; background-color: #cccccc;}
.smallsize11px {font: normal .6875em/1.5em Arial, Helvetica, sans-serif;}
h3 {font-family: Arial,sans-serif; font-size: 1.3em; line-height: 1.6em; font-weight: bold; letter-spacing: 0.035em; word-spacing: 0.1em; background-color: transparent; color: #000000; margin: 0 0px 2% 0px; padding: 0 218px 0 0; text-align: left;}
.copyrightfooter {color: white; width: 100%; text-align: center; margin: 15px auto;}
.nobridcobg {background-image: none;}
.shorterwidth {width: 50%;}
form {margin:0 auto;font-size: .75em; color: #2b1a14;}
.sideboxall {font-family: Arial, Helvetica, sans-serif; margin: 0 auto 8px auto; width: 80%; font-size: .8125em; line-height: 1.5em; color: #050505; background-color: white; padding:8%; border: 1px #005682 solid;}
.sideboxall a, .sideboxall a:link, .sideboxall a:visited, .sideboxall a:active{color: #333333 }
.sideboxall a:hover {color: #004165;}
div.topbox {color: black; -moz-box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,0.7); -webkit-box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,0.7); box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,0.7); background: -moz-linear-gradient(
top,#faaf7d 0%,#f5cbb1); background: -webkit-gradient(linear, left top, left bottom, from(#faaf7d),to(#f5cbb1));}
div.boxrite {background-color: #cfecff;}
div.boxritewite {border: 1px solid red}
.boxritegrad {background: -moz-linear-gradient( top, #d9d9d9 0%, #b3b3b3); background: -webkit-gradient( linear, left top, left bottom, from(#d9d9d9), to(#b3b3b3)); -moz-box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,1); -webkit-box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,1); box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,1);}
div.boxritecont {margin-bottom: 8px; padding: 3%; border: 3px #005682 solid; background-color: white;}
.forminput {width: 94%}
address {font: normal 1em/1.5em Arial, Helvetica, sans-serif;}
a.pno:link, a.pno:visited, a.pno:hover, a.pno:active{border:none;text-decoration:underline;padding:0;margin:0;}
.smartonly {display: none;}
.phonenumfooter {font: bold 1.4em/2em Arial, Helvetica, sans-serif;}
.phonenumright img {position: relative; top: 3px; right: 5px;}
.clearboth {clear: both;}
div.phonenumandmenuwrapper {width: 100%; position: relative; height: 36px; border: 1px solid #466C7E; background-color: #466C7E;}
div.phonenumwrapper {text-align: right; color: white; font-weight: bold; line-height: 36px; padding-right: 8px; margin-right: 0px; background-color: #466C7E;} 
p {width: 82%;color: #2b1a14; text-align: justify; margin: 0 0 0 194px; font-size: 1em; line-height: 1.6em; background-color: transparent; /* border: 1px solid silver;*/ border: none;}
.sidemenuwrapper {position:relative; max-width:1330px; margin: 0 auto; padding:0;} 
.navwrapfixedtopmenu {width:1330px; height: 36px; position: fixed; top: 0; left: 50%; margin-left: -665px; overflow: visible; z-index: 10;} 
.sidemenuwrapfixed {width: 158px; height: 1006px; position: fixed; top: 38px; left: 50%; margin-left: -665px; overflow: visible; z-index: 9;} 
.pagetopimage {width: 82%; margin: 42px 0 0 194px; padding:0;border: none; z-index:1;}
.tptclogo { position: relative; top: 36px;}
.pagetopimagev2 {width: 100%; margin: 36px 0 -2px 0px; padding:0;  border: none; z-index:1;}
/*pagettopimageve2old
{width: 89%; margin: 36px 0 0 160px; padding:0;  border: none; z-index:1;}
oldold{width: 79%; margin: 36px 0 0 200px; padding:0;  border: none; z-index:1;}*/
table td {font-size:.9em; line-height: 1.5em; color: black; vertical-align: top;white-space:normal;}
table.producttable {width:82%; max-width: 1129px; border: none; padding: 0;margin: 0 0 0 194px; border-collapse: separate; border-spacing: 5px 2px;}
table.producttable td { max-width:260px; font-size: 1.2em; font-weight:bold; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; line-height: 1.5em;padding:0; margin:0; text-align:center;}
.producttable,.tablecaptions{font-size:.8em}
table.downalign tr,table.downalign tr td {vertical-align:bottom;}
table.producttable td a { margin:0; padding:0;}
table.producttable td a:link {border:none;text-decoration:none;padding:0;margin:0;} 
table.producttable td a:visited {text-decoration:none; color: #551A8B;}
table.producttable td a:hover {text-decoration: underline; color:red;}
table.producttable td a:active {text-decoration:none; color: gray;}
table.producttablev1 {width: 82%; border: 2px solid black; border-collapse:collapse; padding: 0;margin: 0 0 0 194px;}
table.producttablev1 td {  padding: 4px; font: normal .9em/1.3em Helvetica, Arial, sans-serif; margin:0; white-space:normal; border-collapse:collapse; border: 1px solid #000000; text-align:left;min-height: 1px;}
table.producttablev1 tr td:nth-child(1) {width:150px; background-color:#dddddd;font: bold .8em/1.3em Helvetica, Arial, sans-serif}
table.producttablev1 td a { margin-top: 0;}
table.producttablev1 td a:link {color:blue;border:none;text-decoration:none;padding:0;margin:0;} 
table.producttablev1 td a:visited {text-decoration:none; color: purple;}
table.producttablev1 td a:hover {text-decoration: underline; color:red;}
table.producttablev1 td a:active {text-decoration:underline; color:blue;}
table.pricemod {width: 82%; border: 1px solid black; border-collapse:collapse; padding: 0;margin: 0 0 0 194px;}
table.pricemod tr td {  padding: 0 .5%; font: normal .9em/1.3em Helvetica, Arial, sans-serif; margin:0; white-space:normal; border-collapse:collapse; border:1px solid black; text-align:left;min-height: 1px;}
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .9em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .9em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.producttablev2 {width: 82%; /* border: 1px solid silver;*/ border: none; padding: 0;margin: 0 0 0 194px; border-collapse: separate;  border-spacing:5px 2px;}
table.producttablev2 td a { margin-top: 0;}
table.producttablev2 td a:link {border:none;text-decoration: none;padding:0;margin:0;} 
table.producttablev2 td a:visited {text-decoration:none; color: #263a3d;}
table.producttablev2 td a:hover {text-decoration: underline; color:red;}
table.producttablev2 td a:active {text-decoration:underline; color: gray;}
table.producttablev2 td { width: 24%; padding: 0 .5%; font-size: .9em; line-height: 1.3em; margin:0; white-space:normal; border-collapse:collapse; border:1px solid #d3d0d0; text-align:left;min-height: 1px;}
table.showertable {border:none; padding: 0;margin: 0 0 0 194px;border-collapse: collapse;} 
table.showertable td {border: 1px solid gray; border-collapse: collapse; padding: 3px;}
h1 {width: 82%; font: bold 1.4em/1.7em Arial,sans-serif; letter-spacing: 0.035em; word-spacing: 0.1em; background-color: transparent; color: #0b8ee9;/*green #2a7a12*/ margin: 10px 0 0 194px; padding: 0; text-align: left;}
h2 {width: 82%;font: bold 1.4em/1.7em Arial,sans-serif; letter-spacing: 0.035em; word-spacing: 0.1em; background-color: transparent; color: #515047; margin: 0 0 0 194px; padding: 0; text-align: left; border: none;}
h2.smallerh2 {font: bold 1.2em/1.6em Arial,sans-serif;color:black;}
h3 {width: 82%; font: bold 1.3em/1.6em Arial,sans-serif; letter-spacing: 0.035em; word-spacing: 0.1em; background-color: transparent; color: #000000; margin: 0 0 0 194px; padding:0; text-align: left;}
h3.copyrightfooter {color: white; width: 100%; text-align: center; margin: 15px auto;}
ul.tiletypes {width:82%; list-style-type:none; margin:10px 0 0 194px;}
ul.tiletypes li {float:left; font-size: 1em; line-height: 1.5em; padding: 0 0 0 .75em; color:#777; margin: 0;}
.clrtiletypes {clear:both;}
ul#crumbs {width: 82%;list-style-type:none; /*border:1px solid silver;*/ height:2.3em; background-color: white;margin:43px 0 0 194px;}
ul#crumbs li {float:left; font-size: .8em; line-height: 1.5em; padding: 0 0 0 .75em; color:#777; margin: 0;}
ul#crumbs li a {display:block; padding:0 15px 0 0; background:url(images/crumbs.gif) no-repeat right center;}
ul#crumbs li a:link, ul#crumbs li a:visited {text-decoration:none;color:#777;}
ul#crumbs li a:hover, ul#crumbs li a:focus {color:#dd2c0d;}
ul#crumbstest {width: 82%;list-style-type:none; /*border:1px solid silver;*/ height:2.3em; background-color: white;margin:0px 0 0 194px;}
ul#crumbstest li {float:left; font-size: .8em; line-height: 1.5em; padding: 0 0 0 .75em; color:#777; margin: 0;}
ul#crumbstest li a {display:block; padding:0 15px 0 0; background:url(images/crumbs.gif) no-repeat right center;}
ul#crumbstest li a:link, ul#crumbs li a:visited {text-decoration:none;color:#777;}
ul#crumbstest li a:hover, ul#crumbs li a:focus {color:#dd2c0d;}
div.crumbcont {margin:0 auto;}
div.w704 {max-width: 704px;}
div.w600 {max-width: 600px;}
div.w500 {max-width: 500px;}
div.w400 {max-width: 400px;}
ul.crumbspp {list-style-type:none; margin:0 0 0 -15px; padding:0; text-align:left; width:100%; height: 2.3em;}
ul.crumbspp li {float:left; font-size: .8em; line-height: 1.9em; padding: 0 0 0 .75em; color:#777; margin: 0;}
ul.crumbspp li a {display:block; padding:0 15px 0 0; background:url(images/crumbs.gif) no-repeat right center;}
ul.crumbspp li a:link, ul#crumbs li a:visited {text-decoration:none;color:#777;}
ul.crumbspp li a:hover, ul#crumbs li a:focus {color:#dd2c0d;}
ul.prodpage {margin:0 0 6px 0; width:100%;}
ul.argo{ width: 70%;margin: 0px 0 15px 260px; list-style-position: outside; /* border: 1px solid silver;*/ border: none;}
.withicons {list-style:none}
ul.argo li{ font: normal 1em/1.8em Arial, Helvetica, sans-serif;}
ul.withicons li {font:normal 1.2em/2.8em Arial, Helvetica,sans-serif; background-repeat: no-repeat; padding-left: 60px;background-position: 0 50%; background-size:45px 30px; background-origin:border-box;background-clip: border-box;}
ul.argo li.argochild{text-align:left;background-color:#dddddd;margin-bottom:10px;margin-top:10px;padding:4px 0;}
#footer footer {font: normal 1em/1.7em Arial, Helvetica, sans-serif; padding: 0; color: #ffffff; background-color: #0161a4; text-align: center; width: 85%;  margin: 0 0 0 15%; border: none;}
#footer a, #footer a:link, #footer a:visited, #footer a:hover, #footer a:active{color: #ffffff;}
#pooltileform { width: 82%; margin: 0 0 0 194px; /* border: 1px solid silver;*/ border: none;}
ul.withiconssidenav li {font:normal 1.2em/2.8em Arial, Helvetica,sans-serif; background-repeat: no-repeat; padding-left: 35px;background-position: 0 50%; background-size:30px 20px; background-origin:border-box;background-clip: border-box;}
ul.withiconssidenav li.sidenavsubs {padding-left: 45px; background-size:24px 16px;background-position: 5px 50%;}
img.brdbg {background-color: #FFFFFF; border-color: #515047; border:none; max-width:100%;}
.rnded { border-radius: 10px;}
.smallerp {font-size:smaller;}
h2[id] {padding-top:28px; margin:0; width: 96%;}
.popupstyle {text-align:center; margin: 0 auto 0 auto; padding: 0;border:none; background-color: white; height:100%;clear:both;}
p.popupcaption { text-align:center;max-width: 600px; margin: 0 auto; padding: 0;color:black;} 
img.logolink {position:relative;top:5px;}
a.logop {height:18px;}
.buttonstyle {-moz-box-shadow: 0px 1px 0px 0px #f0f7fa;	-webkit-box-shadow: 0px 1px 0px 0px #f0f7fa;box-shadow: 0px 1px 0px 0px #f0f7fa;background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #33bdef), color-stop(1, #019ad2));background:-moz-linear-gradient(top, #33bdef 5%, #019ad2 100%);background:-webkit-linear-gradient(top, #33bdef 5%, #019ad2 100%);background:-o-linear-gradient(top, #33bdef 5%, #019ad2 100%);background:-ms-linear-gradient(top, #33bdef 5%, #019ad2 100%);background:linear-gradient(to bottom, #33bdef 5%, #019ad2 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#33bdef', endColorstr='#019ad2',GradientType=0);background-color:#33bdef;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;border:1px solid #057fd0;display:inline-block;cursor:pointer;color:#ffffff;font-family:arial;font-size:15px;font-weight:bold;padding:6px 24px;text-decoration:none;text-shadow:0px -1px 0px #5b6178;}
.buttonstyle:hover {background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #019ad2), color-stop(1, #33bdef));background:-moz-linear-gradient(top, #019ad2 5%, #33bdef 100%);background:-webkit-linear-gradient(top, #019ad2 5%, #33bdef 100%);background:-o-linear-gradient(top, #019ad2 5%, #33bdef 100%);background:-ms-linear-gradient(top, #019ad2 5%, #33bdef 100%);background:linear-gradient(to bottom, #019ad2 5%, #33bdef 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#019ad2', endColorstr='#33bdef',GradientType=0);background-color:#019ad2;}
.buttonstyle:active {position:relative;top:1px;}
.samp {color: #e8f484; line-height: 1em;}
.samp1 {color: #e8f484; line-height: 2em;}
.slidecontainer {width:100%; max-width: 810px; margin:0 auto;border:1px solid red;}
.minitable {	width: 100%; margin: 0 auto; border: 1px solid black; text-align:left;border-collapse: collapse;}
table.minitable td { border: 1px solid black;padding:4px;}
table.minitable td:nth-child(odd) {background-color:#dddddd; font-weight: bold; width: 20%;}
table.minitable td:nth-child(even) {background-color:#f5f8fd}
.newwin {font-size:75%;}
.tablebuttonmargin {margin: 6px 0 6px 0;}
.tablebuttonstyle {background-color:#1B70F3;font-weight:bold;padding:10px; border:1px solid #063F97;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;line-height: 2em;}
table.producttablev1 td a.tablebuttonanchortextstyle:link {text-decoration:none;color:yellow;}
table.producttablev1 td a.tablebuttonanchortextstyle:visited {text-decoration:none;color:yellow;}
table.producttablev1 td a.tablebuttonanchortextstyle:hover {text-decoration:underline;color:white;}
table.producttablev1 td a.tablebuttonanchortextstyle:active {text-decoration:none;color:yellow;}
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
.arrowup { color:red;}
.whichdirection {color:red; font-size:.7em; margin-right:6px;}
.lftmrgnzr {margin-left:0;}
.rotatearrow {display:inline-block;
/* Firefox */
-moz-transform: rotate(270deg);
/* IE */
-ms-transform: rotate(270deg);
/* Opera */
-o-transform: rotate(270deg);
/* Safari */
-webkit-transform: rotate(270deg);transform: rotate(270deg);}

hr { 
  display: block;
  width: 85%;
  margin: 0 0 0 194px;
  border-style: inset;
  border-width: 1px;
} 
/* MEDIA QUERIES START */
/* below Desktop Computers less than 1330px width */
@media only screen and (max-width: 1330px) {
.navwrapfixedtopmenu {width:100%; height: 30px; position: fixed; top: 0; left:0px; margin-left:0;}
.sidemenuwrapfixed {width: 12%; height: 1006px; position: fixed; top: 38px; left:0px; margin-left: 0;} 
.pagetopimagev2 {width: 100%; margin: 36px 0 -2px 16px; padding:0;  border: none; z-index:1;}
/*.pagetopimage {width: 80%;z-index:1; margin: 42px 0 0 200px;  border: none;}*/
ul#crumbs {width: 80%; z-index:1; margin: 42px 0 0 16%; /* border: 1px solid fuchsia;*/ border: none;}
ul#crumbstest{ width:80%; margin: 0 0 0 16%;}
h1 {width: 80%; margin: 0 0 0 16%;}
h2 {width: 80%;margin: 0 0 0 16%;}
h3 {width: 80%;margin: 0 0 0 16%;}
p {width: 80%;margin: 0 0 0 16%;/* border: 1px solid fuchsia;*/ border: none;}
table.producttable { width: 80%; max-width:970px;/* /* border: 1px solid fuchsia;*/ border: none; padding: 0;margin: 0 0 0 16%;}
table.producttable td { max-width: 200px;}
table.producttablev1 { width: 80%; padding: 0;margin: 0 0 0 16%;border-collapse:collapse; border:1px solid black;}
table.producttablev1 td { padding: 0.5%; border-collapse:collapse; border:1px solid black;}
table.producttablev1 tr td:nth-child(1) {width:150px; background-color:#dddddd;font: bold .8em/1.3em Helvetica, Arial, sans-serif}
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}	
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .9em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .9em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
ul.argo {width: 70%;margin: 5px 0 5px 24%;}
#footer footer {width: 83%; padding: 0; margin: 0 0 0 17%;/* border: 1px solid fuchsia;*/ border: none;}
#pooltileform { width: 80%; margin: 0 0 0 200px;/* border: 1px solid fuchsia;*/ border: none;}
hr {width:80%;margin: 0 0 0 16%;}
}
@media only screen and (max-width: 1023px) {
hr {width:80%;margin: 0 0 0 16%;}
body {font-size: 90%; line-height: 1.5em;}	
.pagetopimage {width: 80%; z-index:1; /* border: 1px solid black;*/ border: none; padding: 0;  margin: 42px 0 0 16%;}
h1 {width: 80%;/* border: 1px solid black;*/ border: none; padding: 0;  margin: 0 0 0 16%;}
h2 {width: 80%; /* border: 1px solid black;*/ border: none; padding: 0;  margin: 0 0 0 16%;}
h3 {width: 80%; /* border: 1px solid green;*/ border: none; margin: 0 0 0 16%; padding:0;}
ul.tiletypes {width:80%; list-style-type:none; margin:8px 0 0 16% }
p {width: 80%; /* border: 1px solid black;*/ border: none; padding: 0; margin: 0 0 0 16% }
table.producttable{ width: 80%;max-width:780px; /* border: 1px solid black;*/ border: none; padding: 0; margin: 0 0 0 16% }
/* not sure what this is meant to be but 16% is wrong table.producttable td { max-width: 16%}*/
table.producttablev1 { width: 80%; padding: 0; margin: 0 0 0 16% }
table.producttablev1 td { padding: 3px; border-collapse:collapse; border: 1px solid #000000;}
ul#crumbs {width: 80%;/* border: 1px solid black;*/ border: none; padding: 0; margin: 40px 0 0 16%}
table.producttablev1 tr td:nth-child(1) {width:16%; background-color:#dddddd;font: bold .8em/1.3em Helvetica, Arial, sans-serif}
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .8em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .8em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
ul#crumbstest{ width:80%; margin: 0 0 0 16%}
ul.argo {width: 70%; /* border: 1px solid black;*/ border: none; padding: 0; margin: 5px 0 5px 24%;}
#footer footer {width: 83%;  padding: 0;  margin: 0 0 0 17%; /* border: 1px solid black;*/ border: none;}
#pooltileform { width: 80%; margin: 0 0 0 16%; /* border: 1px solid black;*/ border: none;}
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
}
/* below Desktop Computers less than 880px width */
@media only screen and (max-width: 880px) {
.navwrapfixedtopmenu {width:100%; height: 30px; position: fixed; top: 0; left:0; margin-left:0;}
.sidemenuwrapfixed {width: 12.2%; height: 1006px; position: fixed; top: 37px; left:-2px; margin-left: 0;} 
.container {padding: 0;}
.pagetopimage {width: 80%; z-index:1; margin:42px 0 0 16%; border:none;}
h1 {width: 80%; border:none;  margin: 0 0 0 16%;}
h2 {width: 80%; border:none;  margin: 0 0 0 16%; padding:0;}
h3 {width: 80%; border:none;  margin: 0 0 0 16%; padding:0;}
ul.tiletypes {width:80%; list-style-type:none; margin:8px 0 0 16%;}
p {width: 80%; border:none; margin: 0 0 0 16%;}
table.producttable { width: 80%; margin: 0 0 0 16%; border:none;}
table.producttable tr {vertical-align: bottom;} 
table.producttablev1 { width: 80%; margin: 0 0 0 16%;}
table.producttablev1 td { padding: 3px; border-collapse:collapse; border: 1px solid #000000;}
ul#crumbs {width: 80%;  border:none; margin: 42px 0 0 16%;}
ul#crumbstest{ width:80%; margin: 0 0 0 16%;}
ul.argo {width:70%;  border:none; margin: 5px 0 5px 24%px;}
#footer footer {width:80%; padding: 0;  margin: 0 0 0 16%;   border:none;}
#pooltileform { width: 80%; margin: 0 0 0 16%;  border:none;}
table.producttable tr td:nth-child(1), table.producttable tr td:nth-child(2), table.producttable tr td:nth-child(3), table.producttable tr td:nth-child(4) {float:left;}
table.producttable tr td { width: 48%; padding: 0.2%;border: none; max-width: 300px; height: 100%;}
table.downalign tr,table.downalign tr td {vertical-align:bottom;}
table.producttable td:nth-child(odd) { clear:both;}
table.producttable td[colspan] { width: 96%; max-width: 96%; padding: 0 .5%; border: none;}
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
}
/* below TABLET */
@media handheld, only screen and (min-width: 667px) and (max-width: 767px) {
/* @media handheld, only screen and (max-width: 767px) {*/
body {font-size: 80%; -webkit-text-size-adjust: none;}
.row, body, .container {width: 100%; min-width: 0; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px;}
.row .twelvecol {width: auto; float: none; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px;}
/* above two lines were missing for a while */
.navwrapfixedtopmenu {position: fixed; height: 72px; top: 0; z-index: 100;}
.sidemenuwrapfixed {position: fixed; top: 74px; left:-2px;}
.pagetopimage {width: 80%; z-index:1; margin: 80px 0 0 16%; border:none;}
.pagetopimagev2 {width: 100%; margin: 74px 0 -3px 0px; padding:0;  border: none; z-index:1;}	
h1 {width: 78%; margin: 0px 0 0 16%;border:none;}
h2 {width: 80%; margin: 0px 0 2% 16%; padding: 0;border:none;}
ul.tiletypes {width:80%; list-style-type:none; margin:8px 0 0 16%;}
ul.argo { width: 60%;margin: 10px 0 10px 245px;border:none;}
ul#crumbs {width: 80%;list-style-type:none; border:1px solid yellow; height:2.3em; background-color: white;margin:80px 0 0 16% }
ul#crumbstest { margin: 0 0 0 16%}
ul.crumbspp { margin: 0 0 0 0}
p {width: 80%; margin: 0px 0 0 16%;border:none;}
table.producttable { width: 80%; margin: 0px 1% 2% 16%;border:none;}
table.producttablev1 { width: 80%; margin: 0px 1% 0 16% }
table.producttablev1 td { padding: 3px;border-collapse:collapse; border: 1px solid #000000;}
table.producttablev1 tr td:nth-child(1) {width:120px; background-color:#dddddd;font: bold .8em/1.3em Helvetica, Arial, sans-serif}
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .8em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .8em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
.row .twelvecol {width: auto; float: none;} 
#footer footer {width: 80%; padding: 0;  margin: 0 0 0 16%;border:none;}
#pooltileform { width: 80%; margin: 0 0 0 16%;border:none;}
table.producttable tr td:nth-child(1),table.producttable tr td:nth-child(3){float:left;}
table.producttable tr td:nth-child(2),table.producttable tr td:nth-child(4){float:left;}
table.producttable td { width: 48%; padding: 0.2%; border:none;}
table.producttable td:nth-child(odd) { clear:both;}
table.producttable td[colspan] { width: 96%; max-width:96%; padding: 0 .5%; border: none;}
h2[id] {padding-top:67px;}
.slidecontainer {width:100%; max-width: 700px; margin:0 auto;border:1px solid green;}
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
}
@media handheld, only screen and (min-width: 520px) and (max-width: 667px) {
body {font-size: 80%; -webkit-text-size-adjust: none;}
.row, body, .container {width: 100%; min-width: 0; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px;}
.row .twelvecol {width: auto; float: none; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px;}
.phonenumright, .phonenumright img {display: none;}
/*ul#css3menu3  li span img {display: none;}*/
.navwrapfixedtopmenu {position: fixed; height: 72px; top: 0; z-index: 100;}
.sidemenuwrapfixed {width: 85px; position: fixed; top: 74px;left:-2px;}
ul.withiconssidenav, ul.withiconssidenav li, ul.withiconssidenav li a {width:170px;}
.pagetopimage {width: 78%; margin: 80px  0 0 106px; /* border: 1px solid lime;*/ border: none;}
.pagetopimagev2 {width: 100%; margin: 74px 0 -3px 20px; padding:0;  border: none; z-index:1;}		
h1 {width: 78%; /* border: 1px solid lime;*/ border: none; margin: 0 0 0 106px;}
h2 {width: 78%;  /*border: 1px solid lime;*/ border: none; margin: 0 0 0 106px; padding: 0;}
h3 {width: 78%; border: none; margin: 0 0 0 106px; padding: 0;}
ul.tiletypes {width:78%; list-style-type:none; margin:10px 0 0 106px;}
ul.tiletypes li { margin: 2px;}
p {width: 78%; /* border: 1px solid lime;*/ border: none; margin: 0 0 0 106px;}
table.producttable{ width: 78%; /* border: 1px solid lime;*/ border: none; margin: 0 0 0 106px;}
table.producttablev1 { width: 78%; margin: 0 0 0 106px;}
table.producttablev1 td {  padding:  3px;border-collapse:collapse; border: 1px solid #000000;}
table.producttablev1 tr td:nth-child(1) {width:130px; background-color:#dddddd;font: bold .7em/1.3em Helvetica, Arial, sans-serif}
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
ul.argo { width: 70%;/* border: 1px solid lime;*/ border: none;  margin: 10px 0 10px 146px;}
ul#crumbs{width: 78%;list-style-type:none; /* border:1px solid lime; */ height:2.3em; background-color: white;margin: 80px 0 0 86px;}
ul#crumbstest { margin: 0 0 0 106px;}
ul.crumbspp { margin: 0 0 0 0}
#footer footer {width: 78%;  padding: 0;  margin: 0 0 0 106px;}
#pooltileform { width: 78%; margin: 0 0 0 106px; /* border: 1px solid lime;*/ border: none;}
table.producttable tr td:nth-child(1), table.producttable tr td:nth-child(2), table.producttable tr td:nth-child(3), table.producttable tr td:nth-child(4) {float:left;}
table.producttable td { width: 48%; padding: 0 .5%; border:none;}
table.producttable td:nth-child(odd) { clear:both;}
table.producttable td[colspan] { width: 96%; max-width:96%; padding: 0 .5%; border: none;}
h2[id] {padding-top:67px;}
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
hr {width:78%;margin: 0 0 0 106px;}
}
@media handheld, only screen and (max-width:530px) {
.navwrapfixedtopmenu {position: fixed; top: 0px;}
.sidemenuwrapfixed {width: 85px; position: fixed; top: 77px;left:-2px;}
.pagetopimage {width:70%; z-index:1; margin: 80px  0 0 106px; /* border: 1px solid maroon;*/ border: none;}
.pagetopimagev2 {width: 100%; margin: 74px 0 -3px 20px; padding:0;  border: none; z-index:1;} /*display:none;*/
h1 {width:70%; /* border: 1px solid maroon;*/ border: none;}
h2 {width:70%;/* border: 1px solid maroon;*/ border: none;}
h3 {width:70%; border: none;margin: 0 0 0 106px; padding: 0;}
ul.tiletypes {width:70%;  margin:0 0 0 106px;}
ul.tiletypes li { margin: 3px;}
p {width:70%;/* border: 1px solid maroon;*/ border: none;}
table.producttable { width: 70%; /* border: 1px solid maroon;*/ border: none; margin: 0 0 0 106px;}
table.producttablev1 { width: 70%; margin: 0 0 0 106px;}
table.producttablev1 td { padding:  3px;border-collapse:collapse; border: 1px solid #000000;}
table.producttablev1 tr td:nth-child(1) {width:110px; background-color:#dddddd;font: bold .7em/1.3em Helvetica, Arial, sans-serif}
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
ul.argo {width:60%;margin: 10px 0 10px 148px;/* border: 1px solid maroon;*/ border: none;}
ul#crumbs, ul#crumbstest  {width:70%; /* border: 1px solid maroon;*/ border: none;  height:2.3em; background-color: white; margin: 0px 0 0 106px;}
ul.crumbspp { margin: 0 0 0 0}
#footer footer {width: 70%;  padding: 0;  margin: 0 0 0 106px; /* border: 1px solid maroon;*/ border: none;}
#pooltileform { width: 70%; margin: 0 0 0 106px; /* border: 1px solid maroon;*/ border: none;}
table.producttable tr td:nth-child(1), table.producttable tr td:nth-child(2), table.producttable tr td:nth-child(3), table.producttable tr td:nth-child(4) {float:left;}
table.producttable td { width: 48%; padding: 0 .5%; border:none;}
table.producttable td:nth-child(odd) { clear:both;}
table.producttable td[colspan] { width: 96%; max-width:96%; padding: 0 .5%; border: none;}
h2[id] {padding-top:67px;}
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
}
/* below is layout for MOBILE PHONE version   */
@media handheld, only screen and (min-width: 320px) and (max-width: 520px) {
body {font-size: 70%; -webkit-text-size-adjust: none;}
.row, body, .container {width: 100%; min-width: 0; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px;}
.row .twelvecol {width: auto; float: none; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px;}
/*ul#css3menu3  li span img {display: none;}*/
.pagetopimagev2 {width: 100%; margin: 142px 0 -3px 36px; padding:0;  border: none; z-index:1;} /*display:none;*/
.navwrapfixedtopmenu {position: fixed; top: 0px; left:0px;}
.sidemenuwrapfixed {width: 85px; position: fixed; top: 77px;}
.smartonly {display:block;position: fixed; top: 70px; left: 116px;}
.smarttaps {text-align: center; padding:  0 ; margin: 7px auto 0 auto; font-size: 2.2em; line-height: 2.5em; font-family: Arial, Helvetica, sans-serif; color: #ffffff; background-color: #0b8ee9;border: 1px solid #000000; width: 64%;}
.smarttaps a, .smarttaps a:link, .smarttaps a:visited {text-decoration:none; color:white; display:block;}
.smarttaps a:hover, .smarttaps a:active {color:#075f9d;}
.smarttaps img {margin: 0px 14px 0px 0; vertical-align:text-bottom;}
.call { background-image: url(images/phoneicon.png); background-color: #0b8ee9; background-position: 5px; background-repeat: no-repeat; background-clip: border-box; padding-left: 34px;}
.desktopandtablet {display:none;}
.smartheaderonly {display: block; max-width: 100%; height: auto; background-color: white; margin: 0 auto;}
h1 {width: 70%;margin: 0 0 0 100px; /* border: 1px solid teal;*/ border: none;}
h2 {width: 70%;margin: 0 0 0 100px; padding:0;/* border: 1px solid teal;*/ border: none;}
ul.tiletypes {width:70%;  margin:0 0 0 100px;}
ul.tiletypes li { margin: 5px;}
ul.argo {width: 60%;margin: 10px 0 10px 148px; /* border: 1px solid teal;*/ border: none;}
p {width: 70%;margin-left: 100px; /* border: 1px solid teal;*/ border: none;}
table.producttable { width: 70%; /* border: 1px solid teal;*/ border: none; margin: 0 0 0 100px;}
table.producttablev1 { width: 70%; margin: 0 0 0 100px;}
table.producttablev1 td { padding: 2px;border-collapse:collapse; border: 1px solid #000000;}
table.producttablev1 tr td:nth-child(1) {width:110px; background-color:#dddddd;font: bold .7em/1.3em Helvetica, Arial, sans-serif}
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
ul#crumbs, ul#crumbstest  {width: 70%;font-size:.8em;line-height:1.3em; margin: 0px 0 0 100px; /* border: 1px solid teal;*/}
ul.crumbspp { margin: 0 0 0 0}
#footer footer {width: 70%; padding: 0; margin: 0 0 0 100px; /* border: 1px solid teal;*/ border: none;}
#pooltileform { width: 70%; margin: 0 0 0 100px; /* border: 1px solid teal;*/ border: none;}
table.producttable tr td:nth-child(1), table.producttable tr td:nth-child(2), table.producttable tr td:nth-child(3), table.producttable tr td:nth-child(4) {float:left;}
table.producttable td { width: 48%; padding: 0 .5%; border:none;}
table.producttable td:nth-child(odd) { clear:both;}
table.producttable td[colspan] { width: 96%; max-width:96%; padding: 0 .5%; border: none;}
h2[id] {padding-top:67px;}
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
hr {width:70%;margin: 0 0 0 100px;}
}
@media handheld, only screen and (min-width: 315px) and (max-width: 391px) {
body {font-size: 70%; -webkit-text-size-adjust: none;}
/*fix below from 97px to 107px to fix phone number being too high*/
.smartonly {display:block; position: fixed; top: 107px; left:auto; right:0; white-space: nowrap;}
.navwrapfixedtopmenu {position: fixed; top: 0;}
.sidemenuwrapfixed {width: 85px; position: fixed; top: 107px;left:-2px;}
.pagetopimagev2 {width: 100%; margin: 176px 0 -3px 36px; padding:0;  border: none; z-index:1;} /*display:none;*/
.smarttaps {text-align: center; padding:  0 ; margin: 7px auto 0 auto; font-size: 2.2em; line-height: 2.5em; font-family: Arial, Helvetica, sans-serif; color: #ffffff; background-color: #0b8ee9;border: 1px solid #000000; width: 64%;}
h1 {width: 70%; margin: 0 0 0 94px; padding: 0; border: none;}
h2 {width: 70%; margin: 0 0 0 94px; padding:0; border: none;}
h3 {width: 70%; margin: 0 0 0 94px; padding:0; border: none;}
ul.tiletypes {width:70%;  margin:50px 0 0 94px;}
ul.tiletypes li {font-size: 1.3em;}
ul.argo {width: 54%;margin: 0 0 0 128px;  border: none;}
p {width: 70%;margin: 0 6px 0 94px;  border: none;}
table.producttable{ width: 70%;  border: none; margin: 0 0 0 94px;}
table.producttablev1{ width: 70%;  margin: 0 0 0 94px;}
table.producttablev1 td { padding: 2px;border-collapse:collapse; border: 1px solid #000000;}
table.producttablev1 tr td:nth-child(1) {width:110px; background-color:#dddddd;font: bold .7em/1.3em Helvetica, Arial, sans-serif}
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
ul#crumbs, ul#crumbstest  {width: 70%;font-size:.8em;line-height:1.8em; margin: 0px 0 0 98px; /*border: 1px solid navy;*/}
ul.crumbspp { margin: 0 0 0 0}
#footer footer {width: 70%; padding: 0; margin: 0 0 0 98px;  border: none;}
#pooltileform { width: 70%; margin: 0 0 0 98px;  border: none;}
table.producttable td { width: 48%; padding: 0 .5%; border:none;}
table.producttable td:nth-child(odd) { clear:both;}
table.producttable td[colspan] { width: 96%; max-width:96%; padding: 0 .5%; border: none;}
h2[id] {padding-top:105px;} 
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
hr {width:70%;margin: 0 6px 0 94px;}
}
@media handheld, only screen and (max-width: 315px) {
.row, body, .container {width: 100%; min-width: 0; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px;}
.row .twelvecol {width: auto; float: none; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px;}
.smartonly {display:block;position: fixed; top: 107px; left: 82px; whitespace: nowrap;}
.smarttaps {text-align: center; padding: 14px 0 ; margin: 7px auto 0 auto;font-size: 2.2em; line-height: 1.5em; font-family: Arial, Helvetica, sans-serif; color: #fffff; border: 1px solid #000000; width: 60%;}
.smarttaps a, .smarttaps a:link, .smarttaps a:visited {text-decoration:none; color:black;}
.smarttaps a:hover, .smarttaps a:active {color:red;}
.call { background-image: url(images/phoneicon.png); background-color: #0b8ee9; background-position: 5px; background-repeat: no-repeat; background-clip: border-box; padding-left: 34px;}
.desktopandtablet {display:none;}
.smartheaderonly {display: block; max-width: 100%; height: auto; background-color: white; margin: 0 auto;}
.sidemenuwrapfixed {width: 85px; position: fixed; top: 107px;left:-2px;}
.pagetopimagev2 {width: 100%; margin: 176px 0 -3px 36px; padding:0;  border: none; z-index:1;}
/*display:none;*/
h1 {width: 67%; margin: 0 0 0 86px; padding: 0; border: none;}
h2 {width: 67%; margin: 0 0 0 86px; padding:0; border: none;}
h3 {width: 67%; margin: 0 0 0 86px; padding:0; border: none;}
ul.argo {width: 54%;margin: 0 0 0 128px;  border: none;}
p {width: 67%;margin: 0 6px 0 86px;  border: none;}
ul#crumbs, ul#crumbstest  {width: 67%;font-size:.8em;line-height:1.3em; margin: 0px 0 0 86px;}
table.producttable{ width: 67%;  border: none; margin: 0 0 0 86px;}
table.producttablev1{ width: 67%;  margin: 0 0 0 86px;}
table.producttablev1 td { padding: 2px;border-collapse:collapse; border: 1px solid #000000;}
table.producttablev1 tr td:nth-child(1) {width:110px; background-color:#dddddd;font: bold .7em/1.3em Helvetica, Arial, sans-serif}
table.pricemod tr td:nth-child(1),table.pricemod tr td:nth-child(3), table.pricemod tr td:nth-child(4){width:25%; font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
table.pricemod tr td:nth-child(2){ font: normal .7em/1.3em Helvetica, Arial, sans-serif;background-color:white;}
#footer footer {width: 67%; padding: 0; margin: 0 0 0 98px;  border: none;}
#pooltileform { width: 67%; margin: 0 0 0 98px;  border: none;}
table.producttable td { width: 48%; padding: 0 .5%; border:none;}
table.producttable td:nth-child(odd) { clear:both;}
table.producttable td[colspan] { width: 96%; max-width:96%; padding: 0 .5%; border: none;}
h2[id] {padding-top:105px;} 
table.producttablev1 tr td.whitebgcentred {text-align:center; background-color:#ffffff;}
}
@media handheld, only screen and (max-height:600px) {
/* .sidemenuwrapfixed {position: absolute; width: 100px; top: 107px; margin:0;padding:0;border:none; overflow:visible;}
.sidemenuwrapfixed {width: 155px; height: 1006px; position: fixed; top: 41px; left: 50%; margin-left: -665px; overflow: visible; z-index: 9;} */
/* below as -73px now -95px */
.sidemenuwrapfixed {width: 85px; height: 600px; position: absolute; top: -95px; left:-2px;  margin-left:0; overflow: visible; z-index: 9;} 
/*possible solution to mobile phone portrait view losing a lot of space below the side navigation*/
table.stackonly{ width: 100%;  border: none; margin: 0 0 0 0px;}
/*.pagetopimage,h1,h2,ul.argo,p,table.producttable,ul#crumbs {margin-left:100px;} */
#footer footer {width: 100%; padding: 0; margin: 0px; border: none;}
}