/**************************************************************************************************/
/*                                  Non-semantic Helper Classes                                   */
/**************************************************************************************************/
/* Scott Kellum image replacement */
.ir { text-indent: 100%; white-space: nowrap; overflow: hidden; }

/* Nicolas Gallagher image replacement -- works nicely with "margin: 0 auto" centering */
.ir-alt { font: 0/0 a; text-shadow: none; color: transparent; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Micro Clear Fix <http://nicolasgallagher.com/micro-clearfix-hack/> */
.clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; }


/**************************************************************************************************/
/*                                             Globals                                            */
/**************************************************************************************************/
/* Normalize.css v2.1.2 | MIT License | git.io/normalize */
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}

/* Apply a natural box layout model to all elements: paulirish.com/2012/box-sizing-border-box-ftw */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

/* Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */
img { vertical-align: middle; }

/* Other */
@font-face { font-family: 'ff-din-web-1'; src: url('/fonts/ff-din-web-1-400.otf'); font-style: normal; font-weight: 400; }
h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, input, table, tr, th, td { margin: 0; padding: 0; }
a { color: inherit; }
a:hover { text-decoration: none; }


/**************************************************************************************************/
/*                                             Layout                                             */
/**************************************************************************************************/
html, body, .page, .content { height: 100%; }
.content { position: relative; width: 960px; margin: 0 auto; padding: 0 10px; }

