@charset "utf-8";
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
/* CSS Document */
body {
    font-family: 'Open Sans', sans-serif;
    padding: 0;
	font-size:13px;
	line-height: 1.2;
}
a, a:link, a:hover, a:active { text-decoration: none }
* {
	margin:0;
	padding:0;
	outline:0;
	border:none;
	/*font-size: 13px;*/
	font-weight:inherit;
	font-family: 'Open Sans', sans-serif;
	color:#586984; /* Light Blue */
	text-decoration:none;
	list-style:none;
	}
	
h1 {
	font-size: 30px;
	color:#1B3257;
	font-weight: 900;
	margin-bottom: 10px;
	}
	
h2, #product-details p#price  {
	font-size: 20px;
	font-weight: 700;
	line-height: 24px;
	}

h3, .media-page-link p{
	font-size: 18px;
	font-weight: 700;
	color:#335BA1;
	}

strong {
	font-weight:900;
	}

body {
	background: #ccc;
	}
	
#wrap {
	width:960px;
	margin:auto;
	padding:10px;
	position:relative;
	}
	
.cleared {
	clear:both;
}
/* ========== SHARED STYLES ========== */

/* Display as block */
header, nav, footer, #top-nav {
	display:block;
	}

/* white text */	
footer, footer a, #footer-copy, #search-button, .media-link h3 {
	color:#fff;
	}
		
/* Dark blue text */
#banner-text, #banner-text span, #banner-contact, #user-nav li a, .more, .filter-title, #filter-header ,#cat-filter li a:hover, #sup-filter li a:hover, h2, h2 span, a.product p, #product-details p strong, .price span, #reg-box p strong, #login-box p strong, input, select, option, #left-col p strong, #back, h1 span strong, #cart-top td, .cart-item td p strong, .title-cell p strong, .cart-total, #short-col p strong, #short-col p strong a, label, #logout, textarea, #paragraph strong, #privacy-italic, p strong a, #supplier-banner p span, #supplier-banner p {
	color:#1B3257;
	}
	
/* Hover underline */	
.more:hover, #user-nav li a:hover, footer a:hover, #checkout-box p a:hover, #reg-box p a:hover, #login-box div a:hover, .field-box p a:hover, #paragraph a:hover, #logout:hover, #right-col p a:hover, #short-col p strong a:hover, .media-page-link:hover p, p strong a:hover, #supplier-banner:hover p span {
	text-decoration:underline;
	}

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

/* ========== BANNER ========== */

#banner {
	width:100%;
	height:132px;
	background:#fff;
	padding: 10px 0 10px 0;
	}
	
.container {
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
}
.logobox {
	float: left;
	width: 600px;
}
.usermenu {
	float: right;
	width: 360px;
}
.banner-contact{
	float: right;
	width: 300px;
	text-align:right;
	font-size: 11px;
	line-height: 12px;
	color: #1B3257;
}
#top-logo {
	float:left;
	margin:0 30px 0 0;
	}

	
/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {

}
@media only screen  and (min-width : 1224px) {
	
}*/

	
#banner-text span {
	font-size: 14px;
	line-height: 1.2;
	font-weight:bold;
	font-style:italic;
	}
}
#network {
	float:right;	
	width:280px;
	}

#user-nav {
	text-align:right;	
	font-size: 15px;
	margin-bottom: 0;
	}
	
#user-nav li {
	display:inline;
	}
	
#user-nav li a img {
	margin-right:10px;
	vertical-align:top;
	}



	
/* ========== NAVIGATION ========== */

