@charset "UTF-8";
/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* modified to add qualified <img> class for dynamic resizing by ABM, 2014-01-10.
*/


/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

body {
	background-color: #1b354e;  
	height: 100%;
	font-family: "Helvetica Neue", arial, helvetica, geneva, swiss, sunsans-regular, sans-serif;
	font-size: 13px; color:#333333; line-height: 130%;
}

.container { background-color: white; 
-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
}
.container .columns  { margin-left: 0px; }

/*** header area ***/
/*   -----------   */

header { top: 0; left: 0; width: 960px; height: 136px; 
background-color: white;
}

header h1 { line-height: 120%;  margin: 7px 7px 2px 7px; }
header p  { line-height: 120%;  margin: 2px 7px 3px 7px; }

#logo {
	padding-left: 0px;
	float: left;
}

#mobile-logo {
	display:none;
}

#phone-header { 
	right: 20px;
	position: absolute;
	margin: 16px 0 32px 0px;	
}
ul#social-icons {
	padding-left: 50px;
}

#social-icons li {
	padding-left: 10px;
	display: inline;
}


/*** navigation  ***/
/*   -----------   */


.button a:hover { color: #25696f;  text-decoration: none;}

button.more { margin-right:30px;}


/*** selector navigation ***/
/*   -----------   */

#selector{ 
	margin-left: 10px;
	width: 200px; 	 
	height: 160px;
	background:#34929a;
    border-radius: 5px 20px;
	box-shadow:10px 10px 50px 20px rgba(0,0,0,0.3) inset;
	/* outline:1px solid orange;   bill used for testing */
}

#selector:hover{ 
	height: 160px;
    border-radius: 5px 25px;
	box-shadow:10px 10px 50px 20px rgba(0,0,0,0.3) inset;
}


#selector ul {
	display: inline;
	cursor:pointer;
}

#selector ul>li {
	position: relative;
	margin: 0 0 0 10px;   
	display: inline;
	padding: 0 0 0 0;
	top:5px;
	width: 190px;
	font-family: "Helvetica Neue", arial, helvetica, geneva, swiss, sunsans-regular, sans-serif;
	font-size: 15px;
	font-weight: bold;
	color:white;
	list-style-type: none;
	text-align:center;
	/* outline:1px solid red;  bill used for testing */

}

#selector li ul.dropdown { 
	position: absolute;
	margin: 0 auto;
	display: block; /*  none reveal dynamically */
	left: 0; 
	top: 18px;
	z-index: 100;
	/*   outline:1px solid blue; bill used for testing */
	cursor:pointer;
}

#selector:hover li ul.dropdown { 
	display: block; /*  none reveal dynamically */
	cursor:pointer;
}


#selector li li {
	display: block;
	height: 30px;
	width: 150px;
	margin: 10px 0 0 0;
	list-style-type: none;
	text-align:center;
	color:white;
	padding: 0 10px 0 10px;
	background-color: #bfdd67;
    border-radius: 5px 5px;
	box-shadow:2px 10px 2px 10px rgba(255,255,255,0.3) inset;
	/*  outline:1px solid orange;  bill used for testing */
}

#selector li li a{
	color:#000066;
}

#selector li li:hover a{
	color:#ea7800;
}

#selector li li:hover {
	background-color: #fff;
}

.app-selector {
	display:inline-block;
	width: 145px;
	margin: 0 0 0 10px;
	vertical-align:text-top;
}


/*** main content area ***/
/*   -----------------   */

div#main-content { width: 780px; min-height: 500px; float: right;
}

div#left-sidebar { width: 180px; min-height: 500px;  min-width: 159px; float: left;
}


div#main-content-home { width:none; min-height: 500px; float: right;
}

div#left-sidebar-home { width:none;  margin-top: 80px; height:700px;  min-width: 159px; float: left;
}




#fbfeed { 
	width:100%;
	margin:0; 
	float: left;
}

div#slideshow {
	width: 960px;
}

div#slideshow img {

-webkit-box-shadow: 0px 15px 15px -10px rgba(0,0,0,0.6);
-moz-box-shadow: 0px 15px 15px -10px rgba(0,0,0,0.6);
box-shadow: 0px 15px 15px -10px rgba(0,0,0,0.6);

}

.content-cell {
	display:inline-block;
	width:275px;
	text-align:center;
	margin-right:25px;
	margin-bottom:10px;
}

.smaller-cell {
	width:200px;
}

