/*------------------------------------------------------------

Responsive Style Sheet

version:	1.0
author:		derek allard
email:		derek@tunnel7.com
website:	http://www.tunnel7.com

------------------------------------------------------------*/

/* 1 line tricks - DELETE THESE BEFORE GO LIVE 
http://www.cssglobe.com/post/1392/8-premium-one-line-css-tips

VERTICALLY CENTERS CONTENT IN BOX (IN THIS CASE THE BOX WOULD BE 24 PIXELS TALL)
line-height:24px; 

= = =

PREVENTS OVERSIZED CONTENT TO BREK FIXED WIDTH FLOATED LAYOUTS
#main{overflow:hidden;}

= = =

PREVENTS LINE BREAKS IN LINKS
a{white-space:nowrap;}

= = =

ALWAYS SHOW FIREFOX SCROLLBAR
html{overflow:-moz-scrollbars-vertical;}

= = =

REMOVE VERTICAL TEXTAREA SCROLLBAR IN IE
textarea{overflow:auto;}

= = =

FORCE PAGE BREAKS WHEN PRINTING YOUR DOCUMENT
h2{page-break-before:always;}

= = =

REMOVE ACTIVE LINK BORDERS
a:active, a:focus{outline:none;}


*/

/* ======= RESET STYLES ======= */

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* ======= WEB FONTS ======= */