nav {
	display:block;
	height:40px;
	width:100%;
	background-color: #223F6D;
	background-image: -ms-linear-gradient(top, #2C508C 0%, #1B3358 100%);
	background-image: -moz-linear-gradient(top, #2C508C 0%, #1B3358 100%);
	background-image: -o-linear-gradient(top, #2C508C 0%, #1B3358 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2C508C), color-stop(1, #1B3358));
	background-image: -webkit-linear-gradient(top, #2C508C 0%, #1B3358 100%);
	background-image: linear-gradient(to bottom, #2C508C 0%, #1B3358 100%);
	}
#navbar {
	margin-bottom: 0px;
	position: relative;
	z-index: 99;
}
	
/* Search Bar */

#search-bar {
	width:217px;
	margin: 0 auto;
	}
	
#search-text {
	width:150px;
	padding:3px;
	border: 1px solid #112138;
	float:left;
	border-radius: 3px 0 0 3px;
	margin: 0;
	}

#search-button {
	background:transparent;
	width:60px;
	border:1px solid #112138;	
	padding:3px;
	margin-left:-1px;
	cursor:pointer;
	border-radius: 0 3px 3px 0;
	}
	
#search-button:active {
	background:#112138;
	}

/* ========== SLIDER ========== */

.slider-wrapper{
	position:relative;
	overflow: hidden;
	}
.slider img {
	margin: 0 auto;
}
#slide-shadow {
	width:960px;
	height:25px;
	background: url(../images/slider/slide-shadow.png) no-repeat;
	}

.nivoSlider {
  position:relative;
  background:url(../images/slider/loading.gif) no-repeat 50% 50%;
	}

.nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
	display:none;
	}

.nivoSlider a {
	border:0;
	display:block;
	}

.nivo-caption {
	opacity:1 !important;
	filter: Shadow(Color=#000000, Direction=135, Strength=2);	
	}
		
/* ========== CONTENT ========== */
/* ============================= */
#content_area {
	width: 100%;
	background: url(../images/content-bg.png) repeat-x top left; 
}
#content {
	font-size: 14px;
	background:#fff; 
	padding-bottom:50px;
	overflow:hidden;
	}
	
#content-prod {
	padding: 0;
	margin: 0;
/*	background:#fff url(../images/border.gif) repeat-y 239px 0; */
	background: #fff;
	/*padding-bottom:50px;*/
	overflow:hidden;
	position: relative;
	font-size: 14px;
	}
	
#content-dec {
	font-size: 14px;
	background:#fff url(../images/wrap-bg.png) no-repeat top right; 
	padding-bottom:50px;
	overflow:hidden;
	min-height:430px;
	}	
	
h1#page-title {
	margin:20px;
	font-weight:900;
	}
.page-body {
	margin: 0 20px;
}
/* ========== FORM STYLES ========== */

#form-box {
	}
	
.req, .invalid, .match{
	display:none;
	color:#c1272d;
	margin-left:5px;
	}
	
.field-box {
	padding:5px;
	position:relative;
	}

.field-box label {
	display:block;
	float:left;
	width:150px;
	text-align:right;
	margin-right:10px;	
	padding:3px;
	}	
	
.field-box label span{
	font-size: 13px;
	}	

.field-box label span{
	color:#666;
	}
		
#hardware-type, #hardware-finish {
	width:220px;
	margin-bottom: 13px;
	}	
	
#door-size {
	width:140px;
	margin-bottom: 13px;
	}	

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] {
	padding: 4px;
	height: 26px;
	font-size: 13px;
	border-radius: 4px;
	}
	
#staff, #subject {
	width:257px;	
	}	
	
input,textarea {
	width:250px;
	}
	
input.button {
	width:90px;
	background:#999;
	cursor:pointer;
	color:#ddd;
	}	
	
.qty {
	width:30px;
	text-align:right;
	}	
	
	
/* ========== HOME PAGE STYLES ========== */

#home-left-col {
	width:450px;
	padding: 0 10px 0 20px;
	float:left;	
	}	
	
#home-right-col {
	width:480px;
	padding: 0 20px 0 0px;
	float:right;
	}
#home-bottom-col {
/*	width:90%;
	margin: 0 auto;
	padding: 0 20px 0 20px;*/
}
#left-col {
	width:600px;
	padding: 0 10px 0 20px;
	float:left;	
	}	