.schedule-button { /* Bill modified 2019-10-24 */
	background-color: #269bac;
	border-radius: 5px;
	-webkit-box-shadow: 0px 0px 20px 0px #c0dc6e;
	-moz-box-shadow: 0px 0px 20px 0px #c0dc6e;
	box-shadow: 0px 0px 5px 2px #c0dc6e;
	color: white;
	font-size: 18px;
	margin: 15px;
	padding: 5px;
	text-align:center;
	width:50%;
	display:inline-block;
}

.schedule-button:active, .schedule-button:hover { /* Bill modified 2019-10-24 */
	background-color: #9fd7dd;
	color: #1b354e;
}

.schedule-button a, .schedule-button a:visited { /* Bill modified 2019-10-24 */
	display:inline-block; /* this allows the css width element to be applied to the a tag */
	color: white;
	width:100%;/* this expands the a tag to fill the entire div so the cursor is active over the whole button, not just the text */
	/*   outline:1px solid red; 	bill used for testing */
}

.schedule-button a:active, .schedule-button a:hover { /* Bill modified 2019-10-24 */
	color: #1b354e;
}

.biomat-button { /* Bill modified 2019-10-24 */
	background-color: rgb(92,19,132);
	border-radius: 5px;
	-webkit-box-shadow: 0px 0px 20px 0px #c0dc6e;
	-moz-box-shadow: 0px 0px 20px 0px #c0dc6e;
	box-shadow: 0px 0px 5px 2px #c0dc6e;
	color: white;
	font-size: 18px;
	line-height: 1.3em;
	margin: 15px;
	padding: 5px;
	text-align:center;
	width:50%;
	display:inline-block;
}


.biomat-button:active, .biomat-button:hover { /* Bill modified 2019-10-24 */
	background-color: rgb(107,72,117);
	color: #660000;
}

.biomat-button a, .biomat-button a:visited { /* Bill modified 2019-10-24 */
	display:inline-block; /* this allows the css width element to be applied to the a tag */
	color: white;
	width:100%;/* this expands the a tag to fill the entire div so the cursor is active over the whole button, not just the text */
	/*   outline:1px solid red; 	bill used for testing */
}

.biomat-button a:active, .biomat-button a:hover { /* Bill modified 2019-10-24 */
	color: #dddddd;
}




/*** footer area ***/
/*   -----------   */
#app-banners {
	display: none;
}


div#footer { 
	width: 960px; height: 90px; 
	}

div#footernav {  margin-top: 15px; text-align: center;background-color:white;
}

#footernav ul {
	margin: 0;
	list-style: none;
	font-family: Arial, Helvetica, sans-serif;
}

#footernav ul li {
	margin: 0;
	padding: 0;
	display: inline;
}

#footernav ul li a {
	text-decoration: none;
	color: #666666;
	font-size: 12px;
	font-weight: bold;
}

#footernav ul li a:hover {
	text-decoration: none;
	color: #711701;
}

#footernav p {
	margin-top: 0;
	color: #666666;
	font-size: 12px;
	text-align: center;
}



/* #Page Styles
================================================== */

p	{ margin: 10px 7px 2px 7px; }