#front-page { font: 400 1em/1.4 ff-din-web-1, sans-serif;
              background: #3d3d3f; /* Old browsers */
              background: -moz-linear-gradient(top, rgb(65,64,66) 0%, rgb(68,68,70) 50%, rgb(52,52,54) 100%, rgb(44,44,46) 100%); /* FF3.6+ */
              background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(65,64,66)), color-stop(50%,rgb(68,68,70)), color-stop(100%,rgb(52,52,54)), color-stop(100%,rgb(44,44,46))); /* Chrome,Safari4+ */
              background: -webkit-linear-gradient(top, rgb(65,64,66) 0%, rgb(68,68,70) 50%, rgb(52,52,54) 100%, rgb(44,44,46) 100%); /* Chrome10+,Safari5.1+ */
              background: -o-linear-gradient(top, rgb(65,64,66) 0%, rgb(68,68,70) 50%, rgb(52,52,54) 100%, rgb(44,44,46) 100%); /* Opera 11.10+ */
              background: -ms-linear-gradient(top, rgb(65,64,66) 0%, rgb(68,68,70) 50%, rgb(52,52,54) 100%, rgb(44,44,46) 100%); /* IE10+ */
              background: linear-gradient(to bottom, rgb(65,64,66) 0%, rgb(68,68,70) 50%, rgb(52,52,54) 100%, rgb(44,44,46) 100%); /* W3C */
              filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d3d3f', endColorstr='#2c2c2e',GradientType=0 ); /* IE6-9 */
}
	#loading-triangle, #front-block { position: absolute; width: 592px; height: 513px; top: 50%; left: 0; right: 0; margin: -358px auto auto; }
	#loading-triangle { background-image: url('img/loading_triangle.png'); display: none; }
	#front-block {}
		#logo { position: absolute; width: 186px; height: 216px; top: 182px; left: 0; right: 0; margin: auto; background-image: url('/img/p4_logo.png'); }
		#login-form { position: absolute; width: 304px; top: 451px; left: 0; right: 0; margin: auto; }
			.login-label { position: absolute; top: 20px; margin-left: 4px; font-size: 11px; color: #e6e6e6; }
			.login-input, #login-button { float: left; margin-right: 1px; border: none; height: 34px; color: #e6e6e6; }
			.login-input { width: 243px; padding: 6px 5px 0; font-size: 18px; outline: none; background-color: #373739; }
			.login-input:hover, .login-input:focus, #login-button:hover { box-shadow: inset 1px 1px 5px 1px rgba(0,0,0,.125); }
			#login-button { width: 60px; padding: 19px 4px 0; font-size: 11px; margin-right: 0; text-align: left; background-color: #2f2f31; }
			#login-button:active { background-color: #232324; color: #b3b3b3; }
			#login-error { display: none; position: absolute; left: 4px; top: -15px; font-size: 11px; color: #d8eb4c; }


#products-page { width: 839px; margin: 0 auto; padding: 0; font: normal 12px Arial, sans-serif; color: #231f20; }
	#user { position: absolute; top: 1px; right: 1px; z-index: 999; }
		.user-button { min-width: 82px; text-align: center; float: left; margin-right: 1px; padding: 6px 18px; font-size: 10px; font-weight: bold; color: white; text-transform: uppercase; text-decoration: none; background-color: hsl(0, 80%, 35%); box-shadow: inset 2px 2px 2px 1px rgba(0, 0, 0, 0.25); -webkit-transition: background-color 200ms ease-out; -moz-transition: background-color 200ms ease-out; -o-transition: background-color 200ms ease-out; transition: background-color 200ms ease-out; }
		.user-button:last-child { margin-right: 0; }
		.user-button:hover { background-color: hsl(0, 80%, 50%); -webkit-transition: background-color 0; -moz-transition: background-color 0; -o-transition: background-color 0; transition: background-color 0; }
		#refresh_photos { background-color: blue; }
		#refresh_photos:hover { background-color: #4d4dff }
		#contact { background-color: #231f20; }
		#contact:hover { background-color: #594f52; }
	#products-header { margin: 24px 0 82px 63px; }
		#products-header-title { width: 776px; height: 42px; background: url('/img/heading.png') 0 0 no-repeat;}
		#products-header-tagline { font-family: 'Times New Roman'; font-style: italic; }
	.product {}
	.product.admin_only { background-color: #fcf0f2;}
		.style, .images, .info { float: left; }
		.style { width: 63px; margin-top: -4px; padding-right: 2px; font: bold italic 30px 'Times New Roman', serif; text-align: right; }
		.images { width: 392px; }
			.thumbnail { float: left; margin: 0 0 3px 3px; -webkit-transition: opacity 200ms ease-out; -moz-transition: opacity 200ms ease-out; -o-transition: opacity 200ms ease-out; transition: opacity 200ms ease-out;  }
			.thumbnail:hover { opacity: 0.5; filter:alpha(opacity=50); -webkit-transition: opacity 0; -moz-transition: opacity 0; -o-transition: opacity 0; transition: opacity 0; }
			.thumbnail.large { margin-left: 0; }
			.thumbnail.large:hover { opacity: 0.66; }
		.info { width: 384px; margin-top: -1px; }
			.description-head { position: relative; top: 1px; border-bottom: 1px solid #bfbfbf; color: #231f20; font-weight: normal; text-align: left; }
				.style-name { font-weight: bold; }
				.style-extra {}
				.style-description { color: #bfbfbf; }
			.color { vertical-align: bottom; }
			.sold-out .code, .sold-out .description, .sold-out .price-value { text-decoration: line-through; }
				.code { width: 45px; padding: 0 0.5em 0 0.75em; text-transform: uppercase; }
				.code-style {}
				.code-color { display: none; margin-left: 3px; font-weight: bold; }
				.description { width: 272px; }
				.price { text-align: right; }
				.currency { margin-right: 1px; font-size: 8px; }
				.color:not(:first-child) .currency { visibility: hidden; }
		#products-footer { margin: 77px 0 0 63px; padding: 0.9em; font-size: 9px; color: grey; text-transform: uppercase; list-style-type: none; }
			.products-footer-item { display: inline-block; margin-right: 1em; }

	#process-map { width: 776px; float: right; margin: -6px 0 103px; }
	#process-map-img { margin-bottom: 1em; }
	#process-map h2 { font-size: inherit; }
	#process-map h2, #process-map p, #process-map a { display: block; text-align: center; }


/**************************************************************************************************/
/*                                        ColorBox v1.4.26                                        */
/**************************************************************************************************/
/*** ColorBox Core Styles: DO NOT MODIFY. ***/
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative;overflow:hidden}#cboxLoadedContent{overflow:auto}#cboxLoadedContent iframe{display:block;width:100%;height:100%;border:0}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}

/*** ColorBox User Styles ***/
#cboxOverlay { background-color: rgba(0,0,0,0.95); }
#colorbox { outline: 0; }
    #cboxContent { background: #231f20; color: white; } /* Entire visible pop-up */
		#cboxLoadedContent { margin-bottom: 50px; } /* Determines height of container below image */
			#cboxTitle { position: absolute; bottom: 0; left: 0; height: 50px; } /* Match #cboxLoadedContent height */
			#cboxTitle dl { float: left; margin: 4px 12px 0 4px; }
			#cboxTitle dt, #cboxCurrent { min-width: 1.75em; font-size: 9px; color: #dce0df; text-transform: uppercase; }
			#cboxTitle dd { margin: 0; font-size: 12px; }
			#cboxCurrent { position: absolute; bottom: -4px; right: 7px; height: 50px; } /* Match #cboxLoadedContent height */
			#cboxPrevious, #cboxNext, #cboxClose { border: 0; }
			#cboxPrevious, #cboxNext { position: absolute; bottom: 13px; width: 24px; height: 26px; }
			#cboxPrevious { right: 19px; background: url('/img/cbox/next.png') 7px 7px no-repeat; }
			#cboxNext { right: 0; background: url('/img/cbox/previous.png') 7px 7px no-repeat; }
			#cboxPrevious.hover {}
			#cboxNext.hover {}
			#cboxNote { position: absolute; bottom: 3px; right: 5px; font-size: 9px; color: #677471; }
			#cboxClose { position: absolute; top: 0; left: 0; width: 24px; height: 24px; background: url('/img/cbox/close-white.png') 4px 4px no-repeat; }
			#cboxClose:hover { background-image: url('/img/cbox/close-red.png') };

/* IE Fix: The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9. See: http://jacklmoore.com/notes/ie-transparency-problems/ */
.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); }