/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* https://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Colors
==================================================

	dark gray					#505152
	gold type (darkest)			#b39f7f
	gold hover box (medium)		#c0ab8b
	gold subnav bg (lightest)	#e1d2b9
	gold promo box 				#b6935b
	
 */

/* #Site Styles
================================================== */
html, body {
	height: 100%;
}

body {
	background-color: #4c4b4b;
	font-family: 'Work Sans', Helvetica, Arial, sans-serif;
	color: #505152;
}

.supercontainer {
	position: relative;
	float: left;
	width: 100%;
	background-color: #fff;
	z-index: 1;               /* z-index only works on positioned elements */
}

.mobileheader,
.mobilesearch,
#mobilemenu,
h1.mobilehdr { display: none; }


html.fancybox-lock {
    overflow: visible !important;   /* keeps page from jumping to the top when fancybox is open */
}

.fancybox-custom .fancybox-skin {
	box-shadow: 0 0 30px #222;
}

.fancybox-nav {
	height: 20%;
	top: 40%;
	width: 10%;
}

/* NAV */

nav.supercontainer {
	background-color: #4c4b4b;
	position: relative;
	height: /*40px;*/ auto;
	z-index: 2;	            /* z-index only works on positioned elements */
	padding: 20px 0px 10px 0;
}


nav .logo {
	margin: 5px 0 0 35px;
	float: left;
	text-align: left;
	width: 30%;
	line-height: 50px;
}
	
nav .logo a {
	
}

nav .logo a img {
	width: 100%;
	max-width: 400px;
	vertical-align: top;
}


/* main top nav */
ul#nav, ul#nav ul {
	padding: 0px;
	margin: 0 20px 0 0;
	float: right;
	text-align: left;
}

ul#nav.primary-nav {
    float: left;
	clear: both;
	margin-left: 14px;
}

ul#nav li {
	position: relative;
	display: inline-block;
	margin-bottom: 0px;
	/*line-height: 40px;*/
	/*padding: 0px 20px;*/
}


ul#nav li a {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	color: #b39f7f;
	text-decoration: none;
	display: block; 
	/*font-size: 1.1em;*/
	/*letter-spacing: .15em;*/
	
}

ul#nav li:hover {
	background-color: #c0ab8b;
}

ul#nav li:hover > a {
	color: #000;
}

ul#nav ul { 
	position: absolute;
	top: 40px;
	left: 0;
	visibility: hidden;
	padding: 5px 0px 5px 0px;
	background-color: #e1d2b9;
	border-top: 1px solid #998667;
}



/* subnav */
ul#nav li:hover ul {
	visibility: visible;
}

ul#nav ul li {
	padding: 0px 25px 0px 25px;
	white-space:nowrap;
	display: block;
	text-align: left;
}

ul#nav ul li a {
	font-family: 'Work Sans', Arial, Helvetica, sans serif;
	font-size: 1em;
	font-weight: 400;
	letter-spacing: .15em;
	color: #000;
	text-transform: uppercase;
}

ul#nav ul li a:hover {
	color: #000;
}

/* FOOTER */

footer.supercontainer {
	margin: 0;
	padding:  10px 0 15px 0;
	background-color: #4c4b4b;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

footer.home {
	/* sticky footer on home page only */
	bottom: 0;
    position: absolute;
}

/* footer nav */
ul#fnav {
	padding: 0px;
	margin: 0 0 0 15px;
	float: left;
	text-align: left;
	width: 65%;
}

ul#fnav li {
	position: relative;
	display: inline-block;
	margin-bottom: 0px;
}

ul#fnav li.nn {
	border: 1px solid #b29f7e;
	padding-right: 15px;
}

ul#fnav li a {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	color: #b39f7f;
	text-decoration: none;
	display: block; 
}

ul#fnav li:first-child a {
	font-weight: 500;
	color: #eecf9d;
}

ul#fnav li:hover {
	background-color: #c0ab8b;
}

ul#fnav li:hover > a {
	color: #000;
}

ul#fnav li.registration {
	border: 1px solid #eecf9d;
	margin-left: 15px;
}

ul#fnav li.registration a {
	font-weight: 700;
}

/* -----------------top & bottom navs spacing, font-size---------- */

ul#nav li,
ul#fnav li {
	padding: 0px 20px;
	line-height: 40px;
}

ul#nav li a,
ul#fnav li a {
	font-size: 1.1em;
	letter-spacing: .15em;
}

/* --------------------end all navs spacing--------------------------- */

footer .copyright {
	width: 28%;
	clear: both;
	margin: 0 15px;
	font-family: 'Work Sans', sans-serif;
	font-weight: 500;
	text-align: right;
	color: #b39f7f/*#858585*/;
	font-size: .7em;
	text-transform: uppercase;
	letter-spacing: .1em;
	line-height: 40px;
}

footer .credits {
	display: inline;
	color: #74706a;
}

footer .credits::before {
	content: " / ";
}

footer .credits a {
	color: #74706a/*#858585*/;
	text-decoration: underline;
}

footer .credits a:hover {
	color: #e1d2b9;
}


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

/* HOME PAGE */


#promo {
	display: none;
	/*position: absolute;           relative won't overlay the photo 
	bottom: 110px;
	left: 20px;
	height: auto;*/
	padding: 20px 30px 25px 30px; 
	width: auto;
	height: auto;
	text-align: center;
	/* control opacity of only box behind text */
	/* Fallback for web browsers that don't support RGBa */
    background-color: rgb(255, 255, 255);
    /* RGBa with 0.7 opacity */
    background-color: rgba(255, 255, 255, 0.65);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF)";
	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);  
	-moz-box-shadow:  0px 0px 6px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);
}

#promo h2,
#promo h3 {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	color: #505152;
	letter-spacing: .05em;
	text-transform: uppercase;
	margin: 0;
}

#promo h2 {
	font-size: 20px;
	line-height: 25px;
	font-weight: 500;
}

#promo h3 {
	font-size: 16px;
	line-height: 20px;
	margin-bottom: 10px;
}

#promo .date,
#promo .time {
	font-family: 'Work Sans', sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: #b6935b;
	letter-spacing: .05em;
	text-transform: uppercase;
}

#promo .location {
	padding-top: 10px;
	margin-top: 10px;
	border-top: 1px solid #b6935b;
	font-family: 'Work Sans', sans-serif;
	font-weight: 500;
	font-size: 14px;
	line-height: 18px;
	color: #b6935b;
	letter-spacing: .05em;
	text-transform: uppercase;
}

#promo .location span {
line-height: 20px;
	font-size: 18px;
}

/* NEW AND NOTEWORTHY */

/* all layouts */

.newNoteworthy {
	display: none;
	float: left;
	padding: 10px; 
	width: auto;
	height: auto;
	text-align: left;
	/* control opacity of only box behind text */
	/* Fallback for web browsers that don't support RGBa */
    background-color: rgb(255, 255, 255);
    /* RGBa with 0.7 opacity */
    background-color: rgba(255, 255, 255, 0.65);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF)";
	/*box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);  
	-moz-box-shadow:  0px 0px 6px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);*/
}

div[id*="layout"] div[class*="column"] {
	float: left; 
	/*height: 300px;*/
	margin: 0 5px;
	height: 100%;
	overflow:hidden;
}

div[id*="layout"] div[class*="column"] img {
	width: 100%;
	height: auto;
	float: left; 
}

div[id*="layout"] .nnText {
	float: left;
	margin: 15px 14px 0 5px;
    border-top: 1px solid #ab8c5a;
	padding: 20px 0px;
}