blockquote { color: #333333; }
h1	{ font-family: "Helvetica Neue", arial, helvetica, geneva, swiss, sunsans-regular, sans-serif; font-size: 18px; line-height: 120%; font-weight: bold; margin-left: 7px; margin-right: 7px; padding-top: 24px;}
h2	{ font-family: "Helvetica Neue", arial, helvetica, geneva, swiss, sunsans-regular, sans-serif; font-size: 16px; line-height: 140%; font-weight: bold; font-style: italic; margin-left: 7px; margin-right: 7px; }
h3	{ font-family: "Helvetica Neue", arial, helvetica, geneva, swiss, sunsans-regular, sans-serif; font-size: 14px; line-height: 120%; font-weight: bold; margin-left: 7px; margin-right: 7px; }

a, a:visited	{ color: #eb5366; text-decoration: none; }
a.trigger, a:visited.trigger	{ color: #50a2b4; text-decoration: none; }
a:hover { color: #ee8653;  text-decoration: none;}
a:active { color: #ff0000; }
a.trigger#walkin, a:visited.trigger#walkin	{ color: #711701; text-decoration: none; }


.bubble {
	display: none;
}

.trigger {
	display: inline;
	border-bottom: dotted #711701 2px;
}

#news-box {
	margin-left: 20px; margin-right: 20px;
	width: 0 auto;
	background-color:#FFFF99;
	outline:2px black solid;
}

.price-table-font {
	color: white;
	font-style: verdana;
	font-size: 14px;
	font-weight: bold;
}

#walkin {
	display: inline;
	border-bottom: none;
}

.modal-thumb  { float: left; padding-right:5px; padding-bottom:5px;}

div#left-image  {  width: 210px; height: 272px; float: left; }
div#right-image     { padding-left: 5px; width: auto; float: right; }
div#right-image p    { font-size:12px;}

div#right-image     { float:right; }
div#right-image-l     { padding-left: 10px; width: 400px; float: right; }
div#right-image-ll     { padding-left: 10px; width: 450px; float: right; }

#main-content p { font-size: 16px; color: #666666; line-height: 150%;  margin: 10px 7px 2px 7px; 
	font-family: "Helvetica Neue", arial, helvetica, geneva, swiss, sunsans-regular, sans-serif;
}
#main-content .seo  { font-size: 11px; color: #666; line-height: 120%;  margin: 10px 7px 2px 7px; }
#main-content #indented 	{ text-indent: 35px; font-size: 14px }
#main-content li	{ margin-left: 35px; font-size: 14px; list-style-type: disc; }

#left-sidebar h2   { font-size: 16px; font-style: italic; line-height: 120%;   margin: 10px 7px 2px 5px; font-weight: bold; }
#left-sidebar-home p { font-size: 14px;
}

#footer h1 { font-size: 12px; 
	color: #666666;
	line-height: 120%; text-align: center; margin: 0px 7px 2px 7px; }

#footer h2	{ 
	font-family: "Helvetica Neue", arial, helvetica, geneva, swiss, sunsans-regular, sans-serif; 
	font-size: 16px; 
	line-height: 120%; 
	font-weight: bold; 
	font-style: italic; 
	margin-left: 7px; 
	}

#footer p  {
	font-size: 12px;
	color: #666666;
	line-height: 120%;
	text-align: center;
	margin: 5px 7px 2px 7px;
}

.container {
/* 	position: relative;  -- set in skelton.css */
}
.bubble {
	position: fixed; top: 0; left: 0;
	display: block;
	visibility: hidden;
	z-index: -10000;
	margin: 0;
	border: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(200,200,200,0.2);
	text-align: center; /* center the bubble content container */
}
.bubble:target,
.bubble.active {
	z-index: 10000;
	visibility: visible;
}
.bubble > div { /* bubble content container */
	position: absolute;  top: 5%; left: 0;
	display: inline-block;
	margin: 0;
	padding: 2em;
	max-width: 250px;
	background-color: white;
	text-align: left;
	overflow: auto;
	border: 2px solid #50a2b4;
	border-radius: 1em;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.6);
}
.bubble a[href='#'] { /* "Close" */
	display: block; 
	text-align: right; 
	font-weight: bold;
	margin-bottom: 0;
	padding-bottom: 0;
}