@font-face {
    font-family: 'chunkfive';
    src: url('/images/fonts/Chunkfive-webfont.eot');
    src: url('/images/fonts/Chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
         url('/images/fonts/Chunkfive-webfont.woff') format('woff'),
         url('/images/fonts/Chunkfive-webfont.ttf') format('truetype'),
         url('/images/fonts/Chunkfive-webfont.svg#ChunkFiveRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'nevis';
    src: url('/images/fonts/nevis-webfont.eot');
    src: url('/images/fonts/nevis-webfont.eot?#iefix') format('embedded-opentype'),
         url('/images/fonts/nevis-webfont.woff') format('woff'),
         url('/images/fonts/nevis-webfont.ttf') format('truetype'),
         url('/images/fonts/nevis-webfont.svg#webfontbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* ======= GLOBAL STYLES ======= */


body {
	font: normal 100% arial, helvetica, sans-serif; /* sets to 16px baseline */
	background-color: #fff;
	color: #404040;
	line-height: 1.5em;
	position: relative; 
	-webkit-font-smoothing: antialiased;
}

body { /* default */
	background: #fff url('/images/bg-large-interior-v3.jpg') no-repeat fixed center top;
}

body#homepage {
	background: #000 url('/images/bg-large-home-v3-tall-black.jpg') no-repeat center top;	
}

body#landing {
	background: #fff url('/images/bg-large-landing-v3.jpg') no-repeat fixed center top; 
}

body.about {
	background: #fff url('/images/bg-large-interior-v3.jpg') no-repeat fixed center top;
}

body.design-therapy {
	background: #fff url('/images/bg-large-interior2-v3.jpg') no-repeat fixed center top;
}

body.blog {
	background: #fff url('/images/bg-large-interior5-v3.jpg') no-repeat fixed center top;
}	 

body.case-studies {
	background: #fff url('/images/bg-large-interior4-v3.jpg') no-repeat fixed center top;
}

body.collections {
	background: #fff url('/images/bg-large-interior3-v3.jpg') no-repeat fixed center top;
}

body.contact {
	background: #fff url('/images/bg-large-interior6-v3.jpg') no-repeat fixed center top;
}

h1 {  
	font: normal 2.25em nevis, arial, helvetica, sans-serif; /* 36 / 16 */
	color: #404040; 
}
 

h2 {    
	font: normal 1.5em nevis, arial, helvetica, sans-serif; /* 24 / 16 */
	color: #f05816;
	margin: 1em 0 0 0;
}

h3 {  
	font: normal 1.125em nevis, arial, helvetica, sans-serif; /* 18 / 16 */
	color: #f05816;
	margin: 1.25em 0 0 0;
}

h4, h5, h6 {  
	font: normal 0.875em nevis, arial, helvetica, sans-serif; /* 14 / 16 */ 
	margin: 1.5em 0 0 0; 
}


a:link, a:visited {
	color: #16aef0; 
	text-decoration: none;
}

a:hover, a:active {
	color: #0c77a5;
	color: #f05816;
}

.fullwidth:after,
.wrap:after, 
.main:after { /* to ensure there is a character written after so that element contains floated elements */
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

input.test { /* to hide test field on forms to prevent spam - may want to text indent it into oblivion - think i read that some browsers choke on display none*/
	display: none;
	visibility: hidden;
}

#accessnav { 
	display: none;  
}

p, li, dd, dt, blockquote, legend, caption, th, td {
	font-size: 0.875em; /* 14 / 16 */ 
}

p, ul, ol, dl {
	margin: 1em 0;
}

ul ul,
ul ol,
ol ol,
ol ul {
	margin: 0;
}

img, embed, object, video {
	max-width: 100%;		
}

li li { /* ensures no double font ineritance */
	font-size: 1em;
}

ul li { /* put back bullets */
	margin-left: 2em;
	list-style: disc inside;
}

ol li { /* put back numbers */
	margin-left: 2em;
	list-style: decimal inside;
}

em, i {
	font-style: italic;
}

strong, b {
	font-weight: bold;
}

blockquote {
	
}

/* ======= LAYOUT GRID STYLES======= */

.fullwidth {
	width: 100%; 
}

.wrap { 
	margin: auto; 
	width: 90%;	
	/* width: 960px;  TURN THIS ON AND COMMENT OUT MEDIA QUERIES TO HAVE A TRUE FIXED WIDTH */
	max-width: 960px;  
	/* background: #fff url('../i/wrap_shadow.png') no-repeat bottom right; */
	position: relative;
}

.main {
	width: 100%;
	float: left;
}

.main .subnav { /* 250 */
	width: 21.354%; /* 205 / 960 */
	padding: 2.4em 2.083% 2em 2.604%; /* rt = 20 / 960 ... lt = 25 / 960 */
	float: left;
}

#homepage .main .subnav { /* 330 */
	width: 30.729%; /* 295 / 960 */
	padding: 2.4em 1.042% 2em 2.604%; /* rt = 10 / 960 ... lt = 25 / 960 */ 
}

.main #content { /* 710 */ 
	width: 66.666%; /* 640 / 960 */
	padding: 1em 2.604% 2em 4.688%; /* rt = 25 / 960 ... lt = 45 / 960 */
	margin-bottom: 7em; 
	float: left;
	min-height: 700px; /* to ensure taller than sidebar */
}

#homepage .main #content {
	width: 65.625%; /* 630 / 960 */
	position: relative;
	padding: 0;
}

.main .sidebar { /* 203 */
	width: 25.938%; /* 166 / 640 */
	margin-left: 1.563%; /* 10 / 640 */
	padding-left: 4.219%; /* 27 / 640 */
	background: url('/images/bg-vertical-sidebar.png') no-repeat left top;
	min-height: 402px; /* height of bg image */
	float: right; 
}

#landing .sidebar-lt { /* 250 */
	float: left;
	width: 21.354%; /* 205 / 960 */
	padding: 0 2.083% 0 2.604%; /* rt = 20 / 960 ... lt = 25 / 960 */
}

#landing #content { /* 480 */
	float: left;
	width: 46.354%; /* 445 / 960 */
	padding: 0 2.083% 0 1.5625%; /* rt = 20 / 960 ... lt = 15 / 960 */
}

#landing.message #content { /* 960 */
	float: left;
	width: 79.166%; /* 760 / 960 */
	padding: 0 10.417%; /* 100 / 960 */
	min-height: 500px;
}

#landing .sidebar-rt { /* 230 */
	float: left;
	width: 21.354%; /* 205 / 960 */
	padding: 0 2.604% 0 0; /* rt = 25 / 960 */
}
 
