html {min-width: 360px;}

body {font-family: 'Roboto', sans-serif; font-size: 15px;}

h1, h2, h3, h4, h5, h6, .tabs a, .item-box dt {font-family: 'Roboto Condensed', sans-serif;}

.wrapper {width: 100%; max-width: 1376px; padding: 0 48px;}
.layout-2-1 main .wrapper, .layout-1-2 main .wrapper {display: flex; flex-wrap: wrap;}

/* :: Header 
===================================================================================================== :: */

#header .wrapper {display: flex;}
	
	.site-logo {
		position: absolute; top: 3.5rem; z-index: 10; width: 210px; height: 70px; margin: 0; padding: 0;
		background: url(logo.png) no-repeat 50% 0;
	}
	[lang="en"] .site-logo {background-image: url(logo-en.png);}
		.site-logo a {display: block; height: 70px;}		
		
		#site .nav-wrapper .nav-x {margin: 0;}
			.nav-wrapper .nav-x > li {margin: 0 .1em 0 0;}

#header a {text-decoration: none;}
.nav-collapse {display: none;}

/* :: Top Section :: */

.top-section .wrapper {font-size: .9em;}
	.top-section .phone {margin: 1em 0 1em .3em;}
	.top-section .nav-x {flex: 1; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; text-align: center;}
		.top-section .nav-x li {margin: .5em;}
		.top-section .nav-x li:not(:first-child) {
			padding-left: 1em; border-left: 1px solid;
		}
			.top-section .nav-x a {padding: .1em;}
			.top-section .nav-x .current a {font-weight: bold;}
		
.lang {width: 62px; border-style: solid; border-width: 0 1px;}
	.lang a {display: block; padding: .9em 1.2em 1em;}

/* :: Index hero section :: */

.index .hero-section .wrapper {display: flex; margin-top: 2em;}
	.index .hero-section .col-1 {padding-right: 10px;}
	.index .hero-section .col-2 {padding-left: 10px;}
		.index .hero-section .img {margin-bottom: 20px;}
			.index .hero-section .img a {display: block; overflow: hidden;}
				.index .hero-section .img img {transform: scale(1);}
				.index .hero-section .img a:hover img {transform: scale(1.02);}

#header .level-2 .inner {width: 100%; display: flex; padding-left: 220px;}

/* :: Search :: */

.search-bar {position: relative; flex: 1; padding: 0 1em;}
	.search-bar .search-wrapper {display: flex; max-width: 600px; margin: 1.5em auto; border: 2px solid; border-radius: 2em;}
	.search-bar .search-wrapper:focus-within {border-radius: 0;}
		
			.search-bar .form-group {margin: 0; width: auto;}
				.search-bar .txt {height: 44px; background-color: transparent; border-width: 0;}
				.search-bar .txt:first-child {flex: 1; padding-left: 1.2em; border-radius: 0;}
				.search-bar select.txt {padding: .3em .7em; border-width: 0 1px; border-radius: 0;}
			
				.search-bar .dropdown-content.hide {display: block !important; transform: scale(0); transform-origin: top center; opacity: 0;}
				.search-bar .dropdown-content {
					left: 0; right: 0; width: auto; padding: 1em; border-width: 0; opacity: 1; transform: scale(1); transform-origin: top center;
				}
					.search-bar .select-menu > a {height: 2.6em; padding: .4em 30px .2em .4em; text-transform: none; border: 2px solid white;}
			
				.search-bar .btn[type="image"] {
					margin: 0; padding: 0 1em;  background-color: transparent; border: none;
				}
				
				#header .dropdown-content a {float: left; display: block; width: 100%; padding: .2em;}
				.dropdown-content .img {width: 55px; margin: 0 10px 0 0;}
						  .dropdown-content img {max-width: 55px; max-height: 55px;}


/* :: Login :: */

#cat-b-3165 .content, #cat-b-3166 .content {max-width: 820px; margin: 0 auto; padding-right: 0;}
#cat-b-3165 .side-bar, #cat-b-3166 .side-bar {display: none;}

.login, .shopping-cart a {display: flex; min-width: 14rem;}