div[id*="layout"] .nnText h2 {
	float: left;
	margin-right: 0px;
	font-family: "Work Sans",sans-serif;
    letter-spacing: 0.05em;
    font-size: 18px;
    font-weight: 500;
    line-height: 20px;
	color: #ab8c5a;
    text-transform: uppercase;
}

div[id*="layout"] .nnText h2 span.sup {
	font-size: 1.2em;
}

div[id*="layout"] .nnText p {
	float: left;
	font-family: "Work Sans",sans-serif;
    letter-spacing: 0.05em;
    font-size: 14px;
    font-weight: 300;
    line-height: 24px;
	color: #505152;
	margin: 0;
}

div[id*="layout"] .nnText a:hover {
	color: #ab8c5a;
}


/* horizontal layout */

#layout-horz .nnPicGroup {
    position: relative;
	width: 100%;
	max-width: 1200px;
	height: 300px;
	padding: 5px 0;
}

#layout-horz .column1 {	width: 34%; }
#layout-horz .column2 {	width: 14%; }
#layout-horz .column3 { width: 14%; }
#layout-horz .column4 { width: 14%; }
#layout-horz .column5 { width: 34%; }

#layout-horz .column3 {
	height: 180px;
	
}

#layout-horz .column4 {
	position: absolute;
	height: 110px;
	left: 48%;			/* widths are in %, margins are in px -- this should make it always line up properly */
	margin-left: 25px;
	top: 195px;			/* top photo is 180 tall, + 15px margin between */
}

#layout-horz .nnText {
	clear: both;
	width: 97%;
	max-width: 1150px;
}

#layout-horz .nnText h2 {
	width: 25%;
}

#layout-horz .nnText p {
	width: 70%;
}

/* vertical layout */

#layout-vert {
	width: 800px;
}

#layout-vert .nnPicGroup {
	float: left;
	width: 63%;
	max-width: 600px;
	padding: 5px 0;
}

#layout-vert .nnPicGroup .row1{
	height: 410px;
}

#layout-vert .nnPicGroup .row2{
	height: 250px;
	margin-top: 10px;
}



#layout-vert .column1 {	width: 28%; }
#layout-vert .column2 {	width: 68%; }
#layout-vert .column3 { width: 68%; }
#layout-vert .column4 { width: 28%; }

#layout-vert .column1 .img-a {
	float: left;
	width: 100%;
	height: 250px;
	margin-bottom: 10px;
}

#layout-vert .column1 .img-b {
	float: left;
	width: 100%;
	height: 150px;
	margin-top: 5px;
}

#layout-vert .nnText {
	width: 30%;
	padding-top: 0;
	border-top: 0;
}

#layout-vert .nnText h2 {
	padding-bottom: 10px;
	border-bottom: 1px solid #ab8c5a;
	
}

#layout-vert .nnText p {
	
}

/* square layout */

#layout-square .nnPicGroup {
	width: 100%;
	max-width: 680px;
	height: 520px;
	position: relative;
}

#layout-square .column1 {	width: 57%; }
#layout-square .column2 {	width: 38%; }
#layout-square .column3 {	width: 38%; }

#layout-square .column2 {
	height: 320px;
}

#layout-square .column3 {
	position: absolute;
	height: 190px;
	left: 57%;			/* widths are in %, margins are in px -- this should make it always line up properly */
	margin-left: 15px;
	top: 330px;			/* top photo is 180 tall, + 15px margin between */
}

/*#layout-square .column2 .img-a {
	float: left;
	width: 100%;
	height: 320px;
	margin-bottom: 10px;
}

#layout-square .column2 .img-b {
	float: left;
	width: 100%;
	height: 190px;
	margin-top: 5px;
}*/

#layout-square .nnText {
	clear: both;
	width: 100%;
	max-width: 565px;
}

/* single image layout */

#layout-single .nnPicGroup {
	width: 100%;
	max-width: 680px;
	height: 520px;
}

#layout-single .column1 {	width: 99%; }

#layout-single .nnText {
	clear: both;
	width: 96%;
	max-width: 620px;
}

/* COLLECTIONS */

/* splash pages */

.supercontainer.splash {
	height: auto;
}

.splashBlock {
	position: relative;
	float: left;
	margin: 50px 0;
	width:100%;
}

h1.splashTitle {
	position: absolute;
	width: 100%;
	text-align: center;
	top: 45%;
	display: none;
	margin: 0;
}

h1.splashTitle a {
	/*background-color: #4c4b4b#b0a390;*/
	padding: 8px 15px;
	font-family: 'Work Sans', Helvetica, Arial, sans-serif;
	font-size: 130px;
	font-weight: 200;
	letter-spacing: 0.15em;
	color: /*#b0a390*/#4c4b4b;
	text-transform: uppercase;
	text-decoration: none;
	text-shadow: 2px 2px 2px #fff;
	/*border: 1px solid #908063;
	box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.3);  
	-moz-box-shadow:  3px 3px 6px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.3);*/
	
}

h1.splashTitle a:hover {
	color: #333;
}

.splashImage {
	float: left;
	width: 25%;
	max-width: 330px;
}

.splashImage img {
	width: 100%;
	max-width: 330px;
	vertical-align: top;
}

/* regular collections */

.supercontainer.pagehdr {
	background-color: #b0a390;
}

.supercontainer.pagehdr h1 {
	width: auto;
	float: left;
	color: #fff;
	font-family: 'Work Sans', sans-serif;
	font-weight: 300;
	font-size: 20px;
	text-transform: uppercase;	
	margin: 18px 0 14px 0;
	line-height: 20px;
	letter-spacing: .1em;
}

.supercontainer.pagehdr h3 {
	width: auto;
	float: left;
	color: #fff;
	font-family: 'Work Sans', sans-serif;
	font-weight: 300;
	font-size: 14px;
	text-transform: uppercase;	
	margin: 18px 0 14px 0;
	line-height: 20px;
	letter-spacing: .1em;
}

.supercontainer.pagehdr h3 a {
	color: #fff;
	font-family: 'Work Sans', sans-serif;
	font-weight: 300;
	font-size: 14px;
	text-transform: uppercase;	
	line-height: 20px;
	letter-spacing: .1em;
}

#gallery {
	float: left;
	width: 100%;
	height: auto;
	margin-top: 50px;
}

.productThumb {
	float: left;	
	position: relative;
	width: 23%;
	height: 340px;
	margin-right: 2.5%;
	margin-bottom: 20px;
	text-align: left;
}

.productThumb:nth-child(4n) {
	margin-right: 0;
}

.productThumb img {
	width: 100%;
	max-width: 300px;
	vertical-align: top;
}

h2.productName {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #505152;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
	line-height: 16px;
	margin: 10px 0 0 0;
}

h2.productName a {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #505152;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
}

h2.productName a:hover {
	color: #000;
	text-decoration: underline;
}

.caption {
	position: absolute;
    display: none;
    top: 42%;
    width: 100%;
	text-align: center;
	color: #000;
    font-family: 'Work Sans', sans-serif;
    font-size: .9em;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 28px;
   	text-decoration: none;
    text-transform: uppercase;
	cursor: default;
}

.caption a {
	display: block;
	color: #000;
    font-family: 'Work Sans', sans-serif;
    font-size: 1em;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 28px;
   	text-decoration: none;
    text-transform: uppercase;
}

/* PRODUCT PAGE */


.supercontainer.product {
	padding: 20px 0 30px 0;
}


#productImageThumbs {
	float: left;
    margin-right: 25px;
    width: 47%;
}

