/* Styles for content pages */

/************************************************************
Home page */

/* Content sections */
#home #content section header h3 {
	color:#cbc9ca;
}
#home #content section header:first-child h3 {
	/*margin-top:1%;*/
	margin-top:-0.1em;
}

/*-----------------------------------------------------------
Layout changes */

#home {
	padding-top:2.5em;
}

/* Default */
#home.default #main-nav { 
	position:relative;
	top:auto;
	bottom:0;
}
#home.default #logo a {
	margin:1em 0 0;
	height:105px;
	width:120px;
}
#home.default #nav-jump,
#home.transition #nav-jump {
	color:#838383;
}
#home.default #nav-jump:after,
#home.transition #nav-jump:after {
	border-top-color:#838383;
	border-bottom-color:#838383;
}
#home.default #main-nav li nav,
#home.transition #main-nav li nav { /* Hide sub-navigation when the nav is floating somewhere */
	display:none;
}

/* Transitioning */
#home.transition #main-nav {
	position:static;
}
#home.transition #logo a {
	margin:0.6em 0 0;
/*
	height:60px;
	width:120px;
*/
}


/* Sticky nav bar */
#home.sticky {
	padding-top:9%;
}


/* Content header: Watermark */
#home #content>header {
	max-width:1060px;
	font-size:110%;
	padding:4% 40px;
	background:transparent url('../images/backgrounds/watermark-icons.png') no-repeat center center;
	background-size:cover;
}
#home #content>header p {
	font-size:140%;
}

/*-----------------------------------------------------------
Banners */

#banners {
	text-align:center;
	background:#e7e8e8 url('../images/backgrounds/desktop/banner-pillbox.jpg') no-repeat center center;
	background-size:cover;
}
#banners article {
	position:relative;
	max-width:1000px;
	margin:0 auto;
	padding:5% 0 1.5em;
}

/* Navigation circles */
#banners nav ol {
	list-style:none;
	margin:0 0 -2em;
	padding:0;
	position:absolute;
	z-index:7;
	width:100%;
	bottom:75px;
	left:0;
}
#banners nav li {
	display:inline;
	margin:0 1%;
}
#banners nav li a {
	display:inline-block;
	text-align:left;
	text-indent:-9999px;
	outline:none;
	width:0.7em;
	height:0.7em;
	background:#282828;
	border:2px solid #282828;
	border-radius:100%;
	
	-webkit-transition:all 0.3s linear 0s;
	transition:all 0.3s linear 0s;

}
#banners nav li a.active {
	background:transparent;
}
#banners ul li {
  margin: 0 0 0 5px;
  background-size: 90% !important
}

.scroll-button, #banners .scroll-button {
	position: relative;
	display: inline-block;
	height: 31px;
	width:63px;
	border:none !important;
	-o-transform:none !important;
	-ms-transform:none !important;
	-moz-transform:none !important;
	-webkit-transform:none !important;
	transform:none !important;
	background:url('../images/icons/down_arrow.png') no-repeat 0 0;
	transition:none;
}

.scroll-button:hover, .scroll-button:active, #banner .scroll-button:hover, #banner .scroll-button:active {
	background-position:0 -32px !important;
}

#banners nav .scroll-button {
	position: absolute;
	top:auto;
	bottom:5px;
	left:50%;
	margin-left: -32px;
	visibility: visible;
	opacity: 1;
}

/* Navigation arrows */
#banners nav>a {
	visibility:hidden;
	opacity:0;
	height:50px;
	width:50px;
}
#banners article:hover nav>a {
	visibility:visible;
	opacity:1;
}

/* Slider */
#banners ul li {
	background:transparent none no-repeat center top;
	background-size:contain;
	padding:30% 0 10%;
	min-height:10em;
}
#banners ul h2 {
	font-family:AlteDin,Arial,Helvetica,sans-serif;
	line-height:1;
	font-size:345%;
	padding-top: 40px;
}
#banners ul h2+p {
	font-size:220%;
	margin:5px auto 0;
	line-height:1.25;
}
#banners ul h2+p+p {
	margin-top:0.5em;
}
#banners ul .button {
	font-size:120%;
}

/* Images (desktop) */
#banners #banner-01 { background-image:url('../images/banners/desktop/home-01.png'); }
#banners #banner-02 { background-image:url('../images/banners/desktop/home-02.png'); }
#banners #banner-03 { background-image:url('../images/banners/desktop/home-03.png'); }
#banners #banner-04 { background-image:url('../images/banners/desktop/home-04.png'); }
#banners #banner-05 { background-image:url('../images/banners/desktop/home-05.png'); }


/*-----------------------------------------------------------
Callouts area */

#content .callouts {
	margin:4em 0 0;
	max-width:100%;
	text-align:center;
	background:#f2f2f2 url('../images/backgrounds/callout-mesh.gif') repeat center top;
	border-bottom:1px solid #e7e8e8;
	box-shadow:inset 0 0.4em 0.3em -0.3em rgba(0,0,0,0.08);
}
#home .callouts {
	margin:0;
}

.callouts > .wmark a {
	padding: .8em .5em;
}

.callouts aside {
	display:inline-block;
	vertical-align:top;
	width:31.5%;
	margin:0 0.5%;
	max-width:315px;
	min-height:181px;
}
.callouts aside.box h4 {
	font-size:135%;
	margin:0.2em 0;
}
.callouts>h3 {
	margin:1em 0 0;
}
.callouts h3:first-child {
	margin-top:0;
}
.callouts article >h4,
.callouts article >h5 {
	margin:0 0 0.5em;
}

/* variable columns */

.callouts .col {
	position: relative;
	box-sizing:border-box;
	padding:1%;
	text-align:center;
	
	font-size:12pt;
}

.callouts .col + .col:after {
	content:"";
	display: inline-block;
	height:140px;
	width:1px;
	background-color:#cbc9ca;
	
	position: absolute;
	top:50%;
	margin-top:-70px;
	right:100%;
	margin-right:5%;
	
}

/* 2-column callouts */

.callouts.two-col {
	font-size:0;
}

.callouts.two-col > .col {
	box-sizing: border-box;
	padding:1% 2%;
	
	max-width:500px;
	width:47.5%;
}

#content .callouts.two-col .col + .col {
	margin-left:5%;
}

/*-----------------------------------------------------------
News */

.news dl {
	margin:1.5em 0;
}
.news dt {
	display:inline-block;
	vertical-align:top;
	text-align:center;
	margin:0.1em -2.5em 0 0;
	padding:0 0.3em 0 0;
	width:2.1em;
	font-size:180%;
	line-height:1;
	color:#c2c3c1;
	border-right:1px solid #c2c3c1;
}
.news dt strong {
	display:block;
	font-size:120%;
	font-weight:normal;
}
.news dd {
	display:inline-block;
	vertical-align:top;
	width:32%;
	margin:0;
	padding:0 0 0 5.5em;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
	
	clear: both;
	
}
.news dd h4 {
	margin:0;
}

.news dd h4 img{
	max-width: 150px;
	max-height: 150px;

	float: left;
	padding-right: 15px;
}

.news dd h4 a{
	clear: right;
}

/* "Full" news list */
.news.full dt {
	position:absolute;
}
.news.full dd {
	margin:0 0 2em;
	min-height:6em;
	display:block;
	width:auto;
	clear: both;
}

/* View All */
.news .view-all {
	float: right;
	margin-top: -1em;
}

.news.full dl.colLeft {
	width:70%;
	display: inline-block;
}

.news.full dl.colLeft dd {
	display: inline-block;
}

.news.full dl.colRight {
    background-color: #F9F9F9;
    width:22%; 
    margin: 0px; 
    padding: 20px; 
    text-align: left; 
    float:right;
}

.news.full dl.colRight div {
	position: relative;
}

.news.full dl.colRight dt {
	position: absolute;
	left: 0px;
	top:0px;
	width: 30%;
	border: none;
}

.news.full dl.colRight dd {
	clear: both;
    display: block;
    margin: 0 0 15px;
    min-height: 6em;
    width: auto;
    border-bottom: 1px solid #c2c3c1;
}

.news.full dl.colRight div dt {
	padding-left:5px; 
}