#right-col {
	width:300px;
	padding: 0 20px 0 0px;
	float:right;
	}		
.section {
	background: url(../images/sect-sep.png) no-repeat bottom left;
	padding-bottom: 30px;

	}
.section h3 {
	line-height: 22px;
	margin: 0;
}
.last {
	background-image:none;
	}	
	
.section p {
	margin-bottom:1em;
	}

#videos, #articles {
	float:left;
	width:225px;
	background:url(../images/media-link-shadow.png) no-repeat bottom left;
	padding-bottom:22px;
	}
	
#videos {
	margin-right:10px;
	}	

.media-link	{
	display:block;
	width:225px;
	height:75px;
	border-top:1px #335BA1 solid;
	border-bottom:1px #112138 solid;
	padding:10px;
	background: url(../images/media-link-bg.png) repeat-y;
	}
	
.media-link:hover {
	background:#112138;
	border-color:#112138;
	}

.media-link h3 {
	font-size: 14px;
	font-weight:bold;
	line-height: 16px;
	margin: 0;
	}
	
.media-link p {
	color:#aaa;
	}

.vid-thumb {
	float:right;
	margin-left:5px;
	border:#fff solid 3px;
	}
	
.read-btn {
	float:right;
	}

/* ========== PRODUCTS PAGE ========== */

.filter-tab {
	display: none;
}
#product-filter {
	width:240px;
	padding:20px;
	/*float:left;*/
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	}

#filter-header {
	font-weight:bold;
	width:180px;
	padding-bottom:1.5em;
	border-bottom:#ccc 1px solid;
	}

.filter-title {
	font-size: 16px;
	font-weight:bold;
	margin-bottom:1.2em;
	}

#cat-filter {
	margin:24px 0;
	width: 100%;
	}

#sup-filter {
	margin:24px 0;	
	width: 100%;
	}

#product-list {
	position: relative;
	margin-left: 240px;
	overflow: hidden;
	/*float: left;*/
	background: #fff;
	border-left: 1px #ccc solid;
	min-height: 790px;
	}	
	
#product-banner {
	background:url(../images/prod-banner-bg.png) top right no-repeat;
	height:120px;
	position:relative;
	}
	
#supplier-banner {
	background:url(../images/sup-banner-bg.png) top right no-repeat;
	display:block;
	height:150px;
	padding-left:20px;
	position:relative;
	}
	
#supplier-banner img {
	float:left;
	}
	
#supplier-banner p {
	text-align:right;
	position:absolute;
	bottom:0;
	right:0;
	padding:20px;
	font-size: 20px;
	/* text-shadow:#666 1px 1px 3px;
	filter: Shadow(Color=000000, Direction=135, Strength=1); */
	}	
	
#supplier-banner p span	{
	font-size:1em;
	/* font-weight:bold;	 */
	}
	
#product-banner-shadow {
	max-width:720;
	width: 100%;
	height:20px;
	background: url(../images/prod-banner-shadow.png) top center no-repeat;
	}

.catdescription p {
	padding: 10px !important;
}
#product-banner h1 {
	/*position:absolute;
	bottom:0px;
	left:10px;*/
	margin: 0;
	padding: 66px 0 0 10px;
	font-weight:700;
	font-size: 36px;
	line-height: 40px;
	color:#fff;
	text-shadow:#666 1px 1px 3px;
	filter: Shadow(Color=000000, Direction=135, Strength=1);
	}
	
#results {
	margin-left:10px;
	margin-bottom:10px;
	}	
#product-list ul.results {
	margin: 0;
}
#product-list ul li {
	float:left;
	margin:0 0 24px 24px;
	}
		
a.product {
	display:block;
	width:150px;	
	height:250px;
}
a.productcat {
	height:200px;
}
a.product p {
	margin: 0;
	font-size: 11px;
	line-height: 14px;
}
	