#carousel .slides img {
	height: auto;             /* if this is set to 100%, the non-square thumbs get stretched wider to square width - make sure thumbs are 100px tall */
	width: auto;
	max-height: 100px;
	max-width: 100px;
	/*border: 1px solid #fff;*/
}

#carousel .slides img:hover {
	/*border: 1px solid #dedddd;*/
	cursor: pointer;
}

.flexslider {
	margin-bottom: 0px;
}

.flex-viewport {
	width: 88%;
	margin: 0 auto;
}

p.flex-caption {
	position: absolute;
	margin: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
	padding: 5px 0;
	color: #fff;
	font-size: 12px;
	/* control opacity of only box behind text */
	/* Fallback for web browsers that don't support RGBa */
    background-color: #4c4b4b;
	background-color: rgb(76, 75, 75);
    /* RGBa with 0.7 opacity */
    background-color: rgba(76, 75, 75, 0.65);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#994c4b4b, endColorstr=#994c4b4b);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#994c4b4b, endColorstr=#994c4b4b)";

}

#productDetail {
	float: right;
	width: 49%;
}

#productDetail h1 {
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 28px;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 28px;
	color: #505152;
	border-bottom: 1px solid #b0a390;
	margin-bottom: 20px;
    padding-bottom: 10px;
	text-transform: uppercase;
}

#productDetail h2 {
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 22px;
	color: #ab8c5a;
	/*border-bottom: 1px solid #ab8c5a;
	margin: 30px 0 20px 0;
    padding-bottom: 10px;*/
	text-transform: uppercase;
    background: transparent url("https://paganistudio.com/images/plus-thinner.png") no-repeat scroll 96% center;
    border-bottom: 1px solid #e2cfb0;
    margin: 0 0 20px 0;
    padding: 10px 10px 10px 0;
	cursor: pointer;
}


#productDetail h2.minus {
	background: transparent url("https://paganistudio.com/images/minus-thinner.png") no-repeat scroll 96% center;
}

#productDetail .popDown {
	display: none;
	padding: 0 !important;
}

#productDetail p {
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 26px;
	color: #505152;
	
}

#productDetail p strong {
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 26px;
	color: #505152;
	
}

#productDetail a {
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 26px;
	color: #505152;
	text-decoration: underline;
}

#productDetail a:hover {
	color: #ab8c5a;
}

#productDetail .requestQuote,
#productDetail .emailTearsheet {
	margin-top: 40px;
}

#productDetail .requestQuote a.rollover, 
#productDetail .emailTearsheet a.rollover {
	background-color: #fff;
    border: 1px solid #e2cfb0;
    color: #ab8c5a;
    display: block;
    float: left;
    font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 14px;
	font-weight: 500;
    height: 18px;
    line-height: 18px;
	padding: 8px 10px;
	margin: 0 10px 10px 0;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: auto;
}

#productDetail .requestQuote a.rollover:hover, 
#productDetail .emailTearsheet a.rollover:hover {
	background-color: #c4b8a5;
    border: 1px solid #ab8c5a;
    color: #fff;
}

#productDetail .subtitle {
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
	color: #000;
}

/* extras */

.supercontainer.extras {
	background-color: #f9f7f4;
	padding: 50px 0;
}

.extras h3 {
	float: left;
	width: auto;	
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 22px;
	color: #505152;
	border-bottom: 1px solid #ab8c5a;
	margin: 0 0 20px 0;
    padding-bottom: 10px;
	text-transform: uppercase;

}

.extras a.title,
.extras div.title {
	float: left;
	display: block;
	width: 100%;
	height: 50px;
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 18px;
	color: #505152;
	text-decoration: none;
	margin-top: 4px;
	text-transform: uppercase;
}

.extras a.title:hover {
	text-decoration: underline;
	color: #ab8c5a;
}

.finishes {
	width: 100%;
	float: left;
	margin-bottom: 30px;
}

.materials {
	width: 100%;
	float: left;
	margin-bottom: 10px;
}

.finishThumb { 
	float: left;
	margin: 0 20px 0 0;
	width: 140px;
}

.finishThumb img { 
	width: 100%;
	max-width: 140px;
}

a.finishThumb.hidden {
	position: absolute;
}


.variations {
	width: 100%;
	float: left;
	margin-bottom: 30px;
	position: relative;
}

.variations a.rollover {
	position: absolute;
	top: -55px;
	left: 280px;
	background-color: #f9f7f4;
    border: 1px solid #e2cfb0;
    color: #ab8c5a;
	display: block;
    float: left;
    font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 14px;
	font-weight: 500;
    height: 18px;
    line-height: 18px;
	padding: 8px 10px;
	margin: 0 10px 10px 0;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: auto;
}

.variations a.rollover:hover {
	
    background-color: #c4b8a5;
    border: 1px solid #ab8c5a;
    color: #fff;
}

.variationThumb { 
	float: left;
	margin-right: 20px;
	width: 260px;
}

.variationThumb img { 
	width: 100%;
	max-width: 260px;
}


/* finishes popups */

.fancybox-skin {
	box-shadow: 0 0 50px #222;
	border-radius: 0;
}


.finishPopup {
	display: none;
	width: auto;
	padding: 10px;
}

.finishDetail {
	width: 380px;
	float: left;
}

.finishPic img {
	vertical-align: top;	
	width: auto;
	height: auto;
}

.finishPicNew {
	max-width: 700px;
	/*max-height: 500px;
	width: 700px;
	height: 520px;
	overflow: hidden;*/
}

.finishPicNew img {
	vertical-align: top;	
	width: 100%;
	height: auto;
}

.finishDesc {
	padding: 20px 30px 20px 20px;
}


.finishDesc h4 {
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
	font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.1em;
    line-height: 18px;
	color: #333;
	margin-bottom: 15px;
}

.finishDesc h4 span {
	font-weight: 500;
	text-transform: uppercase;
}

.finishDesc p {
	font-family: "Work Sans", Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 300;
    letter-spacing: 0.1em;
    line-height: 16px;
	color: #333;
	margin: 0 0 10px 0;
}

.finishDesc a {
	font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}

.finishDesc a:hover {
	color: #ab8c5a;
}
	
.finishInstall {
	float: right;
	padding-bottom: 10px;

}

.finishInstall img {
	vertical-align: top;
}

.finishInstallNew {
	float: right;
	padding: 0; 
	margin: 0 0 10px 0;
	width: 500px;
	height: 500px;
	overflow: hidden;
}

.finishInstallNew img {
	vertical-align: top;
}

.finishPopup .smallText {
	padding: 10px;
	max-width: 380px;
	font-family: 'Work Sans', sans-serif;
	font-size: 14px;
	line-height: 16px;
	font-weight: 500;
	color: #505152;
	letter-spacing: .05em;
	text-transform: uppercase;
	float: left;
}


/* STATIC */

#static {
	float: left;
	width: 100%;
	height: auto;
	margin: 50px 0 20px 0;
}

#static h2 {
	font-family: 'Work Sans', sans-serif;
	font-weight: 300;
	font-size: 1.4em;
	color: #505152;
	text-transform: uppercase;
	margin: 0px;
	letter-spacing: .1em;
	line-height: 30px;
}

#static h3 {
	font-family: 'Work Sans', sans-serif;
	font-weight: 500;
	font-size: 22px;
	color: #ab8c5a;
	text-transform: uppercase;
	margin: 0px;
	letter-spacing: .1em;
	line-height: 30px;
	border-bottom: 1px solid #e2cfb0;
	margin: 0 0 20px 0;
    padding: 10px 10px 10px 0;
	
}