.news.full dl.colRight h6:after {
	content: " ";
	position: relative;
	display: block;
	width: 100%;
	border-top: 1px solid #c2c3c1;
	margin: 10px 0px 0px 0px;
} 

.news.full dl.colRight h6 {
	margin: 0px;
	padding: 0px;
}

.news.full dl.colRight div:hover {
    cursor: pointer;
}

/* Details */
#content .news-post .news-photo {
	margin: .5em 0;
	max-width: none;
	width: auto;
}

#content .news-post img {
/* 	border: 3px solid #babcba; */
}

/*-----------------------------------------------------------
FAQs */

.faqs {
	margin:0 0 2em;
}
.faqs dt,
.faqs dd {
	position:relative;
}

/* Question */
.faqs dt {
	padding:0.5em 0 0 30px;
	border-bottom:1px solid #ededed;
	font:150%/1.5 AlteDin,Arial,Helvetica,sans-serif;
	color:#48aa48;
}

/* Answer */
.faqs dd {
	margin:0.5em 0 0;
	padding:0 0 0 30px;

	-webkit-transition:all 0.7s ease-in-out 0s;
	transition:all 0.7s ease-in-out 0s;
}
.faqs p {
	margin:0;
	padding:0.5em 0;
}


/* Q/A Letters */
.faqs dt:before,
.faqs dd:before {
	position:absolute;
	font:150%/1.5 GillSans,Arial,Helvetica,sans-serif;
	left:0;
}
.faqs dt:before {
	content:'Q:';
	font-size:100%;
}
.faqs dd:before {
	content:'A:';
}


/* Open / close */
.faqs dd.close {
	visibility:hidden;
	max-height:0;
	opacity:0;

	-webkit-transition-duration:0.3s;
	transition-duration:0.3s;
}
.faqs dd.open {
	visibility:visible;
	max-height:500px;
	opacity:1;
}


/*-----------------------------------------------------------
Downloads */

.downloads {
	margin:0 0 2em;
}
.downloads dt,
.downloads dd {
	position:relative;
}

/* Question */
.downloads dt {
	padding:0.5em 0 0 30px;
	border-bottom:1px solid #ededed;
	font:150%/1.5 AlteDin,Arial,Helvetica,sans-serif;
	color:#48aa48;
}

/* Answer */
.downloads dd {
	margin:0.5em 0 0;
	padding:0 0 0 30px;

	-webkit-transition:all 0.7s ease-in-out 0s;
	transition:all 0.7s ease-in-out 0s;
}
.downloads p {
	margin:0;
	padding:0.5em 0;
}


/* Q/A Letters */
.downloads dt:before,
.downloads dd:before {
	position:absolute;
	font:150%/1.5 GillSans,Arial,Helvetica,sans-serif;
	left:0;
}
.downloads dt:before {
	font-size:100%;
}
.downloads dd:before {
}


/* Open / close */
.downloads dd.close {
	visibility:hidden;
	max-height:0;
	opacity:0;

	-webkit-transition-duration:0.3s;
	transition-duration:0.3s;
}
.downloads dd.open {
	visibility:visible;
	opacity:1;
}



/*-----------------------------------------------------------
Logo slider */

.slider.logo {
	padding:0 3em;
}
#content .slider.logo.client {
	padding:1em 3em;
	margin-bottom: 22px;
}

/* Header lines */
.slider.logo header {
	border-top:1px solid #c2c3c1;
	text-align:center;
	margin-bottom:-1.2em;
}
.slider.logo header h3 {
	display:inline-block;
	background:#fff;
	padding:0 0.5em;
	position:relative;
	top:-1em;
}

.bx-viewport {
  height: auto !important;
}

.bx-wrapper .bx-viewport {
  box-shadow: none !important;
}

/* Tiles layout */
.slider.logo article {

}
.slider.logo>article>ul {
	display:inline-block;
	vertical-align:middle;
	list-style:none;
	width: 100%;
	padding: 0px;
	margin: 0px;
	
	text-align: center;

	/*
	-webkit-transition:all 0.8s ease 0s;
	transition:all 0.8s ease 0s;
	*/
}
.slider.logo>article>ul>li {
	display:inline-block;
	vertical-align:middle;
	width: 16%;
}


.slider.logo.client li > a {
  display: block;
}

.slider.logo.client li > a img {
  max-width: 100%;
  display: block;
  margin: 0 auto;
}

.no-link {
  cursor: default;
}

/* Client logo images and hover effect 
.slider.logo.client li a,
.slider.logo.client li a:after {
	position:relative;
	text-indent:-9999px;
	outline:none;
	background:transparent url('../images/logos/client-slider.png') no-repeat center center;
	height:105px;
}
.slider.logo.client li a:after {
	content:' ';
	position:absolute;
	height:100%;
	width:100%;
	left:0;
	top:0;
	visibility:hidden;
	opacity:0;

	-webkit-transition:all 0.4s ease 0s;
	transition:all 0.4s ease 0s;
}
.slider.logo.client li a:hover:after {
	visibility:visible;
	opacity:1;
}

/* Grayscale
.slider.logo.client li.sony a { width:175px; background-position:1px 0; }
.slider.logo.client li.apple a { width:100px; background-position:-210px 0; }
.slider.logo.client li.cisco a { width:165px; background-position:-347px 0; }
.slider.logo.client li.tpt a { width:105px; background-position:-544px 0; }
.slider.logo.client li.argonne a { width:200px; background-position:-696px 0; }

/* Color
.slider.logo.client li.sony a:after { background-position:1px -105px; }
.slider.logo.client li.apple a:after { background-position:-210px -105px; }
.slider.logo.client li.cisco a:after { background-position:-347px -105px; }
.slider.logo.client li.tpt a:after { background-position:-544px -105px; }
.slider.logo.client li.argonne a:after { background-position:-696px -105px; }
*/


/************************************************************
Slider shared styles */

/* (Tab) Slider */
.slider {
	position:relative;
}
.slider.tab ul {
	position:relative;
	overflow:hidden;
	list-style:none;
	margin:0;
	padding:0;
}
#banners ul {
  height: 550px;
}
#banner-tiles {
  overflow: visible;
}
.slider.tab ul li {
	/*visibility:hidden;
	position:absolute;
	opacity:0; */
	
	width:90%;
	margin:0 5%;
	padding:1px 0;
	
	/*left:110%;*/
	
	top:0;
/*
	-webkit-transition:opacity 0.8s ease 0s;
	transition:opacity 0.8s ease 0s;

	-webkit-transition-property:opacity, visibility;
	transition-property:opacity, visibility;
*/
}

#banners .bx-wrapper .bx-viewport {
  background: none !important;
  border: none;
}

/* Navigation arrows */

.logo.slider .bx-wrapper .bx-controls-direction a {
	position:absolute;
	z-index:7 !important;
	top:45%;
	font:0pt/0 Arial,Helvetica,sans-serif;
	color:#f2f2f2;
	text-indent:-9999px;
	outline:none;
	border:3px solid #d3d4d4;
	height:30px;
	width:30px;

	-webkit-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	transform:rotate(45deg);

	-webkit-transition:all 0.6s ease 0s;
	transition:all 0.6s ease 0s;
}
.logo.slider .bx-wrapper .bx-controls-direction a:after { /* Increase hit area of arrows */
	content:' ';
	position:absolute;
	width:160%;
	height:160%;
	left:-30%;
	top:-30%;
}
.logo.slider .bx-wrapper .bx-controls-direction a.bx-prev {
	left:-45px;
	border-right:none;
	border-top:none;
}
.logo.slider .bx-wrapper .bx-controls-direction a.bx-next {
	right:-45px;
	border-left:none;
	border-bottom:none;
}
.logo.slider .bx-wrapper .bx-controls-direction a:hover {
	border-color:#48aa48;
}