.login {
	flex-direction: column; justify-content: center; padding-left: 4em; 
	background: url(icon-user.svg) no-repeat 1.3em 50%; border-style: solid; border-width: 0 1px;
}
	.login .user-nav {order: 2;}
		.login li:not(:last-child) {margin-right: 1.2em;}
		.login a {display: inline-block; padding: .2em 0;}
			.login a span {
				display: inline; padding-bottom: .3em;
				background-position: 0 1.2rem; background-size: 1px 2px;
				background-image: linear-gradient(to right, #b6dcf1 0%, #b6dcf1 100%);
				background-repeat: repeat-x;
			}
			.login a:hover span {background-image: linear-gradient(to right, #0085cf 0%, #0085cf 100%);}
		
		.login > small {display: inline-block; max-width: 12em; margin-bottom: -.2em; 
			white-space: nowrap; text-overflow: ellipsis; overflow: hidden;
		}

/* :: Cart :: */

.shopping-cart a {
	align-items: center; height: 100%; padding: .8em; padding-left: 4em;
	background: url(icon-cart.svg) no-repeat 1.3em 50%;
}
.shopping-cart a:hover {opacity: .9; background-position: 1.5em 50%;}

#cat-b-3167 .content, #cat-b-3687 .content {max-width: 820px; margin: 0 auto; padding-right: 0;}
#cat-b-3167 .side-bar, #cat-b-3687 .side-bar {display: none;}

.cart-del {
	width: 2.6em; height: 2.6em; text-indent: 200%; font-size: 0;
	background: url(icon-del.svg) no-repeat 50% 50%; background-size: 20px; border-width: 0; border-radius: 50%;
}

.cart-row {display: flex; flex-wrap: wrap; align-items: center; margin: 2em 0;}
	.cart-row .col-1 {flex: 1;}
.cart-total {
	clear: both; padding-top: 1.3em; text-align: right;
	border-style: solid; border-width: 1px 0;
}

.btn-warning {border-width: 0;}

/* :: Navigations 
===================================================================================================== :: */

#site .nav-collapse {display: none;}

/* :: Main Navigation :: */

.site-nav {display: flex; width: 100%;}
	.main-nav {position: relative; flex: 1; display: flex;}
				
		.main-nav a {text-decoration: none; word-wrap: break-word;}
		.main-nav .nav > li > a {padding: .75rem 1rem .55rem; text-transform: uppercase; letter-spacing: .02em;}
		
			.main-nav .nav > li > a span {
				position: relative; display: block; padding: .15rem 0; border-bottom: 2px solid transparent;
			}
			.main-nav .nav > li:hover > a span {top: -2px;}
			
			.main-nav .sub-menu .sub-menu-wrapper { 
				display: flex; flex-wrap: wrap; width: 35rem; padding: 1.5em; border-width: 0; transition-delay: .2s;
			}
				.main-nav .sub-menu .sub-menu-wrapper > li {width: 50%;}
					.main-nav .sub-menu .sub-menu-wrapper > li a {height: 100%; padding: 1em; border: none;}
					.main-nav .sub-menu .sub-menu-wrapper a span {
						display: inline; padding: 1em 0; font-size: 1.1em;
						background-position: 0 2.4em; background-size: 2px 2px;
						background-image: linear-gradient(to right, rgba(0,0,0,.3) 0%, rgba(0,0,0,.3) 100%);
						background-repeat: repeat-x;
					}
					.site-nav .sub-menu .sub-menu-wrapper a:hover span {background-position: 0 2.2em;}
						.main-nav .sub-menu .sub-menu ul {display: none;}


.breadcrumb a {opacity: .6; text-decoration: none; border-bottom: 1px solid transparent;}
.breadcrumb a:hover {opacity: 1;}
.breadcrumb .separator-xxs {
	display: inline-block; vertical-align: middle; width: 1.2%; min-width: .7em; margin: 0 .1em; text-indent: 100%; white-space: nowrap; overflow: hidden;
}
.breadcrumb .separator-xxs:before, .breadcrumb .separator-xxs:after {
	content: ""; position: absolute;
	display: block; border-style: solid;
}
.breadcrumb .separator-xxs:before {top: 10px; left: 0; right: 0; border-width: 1px 0 0;}
.breadcrumb .separator-xxs:after {top: 8px; right: 1px; width: 5px; height: 5px; border-width: 1px 1px 0 0; transform: rotate(45deg);}
	
/* :: Main and Content 
===================================================================================================== :: */

main {padding-bottom: 2em;}

.breadcrumb + main {padding-top: 1%;}

	.content {flex: 1;}
	.layout-2-1 .content {padding-right: 2em;}
	.layout-1-2 .side-bar {order: 1;}
	.layout-1-2 .content {order: 2; padding-left: calc(1.5em + 2%);}
	.layout-1-2 .delivery-wrapper {order: 3;}
		
	main h1 {font-size: calc(1.7em + 2vw); font-weight: 300;}
	main h1 {margin: calc(1em + 1%) 0; text-align: center;}
	#site main h1 + .nav-sep {margin-top: -2em;}
	.inside .content > h1:first-child {margin-top: 0;}
	main h2 {margin: 2rem 0; font-weight: 300;}
	main h2.lead {font-size: 1.8em;}
	main h3 {position: relative; margin: 1em 0; padding-bottom: .5em; line-height: 1.5;}
	main h3:before {
		content: ""; position: absolute; bottom: 0; left: 0; display: block; width: 5em; height: .1em;
	}
	main h5 {font-weight: normal; margin: 1em 0;}
				
		.content .nav-x.nav-sep a, .content .nav-x.nav-sep .current a:hover {position: relative; text-decoration: none;}
		
		.content .nav-x.nav-sep .current a {font-weight: bold;}
		/*.content .nav-x > li > a:before {
			content: ""; position: absolute; bottom: -.5em; left: 50%; 
			display: block; width: 0; 
			border-bottom: 1px solid;
		}
		/*.content .nav-x.nav-sep > li:hover > a:before, .content .nav-x.nav-sep .current a:before {width: 40%; margin-left: -20%;}*/
			
	p.img-left {float: left; margin: .5em 2em 1.5em 0;}
	p.img-right {float: right; margin: .5em 0 1.5em 2em;}
	
	.content .list-styled {list-style: none;}
		.content .list-styled li {position: relative;}
		.content .list-styled li:before {
			content: ""; position: absolute; top: .6em; left: -1em;
			display: block; width: 4px; height: 4px;
		}
		
		.content .inner-section {padding: 0 12%; font-size: 1.1em;}
		
		.content-img-section {display: flex; flex-wrap: wrap; margin: 5% 0;}
			.content-img-section > div {width: 50%;}
			.content-img-section .info {position: relative; margin: 5% 0; margin-left: -5%; padding: 5%;}
				.content-img-section h2 {text-align: center;}
			
			.content-img-section.img-right .img {order: 2;}
			.content-img-section.img-right .info {order: 1; margin-left: 0; margin-right: -5%;}
			
		.content .styled-underline {
			display: inline; padding-bottom: .4em; text-decoration: none;
			background-position: 0 1.2em; background-size: 1px 2px;
			background-image: linear-gradient(to right, rgba(219,46,32,.5) 0%, rgba(219,46,32,.5) 100%);
			background-repeat: repeat-x;
		}
		.content .styled-underline:hover {
			background-position: 0 1.2em; background-size: 1px 2px;
			background-image: linear-gradient(to right, rgba(219,46,32,1) 0%, rgba(219,46,32,1) 100%);
		}

/* :: Delivery :: */

.delivery-wrapper {width: 100%; clear: both; padding: calc(1em + 2%) 0 calc(1em + 2.5%);}
	.delivery-wrapper p {margin-bottom: 0;}			
		.delivery-wrapper span {position: relative; display: inline-block; padding: 1em 250px 1.2em 29%; font-size: 1.1em;}
		.delivery-wrapper span:before {
			content: ""; display: block; width: 230px; height: 115px;
			position: absolute; top: -.5rem; right: 0;
			background: url(delivery-small-van.png) no-repeat 0 0;
		}
			.delivery-wrapper strong {font-weight: normal; margin-right: 1em;}
			.delivery-wrapper .btn {margin: .5em 0;}			
	
	.form-elements .fieldset {margin-bottom: 2.5em; padding: 5% 15%; border-width: 0;}
		.form-elements legend {
			position: relative; margin: 0; padding: .7em 1em; font-weight: bold;
		}
		.form-elements legend:before {
			content: ""; position: absolute; top: 100%; left: 1em;
			width: 0; height: 0; 
			border-style: solid; border-width: 8px 8px 0 8px; border-color: #0085cf transparent transparent transparent; 
		}		
	
	button.del-item {display: inline-block; width: 32px; height: 32px; padding: 3px;}
		button.del-item svg {fill: white;}

/* :: Tabs :: */

#site .tabs {display: flex; margin: 0; padding: 0; list-style: none;}

	#site .tabs li {position: relative; top: 1px; margin: 0 2px 0 0;}
	
		.tabs a {
			display: block; padding: .5em .8em .6em; white-space: nowrap; 
			font-size: 1.3em; text-decoration: none; border-top: 2px solid transparent;
		}
		.tabs li.current a {font-weight: bold;}

/* :: Printer Type :: */

.content .printer-type {display: flex;}
	.printer-type .col-1 {flex: 1; margin-right: 1.2em;}
	.printer-type .col-2, .printer-type .col-3 {
		width: 28%; margin-left: 1.2em; padding-left: 3.2em; padding-bottom: 1em; border-style: dotted; border-width: 0 0 0 1px;
	}
		.printer-type .tab-content a {display: inline-block; margin-bottom: .25em; padding: 1em .5em; text-align: center; border: 1px solid;}

.side-bar .printer-type {clear: both; padding: 1em; padding-right: 0;}
	.side-bar .printer-type .tab-content {display: flex; flex-wrap: wrap;}
		.side-bar .printer-type .tab-content a {width: 31.5%; margin-right: .2em;}




.item-cat {}

	.item-cat .item-cell a {
		display: flex; align-items: center; height: 100%; min-height: 120px; 
		margin: 0; padding: .7em; font-size: 1.1em; text-decoration: none; line-height: 1.4em; border: 2px solid;
	}
		
		.item-cat .img {
			width: 100px; height: 100%; margin-right: .5em; padding: 0; 
			background-repeat: no-repeat; background-position: 50% 50%;
		}
		.item-cat .img[style] {background-size: contain;}
		.item-cat .bw .img {background-image: url(icon_bw.png);}
		.item-cat .color .img {background-image: url(icon_color.png);}
		.item-cat .fax .img {background-image: url(icon_fax.png);}
		.item-cat .multi .img {background-image: url(icon_multi.png);}
		.item-cat .multic .img {background-image: url(icon_multic.png);}
		.item-cat .port .img {background-image: url(icon_port.png);}
		
		.item-cat a .title {flex: 1; padding: .5em 1em; border-left: 1px solid;}


/* :: Contact :: */

.contact-section section {margin-bottom: 5%; padding: 7%;}
	.contact-section section h3:first-child {margin-top: 0;}
	.contact-section section iframe {border: 2px solid white !important;}

/* :: Item Filter :: */

.item-filter {
	display: flex; position: relative; width: 100%; margin-bottom: 2em; border-style: solid; border-width: 1px 0;
}
	.item-filter h2 {flex-grow: 1; text-align: left;}
	
	.item-filter .form-inline .form-group {float: left; width: auto;}
	
	.item-filter .form-inline .form-group:last-child .form-control {margin-right: 0;}
	
	.item-filter select.form-control {padding: .5em; padding-left: .1em; border-width: 0 0 2px;}
	
	.item-filter h5 {margin-right: 2em;}
		.item-filter .number-of-items, .item-filter .number-of-items h6, .item-filter .number-of-items a {
			display: inline-block;
		}
		.item-filter .number-of-items {text-align: center;}
			.item-filter .number-of-items h6 {margin-right: .5em;}
			.item-filter .number-of-items a {margin: 0 .1em; padding: 0 .5em; line-height: 2em; text-decoration: none;}

/* :: Items' list :: */
	
.main-items .item-cell {
	position: relative; display: flex; flex-direction: column; align-items: stretch;
}
		
	.main-items .meta {position: absolute; top: -.4em; right: -.3em; max-width: 100%;}

	.main-items .img {margin-bottom: 1em; text-align: center; line-height: 120px;}
	.main-items span.img {display: block;}
		.main-items .img a {display: inline-block; line-height: normal;}
			.main-items .img img {max-height: 150px;}
	
	.main-items a {text-decoration: none;}
	
	.main-items .info {flex: 1; margin: .2em 0 0;}
	
		#site .main-items .info ul {position: relative; list-style: none; margin: 0; padding: 0;}
			#site .main-items .info ul li {padding: 0;}
			
			.main-items section h3 {margin: 0 0 .5em; font-size: 1.3em; font-weight: 300; line-height: 1.4em;}
				.main-items section h3 a {display: inline-block;}
				
				.main-items .info p {margin-bottom: .5em;}
				
				.item-brand {display: block; margin: .5em 0;}


/* :: Pagination :: */

.pagination {clear: both; margin: 2em 0; padding: .3em 1em; font-weight: 300;}
.item-filter + .pagination {margin: 0 0 1.5em; padding: 0;}
	.pagination .pagination-pages {display: inline-block; margin: auto; padding: 0 1em; border-radius: 1.5em;}
	.pagination h6 {margin-top: .6em;}
	.pagination a, .pagination strong {margin: 0; padding: .5rem .8rem; text-decoration: none; line-height: 42px; vertical-align: middle;}
	.pagination .prev-link, .pagination .next-link {font-size: 1.4em; padding: .5rem; vertical-align: -.2rem;}

/* :: Index Section New :: */

.section-new .wrapper {padding-top: 2em; padding-bottom: 2em;}
/*	.section-new .main-items .item-cell {padding: 0; background-color: transparent; border-color: transparent;}
		.section-new .main-items .meta {right: 15%; opacity: 0;}
		.section-new .main-items .item-cell:hover .meta {right: -1em; opacity: 1;}
		.section-new .main-items .img, .section-new .main-items .info, 
		.section-new .main-items section h3, 
		.section-new .main-items .price-bar, .section-new .main-items strong {margin: 0;}
		.section-new .main-items .img a {padding: .7em;}
			.section-new .main-items .img img {max-height: 300px;}
		
		.section-new .main-items section h3 a {padding: .5em .7em;}
		
			.section-new .shopping {
				order: 3; margin-top: -2.3rem; padding-left: .7em;
			}
				.section-new .main-items strong {
					position: relative; display: inline-block; padding: .4em .5em; 
					font-size: 1.2rem; border-radius: 5px; border-bottom-left-radius: 0;
				}
				.section-new .main-items strong:before {
					content: ""; position: absolute; left: 0; top: 100%; z-index: 10;
					width: 0; height: 0;
					border-style: solid; border-width: 7px 7px 0 0;
					border-color: #eb1c22 transparent transparent transparent;
				}
			
			.section-new .main-items .info {order: 4;}*/
			
			/*.section-new .info p, .section-new .availability, 
			.section-new .price-bar small, .section-new .add-to-cart {display: none;}*/

/* :: Item description :: */

.item-description h2 {margin-bottom: 1.5em;}

.item-description .item-row {display: flex; flex-wrap: wrap; margin-bottom: calc(1em + 1.5%);}

	.item-description .item-gallery {width: 45%; max-width: 480px; margin-right: 5%;}
		.item-gallery .big-img {text-align: center;}
			.item-gallery .big-img > a {position: relative; display: inline-block;}
			.item-gallery .big-img > a:before {
				content: ""; position: absolute; top: .55rem; right: .55rem; bottom: .55rem; left: .55rem; z-index: 10;
				display: block; border: 1px solid;
			}
			.item-gallery .big-img > a:hover:before {top: 0; right: 0; bottom: 0; left: 0;}
		.item-gallery ul {float: left; width: 100%; margin: 1em 0; padding: 0; list-style: none;}
			#site .item-gallery li {float: left; width: 25%; margin: 0; padding: 0 .5em .5em 0;}
				.item-gallery ul a {display: block; padding: .5rem; overflow: hidden; border: 1px solid;}
				.item-gallery ul a:focus {outline: none;}
					.item-gallery ul img {transform: scale(1);}
					.item-gallery ul a:hover img {transform: scale(1.1);}
					.item-gallery ul .current img {opacity: .5;}
	
	.item-description .item-overview {position: relative; flex: 1;}
		.item-overview > .inner {display: flex; justify-content: flex-end;}
			.item-description .item-overview ul {/*width: 50%;*/ padding-right: 5%;}
			.item-description .item-overview .shopping {
				display: flex; flex-direction: column; flex: 1; max-width: 25em; text-align: center;
			}
				.item-overview .price-bar {
					margin-bottom: 1em; padding: 10% 1em; border-style: solid; border-width: 2px 0;
				}
					.item-overview .price-bar .h1 {font-weight: 300;}
					.item-overview .price-bar small {display: block; font-size: .85rem; white-space: nowrap;}
				
				.item-overview .availability {flex: 1;}
		
		main ul.check {list-style: none; margin-left: 0;}
			main ul.check li {position: relative; padding-left: 1.5em;}
			main ul.check li::before {
				content: ""; position: absolute; top: .55em; left: 0;
				display: block; width: 6px; height: 6px; border: 2px solid; 
			}

.item-description .related-items {margin-bottom: 2em;}
	.item-description .related-items > h3 {margin: 0 0 1em; font-weight: bold;}

/* :: Icons :: */

.icon, .icon-light {
	display: inline-block; position: relative; vertical-align: middle; 
	line-height: 16px; width: 16px; height: 16px; margin: 0 2px 0 0;
}
	.icon .icon-wrapper, .icon-light .icon-wrapper {display: none;}

.size-24 .icon-wrapper {line-height: 24px; width: 24px !important; height: 24px;}

ul.list-styled {margin-left: 1.1em;}

a[href$=".pdf"], .pdf {
	display: inline-block; position: relative; padding: .8em; padding-left: 48px !important; 
	overflow-wrap: break-word; word-wrap: break-word; word-break: break-word;
}
a[href$=".pdf"]:before, .pdf:before {
	content: ""; position: absolute; top: 50%; left: 12px; transform: translateY(-50%);
	width: 24px; height: 24px; background: url(icon-pdf.png) no-repeat 0 0;
}

/* :: Side Bar 
===================================================================================================== :: */

.side-bar {width: 28%; margin: 1.6em 0 3%;}
.layout-1-2 .side-bar {width: 300px;}
	.side-bar > .inner {margin-right: 48px;}
	
		.side-bar h2 {position: relative; text-align: left;}
		.side-bar h5 {margin: 1.5em 0;}
	
	.expandable-nav {position: relative;}
	
	    .side-bar .btn-filter-clear {
			position: relative; margin-bottom: 1.5em; padding: .7em 2.4em .8em 1.1em; text-transform: uppercase;
			text-shadow: 1px 1px 3px rgba(0,0,0,.4);
		}
		.side-bar .btn-filter-clear:before, .side-bar .btn-filter-clear:after {
			content: ""; position: absolute; top: 1.2em; right: .6em;
			display: block; width: 14px; height: 2px;
		}
		.side-bar .btn-filter-clear:before {transform: rotate(45deg);}
		.side-bar .btn-filter-clear:after {transform: rotate(-45deg);}
	
	.expandable-nav a, .content .nav-x.nav-sep a {display: inline-block; margin: .1em 0; text-decoration: none;}
		.expandable-nav ul a {position: relative; padding-left: 1em; padding-right: .3em;}
		.expandable-nav ul a:before {
			content: ""; position: absolute; top: .6em; left: -.1em;
			display: block; width: 4px; height: 4px;
		}
			.expandable-nav ul a span, .content .nav-x.nav-sep a span {
				padding: .1em 0 .4em;
				background-position: 0 1.6rem; background-size: 1px 2px;
				background-image: linear-gradient(to right, rgba(219,46,32,0) 0%, rgba(219,46,32,0) 0%);
				background-repeat: repeat-x;
				transition: all .1s ease-in;
			}
			.expandable-nav ul a:hover span, .content .nav-x.nav-sep .current span, .content .nav-x.nav-sep a:hover span {
				background-position: 0 1.4rem; background-image: linear-gradient(to right, rgba(219,46,32,1) 0%, rgba(219,46,32,1) 100%);
			}
	
		.expandable-nav section {
			width: 100%; margin-bottom: 1em; padding: 0; border: 2px solid;
		}
			.expandable-nav .scroll-pane {
				max-width: 100%; height: 0; max-height: 20em; overflow: hidden; opacity: 0;
			}
			.expandable-nav .toggle.on + .scroll-pane {height: auto; overflow: auto; opacity: 1;}
			
			.scroll-pane {scrollbar-color: #999 #f1f1f1; scrollbar-width: thin;}
			.scroll-pane:hover {scrollbar-color: #db2e20 #f1f1f1;}
			.side-bar ::-webkit-scrollbar {width: 10px;}
			
			/* Track */
			.side-bar ::-webkit-scrollbar-track {background: #f1f1f1;}
			
			/* Handle */
			.side-bar ::-webkit-scrollbar-thumb {background: #999;}
			
			/* Handle on hover */
			.side-bar ::-webkit-scrollbar-thumb:hover {background: #db2e20;}
			
				.expandable-nav .scroll-pane .inner {padding: 12px 14px;}
					.expandable-nav .scroll-pane ul {margin: 0; list-style: none;}
		
			.expandable-nav h3 {position: relative; margin: -1px; padding: .4em 12px .6em; font-size: 1.3em;}
			.expandable-nav h3.toggle {cursor: pointer;}
				.expandable-nav h3 span {display: block; padding-right: 16px;}
			
				.expandable-nav .toggle span:before {
					content: ""; position: absolute; top: 1em; right: .7em;
					display: block; width: 8px; height: 8px;
					border-style: solid; border-width: 0 2px 2px 0; 
					transform: rotate(-45deg);
				}
				.expandable-nav .toggle.on span:before {top: .9em; right: .65em; transform: rotate(45deg);}

				.expandable-nav .form-elements {padding: 12px;}
		
			.expandable-nav .form-group {margin: 0;}
				.expandable-nav .form-group.checkbox label {
					position: relative; padding-left: 24px; line-height: 1.4em; font-size: .9em; 
				}
					.expandable-nav .form-group.checkbox input {position: absolute; top: .5em; left: 0;}
					
		.side-bar .f-contact {padding: 2em;}
			.side-bar .f-contact h3 {margin-top: 0;}
					
/* :: My Profile 
================================================================================== */
		
.toggle-items {margin: 1.5em 0;}

	.toggle-items .toggle-closed {position: relative;}
	.toggle-items .toggle-closed:before {
		content: ""; position: absolute; top: 1.3em; left: .7em; z-index: 10;
		display: block; width: 8px; height: 8px;
		border-style: solid; border-width: 2px 2px 0 0; transform: rotate(45deg);
	}
	.toggle-items .toggle-opened:before {transform: rotate(135deg);}

		.toggle-items h3 {
			position: relative; display: flex; flex-wrap: wrap; align-items: center; 
			margin: 0; padding: .3em 0 .3em 1.5em; font-size: 1.2em;
			border-style: solid; border-width: 0 0 1px; cursor: pointer;
		}
		.toggle-items > div:first-child h3 {border-top-width: 1px;}
		.toggle-items h3:before {display: none;}
		
			.toggle-items h3 .order-number {flex: 1; margin: .3em; text-decoration: underline;}
			.toggle-items h3 .order-number:hover {text-decoration: none;}
		
			.toggle-items h3 .info {font-size: .7em;}
				.toggle-items h3 .info strong {display: inline-block; margin: .3em 0 .3em .5em; padding: .5em 1em; border-radius: 1.5em;}
	
	.toggle-items .toggle-content {padding: 1em 0 calc(1em + 3%) 2.2em; border-bottom: 1px solid;}
	
		.toggle-items .print-link {
			display: inline-block; padding: .5em 1em .5em 3em;
			font-size: .85em; text-decoration: none; text-transform: uppercase;
			background: url(icon_print.png) no-repeat .5em 50%; border: 2px solid; border-radius: 1.5em;
		}
		
		
		
		.toggle-items .del {
			position: absolute; top: 1px; right: 1px;
			padding: 1px 22px 2px 0.5em;
			text-decoration: none;
			background: url(close.png) no-repeat 97% 3px;
		}
		
		.toggle-items .del:hover {background-position: 97% -97px;}

#site .side-bar .nav-y {padding: .8em;}
	.side-bar .nav-y li {margin-bottom: 2px;}
		.side-bar .nav-y a {display: block; padding: 1em; text-decoration: none;}
			.side-bar .nav-y a span {
				display: inline; padding-bottom: 0.3em;
				background-position: 0 1.2rem; background-size: 1px 2px;
				background-image: linear-gradient(to right, #b6dcf1 0%, #b6dcf1 100%);
				background-repeat: repeat-x;
			}
			.side-bar .nav-y .current span {background-image: linear-gradient(to right, #ff8a00 0%, #ff8a00 100%);}
			.side-bar .nav-y a:hover span {background-image: linear-gradient(to right, #0085cf 0%, #0085cf 100%);}
		
		.mp-live-search {
			position: relative; display: inline-block; margin: 0 1em 1em 0;
		}
			.mp-live-search .btn-del {
				display: inline-block; width: 26px; height: 26px; text-decoration: none; text-align: center; font-weight: bold;
				border: 1px solid; border-radius: 50%;
			}

/* :: Footer
===================================================================================================== :: */

#footer .wrapper {display: flex; flex-wrap: wrap; font-size: .9em;}
	#footer .wrapper > div {width: 25%;}
	#footer .wrapper > div:first-child {width: 22%;}
	#footer .wrapper > div:last-child {width: 28%;}
	#footer .wrapper > div:not(.col-4) {padding: 2em 0;}

			
	#footer h3 {margin-bottom: .7em;}
	
	#footer ul {list-style: none; margin: 0; padding: 0;}
		#footer li {position: relative; padding-left: 1.2em;}
		#footer li:before {
			content: ""; position: absolute; top: .6em; left: .1em;
			display: block; width: 3px; height: 3px;
		}

#footer .col-4 {
	padding: 1em; background: #ededed;
	background-image: repeating-linear-gradient(-45deg, white, white 4px, transparent 0, transparent 6px);
}

	#footer .col-4 .inner {height: 100%; padding: 1em 1.8em;}
	
		#footer .social {padding-top: 1em; border-top: 1px solid;}
			#footer .social i {display: inline-block; margin-right: .7em; vertical-align: middle;}
			#footer .social span {font-size: 1.2em;}

.footer-copy {
	position: relative; width: 100%; margin: 2em 0; 
	font-size: .8em; text-transform: uppercase; letter-spacing: .05em;
}

/* :: Scroll to Top :: */

.cd-top {
  position: fixed; z-index: 999; bottom: -5em; right: 1em; 
  display: inline-block; width: 40px; height: 40px; overflow: hidden; text-indent: 100%; white-space: nowrap;
  background-color: #db2e20; border-radius: 4px; box-shadow: 0 4px 10px -2px rgba(0,0,0,.4); 
  visibility: hidden; opacity: 0; transition: all .3s 0s;
}
.cd-top:before {
	content: ""; position: absolute; top: 50%; left: 50%;
	display: block; width: 10px; height: 10px; margin: -3px 0 0 -5px;
	border-style: solid; border-width: 2px 2px 0 0; border-color: white;
	transform: rotate(-45deg);
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  bottom: 1em; transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {visibility: visible; opacity: 1; /* the button becomes visible */}
.cd-top.cd-fade-out {opacity: .8; /* if the user keeps scrolling down, the button is out of focus and becomes less visible */}
.no-touch .cd-top:hover, .cd-top:hover {background-color: #e86256; opacity: 1;}


/* :: Cookie Consent :: */

#cookie-consent {position: fixed; right: 1.5em; bottom: 1.5em; z-index: 1000;}
	#cookie-consent .inner {
		position: relative; max-width: 300px; padding: 2em; font-size: .9em; cursor: default;}
#cookie-consent .inner, .close-cookie-window {background-color: #0085cf; box-shadow: 4px 12px 20px -6px rgba(0,0,0,0.3);}
#cookie-consent .inner, #cookie-consent a {color: hsla(0,0%,100%,.7);}
	#cookie-consent p {margin: 0;}
	#cookie-consent p:first-child {margin-bottom: 1em;}
		#cookie-consent a {position: relative; display: inline-block; text-decoration: none;}
		#cookie-consent p a {
			margin-right: .5em; padding: .5em 1em; text-transform: uppercase; border: 2px solid hsla(0,0%,100%,.3); color: white;
			transition: all .2s ease;
		}
		#cookie-consent p a:hover {background-color: #ff7900;}
		#cookie-consent .cookie-agree {padding-left: 1.8em;}
		#cookie-consent .cookie-agree:before {
			content: ""; position: absolute; left: .5em; top: 1em;
			display: block; width: 8px; height: 5px;
			border-style: solid; border-width: 0 0 2px 2px; border-color: white;
			transform: rotate(-45deg);
		}
		#cookie-consent .cookie-agree:hover:before {border-color: white;}
		
		#cookie-consent .close-cookie-window {
			position: absolute; top: -.7em; right: -.7em;
			display: block; width: 24px; height: 24px; text-align: center; line-height: 22px; font-weight: bold; font-size: 1.2em;
			background-color: #ff7900; color: white; border-radius: 4px;
		}
		#cookie-consent .close-cookie-window:hover {background-color: #eb1c22;}

/* :: Special Classes and styling
===================================================================================================== :: */

.toggle {user-select: none;}

#header, .form-elements, .item-filter, .item-cell, .shopping, #footer {cursor: default;}

.item-description .form-group .form-control,
.pagination a, .pagination strong,
.side-bar .btn-filter-clear {border-radius: 4px;}

.item-description .related-items {border-radius: 1em;}

.printer-type .tab-content a:hover, .item-cat .item-cell a:hover {box-shadow: 0 0 1em rgba(0,133,207,.15);}

.info-display {
	box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.live-search .dropdown-content {
	box-shadow: 1px 5px 15px rgba(0,0,0,.3);
}

.main-nav .sub-menu .sub-menu-wrapper {
	box-shadow: 4px 10px 40px -5px rgb(0,0,0,.55);
}

main .underine-link {text-decoration: none;}
	main .underine-link span {
		display: inline; padding-bottom: .1em;
		background-position: 0 100%; background-size: .15em .15em;
		background-image: linear-gradient(to right, rgba(17,135,201,.7) 0%, rgba(17,135,201,.7) 100%);
		background-repeat: repeat-x;
	}
	main .underine-link:hover span {
		background-image: linear-gradient(to right, #13b5ea 0%, #13b5ea 100%); background-size: .15em .3em; /*background-position: 0 1.2em;*/
	}

/* :: Transitions :: */

#header a, #header span,
.search-bar .search-wrapper, .index .hero-section .img img,
.main-nav nav, .main-nav span, .main-nav nav > ul > li > a:before,
.btn, .nav-wrapper, .nav-collapse, .nav-collapse:before, .nav-collapse:after, .nav-collapse span:before,
.content .styled-underline,
.live-search .dropdown-content,
.content .nav-x > li > a:before, .side-bar h2:before,
.expandable-nav .scroll-pane, .expandable-nav h3 span:before, .expandable-nav h3 span:after, .expandable-nav .toggle + .form-elements,
.item-list .item-cell, .item-list .item-cell > div, .item-cell a, .pagination a,
.main-items .meta,
.item-gallery .big-img > a:before, .item-gallery ul a, .item-gallery ul img, 
#footer .nav-y a, #footer span, main .underine-link, main .underine-link span,
.icon-map path, .icon-map circle, .tab-content a, .toggle-items .toggle-closed:before, .toggle-items .print-link,
.side-bar .nav-y a span, .mini-nav .sub-menu .inner {
	transition: all .2s ease;
}