#static p {
	font-family: 'Work Sans', sans-serif;
	color: #505152;
	margin: 0 0 20px 0;
	font-size: 18px;
    font-weight: 300;
    letter-spacing: 0.2;
    line-height: 28px;
}

#static p strong {
	font-weight: 500;
	color: #505152;
}

#static p.subtitle {
	clear: both;
	font-weight: bold;
	margin-top: 20px;
}

#static p .italic {
	font-style: italic;
	font-size: 16px;
}

#static a {
	color: #b39f7f;
	font-weight: 500;
	text-decoration: none;
}

#static a:hover {
	color: #505152;
	text-decoration: underline;
}


#static img {
	float: left;
	margin: 0px 50px 20px 0px;
	width: 100%;
	max-width: 500px;
	height: auto;
}

#static img.thanksPage {  /* submission thank you pages  */
	float: left;
	max-width: 400px;
	margin: 0 20px 20px 0;
}

#static ul,
#static ol {
	list-style-type: disc;
	margin: 0 0 20px 0;
	padding: 0 0 0 20px;
}

#static ul li,
#static ol li{
	font-family: 'Work Sans', sans-serif;
	color: #505152;
	font-size: 18px;
    font-weight: 300;
    letter-spacing: 0.2;
    line-height: 28px;
	list-style-type: disc;
	padding: 0 0 0 20px;
}

#static ul li strong {
	font-weight: 500;
	}

/* SHOWROOMS */

.showroom {
	border: 0;
	margin: 0;
	padding: 0;
	float: left;
	width: 30%;
	height: 250px;
	font-family: 'Work Sans', sans-serif;
	color: #505152;
	font-size: 18px;
	font-style: normal;
    font-weight: 300;
    letter-spacing: 0.2;
    line-height: 28px;
}

.showroom a {
	color: #b39f7f;
    font-weight: 500;
    text-decoration: none;
}

.showroom a:hover {
	color: #505152;
}

.sr_title {
	font-weight: 500;
}

.sr_name {
	text-transform: uppercase;
}

.sr_address {

}

.sr_contact span.fax {
	display: none;
}

/* CONTACT */

#static p.contact {
	font-size: 1.3em;
}

#static p.contact span{
	font-family: 'Work Sans', sans-serif;
	font-size: 1.3em;
    font-weight: 300;
	color: #333;
}

iframe {
	float: left;
	margin: 0px 40px 40px 0px;
	/*max-width: 420px;*/
	background-color: #fff;
}

a.social {
	color: #898a8c;
	margin-right: 20px; 
	float: left;
	margin-top: 20px;
}

a.social i {
	color: #898a8c;
}

a.social:hover i {
	color: #333;
}

/* PRESS */

#static .pressBox {
	float: left;	
	position: relative;
	width: 18%;
	height: 350px;
	margin-right: 2.5%;
	margin-bottom: 20px;
	text-align: left;
}

#static .pressBox:nth-child(5n) {
	margin-right: 0;
}

#static .pressBox img {
	width: 100%;
	max-width: 300px;
	vertical-align: top;
	margin: 0;
}

#static h2.pressTitle {
	float: left;
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #505152;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
	line-height: 16px;
	margin: 10px 0 0 0;
}

#static h2.pressTitle a {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #505152;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
}

#static h2.pressTitle a:hover {
	color: #000;
	
}

/* STORIES */





/* CUSTOM */

.supercontainer.pagehdr h2 {
	display: inline-block;
	float: right;
	width: auto;
	line-height: 20px;
	font-size: 20px;
	margin: 18px 0 14px 0;
}

.supercontainer.pagehdr h2 a {
	color: #333;
	font-family: 'Work Sans', sans-serif;
	font-weight: 300;
	font-size: 14px;
	text-transform: uppercase;	
	text-decoration: none;
	line-height: 20px;
	letter-spacing: .1em;
}

.supercontainer.pagehdr h2 a:hover {
	text-decoration: underline;
}

/* Masonry image grid */

.supercontainer.grid {
	margin-top: 0px;
	background-color: #bbb;
}

#grid-container {
	text-align: center;
	width: 100%;
}

.grid-sizer {
	width: 33.333%;
	line-height: 0;
}

.grid-item {
	float: left;
	width: 33.333%;
	/*max-width: 33%;*/
	margin: 0px !important;
	border: 0px !important;
	padding: 0px !important;
	line-height: 0px;    /* required or each div gets extra 5px padding.  Could also set explicit height but pics may be diff sizes */
	background-color: #000;
 }
 
.grid-item-horz-lg {
	width: 66.666%;
}
 
.grid-item img {
	width: 100%;
}
 

.grid-item .caption {
	position: absolute;
    text-align: center;
    top: 40%;
    width: 100%;
	font-family: 'Work Sans', sans-serif;
    font-weight: 600;
	font-size: 9px;
	color: #fff;
}

.grid-item .caption h2 {
	font-family: 'Work Sans', sans-serif;
    font-weight: 500;
	font-size: 19px;
	text-decoration: none;
	line-height: 28px;
 	text-transform: uppercase;
	color: #fff;
}

.grid-item .caption .firm,
.grid-item .caption .type {

	font-family: 'Work Sans', sans-serif;
    font-weight: 400;
	font-size: 13px;
	text-decoration: none;
	line-height: 20px;
 	text-transform: uppercase;
	color: #fff;
	
}



.grid-item .caption a {
	display: inline;
	font-family: 'Work Sans', sans-serif;
    font-weight: 600;
	font-size: 9px;
	text-decoration: underline;
	line-height: 38px;
 	text-transform: uppercase;
	color: #fff;
}

.grid-item .caption a:hover {
	color: #c7bcab;
}

/* custom popups */

.fancybox-nav span {  /* make arrows always visible so obvious when there is more */
	visibility: visible !important;
}



.customPopup {
	display: none;
	padding: 10px; 
	width: auto;
	max-width: 700px;
	height: auto;
	text-align: left;
	/* control opacity of only box behind text */
	/* Fallback for web browsers that don't support RGBa */
    background-color: rgb(255, 255, 255);
    /* RGBa with 0.7 opacity */
    background-color: rgba(255, 255, 255, 0.65);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF)";
	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);  
	-moz-box-shadow:  0px 0px 6px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);
}

.popupPic {
	width: 100%;
}

.popupPic img {
	vertical-align: top;
	max-height: 650px;
}


.customPopup .popupText {
	padding: 10px 10px 5px; 
}



.customPopup h2,
.customPopup h3 {
	font-family: 'Work Sans', sans-serif;
	color: #505152;
	letter-spacing: .05em;
	text-transform: uppercase;
	margin-bottom: 10px;
}

.customPopup h2 {
	font-size: 18px;
	line-height: 25px;
	font-weight: 500;
}

.customPopup h3 {
	font-size: 16px;
	line-height: 20px;
	font-weight: 400;
	
}

.customPopup div {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 18px;
}

.customPopup div span {
	font-weight: 500;
	text-transform: uppercase;
}

.customPopup .description {
    margin-bottom: 10px;
}

.customPopup .description p {
	margin: 0;
    padding-top: 15px;
}



.customPopup .firm,
.customPopup .type {
	color: #ab8c5a;
	font-size: 12px;
	text-transform: uppercase;
}

.customPopup .contact {
	margin-top: 10px;
}

.customPopup .contact a {
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 500;
}

.customPopup .contact a:hover {
	color: #ab8c5a;
}

.customPopup .smallText {
	padding: 10px;
	max-width: 380px;
	font-family: 'Work Sans', sans-serif;
	font-size: 14px;
	line-height: 16px;
	font-weight: 500;
	color: #505152;
	letter-spacing: .05em;
	text-transform: uppercase;
	
}