/* Navigation arrows */
.slider nav > a,
#banners nav > div > a {
	position:absolute;
	z-index:7;
	top:45%;
	font:0pt/0 Arial,Helvetica,sans-serif;
	color:#f2f2f2;
	text-indent:-9999px;
	outline:none;
	border:3px solid #d3d4d4;
	height:30px;
	width:30px;

	-webkit-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	transform:rotate(45deg);

	-webkit-transition:all 0.6s ease 0s;
	transition:all 0.6s ease 0s;
}
#banners nav > div {
  position:absolute;
	z-index:7;
	top:45%;
	width:100%;
	height:100%;
	max-height: 80px;
	max-width: 80px;
	
	opacity: 0;
	visibility: hidden;
	
	-webkit-transition:all 0.6s ease 0s;
	transition:all 0.6s ease 0s;
}

#banners:hover nav > div {
  opacity: 1;
	visibility: visible;
}

#banners nav > div > a {
  height: 100%;
  width: 100%;
}
#banners nav > a {
  position:relative;
  top:0px;
  left: 0px;
}
.slider nav>a:after,
#banners nav > div > a:after { /* Increase hit area of arrows */
	content:' ';
	position:absolute;
	width:160%;
	height:160%;
	left:-30%;
	top:-30%;
}
.slider nav>a.prev,
#banners nav > div.prev,
#banners nav > div.prev > a {
	left:-10px;
	border-right:none;
	border-top:none;
}
.slider nav>a.next,
#banners nav > div.next,
#banners nav > div.next > a {
	right:-10px;
	border-left:none;
	border-bottom:none;
}
.slider nav>a:hover,
.slider nav > div > a:hover {
	border-color:#48aa48;
}


/* Animations */
.slider ul li.in.next {
	-webkit-animation:in-next 0.8s 0s ease 1;
	animation:in-next 0.8s 0s ease 1;
}
.slider ul li.out.next {
	-webkit-animation:out-next 0.8s 0s ease 1;
	animation:out-next 0.8s 0s ease 1;
}
.slider ul li.in.prev {
	-webkit-animation:in-prev 0.8s 0s ease 1;
	animation:in-prev 0.8s 0s ease 1;
}
.slider ul li.out.prev {
	-webkit-animation:out-prev 0.8s 0s ease 1;
	animation:out-prev 0.8s 0s ease 1;
}

@-webkit-keyframes in-next { from { left:100%; } to { left:0; } }
@-webkit-keyframes out-next { from { left:0; } to { left:-100%; } }
@-webkit-keyframes in-prev { from { left:-100%; } to { left:0; } }
@-webkit-keyframes out-prev { from { left:0; } to { left:100%; } }

@keyframes in-next { from { left:100%; } to { left:0; } }
@keyframes out-next { from { left:0; } to { left:-100%; } }
@keyframes in-prev { from { left:-100%; } to { left:0; } }
@keyframes out-prev { from { left:0; } to { left:100%; } }

.client.slider nav > a {
  top:50%;
}

/*-----------------------------------------------------------
Knowledge Base */

/* Category List */
.kb-category-list {
	font-size: 120%;
}

.kb-category-list > ul > li {
	display: inline-block;
	vertical-align: top;
	margin-right: 3%;
	margin-bottom: 1em;
}

.kb-category-list > ul > li > a {
	font-size: 130%;
	color:#000;
}

.kb-category-list li li {
	margin-top: .4em;
}

/* Article List */
.kb-article-list {
	list-style: none;
	margin: 0 0 1em 0;
	padding: 0;
}

.kb-article-list li {
	margin: 1.5em 0 0;
	border-top: 1px solid #ededed;
}

.kb-article-list li:first-child {
	margin-top: 0;
	border-top: none;
}

.kb-article-list a {
	font-size: 120%;
}

.kb-article-list p {
	margin: 0;
	font-style: italic;
}

/************************************************************
Static pages */

/*-----------------------------------------------------------
Sections */

#content>article:nth-of-type(even),
#content>article.alt-bg {
	background:#f2f2f2 url('../images/backgrounds/callout-mesh.gif') repeat center top;
}
#content>article {
	text-align:center;
	max-width:none;
	padding:2em;
}

#content>article > h3 {
	margin-top: 0;
}

/* Columns */
#content>article>section {
	text-align:left;
	max-width:440px;
	display:inline-block;
	vertical-align:middle;
	margin:0 2%;
	width:45%;
}
#content>article>figure {
	max-width:440px;
	display:inline-block;
	vertical-align:middle;
	margin:0 2%;
	width:45%;
}
#content>article>figure figcaption {
	text-transform:uppercase;
	text-align:center;
	font-size:160%;
	margin:0.3em 12%;
	color:#838383;
}

/* Main / side columns */
#content .col.main {
	max-width:582px;
	width:60%;
	margin:0;
}
#content .col.side {
	max-width:320px;
	width:35%;
	margin:0;
}
#content .col+.col {
	margin-left:4%;
}

#. col.side h3 {text-align: left;}


/* Top-aligned */
#content>article>figure.top {
	vertical-align:top;
	margin-top:-2em;
}

/* No columns */
#content>article.full {
	max-width:970px;
	margin:0 auto;
	padding:2em !important;
	text-align:left;
}
#content>article.full~article {
	padding-top:2em !important;
}
/*#content>article>p {
	max-width:970px;
	margin:1.2em auto;
	text-align:left;
}*/




/*-----------------------------------------------------------
Workflow solutions */


/*
#solutions #content>article:nth-child(even)>section {
	float:right;
}
#solutions #content>article:nth-child(even)>figure {
	float:left;
}
*/

/*-----------------------------------------------------------
Partner Page */

#partner-listing > a[data-section] {
	position: relative;
	font-size: 150%;
	color: #282828;
	line-height: 1;
	padding-left: .8em;
}

#partner-listing > a[data-section]:before {
	position: absolute;
	content: ' ';
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	border-right: none;
	border-left: 8px solid #282828;
	font-size: 0;
	vertical-align: middle;
	left: 0;
}


#partner-listing > a[data-section].open:before {
	border-top: 8px solid #282828;
	border-bottom: none;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	top: 8px;
	left: -4px;
}

#partner-listing > section.partner-section {
	margin: 0 0 1em 0;
	width: 100%;
	max-height: 10000px;
	max-width: none;
	overflow: hidden;

	-webkit-transition:all .5s ease-in-out 0s;
	transition:all .5s ease-in-out 0s;
}

#partner-listing > section.partner-section.closed {
	opacity: 0;
	max-height: 0px;
}

/************************************************************
Product (static) pages */

#prod-details {
	display: block;
	
	font-size:0;
}

#left,
#right {
	display: inline-block;
	width:50%;
	vertical-align: top;
	font-size:12pt;
	
	box-sizing:border-box;
}

#left {
	padding-right: 20px;
}

#right {
	padding-left: 20px;
}

#prod-image {
	margin: 0;
}

#prod-details > section#left > footer {
	text-align: center;
	margin-top: 35px;
}

#prod-details > #left footer .button {
	min-width:180px;
}

#prod-details > #left footer .button ~ a {
	padding-left:12px;
}

#prod-image,
#prod-image > img,
/* #prod-image > a > img, */
.lightbox > li > figure,
.lightbox > li > figure > a > img {
	max-width: 465px;
	text-align: center;
	margin:0 auto;
}

.lightbox > li > figure > a > img {
	max-width:100%;
}

.lightbox {
	margin: 0;
	padding: 0;
}

.lightbox > li {
	list-style: none;
}

section.product-page {

}

.prodCatProduct, .minorProduct {

	position: relative;
	display:inline-block;
	vertical-align: top;
	width:47.5%;
	max-width:465px;
	margin:0;
	background-color:#EAEAEB;
	
	box-sizing:border-box;
	padding:10px;
	
}

.prodCatProduct:nth-child(2n),
.minorProduct:nth-child(2n) {
	margin-left:3%;
}
.prodCatProduct:nth-child(n+3),
.minorProduct:nth-child(n+3) {
	margin-top:2.5%;
}

.prodCatProduct > div,
.prodCatProduct > figure {
	position: relative;
	display: inline-block;
	vertical-align:middle;
	width:48%;
	max-width:225px;
}

.prodCatProduct > figure + div {
	margin-left:2.5%;
}

/* image 'column' */
.prodCatProduct > figure {
	margin:0 !important;
}

.prodCatProduct > figure > a {
	display: inline-block;
	max-width:100%;
	max-height:100%;
}

.prodCatProduct > div > h5 {
	font-size:24px;
	margin-top:10px;
}