a.product:hover img, a.gallery-image img:hover {
	opacity: .7;
	}
	
a.product img, .gallery-image img{
	width:149px;
	height:149px;
	border: 1px #999 solid;
	margin-bottom:3px;	
	}
		
a.product p {
	font-weight:bold;
	text-align:left;
	}
	
a.product p.price{
	font-size:18px;
	margin-top:8px;
	}	

.logo {
	height:150px !important;
	}

.logo img {
	border:none !important;
	}	
	
/* ========== PRODUCT DETAILS STYLES ========== */

#main-image {
	float:left;
	border:none;
	margin-bottom:10px;
	}

.finish-image {
	float:left;
	width:50px;
	height:50px;
	cursor:pointer;
	margin-right:10px;
	}
	
#product-images {
	float:left;
	margin-right:20px;
	width:350px;
	}
	
#product-details {
	float:left;	
	width:280px;
	padding-left:20px;
	border-left:1px solid #aaa;
	}
	
#product-details p {
	margin-bottom:1em;
	}	

#calc-btn {
	padding:4px;
	color:#fff;
	cursor:pointer;
	background:#1B3257;
	border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;
	-webkit-border-radius:5px;
	}
	
#add-btn {
	display:block;
	width:231px;
	height:55px;
	margin-top:24px;
	background: url(../images/add-btn.png) no-repeat;
	cursor:pointer;
	border:none;
	}
	
#add-btn:active {
	background: url(../images/add-btn-active.png);
	}	
				
/* ========== CART PAGE STYLES ========== */

#cart-table {
	width:95%;
	border:1px solid #999;
	margin:auto;
	}
	
#cart-table tr td {
	padding:6px;
	}
	
#cart-top td{
	padding:6px;
	background:#ccc;
	border-bottom:1px solid #999;
	}
	
#cart-top td {
	font-weight:bold;	
	}		

.cart-item td {
	height:50px;
	vertical-align:middle;
	vertical-align: top;
	border-bottom: 1px dotted #aaa;
	}
	
.last td{
	border-bottom:none;
	}	
	
.remove-btn {
	display:block;
	width:70px;
	height:24px;
	border:none;
	background:url(../images/remove-btn.png) no-repeat;
	}
	
.remove-btn:active {
	background-image:url(../images/remove-btn-active.png);
	}

#update-btn {
	width:90px;
	height:24px;
	cursor:pointer;
	border:none;
	background:url(../images/update-cart-btn.png) no-repeat;
	}	
	
#update-btn:active {
	background-image:url(../images/update-cart-btn-active.png);
	}	
	
#empty-btn {
	width:90px;
	height:24px;
	cursor:pointer;
	border:none;
	background:url(../images/empty-cart-btn.png) no-repeat;
	}	
	
#empty-btn:active {
	background-image:url(../images/empty-cart-btn-active.png);
	}		

.title-cell {
	text-align:right;
	}

.cart-total {
	font-size: 16px;
	font-weight:bold;
	margin-top: 12px;
	}		
	
#cart-bottom td{
	vertical-align:top;
	/*border-bottom:1px solid #999;*/
	}	
	
#checkout-box {
	margin-top:24px;
	margin-right:38px;
	text-align:right;
	float:right;
	}
	
#checkout-box p {
	text-align:right;
	width:200px;
	}	
		
#checkout, #confirm {
	width:150px;
	height:35px;
	margin-bottom:12px;
	cursor:pointer;
	border:none;
	background:url(../images/checkout-btn.png) no-repeat bottom right;
	}
		
#checkout:active {
	background-image:url(../images/checkout-btn-active.png);
	}	
	
#confirm{
	background-image:url(../images/confirm-btn.png);
	}	
		
#confirm:active {
	background-image:url(../images/confirm-btn-active.png);
	}		
	
#paragraph {
	margin-left:20px;
	}		
	
#back {
	margin-left:20px;
	font-weight:bold;
	}	
	