#landing .testimonial {
	clear: both;
	width: 81.25%; /* 780 / 960 */
	padding: 2em 9.375% 0 9.375%; /* lt & rt = 90 / 960 */
}

/* ======= HEADER STYLES ======= */

.topfull {
	background: rgba(0,0,0,0.4);
	/* position: fixed; */
}

.banner {
	line-height: 1;
	padding: 1.5% 0 0 0;
}

.banner nav {
	float: left;
}

.banner nav ul {
	margin: 0;
	padding: 0 0 1% 0;
}

.banner nav li { 
	display: inline;
	margin: 0 2em 0 0; }

.banner nav ul li a:link,
.banner nav ul li a:visited {
	color: #fff;
	font-weight: normal;
	font-size: 1.143em; /* 16 / 14 */
	height: 100%;
	padding-top: 1.8%; /* controls where top border is positioned */
}

.banner nav ul li a:hover,
.banner nav ul li a:active,
.banner nav ul li.here a {
	border-top: 2px solid #aef016;
}
 
.banner .search {
	position: absolute;
	top: 20%;
	left: 80.625%;
	width: 19.375% ;/* 186 / 960 */ 
}

.banner header {
	float: left;
	width: 71.979%;
	padding-left: 28.021%; /* 269 / 960 */
	margin-bottom: 0.5em;
}

.banner header .mobile { /* hide mobile logo */
	display: none;
}

.banner header a { 
	float: left;
}

.banner header img {
	float: left;
}

.banner header hgroup {
	float: left; 
	margin: -0.1em 0 0 0.5em;
	line-height: 0.5;
}

.banner header hgroup h1 { 
	font: normal 3em nevis, arial, helvetica, sans-serif; /* 48 / 16 */
	text-transform: uppercase;
	color: #000;
}

.banner header hgroup h2 { 
	font: italic normal 0.875em arial, helvetica, sans-serif; /* 14 / 16 */
	margin-top: -0.5em;
	color: #000;
}

.banner header a:link,
.banner header a:visited {
	color: #000;
}

.banner header a:hover,
.banner header a:active {
	color: #404040;
}

.banner .feature {
	float: left;
	width: 100%;
	background: #f05816 url('/images/bg-pattern-orange.png') repeat left top;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	box-shadow: 0.1em 0.1em 1em #404040;
	margin-bottom: 3%;
}

.banner .feature p {
	font-size: 1.125em; /* 18 / 16 */
	font-style: italic;
	color: #e2e4e3;
	margin: 1% 0 0.25% 8.333%; /* 80 / 960 */ 
}

.banner .feature p mark {
	font: normal 2em chunkfive, impact, georgia, serif; /* 36 / 18 */
	color: #fff;
	background: none;
	text-transform: uppercase;
}



/* ======= MAIN CONTENT STYLES ======= */


.main .subnav {
	background: rgba(0,0,0,0.5);
	border-radius: 7px 0 0 7px;
	-moz-border-radius: 7px 0 0 7px;
	-webkit-border-radius: 7px 0 0 7px;
	box-shadow: 3px 1px 10px rgba(50, 50, 50, 0.61);
	margin-top: 1em;	
}

.main .subnav a:link,
.main .subnav a:visited {
	color: #aef016;
	font-weight: bold;
}

.main .subnav a:hover,
.main .subnav a:active,
.main .subnav li.here a,
.main .subnav li.parent-here li.here a {
	color: #fff;
}

.main .subnav li.here li a,
.main .subnav li.parent-here li a {
	color: #aef016;
	font-weight: normal;
}

.main .subnav h2 a:link,
.main .subnav h2 a:visited {
	color: #acabab;
	font-weight: normal;
}

.main .subnav h2 a:hover,
.main .subnav h2 a:active {
	color: #fff;
}

.main .subnav li {
	list-style: none;
	margin-left: 0;
}

.main .subnav li li { /* for nested subnav */
	margin-left: 1.5em;
}