.prodCatProduct > div > h5 a { 
	display: block;
}

.prodCatProduct > div > ul {
	padding: 0;
	margin-left:15px;
}
.prodCatProduct > div > ul li + li {
	margin-top:8px;
}

.prodCatProduct > div > a > img {
	width:100%;
	max-width:100%;
	max-height:100%;
	padding:0;
	vertical-align: middle;
}

.minorProduct {
	display: inline-block;
}

.minorProduct .prodCatProduct {
	width:100%;
}

/*
.minProRight {
	margin-left: 10px;
}

.minProLeft {
	margin-right: 10px;
}
*/

.threePics {
	width: 320px;
	display: inline-block;
	vertical-align: middle;
}

#primaryProducts {
	text-align: center;
}

#primaryProducts > a {
	display: inline-block;
}

.widePhoto {
	display: inline-block;
}

.banner.product-page {
	position: relative;
	height: 270px;
	border-bottom:5px solid transparent #48AA48;
	/* border-image: url("/images/backgrounds/callout-mesh.gif") 30 30 repeat; */
	background-size: cover !important;
	border-bottom:5px solid #48aa48;
}
.banner.product-page img {
	max-height: 100%;
}
.banner-text {
	position: relative;
	max-width:1045px;
	margin:0 auto;
	text-align: right;
}

/* banner content container */
.banner-text article {
	position: relative;
	display: inline-block;
	min-width:550px;
	margin-top:75px;
	text-align: center;
}

.banner-text div {
	text-align: center;
	display: inline-block;
	color:#FFF;
	text-transform: uppercase;
	font-size:34px;
	font-family:AlteDin,Arial,Helvetica,sans-serif;
}

.product-page .banner-text div {
	color:#48aa48;
	font-size:42px;
}

.dark-bg {
	background-color:rgba(0,0,0,0.75);
	box-sizing:border-box;
	padding:10px 15px;
}

/*-----------------------------------------------------------
Banner area */

#content .pg-banner {
	margin:0;
	text-align:center;
	max-width:none;
	background:#eaeaea url('../images/backgrounds/texture-grain.gif') repeat center top;
	min-height: 240px;
}

#content .pg-banner.main-cat-info {
	min-height: 0;
}

#content .pg-banner.main-cat-info > article {
	max-width: 480px;
}

#content .pg-banner.main-cat-info > figure {
	max-width: 370px;
	margin: 0 3.3%;
}

/* Columns */
#content .pg-banner>article {
	text-align:left;
	max-width:440px;
	display:inline-block;
	vertical-align:middle;
	margin:0 2%;
	width:45%;
}
#content .pg-banner>figure {
	max-width:440px;
	display:inline-block;
	vertical-align:middle;
	margin:0 2%;
	width:45%;
}

/* Content */
#content .pg-banner>header {
	max-width:970px;
	margin:0 auto 1em;
	padding:0 8%;
}
#content .pg-banner article header {
	padding:0;
}
#content .pg-banner h1 {
	text-align:left;
	font-size: 350%;
}
#content .pg-banner p {
	font-size:110%;
}

/* Category Header */
#content header.header-cat h1{
	text-transform: none;
}

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

Tab navigation */

#content #tab-nav {
	margin:0;
	padding:0;
	max-width:none;
	background:#181b14;
	text-align:center;
}
#content #tab-nav:target:before {
	display: block;
	content: '';
	height: 150px;
	margin-top: -150px;
	/* background-color: #FFF; */
	background:#f2f2f2 url('../images/backgrounds/callout-mesh.gif') repeat center top;
}
#content #tab-nav>ul {
	display:inline-block;
	vertical-align:middle;
	text-align:left;
	max-width:970px;
	padding:0 8em 0 0; /* Leave room for the "shop now" button */
	width:100%;
	margin:0;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
#content #tab-nav li {
	display:inline-block;
	vertical-align:middle;
}
#content #tab-nav li>a {
	display:block;
	padding:1em 1.2em;
	font-size:115%;
	text-transform:uppercase;
	color:#fff;
	position:relative;

	-webkit-transition:all 0.5s ease 0s;
	transition:all 0.5s ease 0s;
}
#content #tab-nav li.sel>a {
	background:#48aa48 !important;
}

#content #tab-nav li.sel>a:after {
	content:' ';
	position:absolute;
	border-top:0.6em solid #48aa48;
	border-left:0.9em solid transparent;
	border-right:0.9em solid transparent;
	margin:0 0 0 -0.9em;
	width:1px;
	left:50%;
	top:100%;
	
	-moz-transform:scale(.9999);
	transform:scale(.9999);
}

#content #tab-nav li>a:hover {
	background-color:#464843;
}

/* Put "Shop Now" in with the tab nav */
#content #tab-nav>ul+a.button {
	margin-left:-8em;
}



/*-----------------------------------------------------------
Big link area at bottom */

#content .big-link {
	text-align:center;
	padding:5% 16%;
}
#content .big-link h3 {
	line-height:1.5;
	margin:0;
}
#content .big-link p {
	margin:0 0 0.5em;
	font-size:130%;
}
#content .big-link .button {
	margin-top:1em;
}


/************************************************************
Product (e-commerce) pages */

/*-----------------------------------------------------------
Product list */

/* Tiles */

#content .prod {
	max-width: none;
	width: auto;
	margin: 0;
}

#content .prod>article>ul {
	list-style: none;
	vertical-align:top;
	padding-top:0.2em; /* Keeps the shadow on the <li> from getting cut off by overflow:hidden */
	margin: 0;
	padding-left: 0;
}
#content .prod>article>ul>li {
	display: inline-block;
	position:relative;
	vertical-align:top;
	white-space:normal;
	max-width:290px;
	background:#fff;
	margin:0 0.2em 1.5em;
	padding:0 0.5em 0.5em;
	border-right: 1px solid #EEE;

	-webkit-transition:all 0.5s ease 0s;
	transition:all 0.1s ease 0s;
}

#content .prod > article > ul > li:nth-child(3n),
#content .prod > article > ul > li:last-child {
    border-right: none;
}


#content .prod>article>ul>li:hover {
	/*box-shadow:inset 0 0 2em rgba(0,0,0,0.1), 0 0 0.3em rgba(0,0,0,0.25);*/
}


/* Info + image */
#content .prod figure {
	text-align:center;
	margin:0.5em 0.8em;
}

#content .prod figure a {
	color: inherit;
	font-size: inherit;
}

#content .prod figure a.button {
	font-size: 90%;
}

/* Additional details */
#content .prod h5 {
	padding-bottom: 15px;
}

#content .prod figcaption {
	border:0px solid #e5e5e5;
	text-align:left;
	overflow:hidden;
	max-height:0;

	-webkit-transition:all 0.7s ease 0s;
	transition:all 0.7s ease 0s;
}
#content .prod figure ul {
	text-align: left;
	margin-left: 0;
	padding-left: .5em;
	list-style: disc;
}
#content .prod figcaption ul {
	list-style:disc;
	margin:0;
	padding:1em 0 1em 1.5em;
}

/* Show/hide */
#content .prod>article>ul>li:after {
	content:'';
	text-transform:uppercase;
	text-align:center;
	position:absolute;
	width:100%;
	opacity:1;
	bottom:0.2em;
	left:0;

	-webkit-transition:all 0.5s ease 0s;
	transition:all 0.5s ease 0s;
}


/* Prod Slider */
#content .slider.prod {
	max-width:970px;
	display:block;
	margin:0 auto;
	width:auto;
}

#content>article>section.slider {
	margin: 0 2%;
	width: 45%;
	max-width: 400px;
}

#content .slider.prod>article>ul>li {
	margin-bottom: 0;
}

/*-----------------------------------------------------------
Product detail */

/* Image */
#prod-image {
	position:relative;
}
#prod-image .plus {
	position:absolute;
	display:inline-block;
	padding:0.3em 0 0.3em 3.5em;
	text-transform:none;
	color:inherit;
	bottom:-2em;
	left:0;
}
#prod-image .plus:after {
	position:absolute;
	left:0;
	top:0;
}


/* Details / form */
#content #prod-form p {
	font-size:100%;
}
#prod-form strong {
	color:#48aa48;
}
#prod-form h3 strong {
	color:inherit;
}