/* ========== LOGIN PAGE STYLES ========== */	

#reg-box {
	width:90%;
	float:left;	
	padding: 20px;
	}
	
#login-box {
	padding:20px;
	border-top: 1px solid #aaa;
	float:left;	
	}
	
#alert-bad {
	color:#f00;
	}
	
/* ========== MY ACCOUNT PAGE STYLES ========== */	

#alert-good {
	color:#0C0;
	}

#edit-btn {
	display:block;
	width:70px;
	height:24px;
	background: url(../images/edit-btn.png) no-repeat;
	}
	
#edit-btn:active {
	background: url(../images/edit-btn-active.png) no-repeat;
	}	
	
/* ========== RECOVER PAGE STYLES ========== */	

#not-found {
	color:#c1272d;
	margin-left:20px;
	}
	
/* ========== CONTACT PAGE STYLES ========== */	

#short-col {
	float:left;
	width:250px;
	padding:0 20px;
	border-right: 1px solid #aaa;
	}	
	
#left-col-stretch {
	float:left;
	}	

/* ========== GALLERY PAGE STYLES ========== */		

#gallery-wrapper {
	margin:auto;
	width:80%;
	}	
	
.fancybox img {
	margin:10px 10px;
	border: 1px #999 solid;
	}
	
/* ========== POLICY PAGE STYLES ========== */	

#privacy-italic {
	font-size: 20px;
	font-family:"Times New Roman", Times, serif;
	font-style:italic;
	}
		
ul#privacy-list li {
	list-style-type:disc !important;
	margin:8px 17px;
	}	
	
/* ========== VIDEO PAGE STYLES ========== */	
.media-page-link {
	display:block;
	margin-bottom:20px;
	}

.media-page-link p {
	display:inline;
	margin-left:10px;
	}
	
.media-page-link img{
	vertical-align:bottom;
	}
					
/* ========== FOOTER ========== */
/* ============================ */

footer {
	clear:both;
/*	background: url(../images/footer-bg.png) no-repeat;	*/
	background-color: #223F6D;
	background-image: -ms-linear-gradient(top, #2C508C 0%, #1B3358 100%);
	background-image: -moz-linear-gradient(top, #2C508C 0%, #1B3358 100%);
	background-image: -o-linear-gradient(top, #2C508C 0%, #1B3358 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2C508C), color-stop(1, #1B3358));
	background-image: -webkit-linear-gradient(top, #2C508C 0%, #1B3358 100%);
	background-image: linear-gradient(to bottom, #2C508C 0%, #1B3358 100%);
color: #fff;
	padding: 15px 10px;
	}

.footer-contact {
	display: none;
}
		
#footer-copy {
	line-height:20px;
	font-size:13px;
	}

#footer-copy a {
	font-size: 13px;
	}
.spacer {
	display: none;
}
.search .searchform {
	
}
@media screen and (min-width: 1000px){
	#banner-text {
		font-size: 13px;
		float:left;
		line-height: 14px;
		}
}

@media screen and (max-width: 1000px){
	
	.logobox {
		float: none;
		width: 430px;
		margin: 0 auto;
	}
	#top-logo {
		float: left;
		margin: 10px 0;
	}
	#top-logo img {
		height: 70px;
		margin-right: 20px;
	}
	#user-nav {
		margin-bottom: 8px;
		text-align: center;
	}
	#user-nav img {
		height: 20px;
	}
	.usermenu {
		float: none;
		width: 100%;
		text-align: center;
	}
	#user-nav {
		text-align: center;
	}
	.banner-contact {
		display: none;
	}
	.footer-contact {
		display: block;
		width: 100%;
		text-align: center;
		color: #fff;
		padding-bottom: 8px;
	}
	.footer-contact strong {
		color: #fff;
		font-weight: 900;
	}
	footer {
		text-align: center;
	}
	#supplier-banner {
		background:url(../images/sup-banner-bg.png) top left no-repeat;
	}
	#supplier-banner p {
		width: 350px;
		}
}
@media screen and (min-width: 500px) and (max-width: 1000px){ 
	#banner-text {
		font-size: 12px;
		float:left;
		line-height: 13px;
	}
	#banner-text span {
		padding-top: 7px;
		font-size: 12px;
		line-height: 13px;
	}
	.nivo-caption p {
		width: 400px;
	}
	.nivo-caption p strong {
		font-size: 20px;
		color:#fff;
		}
}
@media screen and  (max-width: 925px){ 
	#item-page {
		width: 90%;
	}
	#product-images {
		float: none;
		width: 90%;
		margin:0 auto;
		display: block;
		position: relative;
		text-align: center;
		}
		
	#product-details {
		float: none;
		margin: 0 auto;
		width: 90%;
		border: 0;
		display: block;
		position: relative;
		padding: 0;
		}
	.spacer {
		display: block;
		clear: both;
	}
}