#nav-sub {
	margin-bottom: 2em;
}

.main .subnav h2 {
	font: normal 2.25em nevis, "trebuchet ms", sans-serif; /* 36 / 16 */
	color: #acabab;
	margin-top: 0;
}

.main .subnav h3 {
	font: normal 1.5em nevis, "trebuchet ms", sans-serif; /* 24 / 16 */
	color: #acabab;
}

.main .subnav .action { /* 175 */
	width: 78.049%; /* 160 / 205 */
	background: #16aef0 url('/images/bg-pattern-blue.png') repeat left top;
	padding: .5em 2.439% .5em 4.878%; /* rt = 5 / 205 ... lt = 10 / 205 */ 
	margin: 3em 0;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	box-shadow: 0.1em 0.1em 1em #404040; 
	color: #fff;	
}

.main .subnav .action h4 {
	font: normal 1.125em chunkfive, impact, georgia, serif; /* 18 / 16 */
	margin: 0;
}

.main .subnav .action p {
	margin: 0;
}

.main #content {
	background: rgba(255,255,255,0.90);
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
}

.main #content .action { /* 175 */
	width: 78.049%; /* 160 / 205 */
	background: #16aef0 url('/images/bg-pattern-blue.png') repeat left top;
	padding: .5em 2.439% .5em 4.878%; /* rt = 5 / 205 ... lt = 10 / 205 */ 
	margin: 3em 0;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	box-shadow: 0.1em 0.1em 1em #404040; 
	color: #fff;	
}

.main #content .action h4 {
	font: normal 1.125em chunkfive, impact, georgia, serif; /* 18 / 16 */
	margin: 0;
}

.main #content .action p {
	margin: 0;
}

.breadcrumb {
	font-size: 0.875em; /* 14 / 16 */
	font-style: italic;
	margin-bottom: 1em;
}

.listing-item {
	/* card experiment
	margin: 0 2em 2.5em 0;
	width: 20%;
	padding: 3%;
	height: 300px;
	border: 1px solid #ececec;
	background: #fff;
	float: left;
	*/
	margin: 1em 0 2.5em 0;
}

p.date {
	margin-top: 0;
	font-weight: bold;
	font-style: italic;
	font-size: 0.857em; /* 12 / 14 */
}

.sidebar ul li { /* no margins */
	margin-left: 0; 
}

.sidebar ol li { /* no margins */
	margin-left: 0; 
}

.sidebar li li { /* nested should have a bit of margin */
	margin-left: 1em;
}

/* homepage */

#homepage .main .subnav {
	background: rgba(0,0,0,0.5);
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	box-shadow: none;
	margin-top: 1em;	
	color: #fff;
}

#homepage .main .subnav a:link,
#homepage .main .subnav a:visited {
	font-weight: normal;
}

#homepage .main .subnav h1 {
	font: normal 1.5em nevis, "trebuchet ms", sans-serif; /* 24 / 16 */ 
	background: transparent url('/images/bg-green-line.png') no-repeat 20% bottom;
	padding-bottom: .7em;
	color: #fff;
}

#homepage .main .subnav h2 {
	font: normal 1.688em nevis, "trebuchet ms", sans-serif; /* 27 / 16 */
	color: #fff;
	margin: 0;
}

#homepage .main .subnav h3 {
	font: normal 1.5em nevis, "trebuchet ms", sans-serif; /* 24 / 16 */
	color: #fff; 
}

#homepage .homelines {
	float: left;
	width: 100%;
	margin: 1em 0;
}

#homepage .homelines .image { 
	float: left;
	width: 35.932% /* 106 / 295 */
	
}

#homepage .homelines .text { 
	float: left;
	width: 64.0678%; /* 189 / 295 */
}

#homepage .homelines p {
	margin: .5em 0;
}

#homepage .main #content { 
	background: transparent; 
	min-height: 1100px; /* to keep bg image showing and not having side fall into footer */
}