/* DESIGNER REGISTRATION */


.registrationform {
	float: left;
	width: 100%;
	margin-bottom: 0px;
}

#static .registrationform h2 {
	font-size: 20px;
	font-weight: 500;
    color: #505152;
	text-transform: none;
	letter-spacing: 0;
	margin-bottom: 20px;
}


.registrationform input[type="text"],
.registrationform input[type="email"],
.registrationform textarea {
	width: 50%;
	font-family: 'Work Sans', sans-serif;
	font-size: 14px;
}


.registrationform select {
	width: 41%;
	padding: 6px 4px;
	font-family: 'Work Sans', sans-serif;
}

.registrationform label {
	font-size: 14px;
	font-weight: 500;
}


.registrationform .error {
	color: #cc0000;
	font-size: 18px;
	margin: 10px 20px 20px 0px;
}

.registrationform .error li {
	font-family: "Work Sans",sans-serif;
    font-size: 18px;
    font-weight: 300;
    line-height: 28px;
}

.registrationform div.required {
	font-size: 13px;
	font-style: italic;
	margin-bottom: 15px;
}

.registrationform div.subtitle {
	font-family: 'Work Sans', sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: #000;	
	text-transform: uppercase;
}

.registrationform p.forgot {
	font-size: 14px;
}

.registrationform #member_form img {
	width: auto !important;
}

/* REQUEST A QUOTE */

.quoteform .quote_confirmation {
	border-top: 1px solid #dedddd;
    font-size: 20px;
    margin-bottom: 20px;
    padding-top: 20px;
}

.quoteform .quote_confirmation span {
	color: #cc0000;
    text-transform: uppercase;
}

.quoteform input[type="text"],
.quoteform textarea {
	width: 40%;
	font-family: 'Work Sans', sans-serif;
	font-size: 14px;
}


.quoteform select {
	width: 41%;
	font-family: 'Work Sans', sans-serif;
	padding: 6px 4px;
}

.quoteform label {
	font-size: 14px;
	font-weight: 700;
}

.quoteform .showroom_question {
	display: block;
	float: left;
	width: 100%;
}

.quoteform .showroom_question label,
.quoteform .showroom_question ul, 
.quoteform .showroom_question li {
	float: left;
	margin-bottom: 10px;
	margin-right: 5px;
	line-height: 18px;
}

.quoteform span.error {
	color: #cc0000;
	font-size: 13px;
	font-style: italic;
}