#prod-form h3 del {
	font-size: 80%;
}

/*#prod-form h3 small:before {
	content:'  \2013  ';
}*/
#prod-form h4 {
	border-top:1px solid #d2d2d2;
	padding-top:0.3em;
}
#prod-form form {
	background:#fff;
	margin:0.5em 0;
	padding:1em;
	box-shadow:inset 0 0 2em rgba(0,0,0,0.1), 0 0 0.3em rgba(0,0,0,0.25);
}
#prod-form form h5 {
	margin:0;
}
#prod-form form p {
	margin:0.4em 0 1em;
}
#prod-form .error {
	background-color:#fcc;
	cursor:help;
}


/* Form buttons area */
#prod-form form footer {
	margin: 0;
	display:table;
	width:95%;
}

#prod-form form p+footer {
	margin-top: 2em;
}

#prod-form footer a {
	display:table-cell;
	vertical-align:baseline;
	text-align:center;
	color: #282828;
}

#prod-form footer a > img {
	vertical-align: bottom;
}

.pricing {
	display: block;
	font-size:135%;
	margin:10px auto;
}


/************************************************************
Search page */

/*--------------------------------------------------
Filter form */

#search-filter {
	max-width:440px;
	margin:0 auto;
	padding:1em 0 0;
}
#search-filter p {
	margin:0;
}
#search-filter label {
	font-weight:bold;
	margin-right:0.4em;
}
#search-filter input {
	display:inline-block;
	vertical-align:middle;
	font:bold 100%/1.3 GillSans,Arial,Helvetica,sans-serif;
	height:2em;
}
#search-filter input[type="search"] {
	background:#fff;
	color:#2e3133;
	padding:0 0.5em;
	border:1px solid #cfcfcf;
	border-radius:0.2em 0 0 0.2em;
	box-shadow:inset 0.2em 0.2em 0.2em rgba(0,0,0,0.2);
	opacity:0.8;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
#search-filter .button {
	padding:0.2em 0.5em;
	border-radius:0 0.2em 0.2em 0;
}


/*--------------------------------------------------
Search results */

#search-results {
	list-style:none;
	margin:1em 0;
	padding:0;
}
#search-results li {
	margin:1.5em 0 0;
	border-top:1px solid #ededed;
}
#search-results a small {
	font-size:80%;
	text-transform:none;
}
#search-results a small:before {
	content:'(';
}
#search-results a small:after {
	content:')';
}

#search-results a:hover span:after {
	content: '\00bb';
	padding-left: .5em;
}

/* Pagination */
.pagination ul {
	list-style:none;
	margin:1em 0;
	padding:0;
	text-align:center;
}
.pagination li {
	display:inline;
	margin:0 0.2em;
	font-size: 110%;
}
.pagination li+li:before {
	content:'|  ';
	color:#e5e5e5;
}

.pagination li strong, .pagination li a {
	font-size: 120%;
}

/*--------------------------------------------------
Knowledge Base form */
#search-kb .button {
	padding:0.2em 0.5em;
	border-radius:0 0.2em 0.2em 0;
}
#search-kb input {
	display:inline-block;
	vertical-align:middle;
	font:bold 100%/1.3 GillSans,Arial,Helvetica,sans-serif;
	height:2em;
}
#search-kb input[type="search"] {
	background:#fff;
	color:#2e3133;
	padding:0 0.5em;
	border:1px solid #cfcfcf;
	border-radius:0.2em 0 0 0.2em;
	box-shadow:inset 0.2em 0.2em 0.2em rgba(0,0,0,0.2);
	opacity:0.8;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
#content header form#search-kb  p{
	font-size: 100%;
}

/************************************************************
Breadcrumb navigation */

/*-----------------------------------------------------------
Breadcrumb links */

#breadcrumb {
	position:relative;
}
#breadcrumb>ol {
	list-style:none;
	margin:0;
	padding:0;
}
#breadcrumb>ol li {
	display:inline;
}
#breadcrumb>ol li+li:before {
	content:'  \2022  ';
	padding:0 0.25em;
	color:#838383;
	vertical-align:middle;
	font:100%/1 AlteDin,Arial,Helvetica,sans-serif;
}
#breadcrumb>ol a {
	color:inherit;
}

/*-----------------------------------------------------------
Category slider */

/* Arrows */
.slider.cat nav>a.prev {
	left:6px;
}
.slider.cat nav>a.next {
	right:6px;
}


/* Tiles */
.slider.cat ul li {
	text-align:center;
	vertical-align:bottom;
	margin:0 0.6em;
	max-width:170px;
}
.slider.cat li img {
	display:block;
}
.slider.cat li a {
	color:#282828;
	font-size:115%;
}

/*-----------------------------------------------------------
Shadow */

.slider.cat {
	margin:2em 0 0;
	box-shadow:0 0.7em 0.2em -0.7em rgba(0,0,0,0.15);
}
.slider.cat:after {
	content:' ';
	position:absolute;
	width:100%;
	height:0.35em;
	top:100%;
	left:0;

	background:-webkit-radial-gradient(center top, ellipse farthest-side, rgba(0,0,0,0.15), rgba(0,0,0,0));
	background:radial-gradient(ellipse farthest-side at center top, rgba(0,0,0,0.15), rgba(0,0,0,0));
}

.cat.logo.slider li {
	margin:0;
}

.cat.logo.slider li a {
	display: inline-block;
	max-width:100%;
}

/*-----------------------------------------------------------
Flyout (show/hide) */

#cat-flyout {
	position:relative;
}
#cat-flyout a.plus {
	position:absolute;
	margin:0 0 -0.5em;
	bottom:100%;
	left:45%;
	z-index:2;
}

/* Show/hide */
#cat-flyout .slider.cat {
	overflow:hidden;
	max-height:0;
	margin-top:0;

	-webkit-transition:all 0.7s ease 0s;
	transition:all 0.7s ease 0s;
}
/*#cat-flyout:hover .slider.cat,*/
#cat-flyout.open .slider.cat,
#breadcrumb:target #cat-flyout .slider.cat {
	max-height:300px;
}

#cat-flyout .slider.cat article {
	padding-top: 1.5em;
}

#cat-flyout.open > a.plus:after {
	content: '-';
	padding: 0 .67em 0.3em .6em;
}

/*-----------------------------------------------------------
Back / cart links */

#breadcrumb .back {
	position:absolute;
	top:0.8em;
	left:45%;
}
#breadcrumb .cart {
	position:absolute;
	top:0.8em;
	right:0.5em;
}



/************************************************************
Social icons */

.social {
	list-style:none;
	margin:0;
	padding:0;
}
.social li {
	display:inline;
	margin:0 0.5%;
}
.social a {
	display:inline-block;
	text-indent:-9999px;
	outline:none;
	width:43px;
	height:43px;
	background:transparent url('../images/icons/icons.png') no-repeat center center;
}
.social .fb a { background-position:0 0; }
.social .tw a { background-position:-49px 0; }
.social .yt a { background-position:-99px 0; }
.social .li a { background-position:-148px 0; }

/* Hover */

/* black */

.social.dark .fb a:hover { background-position:0 -99px; }
.social.dark .tw a:hover { background-position:-49px -99px; }
.social.dark .yt a:hover { background-position:-99px -99px; }
.social.dark .li a:hover { background-position:-148px -99px; }


/* green */
.social .fb a:hover { background-position:0 -50px; }
.social .tw a:hover { background-position:-49px -50px; }
.social .yt a:hover { background-position:-99px -50px; }
.social .li a:hover { background-position:-148px -50px; }

/************************************************************
Callouts */

/* Shared */
aside>a {
	display:block;
	padding:0.5em;
}


/* Video callout */
.video {
	margin:0 0 1em;
	position:relative;
}
.video>a {
	padding:0;
}
.video img {
	display:block;
	height: 183px;
}