#homepage .main #content .caption { 
	/*
	position: fixed;
	top: 21.5em;
	left: 31.5em; 
	color: #000;
	text-align: right;
	line-height: 1.2;
	font-style: italic;
	*/
	display: none;
}

/* landing page */

#landing .topfull .banner {
	padding: .5% 0 0 0; 
}

#landing .topfull { 
	text-align: center;
}

#landing .topfull p {
	font: normal 1em nevis, "trebuchet ms", sans-serif; /* 16 / 16 */
	color: #fff; 
	margin: .5em 0;
}

#landing .main {
	background: rgba(255,255,255,0.90);
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	box-shadow: 0.1em 0.1em 1em #777;
	margin-bottom: 7em;
	padding: 3em 0;
}

#landing #content {
	min-height: 0; 
	margin-bottom: 0;
}

#landing .testimonial p {
	text-align: right;
	font-style: italic;
}




/* ======= FOOTER STYLES ======= */

.bottomfull { 
   width:100%; 
   background: #000 url('/images/bg-pattern-black.png') repeat left top;
   position: relative;
   color: #fff;
   padding-bottom: 1.5em; /* covers extra space at bottom */
   /* this works for fixed positioning 
   position:fixed;
   left:0px;
   bottom:0px;    
   */
}

.subfull {
	background: transparent;	
}

.subwrap {
	/*
	position: absolute;
	left: 0;
	top: -37px;
	top: -200px;
	width: 100%;
	z-index: -100; 	
	*/
}

.subwrap .tab { /* 330 */
	width: 32.8125%; /* 315 / 960 */
	padding: .5em 0% .1em 1.563%; /* rt = 0 / 960 ... lt = 15 / 960 */
	/* background: #f05816 url('/images/icon-lines.png') no-repeat 75% top; */
	background: #f05816;
	background: #f05816 url('/images/bg-pattern-orange.png') repeat left top; 	
	border-radius: 7px 7px 0 0;
	-moz-border-radius: 7px 7px 0 0;
	-webkit-border-radius: 7px 7px 0 0;
}

.subwrap .tab p {
	color: #e2e4e3;
	font-style: italic;
	margin: 0;
}

.subwrap .tab p mark {
	font: normal 1.714em chunkfive, impact, georgia, serif; /* 24 / 14 */
	color: #fff;
	text-transform: uppercase;
	background: none;
}

.subwrap .tab p .control {
	margin-left: .25em;
}
.subfooter { /* 960 */
	float: left;
	width: 95.8333%; /* 920 / 960 */
	padding: .5em 1.563% .1em 2.604%; /* rt = 15 / 960 ... lt = 25 / 960 */
	background: #f05816;	
	background: #f05816 url('/images/bg-pattern-orange.png') repeat left top;
	border-radius: 0 7px 0 0;
	-moz-border-radius: 0 7px 0 0;
	-webkit-border-radius: 0 7px 0 0;
	color: #fff;
}

.subfooter h1,
.subfooter h2,
.subfooter h3,
.subfooter h4,
.subfooter h5,
.subfooter h6 {
	color: #e2e4e3;
}

.subfooter a:link, .subfooter a:visited {
	color: #aef016;
}

.subfooter a:hover, .subfooter a:active {
	color: #f7ff61;
}

.subfooter dl {
	width: 100%;
	float: left;
}

.subfooter dt {
	width: 50%;
	float: left;
	font-weight: bold;
}

.subfooter dd {
	width: 50%;
	float: left;
}

.subfooter .hours {
	float: left;
	width: 30%;
	padding-right: 3%;
}

.subfooter .directions {
	float: left;
	width: 30%;
	padding-right: 3%
}

.subfooter .action {
	float: left;
	width: 33%;
}

footer {
	padding-bottom: 3em;
}

footer a:link,
footer a:visited {
	color: #aef016;
}

footer a:hover,
footer a:active {
	color: #16aef0;
}

footer p {
	margin: 0;	
}

footer .logo {
	position: absolute;
	top: -28%;
	left: 50%; 
}