.quoteform div.required {
	font-size: 13px;
	font-style: italic;
	margin-bottom: 15px;
}



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

	
	/* larger than 1500  (devices and browsers)  - big desktop screen */
	@media only screen and (min-width: 1500px) {
		

			
	}
	
	/* larger than 1080 but smaller than 1500 (devices and browsers) - laptop screens & landscape ipad */  /*ORANGE*/
	@media only screen and (min-width: 1080px) and (max-width: 1499px) {
		
		
		/*nav .logo {
			margin: 0 0 0 15px;
		}
		
		
		ul#nav li, 
		ul#fnav li {
			padding: 0 15px;
		}
		
		ul#nav li a, 
		ul#fnav li a {
			font-size: 1em;
			letter-spacing: .1em;
		}*/

		.productThumb {
			height: 280px;
	
		}
		
		/* NEW & NOTEWORTHY */
		
		#layout-vert .nnPicGroup .row1 { height: 380px; }
		#layout-vert .nnPicGroup .row2 { height: 220px; }
		#layout-vert .column1 .img-a { height: 230px; }
		#layout-vert .column1 .img-b { height: 140px; }
		
		#layout-square .nnPicGroup { height: 400px; }
		#layout-square .column2 { height: 250px; }
		#layout-square .column3 { height: 140px; top: 260px;}
		
		#layout-single .nnPicGroup { width: 420px; height: 390px; }
		#layout-single .nnText { width: 400px; }
		#layout-single .nnText p { line-height: 20px !important;}
		
		/* COLLECTION */
		
		.supercontainer.splash {
			height: 540px;
		}
		
		/* PRODUCT */
		
		.prodimage {
			height: 490px;
		}
		
		.zoomWindow {
			width: 496px !important;
			height: 496px !important;
		}
		
		.jcarousel li {
			margin: 0px 0 0 3px;
		}
		
				
		/* CUSTOM */
		
		.grid-item .caption {
			top: 35%;
		}
		
		.grid-item .caption h2 {
			font-size: 15px;
			line-height: 20px;
			padding: 0 15px;
		}
		
		.grid-item .caption .firm, 
		.grid-item .caption .type {
			font-size: 11px;
			line-height: 15px;
			padding: 0 15px;
		}

		.popupPic img {
			max-height: 450px;
		}
		
		/* PRESS */
		
		#static .pressBox {
			height: 300px;
		}
		
		
		
		
	}
	
	/* larger than 960 but smaller than 1080 (devices and browsers) - small laptop screens & landscape ipad */  /*PURPLE*/
	@media only screen and (min-width: 960px) and (max-width: 1079px) {
		
		
		
		/* 	nav .logo {
			margin: 0 0 0 15px;
			width: 315px;
		}
		
		nav .logo a img {
			margin-top: 5px;
		}*/
		
		ul#nav {
			margin: 0 10px 0 0;
		}
		
		
	
		/* -----------------top & bottom navs spacing, font-size---------- */
	
		ul#nav li,
		ul#fnav li {
			/*padding: 0px 10px;*/
			line-height: 40px;
		}
		
		/*ul#nav li a, 
		ul#fnav li a {
			font-size: 1em;
			letter-spacing: .05em;
		}*/
		
		/* --------------------end all navs spacing--------------------------- */
		
		/* NEW & NOTEWORTHY */
		
		#layout-horz .nnPicGroup  { height: 250px; }
		#layout-horz .column3 { height: 150px; }
		#layout-horz .column4 { height: 90px; margin-left: 15px; top: 165px;}
		#layout-horz .column1 {	width: 33%; }
		#layout-horz .column2 {	width: 14%; }
		#layout-horz .column3 { width: 14%; }
		#layout-horz .column4 { width: 14%; }
		#layout-horz .column5 { width: 33%; }
		#layout-horz .nnText { width: 95%; }
		
		#layout-vert .nnPicGroup .row1 { height: 300px; }
		#layout-vert .nnPicGroup .row2 { height: 200px; }
		#layout-vert .column1 .img-a { height: 170px; }
		#layout-vert .column1 .img-b { height: 120px; }
		
		#layout-square .nnPicGroup { height: 340px; max-width: 600px;}
		#layout-square .nnText { max-width: 550px; } 
		#layout-square .column2 { height: 210px; }
		#layout-square .column3 { height: 120px; top: 220px;}
		#layout-square .nnText p { line-height: 20px;}

		#layout-single .nnPicGroup { width: 350px; height: 320px; }
		#layout-single .nnText { width: 330px; }
		#layout-single .nnText p { line-height: 20px !important;}
		#layout-single .nnText h2 { font-size: 17px !important; }
		
		
		/* COLLECTION */
		
		.supercontainer.splash {
			height: 500px;
		}
		
		
		.productThumb,
		.productThumb:nth-child(4n) {
			width: 31%;
			margin-right: 3.5%;
		}
		
		.productThumb:nth-child(3n) {
			margin-right: 0;
		}
		
		

		/* product */
		
		.prodimage {
			height: 440px;
		}
		
		.zoomWindow {
			width: 440px !important;
			height: 440px !important;
		}
		
		.jcarousel li {
			margin: 0px 0 0 18px;
		}
		
		/* CUSTOM */
		
		.grid-item .caption {
			top: 30%;
		}
		
		.grid-item .caption h2 {
			font-size: 14px;
			line-height: 20px;
			padding: 0 15px;
		}
		
		.grid-item .caption .firm, 
		.grid-item .caption .type {
			font-size: 11px;
			line-height: 15px;
			
			padding: 0 15px;
		}
		
		.popupPic img {
			max-height: 350px;
		}
		
		/* PRESS */
		
		#static .pressBox {
			height: 270px;
		}
	
	}
	
	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		
				
		
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */      /* BLUE */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		
		nav.supercontainer {
			/*height: 75px;
			padding: 15px 0 10px 0;*/
		}
		
		nav .logo {
			width: 40%;
		}	
		
		/*nav .logo {
			width: 315px;
			margin: 0 0 10px 15px;
			line-height: 30px;
		}
		
		nav .logo a img {
			margin-top: 5px;
		}*/
		
		ul#nav {
			float: left;
		}
		
		
		footer .copyright {
			font-size: 0.7em;
		}

	
		/* -----------------top & bottom navs spacing, font-size---------- */
	
		ul#nav li,
		ul#fnav li {
			/*padding: 0px 14px;*/
			line-height: 40px;
		}
		
		/*ul#nav li a,
		ul#fnav li a {
			font-size: 1em;
			letter-spacing: .15em;
		}*/
		
		/* --------------------end all navs spacing--------------------------- */
		
		/* NEW & NOTEWORTHY */
		#layout-horz .nnPicGroup  { height: 250px; }
		#layout-horz .column3 { height: 150px; }
		#layout-horz .column4 { height: 90px; margin-left: 15px; top: 165px; }
		#layout-horz .column1 {	width: 33%; }
		#layout-horz .column2 {	width: 14%; }
		#layout-horz .column3 { width: 14%; }
		#layout-horz .column4 { width: 14%; }
		#layout-horz .column5 { width: 33%; }
		#layout-horz .nnText { width: 95%; }
		
		div[id*="layout"] .nnText p { line-height: 20px; }
		
		#layout-vert { width: 650px; }
		#layout-vert .column2 {	width: 64%; }
		#layout-vert .column3 { width: 64%; }
			
		#layout-square .nnPicGroup { height: 500px; }
		#layout-square .column2 { height: 300px; }
		#layout-square .column3 { height: 190px; top: 310px;}
		
		
		#layout-single .nnPicGroup { width: 490px; height: 460px; }
		#layout-single .nnText { width: 470px; }
		#layout-single .nnText p { line-height: 20px !important;}
		
		
		/* COLLECTION */
		
		.supercontainer.splash {
			height: 415px;
		}
		
		h1.splashTitle a {
			font-size: 110px;
		}
		
		.productThumb,
		.productThumb:nth-child(4n) {
			width: 31%;
			margin-right: 3.5%;
			margin-bottom: 25px;
			height: 270px;
		}
		
		.productThumb:nth-child(3n) {
			margin-right: 0;
		}

		/* product */
		
		.prodimage {
			height: 360px;
		}
		
		.jcarousel li {
			margin: 0px 0 0 35px;
		}
		
		
		.finishThumb {
			width: 130px;
		}
		
		.finishPopup {
			width: 97%;
		}
		
		.finishDetail {
			width: 45%;
		}
		
		.finishInstall {
			width: 55%;
		}
		
		.finishInstall img {
			width: 100%;
			max-width: 500px;
		}
		.finishInstallNew {
			width: 55%;
		}
		
		.finishInstallNew img {
			width: 100%;
			max-width: 500px;
		}
		
	
		.variationThumb {
			width: 230px;
			margin-bottom: 10px;
		}
		
		.variations a.rollover {
			left: 250px;
		}
		
		/* CUSTOM */
		
		.grid-sizer,
		.grid-item {
			width: 50%;
			max-width: 50%;
		}
		
		.grid-item .caption {
			top: 35%;
		}
		
		.grid-item .caption h2 {
			font-size: 15px;
			line-height: 20px;
			padding: 0 15px;
		}
		
		.grid-item .caption .firm, 
		.grid-item .caption .type {
			font-size: 11px;
			line-height: 15px;
			
			padding: 0 15px;
		}
		
		.popupPic img {
			max-height: 300px;
		}
		
		 
		/* SHOWROOMS */
		
		.showroom {
			width: 45%;
		}
		
		/* PRESS */
		
		#static .pressBox {
			width: 22%;
			height: 270px;
		}
		
		#static .pressBox:nth-child(5n) {
			margin-right: 2.5%;
		}
		
		#static .pressBox:nth-child(4n) {
			margin-right: 0;
		}
		
		
		
	}
	
	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		
		/* splash */
		
		h1.splashlogo {
			box-shadow: none;  
			-moz-box-shadow:  none;
			-webkit-box-shadow: none;
		}
		
		/* MOBILE HEADER */
		
		nav.supercontainer { display: none; }
		
		.supercontainer {
			position: relative;
			float: left;
			width: 100%;
			background-color: #fff;
			z-index: 1;               /* z-index only works on positioned elements */
		
		}
		
		.mobile-scrolling {
			position: relative;
			width: 100%;
			z-index: 400;
			background-color: #fff;
			border-bottom: 1px solid #f1f1f1;
		}
		
		.mobile-fixed {
			position: fixed;
			width: 100%;
			z-index: 400;
			background-color: #22c6de;
			border-bottom: 1px solid #f1f1f1;
			box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);  
			-moz-box-shadow:  0 0 10px rgba(0, 0, 0, 0.5);
			-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
		}
		
		.mobileheader { 
			display: block; /* show menu link and main logo for mobile */
			background-color: #505152;
			margin: 0px auto;
			height: 45px;
		}  
		
		.mobileheader a.navbutton {
			background: linear-gradient(to bottom, #b39f7f 0%, #b39f7f 20%, transparent 20%, transparent 40%, #b39f7f 40%, #b39f7f 60%, transparent 60%, transparent 80%, #b39f7f 80%, #b39f7f 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
			border: 0 none;
			border-radius: 0;
			cursor: pointer;
			display: block;
			height: 25px;
			left: 20px;
			position: absolute;
			top: 5px;
			width: 30px;
			z-index: 999;
			color: #b39f7f;
			line-height: 65px;
			text-decoration: none;
			font-size: .75em;
		}
		
		.mobileheader a.navbutton:hover {
			background: linear-gradient(to bottom, #e1d2b9 0%, #e1d2b9 20%, transparent 20%, transparent 40%, #e1d2b9 40%, #e1d2b9 60%, transparent 60%, transparent 80%, #e1d2b9 80%, #e1d2b9 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
			color: #e1d2b9;
		}
		
		.mobileheader .logo {
			margin: 0px;
			text-align: right;
			padding: 0px 0px;
			width: 100%;
			height: 45px;
			line-height: 45px;
		}
		
		.mobileheader .logo img {
			padding: 10px 15px 12px 0;
			vertical-align: bottom;
			width: 280px;
		}
		
				
		
		/* mobile menu */
		 
		ul#nav, ul#nav ul {
			 width: 100%;
		}
		 
		ul#nav ul {
			 top: 18px;
		}
		 
		ul#nav li {
			 display: block;
		}
		 
		ul#nav li a {
			 text-align: left;
			 line-height: 30px;
		}
		 
		ul#nav ul li a {
			 letter-spacing: 0.2em;
			 font-size: 1em;
		}	
		
		.mm-menu { background: #505152; }								/* main menu div */
		
		.mm-menu.mm-vertical .mm-list li.mm-opened > ul.mm-panel {	/* opened subcategory list ul */
			background: rgba(255, 255, 255, 0.05) none repeat scroll 0 0;
			/* or you can just substitute a background color */
			border-top: 1px solid rgba(0, 0, 0, 0.15);
		}
		
		.mm-menu.mm-vertical .mm-list li.mm-opened > a.mm-subopen, 	/* subopen arrow background color */
		.mm-menu.mm-vertical .mm-list li.mm-opened > ul {
			background: rgba(255, 255, 255, 0.05) none repeat scroll 0 0;
			/* or you can just substitute a background color */
		}
		
		.mm-menu .mm-list > li > a.mm-subopen:after, 				/* subopen arrow color */
		.mm-menu .mm-list > li > a.mm-subclose:before {
			border-color: #999; 
		}
		
		.mm-menu .mm-list a,
		.mm-list a {												/* all menu links */
			font-family: 'Work Sans', sans-serif;
			font-weight: 400;
			text-decoration: none; 
			font-size: 16px;
			color: #b39f7f;
			text-transform: uppercase; 
		}						
		
		.mm-list a:hover {
			text-decoration: underline !important; 
		}
		
		.mm-menu .mm-list ul a,
		.mm-list ul a {												/* subcategory links */
			text-decoration: none; 
			font-size: 14px; 
			padding-left: 30px !important;
		}
	
		.mm-menu .mm-list .service { background: rgba(255, 255, 255, 0.05) none repeat scroll 0 0; }	/* service menu links if using*/
		
		.mm-menu .mm-list .service a { font-size: 12px; color: #b39f7f; }
		
		.mm-menu .mm-list .login { background: rgba(255, 255, 255, 0.05) none repeat scroll 0 0; }		/* login menu links if using */
		
		.mm-menu .mm-list .login a { font-size: 12px; color: #b39f7f; }
		
		
		
		/* FOOTER */
		
		footer.supercontainer {
			padding: 5px 0 8px;
		}
		
		ul#fnav { width: 100%; }
		
		ul#fnav li {
			line-height: 24px;
		}
		
		ul#fnav li.nn {
			margin: 10px 0;
		}
		
		ul#fnav li a {
			font-size: 1em;
		}
		
		footer .copyright {
			width: 100%;
			font-size: 0.7em;
			text-align: left;
		}
		
		footer #promo {
			bottom: 100px;
		}
		
		/* NEW & NOTEWORTHY */
		#layout-horz .nnPicGroup  { height: 200px; }
		#layout-horz .column3 { height: 120px; }
		#layout-horz .column4 { height: 72px; left: 0; margin-left: 5px; top: 343px;}
		#layout-horz .column1 {	width: 66%; }
		#layout-horz .column2 {	width: 28%; }
		#layout-horz .column3 { width: 28%; margin-top: 10px !important;}
		#layout-horz .column4 { width: 28%; }
		#layout-horz .column5 { width: 66%; margin-top: 10px !important;}
		#layout-horz .nnText { width: 92%; }
		#layout-horz .nnText h2 { line-height: 20px; width: 100%; margin-right: 0;}
		#layout-horz .nnText p { line-height: 20px; width: 100%; }
		
		#layout-vert { width: 96%; }
		#layout-vert .nnPicGroup { width: 100%; }
		#layout-vert .nnText { clear: both; width: 93%; }
		#layout-vert .nnPicGroup .row1 { height: 280px; }
		#layout-vert .nnPicGroup .row2 { height: 170px; }
		#layout-vert .column1 .img-a { height: 160px; }
		#layout-vert .column1 .img-b { height: 110px; }
		#layout-vert .column2 {	width: 63%; }
		#layout-vert .column3 { width: 63%; }
		
		#layout-square .nnPicGroup { height: 400px; }
		#layout-square .column2 { height: 240px; }
		#layout-square .column3 { height: 150px; top: 250px;}
		
		#layout-single .nnPicGroup { width: 350px; height: 320px; }
		#layout-single .nnText { width: 330px; }
		#layout-single .nnText p { line-height: 20px !important;}
		#layout-single .nnText h2 { font-size: 17px !important; }
		
		/* COLLECTIONS */
		
		.splashImage {
			width: 50%;
		}
		
		h1.splashTitle {
			top: 20%;
		}
		
		h1.splashTitle a {
			font-size: 75px;
		}
		
		.supercontainer.pagehdr h1 {
			margin: 8px 0;
			font-size: 16px;
		}
		
		.supercontainer.pagehdr h2 {
			margin: 8px 0;
		}
		
		.supercontainer.pagehdr h2 a {
			font-size: 12px;
		}

		
		.productThumb,
		.productThumb:nth-child(4n),
		.productThumb:nth-child(3n) {
			width: 47%;
			margin-right: 5%;
			margin-bottom: 25px;
			
		}
		
		.productThumb:nth-child(2n) {
			margin-right: 0;
		}

		.caption {
			top: 40%;
		}
		
		/* product */
		
		#productDetail h1 {
			display: none;
		}
		
		h1.mobilehdr { 
			display: block;
			font-family: "Work Sans", Arial, Helvetica, sans-serif;
			font-size: 28px;
			font-weight: 500;
			letter-spacing: 0.1em;
			line-height: 28px;
			color: #505152;
			border-bottom: 1px solid #b0a390;
			margin-bottom: 20px;
			padding-bottom: 10px;
			text-transform: uppercase;
		}

		#productImageThumbs {
			margin-right: 0;
			width: 100%;
		}
		
		.zoomContainer {
			display: none !important;   /* hide rollover zoom on mobile */
		}
		
		
		#productDetail {
			float: left;
			width: 100%;
			margin-top: 20px;
		}
		
		#productDetail p.specs {
			display: none;
				
		}
		.finishPopup {
			display: none;
			width: 95%;
		}
		
		.finishDetail {
			width: 40%;
			
		}
		
		
		.finishInstall {
			width: 60%;
			
		}
		
		.finishDetail img,
		.finishInstall img {
			width: 100%;
			
		}
		
		
		.finishInstallNew {
			width: 60%;
			
		}
		
		
		.finishInstallNew img {
			width: 100%;
			
		}


		.variationThumb {
			width: 45%;
			margin-bottom: 10px;
		}
		
		/* CUSTOM */
		
		.supercontainer.pagehdr h2 {
			float: left;
			clear: both;
			margin: -10px 0 8px;
		}
		
		.grid-sizer,
		.grid-item {
			width: 50%;
			max-width: 50%;
		}
		
		.grid-item .caption {
			top: 30%;
		}
		
		.grid-item .caption h2 {
			font-size: 13px;
			line-height: 20px;
			padding: 0 15px;
		}
		
		.grid-item .caption .firm, 
		.grid-item .caption .type {
			font-size: 10px;
			line-height: 15px;
			
			padding: 0 20px;
		}
		
		.customPopup h2 {
			font-size: 16px;
			line-height: 16px;
		}
		
		.customPopup div {
			font-size: 12px;
			line-height: 14px;
		}
		
		.customPopup .popupText {
			padding: 10px 5px 5px;
		}
		
		.customPopup .smallText {
			padding: 8px 5px 0px 5px;
		}
		
		.customPopup .description p {
			margin: 10px 0 20px;
			padding-top: 5px;
		}
		
		.fancybox-nav {    /* shorten next/prev click area to allow scrolling of box contents if necessary */
			height: 50%;
			top: 25%;
		}
		
		.popupPic img {   
			width: 100%;
		}

		
		
		/* SHOWROOMS */
		
		.showroom {
			width: 45%;
		}
		
		/* PRESS */
		
		#static .pressBox {
			width: 47%;
			height: 300px;
		}
		
		#static .pressBox,
		#static .pressBox:nth-child(5n) {
			margin-right: 6%;
		}
		
		#static .pressBox:nth-child(2n) {
			margin-right: 0;
		}
			
	}
	
	/* Mobile Landscape Size to Tablet Portrait - larger phones - phablets (devices and browsers) */       /* PINK */
	@media only screen and (min-width: 580px) and (max-width: 767px) {
		
		
		.jcarousel li {
			margin: 0px 0 0 9px;
		}
		
		/* COLLECTION */
		
		.supercontainer.splash {
			height: 980px;
		}
		
		.productThumb {
			height: 280px;
		}
		
		.prodimage {
			height: 530px;
		}
		
		/* product */
		.variations a.rollover {
			left: 260px;
		}
		
		/* PRESS */
		
		#static .pressBox {
			height: 370px;
		}
		
	}
	
	/* Mobile Landscape Size to Tablet Portrait - larger phones - phablets (devices and browsers) */       /* PINK */
	@media only screen and (min-width: 580px) and (max-width: 650px) {
	
		#layout-square .nnText {
    		width: 97%;
		}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */       /* GREEN */
	@media only screen and (min-width: 480px) and (max-width: 579px) {
		
		.mobileheader .logo img {
			width: 300px;
		}
		
		/* COLLECTION */
		
		.supercontainer.splash {
			height: 800px;
		}
		
		h1.splashTitle a {
			font-size: 60px;
		}
		
		.productThumb {
			height: 230px;
		}
		
		.prodimage {
			height: 420px;
		}
		
		.jcarousel li {
			margin: 0px 0 0 13px;
		}
		
		.finishPopup {
			width: 94%;
		}
		
		.finishDetail {
			width: 100%;
			
		}
		
		.finishPic {
			float: left;
			width: 45%;
		}
		
		.finishPicNew {
			float: left;
			width: 45%;
		}
		
		.finishDesc {
			float: left;
			width: 45%;
			padding: 15px 20px;
		}
		
		.finishDesc h4 {
			margin-bottom: 5px;
		}

		.finishInstall {
			display: none;
		}
		
		.finishInstallNew {
			display: none;
		}
		
		.variations a.rollover {
			position: relative;
			top: 0px;
			left: 0px;
			clear: both;
		}
		
		/* NEW & NOTEWORTHY */
		
		#layout-vert { width: 92%; }
		
		#layout-vert .nnPicGroup .row1 { height: 200px; }
		#layout-vert .nnPicGroup .row2 { height: 100px; }
		#layout-vert .column1 .img-a { height: 110px; }
		#layout-vert .column1 .img-b { height: 80px; }
		#layout-vert .nnText h2 { line-height: 18px; font-size: 16px; }
		#layout-vert .nnText p { line-height: 16px; font-size: 12px;	}

		#layout-square .nnPicGroup { height: 300px; }
		#layout-square .column1 { width: 55%; }
		#layout-square .column2 { height: 180px; }
		#layout-square .column3 { left: 55%; height: 110px; top: 190px;}
		#layout-square .nnText { width: 94%; }
				
		/* CUSTOM */
		
		.grid-item .caption {
			top: 15%;
		}
		
		/* SHOWROOMS */
		
		.showroom {
			width: 100%;
			height: auto;
			margin-bottom: 30px;
		}
		
		 
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */      /* RED */
	@media only screen and (max-width: 479px) {
		
		
		.mobileheader .logo img {
			width: 220px;
			padding: 10px 10px 12px 0;
			vertical-align: top:
		}
		
		ul#fnav li {
			padding: 0 10px;
		}
		
		ul#fnav li a {
			font-size: .8em;
			letter-spacing: .1em;
		}
		
		footer .copyright {
			letter-spacing: 0;
		}
		
		footer .credits {
			display: none;
		}
		
		footer #promo {
			padding: 10px 0;
			width: 100%;
			left: auto;
			bottom: 80px;
		}
		
		#promo h3 {
			margin: 0;
		}
		
		#promo .location {
			margin-top: 5px;
			padding-top: 5px;
			font-size: 12px;
		}
		
		#promo .location span {
			font-size: 16px;
		}
		
		/* NEW & NOTEWORTHY */
		
		div[id*="layout"] .nnText h2 { line-height: 18px; font-size: 16px; }
		div[id*="layout"] .nnText p { line-height: 16px; font-size: 12px;	}
			
		#layout-horz .nnPicGroup  { height: 150px; }
		#layout-horz .column3 { height: 90px; }
		#layout-horz .column4 { height: 54px; top: 261px; }
		#layout-horz .column1 {	width: 64%; }
		#layout-horz .column2 {	width: 24%; }
		#layout-horz .column3 { width: 24%; margin-top: 10px !important;}
		#layout-horz .column4 { width: 24%; }
		#layout-horz .column5 { width: 64%; margin-top: 10px !important;}
		#layout-horz .nnText { padding: 10px 0; }
		
		
		#layout-vert { width: 92%; }
		#layout-vert .nnPicGroup .row1 { height: 200px; }
		#layout-vert .nnPicGroup .row2 { height: 100px; }
		#layout-vert .column1 .img-a { height: 110px; }
		#layout-vert .column1 .img-b { height: 80px; }

		#layout-square .nnPicGroup { height: 300px; }
		#layout-square .column1 { width: 96%; margin-bottom: 10px; }
		#layout-square .column2 { width: 45%; }
		#layout-square .column3 { width: 45%; }
		#layout-square .column2 { height: 180px; }
		#layout-square .column3 { height: 180px; top: 310px; left: auto; right: 4px;}
		#layout-square .nnText { width: 97%; }
		
		#layout-single .nnPicGroup { height: 300px; width: 96%; }
		#layout-single .nnText { width: 90%; }
		#layout-single .nnText h2 { font-size: 14px !important; }
		
		/* COLLECTION */
		
		.supercontainer.splash {
			height: 600px;
		}
		
		h1.splashTitle a {
			font-size: 45px;
			letter-spacing: 0.1em;
		}
		
		
		.productThumb,
		.productThumb:nth-child(4n),
		.productThumb:nth-child(3n),
		.productThumb:nth-child(2n) {
			width: 100%;
			height: 340px;
			margin-right: 0;
			margin-bottom: 25px;
		}
		
		.caption {
			top: 41%;
		}
		
		/* product */
		
		.prodimage {
			height: 300px;
		}
		
		.jcarousel li {
			margin: 0px 0 0 17px;
		}
		
		.finishThumb {
			width: 120px;
		}
		
		.variationThumb {
			width: 260px;
			margin-bottom: 20px;
		}
		
		.finishPopup {
			width: 93%;
		}
		
		.finishDetail {
			width: 100%;
			
		}
		
		.finishDesc h4 {
			margin-bottom: 5px;
		}

		.finishInstall {
			display: none;
		}
		
		.finishInstallNew {
			display: none;
		}
		
		.variations a.rollover {
			position: relative;
			top: 0px;
			left: 0px;
			clear: both;
		}
		
		/* CUSTOM */
		
		.grid-sizer {
			width: 100%;
		}
		
		.grid-item {
			width: 100%;
			max-width: 100%;
			
		 }
		
		
			
		/* SHOWROOMS */
		
		.showroom {
			width: 100%;
			height: auto;
			margin-bottom: 30px;
		}
		
		/* PRESS */
		
		#static .pressBox {
			height: 250px;
		}
		
		
	}