.video>a:before {
	content:' ';
	position:absolute;
	left:50%;
	top:70%;
	width:5.4em;
	height:5.4em;
	margin:-2.9em 0 0 -3em;
	background:rgba(231,232,232,0.5);
	border-radius:100%;
	z-index:3;
}
.video>a:after {
	content:' ';
	position:absolute;
	left:50%;
	top:70%;
	height:0.1em;
	margin:-2em 0 0 -0.9em;
	border-left:1.8em solid #f3f3f3;
	border-top:1.8em solid transparent;
	border-bottom:1.8em solid transparent;
	border-radius:0.3em;
	z-index:4;
}

.video h4 {
	position:absolute;
	z-index:10;
	width:95%;
	top: -7%;
	left:0;
	color:#fff;
	text-align:center;
	text-shadow:1px 1px 1px #000;
}


/* Green watermark callout */
.wmark {
	margin:0 0 1em;
	text-align:center;
	background:#48aa48 url('../images/backgrounds/watermark-tree.png') no-repeat -10% 20%;
	background-size:150%;
}
.wmark>a {
	color:#fff;
	padding:0.8em;
}
.wmark h4 {
	text-transform:uppercase;
	margin:4% 0;
}
.wmark p {
	margin:0.3em 0;
	font-size:120%;
}
.wmark .button {
	font-size:100%;
	margin-bottom:-0.2em;
}


/* Generic box callout */
.box {
	margin:0 0 1em;
	background:#fff;
}
.box>a {
	color:inherit;
}




/************************************************************
Odds and Ends */

/* Bubble image */
img.bubble {
	border-radius:100%;
	border:3px solid #babcba;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.green {
	color: #48aa48;
}

/*-----------------------------------------------------------
Support Table */

table.sub {
	color:#000;
	border:none;
	border-collapse:collapse;
	width:100%;
	margin-bottom: 1em;
}
table.sub.fixed {
	table-layout:fixed;
}
table.sub caption {
	font:270%/1.2 GillSans,Arial,Helvetica,sans-serif;
	text-align:center;
	margin:0 0 0.2em;
}
table.sub th,
table.sub td {
	padding:0.2em 0.4em;
}

table.sub thead {
	background:#48aa48;
	color:#fff;
}
table.sub thead th {
	text-align:left;
	font-weight:normal;
}

table.sub tbody th {
	text-align:left;
}

table.sub tbody tr:nth-child(even) {
	background-color: #f2f2f2;
}


/*-----------------------------------------------------------
Files list */

ul.files {
	list-style:none;
	margin:0.5em 0 1em;
	padding:0;
}
ul.files li {
	
}
ul.files li a {
	display:inline-block;
	padding:0.3em 0;
	font-size:115%;
	color:inherit;
}
ul.files li a:before {
	content:url('../images/icons/pdf.png');
	vertical-align:middle;
	padding:0 0.4em 0 0;
}


/*-----------------------------------------------------------
Lightbox photos */

#content figure.lightbox {
	float:right;
	line-height:0;
	margin:0 0 1em 1em;
	max-width:200px;
	width:40%;
}
#content figure.lightbox a {
	display:inline-block;
	margin:0 1% 0.5em;
	width:30%;
}
#content figure.lightbox img {
	display:block;
	border:2px solid #babcba;
	border-radius:1em;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

#content figure.lightbox a:first-child {
	display:block;
	width:100%;
}
#content figure.lightbox a:first-child img {
	border-width:3px;
}


/*-----------------------------------------------------------
Fancy list */

.list {
	list-style:none;
	margin:1em 0;
	padding:0 0 0 1.5em;
}
.list>li:before {
	content:'\2022';
	color:#48aa48;
	float:left;
	margin-left:-0.7em;
	font-size:150%;
	line-height:0.9;
}


/*-----------------------------------------------------------
Revised Products Page */

.callout1 {
	margin-bottom:-20px !important;
}

.shift {
	background-color:#EAEAEA !important;
}

.shift section {
	max-width:420px !important;
	width:42% !important;
}

.shift figure {
	max-width:550px !important;
	width:50% !important;
}

#content > article > figure.top {
	margin-top:0;
}

/****************************
  Miscellaneous Style
****************************/
.slidehover {
  opacity: 0.5;
  display: inline-block;
  
  -ms-transition:all 0.5s ease 0s !important;
  -webkit-transition:all 0.5s ease 0s !important;
  transition:all 0.5s ease 0s !important;
}

.slidehover:hover {
  opacity: 1 !important; 
}

/************************************************************
/************************************************************
RESPONSIVE */

/* Funkier stuff for the home page banner */
@media screen and (max-height:760px) and (min-width:660px) {

	#banners article {

	}
	#banners ul li {
		
	}

}
@media screen and (max-height:850px) and (min-width:860px) {

	#banners article {
		
	}

}
@media screen and (max-height:700px) and (min-width:860px) {

	#banners article {
		
	}
	#banners ul li {
		
	}
	

}
@media screen and (min-height:615px) and (max-width:659px) {

	#banners article {
		
	}

}
@media screen and (min-height:715px) and (max-width:449px) {

	#banners article {
		
	}

}




/* Scaling up */
@media screen and (min-width:1360px) {

	/* Navigation links (fixed padding) */
	#main-nav>ul>li {
		padding-right:1.4em;
		padding-left:1.4em;
	}

}

/* Scaling down */
@media screen and (max-width:1120px) {

	/* Slider arrows */
	#banners nav>a {
		height:40px;
		width:40px;
	}
	.slider nav>a.next {
		right:15px;
	}
	.slider nav>a.prev {
		left:15px;
	}
	.slider nav>a:after { /* Hit area is causing the horizontal scroll to appear */
		width:140%;
	}


	/* Home page video callout - reposition the image for scaling purposes */
	.callouts aside.video {
		overflow:hidden;
		min-height:181px;
	}
	.callouts aside.video img {
		position:absolute;
		margin:0 0 0 -157px;
		max-width:none;
		height:100%;
		width:315px;
		left:50%;
		top:0;
	}

}
@media screen and (max-width:860px) {

	/* Heading sizes */
	h1, h2 {
		font-size:320%;
	}
	h3 {
		font-size:170%;
	}
	h4 {
		font-size:140%;
	}
	h5 {
		font-size:120%;
	}

	/* Banner text size */
	#banners ul h2+p {
		font-size:180%;
	}

	/* Shrink the nav somewhat */
	body {
		padding-top:7.5em;
	}
	#main-nav>ul {
		padding-top:1.3em;
		padding-bottom:1.3em;
	}
	#main-nav>ul>li {
		padding:0 1.2%;
	}
	#main-nav>ul>li>a {
		font-size:110%;
		padding:0.6em 0.2em;
	}
	#main-nav li>nav {
		margin-top:0;
	}
	#main-nav li:hover>nav {
		padding-top:1.3em;
	}
	#main-nav li:hover>nav>ul:before {
		border-bottom-width:1em;
	}

	/* And the logo along with  it */
	#home.default #logo a {
		margin:0.6em 0 0;
		height:60px; /* 105 */
	}
	#logo a {
		margin:4px 0 0;
		height:64px;
	}

	/* As well as the menu link */
	#nav-jump {
		font-size:115%;
		padding:1.7em 0;
	}

	/* Content header */
	#home #content>header p {
		font-size:120%;
	}


	/* Home page: Show only two news items at this point */
	#home .news dl>*:nth-child(4)~* { /* Any element after the 4th child (2nd <dd>) should be hidden */
		display:none;
	}
	.news dt {
		margin-right:-2.5em;
		font-size:220%;
	}
	.news dd {
		margin-right:1%;
		width:48%;
	}

	/* Logo slider */
	.slider.logo>article>ul>li {
		margin:0 0.8em;
		padding:0;
	}


	/* Home page callouts */
	.callouts aside,
	.callouts aside.video {
		min-height:200px;
	}


	/* Tab navigation */
	#tab-nav {
		font-size:90%;
	}
	#content #tab-nav li>a {
		padding-right:0.8em;
		padding-left:0.8em;
	}
	
	#primaryProducts > a {
		float:left;
		margin-left:0;
	}

}
@media screen and (max-width:770px) {

	/* More navigation adjustments (including logo) */
	body {
		padding-top:9.5em;
	}
	#logo a {
		margin:8px 0 0;
		height:80px;
	}
	#main-nav>ul {
		padding:1em 7.5em;
	}
	#main-nav>ul>li {
		padding:0 3%;
	}
	#main-nav>ul>li>a {
		padding:0.5em 0.2em;
	}
	#main-nav li:hover>nav {
		padding-top:0.8em;
	}

	/* Menu link */
	#nav-jump {
		padding:2.5em 0;
	}
	
	/* Resize home page banner images */
	#banners #banner-01 { background-size:100% auto; }
	#banners #banner-03 { background-size:100% auto; }

	/* Footer area */
	#foot-nav>ol {
		width:54%;
	}
	#foot-nav ol>li {
		width:auto !important;
		padding-right:4%;
	}
	#foot-nav>aside {
		max-width:300px;
		margin-left:0;
		width:44%;
	}
	#foot-nav>ol h5 { /* Force-wrap that one lengthy heading */
		max-width:90px;
	}

    .news.full dl.colLeft {
	    display: block;
	    width: 100%;
    }
    
    .news.full dl.colRight {
	    box-sizing: border-box;
	    display: block;
	    width: 100%;
	    float: none;
    }
    
    .news.full dl.colRight dt {
	    width: 2.1em;
    }
    
	/* search bar */
	#search {
		width:100%;
		max-width:100%;
	}
	
	#banners .prev,
	#banners .next {
  	display: none;
	}
	
	#banners ul {
    height: 520px;
  }
}