footer .socialmedia {
	float: left;
	width: 9.375%; /* 90 / 960 */
	margin: 1.4em 2.25% 0 0; /* 60 / 960 */
}

footer .awards {
	float: left;
	width: 21.833%;  
	margin: .7em 2.083% 0 0; /* 20 / 960 */
}

footer .contact { 
	float: left;
	width: 36.458%; /* 350 / 960 */
	margin: 1.8em 7.708% 0 0; /* 74 / 960 */
	font: bold 1em arial, helvetica, sans-serif; 
}

footer .contact ul {
	margin: 0;
}

footer .contact li {
	display: inline;
	margin: 0 2em 0 0;
	list-style: none;
}

footer .contact li.email {
	margin-right: 0;
}

footer .mailinglist {
	float: left;
	width: 19.375%; /* 186 / 960 */
	margin: 1.4em 0 0 0; /* matches .socialmedia for alignment */
}

footer .legal {
	float: left;
	width: 100%; 
	text-align: right;
	display: none;
}

footer .legal p {
	font-size: 0.75em; /* 12 / 16 */
}


/* ======= FORM STYLES ======= */

#content form {
	margin: 1em 0;
}

form input.test { /* to hide test field on forms to prevent spam - may want to text indent it into oblivion - think i read that some browsers choke on display none*/
	display: none;
}

form dd {
	margin-bottom: 1em;
}

form label {
	font-weight: bold;
	font-size: 1.143em; /* 16 / 14 */
}

form input, form select, form textarea {   
	font-size: 1em; /* 14 */
	font-style: italic;
	background-color: #bee9fc;
	border-radius: 7px; 
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border: none;	
	padding: .5em; 
}

#content form input {
	width: 50%;
}

#content form input[type="radio"], #content form input[type="checkbox"] {
	width: auto;
	background: none;
}


#landing #content form input {
	width: 70%;
}

#content form input.button {
	width: auto;
}

#content form textarea {
	width: 70%;
}

.ask-your-question #content form textarea { /* bit narrower for design therapy */
	width: 50%;
}

#landing #content form textarea {
	width: 90%;
}

form input:focus, form textarea:focus {
	background-color: #ddf2fb;
}

form input.button, form input[type="button"], form input[type="submit"]  { 
	background: #16aef0 url('/images/bg-pattern-blue.png') repeat left top;
	font: normal 1.714em chunkfive, impact, georgia, serif; /* 24 / 14 */
	color: #fff;
	border: none;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;	 
	border-radius: 7px;	
}
  
form input.button:hover, form input[type="button"]:hover, form input[type="submit"]:hover {
	background: #f05816 url('/images/bg-pattern-orange.png') repeat left top;  
}

.feedback {
	color: #d80000;
}

/* search */

.banner .search input {
	width: 100%;
	font-size: 0.875em; /* 14 / 16 */ 
	/* background: #fff url('/images/icon-search.png') no-repeat 98% 50%; */
	background: #fff;
	padding: .25em;
	position: relative;
} 

.banner .search form #search-submit { /* to make icons clickable - this is a transparent overlay */
	width: 1.5em;
	background: transparent url('/images/icon-search.png') no-repeat 50% center; 
	position: absolute;
	top: .1em;
	right: 0;	
	cursor: pointer;
	border-radius: none;
	-webkit-border-radius: none;
	-moz-border-radius: none;
}

/* email signup */

.mailinglist form input {
	width: 100%;
	font-size: 0.875em; /* 14 / 16 */
	/* background: #fff url('/images/icon-arrow.png') no-repeat 98% 50%; */
	background: #fff;
	padding: .25em;
	position: relative;
}

.mailinglist form #email-submit { /* to make icons clickable - this is a transparent overlay */
	width: 2%;
	background: transparent url('/images/icon-arrow.png') no-repeat right center; 
	/* background: transparent; */
	position: absolute;
	top: 1.6em;
	right: 0;	
	cursor: pointer;
	border-radius: none;
	-webkit-border-radius: none;
	-moz-border-radius: none;
}