@media screen and (max-width: 705px) { 
	#gallery-wrapper {
		margin:auto;
		width:90%;
		}
	.filter-tab {
		display: block;

		padding: 8px 16px 16px 16px;
		color: #fff;
		background: #223F6D;
		border-radius: 5px 5px 0 0;
		position: fixed;
		top: 275px;
		cursor: pointer;
		right: 0;
		margin-right: -38px;
		z-index: 9999999;
	 	-webkit-transform: rotate(270deg);
	    -moz-transform: rotate(270deg);
	    -o-transform: rotate(270deg);
	    writing-mode: lr-tb;

	}
	#product-filter {
		display: none;
	}
	#product-banner {
		/*white-space:nowrap;*/
	}
	#product-banner h1 {
		padding: 20px 0 0 10px;
		font-size: 22px;
		line-height: 24px;

	}
	#product-list {
		margin: 0;
	}	

	#right-col, #left-col, #home-left-col, #home-right-col, #home-bottom-col, #short-col, #left-col-stretch  {
		width:90%;
		padding: 0;
		margin: 0 auto;
		float: none;
		border: 0;
		}
		
}
@media screen and (max-width: 500px) { 
	
	#banner-text {
		display: none;
	}
	#top-logo {
		float: none;
		margin: 10px 0;
	}
	#top-logo img {
		margin: 0;
	}
	.logobox {
		width: 100%;
		text-align: center;
	}
	#testimonials, .test-text {
		display: none;
	}
	.nivo-caption p {
		width: 90%;
	}
	.nivo-caption p strong {
		font-size: 16px;
		color:#fff;
		}
	.field-box label {
		display:block;
		float:left;
		width:150px;
		text-align:left;
		margin-right:10px;	
		padding:3px;
		}
		#supplier-banner p {
			width: 225px;
			font-size: 16px;
			}
}
@media screen and (max-width: 680px) { 
	#gallery-wrapper, #product-list .results {
		margin:0 auto;
		width:525px;
		}

	.fancybox img {
		margin:10px 10px;
		border: 1px #999 solid;
		}
}
@media screen and (max-width: 515px) { 
	#gallery-wrapper, #product-list .results {
		margin:0 auto;
		width:350px;
		}	

	.fancybox img {
		margin:10px 10px;
		border: 1px #999 solid;
		}
		.cart-table {
			font-size: 12px !important;
		}
}
@media screen and (max-width: 340px) {  
	#gallery-wrapper, #product-list .results {
		margin:0 auto;
		width:175px;
		}	
	.fancybox img {
		margin:10px 10px;
		border: 1px #999 solid;
		}
}
@media (max-width: 700px) and (orientation: landscape) {
	.filter-tab {
		top: 155px;
	}
}

.lb-container {
	z-index: 999;
}

.uscustomers {
	margin-top: 6px !important;
}
.uscustomers a {
	font-size: 14px !important;
	line-height: 20px;
}