@media screen and (max-width:700px) {

	.prodCatProduct > div,
	.prodCatProduct > figure {
		width:100%;
		max-width:none;
		text-align: center;
	}
	
	#left, #right {
		float:none;
		display: block;
		width:100%;
		padding-left:2%;
		padding-right:2%;
	}
	
	.prodCatProduct > figure + div,
	.minorProduct > figure + div {
		margin-left:0;
		margin-right:10px;
	}
	
	#product-features table {
		width:100%;
	}

}


/* Tablet */
@media screen and (max-width:660px) {

	/* Font sizing */
	body {
		font-size:10pt;
	}
	h1, h2 {
		font-size:280%;
	}
	h3 {
		font-size:150%;
	}
	h4 {
		font-size:130%;
	}
	h5 {
		font-size:115%;
	}


	/* Footer area */
	#foot-nav>ol,
	#foot-nav>aside {
		float:none;
		width:100%;
		max-width:none;
	}
	#foot-nav>ol>li {
		width:19.2% !important;
		padding:0;
	}
	#foot-nav ul {
		margin-top:0.15em;
	}
	#foot-nav>aside section {
		float:left;
		width:40%;
		margin:0 0 1em;
	}
	#foot-nav>aside section+section {
		float:right;
		width:53%;
	}
	#foot-nav .social {
		margin-bottom:0;
	}

	/* Home page callouts */
	.callouts aside {
		display:block;
		margin:0.2em auto;
		min-height:1px;
		width:auto;
	}
	.callouts aside.video {
		min-height:181px;
	}
	.callouts aside+aside {
		margin-top:1.2em;
	}
	
	/* 2 column callouts -- make single column */
	
	.callouts.two-col > .col {
		display: block;
		max-width:none;
		width:100%;
		
		margin:0 auto;
		padding:1% 2%;
	}
	
	#content .callouts.two-col > .col + .col {
		margin:10px auto 0;
	}

	/* News items */
	.news dt {
		/* float:left; */
		position: absolute;
		font-size:180%;
		margin:0.15em 0;
	}
	.news dd {
		display:block;
		width:auto;
		min-height:5em;
		padding:0 0 0 5em;
		margin:0 0 1.5em;
	}
	.news dd p {
		margin-top:0.4em;
	}

	/* We can show all news items on the home page now, too */
	#home #content .news dl>* {
		display:block;
	}


	/* Logo slider */
	.slider.logo>article>ul>li {
		margin:0 -0.4em;
	}
	.slider.logo ul>li>a {
		transform:scale(0.8);
	}


	/* Banner images */
	#banners { background-image:url('../images/backgrounds/tablet/banner-pillbox.jpg'); }
	#banners #banner-01 { background-image:url('../images/banners/tablet/home-01.png'); }
	#banners #banner-02 { background-image:url('../images/banners/tablet/home-02.png'); }
	#banners #banner-03 { background-image:url('../images/banners/tablet/home-03.png'); }
	#banners #banner-04 { background-image:url('../images/banners/tablet/home-04.png'); }
	#banners #banner-05 { background-image:url('../images/banners/tablet/home-05.png'); }


	/* Tab navigation */
	#tab-nav {
		font-size:80%;
	}
	#content #tab-nav li>a {
		padding-right:0.5em;
		padding-left:0.5em;
	}

	/* Breadcrumb icon links */
	#cat-flyout a.plus {
		left:auto;
		right:0;
	}
	#breadcrumb .back {
		left:auto;
		right:0.5em;
	}
	#breadcrumb #cat-flyout+.cart,
	#breadcrumb .back+.cart { /* This one will overflow */
		margin:0.5em 0 0;
		top:100%;
	}


	/* Product slider */
	#content .slider.prod>article>ul>li {
		max-width:260px;
	}

	#menu .dropdown {
		height: 20px;
		
	}
	

	
	.product-page .banner-text article {
		min-width:0;
		margin-top:12%;
	}
	
	.product-page .banner-text div {
		font-size:32px;
	}
	
	.slider.logo>article>ul>li {
		width:32%;
	}

}

@media screen and (max-width:600px) { /* mobile-ish sizes */
  
	#banners ul {
		height: 420px;
	}
	
	.cat.logo.slider {
		text-align: center;
	}
  
  	.cat.logo.slider li {
		width:32%;
	}
}

@media screen and (max-width:540px) { /* mobile-ish sizes */

	/* Navigation (including logo) */
	#logo a {
		height:72px;
	}
	#main-nav>ul>li>a {
		font-size:105%;
	}

	/* Top navigation */
	#top-nav>p,
	#top-nav>ul {
		font-size:90%;
		line-height:2;
	}
	#top-nav>ul>li>a>span { /* Shorten up links that can be */
		display:none;
	}

	/* Content header */
	#home #content>header {
		padding:4% 1.5em;
	}
	#content header h3 {
		margin-left:0;
		margin-right:0;
	}


	/* Footer area */
	#foot-nav>ol {
		text-align:center;
		display:block;
		width:auto;
		padding:0 1em;
	}
	#foot-nav>ol>li {
		text-align:left;
		width:auto !important;
		padding:0 1.5em;
	}

	#foot-nav>aside {
		width:auto;
	}
	#foot-nav>aside section {
		float:none !important;
		width:auto !important;
		text-align:center;
		margin:2em 0;
	}
	
	/* We're going to hide all footer sub-navigation lists, and put the top level nav links in a single column */
	
	#foot-nav li ul {
		display: none;
	}
	
	#foot-nav > ol > li {
		display: block;
		width:100% !important;
		box-sizing:border-box;
		text-align: center;
	}
	#foot-nav > ol > li + li {
		margin-top:8px;
	}
	
	#foot-nav > ol h5 {
		display: inline-block;
		font-size:135%;
	}

	/* Page banner */
	#content .pg-banner>article,
	#content .pg-banner>figure {
		display:block;
		width:auto;
	}
	#content .pg-banner>figure {
		max-width:250px;
		margin:0 auto;
	}

	/* Content sections */
	#content>article {
		position:relative;
		padding:50% 8% 1em;
	}
	#content>article h2 {
		text-align:center;
	}
	#content>article>section {
		display:block;
		margin:0 auto;
		width:auto;
	}
	#content>article>figure {
		position:absolute;
		left:27.5%;
		width:45%;
		top:4%;
	}
	#content>article>figure figcaption {
		font-size:110%;
		margin:-0.5em -0.5em 0;
	}
	#content>article>figure.top {
		margin-top:0;
	}

	/* Workflow Solutions */
	#solutions #content>article>section p:last-child {
		text-align:center;
	}

	/* Tab navigation */
	#content #tab-nav {
		padding:0 7%;
	}
	#content #tab-nav>ul {
		display:inline;
		padding-right:0;
	}
	#content #tab-nav li>a {
		padding-right:1em;
		padding-left:1em;
	}
	#content #tab-nav ul+a.button {
		margin-left:0;
	}

	/* Modal videos */
	#modal iframe {
		height:300px;
	}

}