.placeholder { /* for jquery placeholder workaround */
	color: #aaa;
}





/* ======= TABLE STYLES ======= */

table thead, 
table tfoot { 
	background: #f5f5f5; 
}


/* ======= MEDIA QUERIES ======== */

@media screen and (max-width: 780px) { /* tablets - */
	
	body#homepage { /* text removed from keith */
		background: #000 url('/images/bg-large-home-v3-mobile-tall.jpg') no-repeat center top;	
	}
	
	.banner {
		float: left;
	}
	
	.wrap { 
		margin: auto;
		max-width: 90%;  
		/* background: #fff url('../i/wrap_shadow.png') no-repeat bottom right; */ 
	}
	
	.banner .search { /* hide search */
		display: none;
	}
	
	.banner nav li {  /* smaller right margin, bigger bottom margin and inline block to keep nav together */
		margin:	0 1em .5em 0;
		display: inline-block; 		 
	}
	  
	.banner nav ul li a:hover,
	.banner nav ul li a:active,
	.banner nav ul li.here a { /* remove top border on state for color only */
		border-top: none;
		color: #aef016;
	}

	.banner header { /* reduce left padding */
		padding-left: 15%; /*  arbitrary but roughly centered and enough so logo doesn't break before 500 media query */
	}
	
	.banner .feature p { /* add a bit o' space beneath text, reworked margins and a bit smaller font */
		margin: 1% 1% 1% 5%;
		font-size: .95em;
	}
	
	.main {
		width: 100%;
		float: left;
	}
	
	.main .subnav { /* subnav full width at top and remove top margin and decrease padding top and bottom*/
		width: 95.313%; /* 100 - 2.083 rt / 2.604 lt padding */	
		margin-top: 0;
		margin-bottom: 1em;
		padding-top: 1em;
		padding-bottom: .5em;
		border-radius: 7px;
		-moz-border-radius: 7px;
		-webkit-border-radius: 7px;
	}
	
	.main .subnav .col1 {
		float: left;
		width: 60%;
	}
	
	.main .subnav .col2 {
		float: left;
		width: 40%;
	}
	
	.main .subnav .col2 .action {
		margin: 3.5em 0 0 0;
	}
	
	#homepage .main .subnav { /* except on hompage where it is the feature text */
		display: block;
		width: 96.354%; /* 100 - 1.042 rt / 2.604 lt padding */
		margin-bottom: 3em;
	}
	
	#homepage .main .subnav h1 { 
		background: transparent url('/images/bg-green-line.png') no-repeat 50% bottom;
	}
	
	#homepage .main .homelines .image {
		text-align: center;
	}
	
	#homepage .main #content { /* eliminate content area on homepage */
		display: none;
	}
		
	.main #content {
		width: 92.708%; /* 100 - 2.604% rt / 4.688 lt padding inherited */
		float: left;
	} 
	
	.subwrap .tab { /* make tab full width and easily clickable */
		width: 65%; /* arbitrary but wide enough to prevent wrap */ 
	}
	
	.subfooter { /* full width */
		width: 95.833%; /* 100 - 1.563% rt / 2.604 lt padding inherited */		 
	}
	
	.subfooter .hours, 
	.subfooter .directions { /* go to double columns */
		width: 50%;
		padding: 0;
	}
	.subfooter .action { /* full width */
		width: 100%;				
	}
	 
	footer {
		text-align: center;
		width: 100%;
	}
	
	footer .logo { /* break absolute positioning and reposition*/
		position: relative; 
		width: 100%;
		top: auto;
		left: auto;
		padding-top: 1em;
	}
	
	footer .socialmedia,
	footer .awards,
	footer .contact,
	footer .mailinglist { /* linerize footer */
		width: 100%;
	}
	
	footer .mailinglist form {
		position: relative;
		width: 75%;
		margin: auto; /* center it */
	}
	
	footer .contact li { /* smaller margin to fit */
		margin-right: 1em;
	}
	 	
	footer .mailinglist form #email-submit { /* and put arrow in place */
		top: 0;
	}
	
}