.red { color: #BA0303; font-weight: bold; }

.indent-block { padding-left: 20px;}

.caption   { color: #06357a; font-size: 10px; font-style: italic; 
				text-align: center; width: auto; }

.quote  { line-height: 20px; font-style: italic; }

.highlight { background-color: #bfe7ed;
	width: auto;
	padding: 0 30px 0 30px;
	}

.smallcaps { font-variant: small-caps; } 
.cartoon { color: red }
.teal { color: #39949A; font-size: 16px }

.phone { font-size: 24px; font-weight: bold; text-align: center; margin-top: 5px;  }
.phone a { text-decoration: none; color: white; }

.location-hours {
	float: left;
	background-color: #39949A; 
	font-weight: bold; 
	font-size: 12px; 
	margin: 0; 
	text-align: center; 
	padding: 5px 0px 5px 0px;
}

.special { 
	margin: 20px 0 0 0px; 
	padding-left: 0px;
}

.special ul {
	margin: 0px 0px 0 10px; 
	padding-left: 10px;
	list-style-type: disc;
	font-size: 11px; 
}

.special li {
	line-height: 11px; 
}

.sidesub  {
	font-size: 13px; 
	padding-bottom: 20px;
	font-weight:bold;
}

.icon-free {
	margin: 20px 12px 0 12px; padding-right: 8px; float: right;
}

img.team {
	padding-right: 10px;
}

.small-pix {
	display: none;
}

iframe.blog { 
	padding-left:10px; 
	border:0;
	}



/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
	
	
	div#slideshow {
	width: 959px;
	}

}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	

	
	header { top: 0; left: 0; width: 768px; height: 140px; 
	}
		
	
	div#main-content {
		width: 590px;  min-height: 440px; 
	}
	
	div#left-sidebar {  width: 168px;
	}
	
	
	div#footer { 
	 left: 0; width: 768px; height: 50px; 
	  padding-bottom: 40px; 
	}

	div#slideshow {
	width: 768px;
	}
		
	img.special {
		width: 270px;
	}
	
	.icon-free { margin: 0; padding-right: 10px;
	}
	
	img.pic {
		max-width: 570px;
	}
	
	iframe.blog { 
	width: 740px;
	padding-left:10px; 
	border:0;
	}

	div#right-image     { float:left; }

}

	/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {

	div#footer { 
	 	left: 0; width: 600px; height: 130px; 
	  padding-bottom: 130px; 
	}
	
	div#slideshow {
	width: 767px;
	}
	
	img.special {
		width: auto;
		min-width: 360px;
	}
	
	div#right-image     { float:left; }

	.special .quote  { font-size: 12px; }

}
	
	
	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

	#app-banners {
	display: block;
	}

	.container { width: 410px;
	}
	
	
	header { max-width: 410px;
    	background-image: url(none);
	}

	.button {
	font-size: 24px;
	text-align: center;
	min-width: 388px;
	margin-top: 2px;
	}

	.secondary {
	font-size: 24px;
	text-align: center;
	min-width: 350px;
	margin-left:20px;
	}
	

	div#main-content {
		width: 400px;   padding-right: 10px;
	}
	

	.special { 
		margin: 20px 0 0 0px; 
		padding-left: 10px;
	}


	
	div#left-sidebar {   width: 410px;
	}
	
	.location-hours { margin-top: 20px;
	}

	div#left-sidebar p { font-size: 13px; 
	}

	
	#store-info h1.phone {
		display: none;
	}
	
	div#slideshow {
	width: 410px;
	}
	
	div#footer { 
	 left: 0; width: 400px; height: 130px; 
	  padding-bottom: 130px; 
	}
	
	.small-pix {
		width: 200px;
		display: block;
		float: right;
	}
	
	.small-pix img { width: auto; padding-top: 40px; padding-bottom:20px;
	}
	
	.icon-free { display: none;
	}
	
	img.pic {
		min-width: 370px;
		width: 370px;
	}

	iframe { 
	width: 95%;
	}
	
	div#right-image     { float:left; }

	#mobile-logo {
	display:block;
	float:left; 
	padding-bottom:20px;
	}

	#side-logo {
	display:none;
	}

}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	
	.app-selector {
	margin: 10px 0 0 10px;
	vertical-align:text-top;
	}

	
	#app-banners {
	display: block;
	}

	#phone-header { 
	right: 0px;
	position: absolute;
	margin: 6px 0 32px 0px;
	}
	
	#phone-header h1 {
	font-size: 16px;	
	}
	
	.phone {
		padding-left: 6px;
	}
	
	ul#social-icons {
	padding: 4px 0 0 20px;
	}
	
		
	header { max-width: 300px;
    	background-image: url(none);
		height:122px;
	}
	
	.button {
	font-size: 24px;
	text-align: center;
	min-width: 278px;
	margin-top: 2px;
	}

	.secondary {
	font-size: 24px;
	text-align: center;
	min-width: 240px;
	margin-left:20px;
	}
	

	div#main-content {
		width: 290px;  padding-right: 0;
	}

	div#left-sidebar { width: 300px;
	}
		
	div#footer { 
	 left: 0; width: 290px; height: 130px; 
	 margin-bottom: 130px; 
	}
	
	#store-info h1.phone {
		display: none;
	}
	
	div#slideshow {
	width: 300px;
	}
	
	.small-pix {
		display: block;
		padding-top: 10px;
		float: right;
	}

	
	.icon-free { 
	display: none;
	}

	img.pic {
		min-width: 270px;
		width: 270px;
	}
	

	.optional { 
	display: none;
	}
	
	iframe { 
	width: 90%;
	}

	div#right-image     { float:right; }

	#mobile-logo {
	display:block;
	float:left; 
	padding-bottom:20px;
	}

	#side-logo {
	display:none;
	}

	#logo img{
	height: 101px;
	}

	#mainnav {
		top:102px; 
	}

}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/