/* Mobile */
@media screen and (max-width:485px) {

	/* Body text */
	body {
		font-size:9.5pt;
	}

	/* Navigation / logo / menu links */
	#logo a {
		height:56px;
		margin-top:5px;
		
		left:50%;
		margin-left:-45px;
	}
	/* keep main-nav from sticking on home page */
	#home.sticky #main-nav > ul {
		display: none;
	}
	#home.default #logo a, #home.transition #logo a {
		left:3%;
		margin-left:0;
	}
	#home.sticky #logo a {
		width:62px;
		margin-left:-31px;
	}
	
	/* hide superfluous navigation, center logo */
	#main-nav {
		height:98px;
	}
	#main-nav>ul {
		padding-right:6.5em;
		
		display: none;
	}
	#home #main-nav> ul {
		display: block;
	}
	#main-nav>ul>li>a {
		font-size:100%;
	}
	#nav-jump {
		font-size:100%;
		padding:1.5em 0;
		top:4.5em;
	}
	#nav-jump:after {
		width:1.5em;
	}

	/* Breadcrumb icon links */
	#cat-flyout {
		margin-top:1.5em;
	}
	#cat-flyout a.plus {
		/*margin-left:-5em;
		left:50%;*/
		position:relative;
		top:0.4em;
		left:0;
	}

	#breadcrumb {
		overflow:hidden;
	}
	#breadcrumb ol {
		float:left;
	}
	#breadcrumb .back {
		position:static;
		float:left;
		clear:left;
		margin:0.7em 0 -0.3em;
	}
	#breadcrumb .cart {
		margin:0 0.5em 0 0;
		position:static;
		float:right;
	}
	#breadcrumb #cat-flyout+.cart,
	#breadcrumb .back+.cart {
		position:absolute;
		top:2.2em;
	}

	/* Product list */
	#content .slider.prod {
		margin:0 -2em;
	}
	#content .slider.prod>article>ul>li {
		max-width:210px;
	}
	#content .slider.prod>article>ul>li .button {
		font-size:80%;
	}
	
	/* search popout */
	
	#search {
		height:60px;
		width:100%;
		z-index: 200;
	}
	
	#search nav a {
		left:0;
	}
	
	#search nav a:after {
		position:relative;
		margin-left:0.5em;
		z-index:100;
		float:left;
	}
	
	#search p {
		background-color:#11140F;
		text-align: left;
	}
	
	#search input[type="search"] {
		display: block;
		width:90%;
		border-radius:0.2em;
		border-right:1px solid #FFF;
	}
	
	#search input[type="submit"] {
		margin-top:3px;
		border-radius:0.2em;
	}
	
	.prodCatProduct, .minorProduct,
	.prodCatProduct:nth-child(n+3),
	.minorProduct:nth-child(n+3),
	.prodCatProduct:nth-child(2n),
	.minorProduct:nth-child(2n) {
		width:100%;
		margin:0 auto;
	}
	
	.prodCatProduct + .prodCatProduct,
	.minorProduct + .minorProduct {
		margin-top:20px !important;
	}

}
@media screen and (max-width:450px) {
  #banners article {
    padding-top: 15%;
  }

	/* Top area */
	#top-nav {
		height:3em;
	}
	#top-nav>p,
	#top-nav>ul {
		float:none;
		margin:0.3em 0;
		max-width:260px;
		line-height:1.3;
	}

	/* Login form */
	#top-login {
		width:100%;
		right:auto;
		left:0;
	}


	/* Navigation / logo / menu link */
	body {
		padding-top:10.5em;
	}
	#nav-jump {
		padding:1.3em 0;
		/* top:0; */
	}
	#home.default #nav-jump,
	#home.transition #nav-jump {
		color:#fff;
	}
	#home.default #nav-jump:after,
	#home.transition #nav-jump:after {
		border-top-color:#fff;
		border-bottom-color:#fff;
	}
	#home.default #nav-jump, #home.transition #nav-jump {
		top:0;
	}
	#nav-jump {
			top:5em;
	}
	#main-nav {
		top:4em;
		height:78px;
	}
	#main-nav>ul {
		padding:1em 1.5em 1em 7.5em;
	}
	#home.default #main-nav>ul,
	#home.transition #main-nav>ul {
		padding:1em 8%;
	}

	/* Footer area */
	#foot-nav>ol {
		padding:0;
	}
	#foot-nav>ol>li {
		padding:0 1em;
	}


	/* Banner images */
	#banners { background-image:url('../images/backgrounds/mobile/banner-pillbox.jpg'); }
	#banners #banner-01 { background-image:url('../images/banners/mobile/home-01.png'); }
	#banners #banner-02 { background-image:url('../images/banners/mobile/home-02.png'); }
	#banners #banner-03 { background-image:url('../images/banners/mobile/home-03.png'); }
	#banners #banner-04 { background-image:url('../images/banners/mobile/home-04.png'); }
	#banners #banner-05 { background-image:url('../images/banners/mobile/home-05.png'); }
	
	#banners ul li {
		padding-bottom:12.5%;
	}

	/* Modal videos */
	#modal iframe {
		height:250px;
	}

}

@media screen and (max-width:360px) {

  #banners ul {
    height: 395px;
  }
  
  #banners ul li {
    background-position: center 25px;
  }

}
@media screen and (max-width:375px) and (min-width:351px) {

	/* One last navigation tweak */
	body {
		padding-top:13em;
	}
	#main-nav>ul {
		padding:1em 2.5em 1em 8.5em;
	}

}
@media screen and (max-width:350px) {
	body {
		padding-top:13em;
	}
	
	#banners ul li {
		padding-bottom:14.5%;
	}

	/* Footer area */

/*
	#foot-nav>ol>li {
		width:40% !important;
	}
*/
}

/********* Special CSS for Alert Popup **********/

.alert-contain {
  position: fixed;
  height: 100%;
  width: 100% !important;
  background: url(/images/site/bg-alert.png) repeat scroll top left transparent;
  top: 0px;
  width: 0px;
  z-index: 9999;
  box-sizing: border-box;
}
.alert-outer {
  border: 4px solid #40A045;
  max-width: 670px;
  width: 100%;
  height: 380px;
  position: absolute;
  top:0px;
  bottom:0px;
  left: 0px;
  right: 0px;
  margin: auto;
  background: url(/images/site/logo.gif) no-repeat scroll 99% 98% #ffffff;
  background-size: 87px 76px;
  box-sizing: border-box; 
}
/* happy holidays modal */
.alert-outer {
	text-align: center;
	height:260px;
}

.alert-display {
  padding: 32px 38px 20px;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.close-btn {
  background: transparent url("/images/site/close.png") no-repeat scroll right top;
  cursor: pointer;
  height: 30px;
  position: absolute;
  right: -10px;
  top: -10px;
  width: 30px;
  z-index: 15;
  box-sizing: border-box;
}
.close-btn a {
  display: block;
  width: 100%;
  height: 100%;
}
.alert-display p.top {
  color: red;
  font-size: 20px;
  line-height: 20px;
  text-transform: uppercase;
  text-align: center;
  padding: 0px;
  margin: 0px;
}
.alert-display h2 {
  font-size: 40px;
  text-align: center;
  margin: 0px;
  padding: 0px 0px 10px 0px;
  position: relative;
}
.alert-display h2:after {
  content: "";
  background-color: #282828;
  height: 2px;
  width: 40%;
  display: block;
  margin: 15px auto 0px;
}

@media screen and (max-width:668px) {
  .alert-contain {
    padding: 15px;
  }
  .alert-outer {
    position: relative;
    height: 100%;
    width: 100%;
  }
}

@media screen and (max-width:430px) {

  .alert-display h2 {
     font-size: 32px;
  }
}

@media screen and (max-width:360px) {
  .alert-display {
    padding: 15px 22px !important;
  }
  
  .alert-outer {
    background-size: auto 14%;
    background-position:97% 98%
  }
  
  .alert-display p {
    font-size: 14px;
  }
  
}

@media screen and (max-width:320px) {
  .alert-display h2 {
     font-size: 28px;
  }
}