@media screen and (max-width: 550px) { /* small screen (phones) */
 	
 	body {
	 	border-top: none;
 	}
 	
 	body#homepage { /* text removed from keith */
		background: #fff url('/images/bg-large-home-v3-mobile-tall-white.jpg') no-repeat center top;	
	}
	
	.wrap { 
		margin: auto;
		max-width: 90%;  
		/* background: #fff url('../i/wrap_shadow.png') no-repeat bottom right; */ 
	}
	
	.banner .search { /* hides search */
		display: none;
	}
	
	.banner nav li {  /* smaller right margin, bigger bottom margin and inline block to keep nav together */
		margin:	0 1em .5em 0;
		display: inline-block; 		 
	}
	  
	.banner nav ul li a:hover,
	.banner nav ul li a:active,
	.banner nav ul li.here a { /* remove top border on state for color only */
		border-top: none;
		color: #aef016;
	}

	.banner header { /* full width to header */
		float: left;
		width: 100%;
		padding-left: 0; 
		text-align: center; 
	}
	
	.banner header hgroup { 
		float: left;
		width: 115%; /* hack for centering */
		display: block;
		margin: 0;
		padding: 0; 
	}
	
	.banner header img { /* hide logo image */
		display: none;
	}
	
	.banner header h1,
	.banner header h2 { /* add a bit of text shadow for logo on dark bg */
		text-shadow: 1px 1px 2px #fff; 
		display: block;
		width: 100%;  
	}
	
	.banner .feature p { /* add a bit o' space beneath text, reworked margins and slightly smaller font */
		margin: 1% 1% 1% 5%;
		font-size: .8em;
	}
	
	.main {
		width: 100%;
		float: left;
	}
	
	.main .subnav { /* hide subnav */
		display: none;
	}
	
	#homepage .main .subnav { /* except on hompage where it is the feature text */
		display: block;
		width: 96.354%; /* 100 - 1.042 rt / 2.604 lt padding */
		margin-bottom: 3em;
		
	}
	
	#homepage .main #content { /* eliminate content area on homepage */
		display: none;
	}
		
	.main #content {
		width: 92.708%; /* 100 - 2.604% rt / 4.688 lt padding inherited */
		float: left;
	}
	
	.main .sidebar { /* hide sidebar */
		display: none;
	}
	
	.subwrap .tab { /* make tab full width and easily clickable */
		width: 98.437%; /* 100 - 1.563% rt padding inherited  */ 
	}
	
	.subfooter { /* remove border radius and full width */
		width: 95.833%; /* 100 - 1.563% rt / 2.604 lt padding inherited */		
		border-radius: 0;
	}
	
	.subfooter .hours, 
	.subfooter .directions,
	.subfooter .action { /* linearize triple columns */
		width: 100%;				
	}
	
	.subfooter .directions iframe { /* hide iframe map as it's crashing stuff */
		display: none;
	}
	
	footer {
		text-align: center;
		width: 100%;
	}
	
	footer .logo { /* break absolute positioning and reposition*/
		position: relative; 
		width: 100%;
		top: auto;
		left: auto;
		padding-top: 1em;
	}
	
	footer .socialmedia,
	footer .awards,
	footer .contact,
	footer .mailinglist { /* linerize footer */
		width: 100%;
	}
	
	footer .mailinglist form {
		position: relative;
		width: 75%;
		margin: auto; /* center it */
	}
	
	footer .contact li { /* smaller margin to fit */
		margin-right: 1em;
	}
	 	
	footer .mailinglist form #email-submit { /* and put arrow in place */
		top: 0;
	}
}

@media screen and (min-width: 781px) { /* desktops - this may be redundant */

	
	
}



/* ======= PLUGIN STYLES ======= */ 


/* ======= HIDING ======= */

body.products h2.category,
body.blog h2.category {
	/* display: none; */
}