﻿* {
margin:0;
padding:0;
outline:none;
}

body {
font-family:'Verdana',sans-serif;
overflow-y:scroll; 
}

html { scroll-behavior: smooth; }
html.noscroll, body.noscroll { overflow-y:hidden; }

.clear { clear:both; }
.left { float:left; }
.right { float:right; }
.center { margin:0 auto; }

a {
text-decoration:none;
}

a, label, input[type=radio], input[type=checkbox] {
cursor:pointer;
}

img { border:none; }

ul { list-style:none; }

table { border-collapse:collapse; }

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }

.placeholder { color:#aaa !important; }

at:before { content:"@"; }

.roundbox {
border:1px solid transparent;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

.sysinfo { display:none; background-color:#000; color:#ccc; }

div.ajax_overlay {
position:fixed;
width:100%;
height:100%;
z-index:10000;
}

#announcement {
padding:10px;
background:#ff0000;
color:#fff;
font-weight:300;
font-size:14px;
text-align:center;
}
#announcement a {
color:#fff;
text-decoration:underline;
}
#announcement a:hover {
text-decoration:none;
}

#loggedAsAdmin {
position:fixed;
left:0;
top:0;
z-index:100000;
background:#404040;
color:#fff;
font-size:12px;
opacity:0.8;
padding:5px;
border-radius:0 0 10px 0  !important;
overflow:hidden;
}

/* container
------------------------*/
#container {
width:990px;
margin:0 auto;
}


/* General Tooltips
---------------*/

[data-tooltip] { /*:link, a[data-tooltip]:visited*/
text-decoration: none;
display:inline-block;
position:relative;
/*z-index:999;*/
}

[data-tooltip]:before {
content:"";
position:absolute;
border-top:8px solid #202020;
border-left:8px outset transparent;
border-right:8px outset transparent;
visibility:hidden;
top:-60%;
right:0%;
opacity:0.8;
}
  
[data-tooltip]:after {
content:attr(data-tooltip);
position:absolute;
color:#fff;
bottom:160%;
right:-10px;
background:#202020;
border:1px solid #202020;
padding: 15px;
font-size:12px;
line-height:18px;
font-weight:normal;
text-align:left;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
white-space:normal;
visibility:hidden;
width:300px;
opacity:0.8;
text-shadow:none;
z-index:9999;
}

[data-tooltip]:hover:before, [data-tooltip]:hover:after {
visibility:visible;
-moz-transition:visibility 0s linear .3s;
-webkit-transition:visibility 0s linear .3s;
}


/* header
------------------------*/
header {
margin:15px 0 0;
}

#header-image {
width:990px;
height:154px;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
position:relative;
}

header a#homelink {
width:300px;
height:154px;
display:block;
position:absolute;
left:0px;
}

header>nav {
width:990px;
margin:0 0 15px;
height:50px;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

header nav>ul {
float:left;
}

header nav>ul>li {
float:left;
padding:12px 10px 0;
}

header nav>ul>li>a {
font-size:12px;
font-weight:bold;
color:#ccc;
text-decoration:none;
line-height:24px;
}

header nav>ul>li>a:hover {
color:#fff;
}

header #header-login {
white-space:nowrap;
}

/* header search
------------------------*/
#search {
width:385px;
height:48px;
background:rgba(255,255,255,0.6);
background:#ccc\9;
float:left;
margin:50px 0 0 350px;
border-color:#fff;
position:relative;
}

#search input[type='text'] {
width:270px;
background:none;
height:48px;
border:none;
padding:0 15px;
border-radius:5px 0 0 5px;
-moz-border-radius:5px 0 0 5px;
-webkit-border-radius:5px 0 0 5px;
color:#404040;
}

#search>a {
height:36px;
position:absolute;
right:0;
border-radius:0 5px 5px 0;
-moz-border-radius:0 5px 5px 0;
-webkit-border-radius:0 5px 5px 0;
padding:12px 20px 0;
line-height:24px;
font-size:14px;
font-weight:bold;
color:#fff;
}

.autocomplete-suggestions { border: 1px solid #999; background: #FFF; overflow: auto; font-size:14px; }
.autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; }
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong { font-weight: normal; color: #3399FF; }
.autocomplete-group { padding: 2px 5px; background-color:#f0f0f0; }
.autocomplete-group strong { display: block; border-bottom: 1px solid #000; }

.autocomplete-suggestion div:before {
font-family:"Font Awesome 5 Free";
font-weight:900;
content:"\f002";
color:#ccc;
margin-right:10px;
line-height:20px;
width:20px;
height:20px;
}
.autocomplete-suggestion div { cursor:pointer; }
.autocomplete-suggestion div.keyword:before { content:"\f002"; }
.autocomplete-suggestion div.product:before { content:"\f02b"; }
.autocomplete-suggestion div.category:before { content:"\f5fd"; }
.autocomplete-suggestion div.brand:before { content:"\f1f9"; }
.autocomplete-suggestion div.more { font-style:italic; color:#aaa; }


/* footer
------------------------*/
footer {
width:988px;/*990px - border*/
border-color:#909090 !important;
background:#eee;
margin:15px auto;
}    
    
footer p {
text-align:center;
color:#404040;
padding:10px;
font-size:10px;
}


/* cookies
-------------------------*/
.cookiewrapper {
position:fixed;
bottom:0;
width:100%;
margin:0 auto;
z-index:9999;
background:rgba(0,0,0,0.8);
border-top: solid 1px #fff;
}
.cookiebox {
color:#fff;
font:12px "Arial";
padding:40px;
}
.cookiebox h3 {
margin-bottom:15px;
font-weight: normal;
font-size: 22px;
}
.cookiebox a {
display:inline-block;
color:#fff;
margin-top:15px;
}
.cookiebox a:hover {
text-decoration:underline;
}
.cookiebox input[type=button] {
background-color:#50C24E;
color:#000;
border:none;
border-radius:5px;
display:inline-block;
cursor:pointer;
margin: 20px 20px 0px 0px;
padding:10px 15px;
font-size:13px;
}
.cookiebox input[type=button]:hover {
text-decoration:none;
background-color:#fff;
color:#50C24E;
}
.cookiebox input[type=button]#btnCookieDisagree {
background-color:#a0a0a0;
}


/* basket
------------------------*/
#basket p>b {
font-weight:normal;
}

#basketList {
position:relative;
z-index:9999;
}
#basketList>div { /*perko*/
display:none;
position:absolute;
top:0;
right:0;
padding:10px 10px 35px;
border:solid 1px #ccc;
background:rgba(255,255,255,0.9);
width:260px;
color:#404040;
}

#basketSumQty, #basketSumRegular, #basketSumDiscount, #basketSumWeight, #basketPostage, #basketPackaging, #basketTotalSum, #basketTotalSumWithoutPostage, #basketSumCoupons, #basketSumCouponsPreview, #basketSumBonus, #basketSumBonusPreview, #basketSumBonusObtained, #basketTotalSumWithoutPostageVatValue, #basketTotalSumWithoutPostageWithVat  {
display:none !important;
}

#basketList a.hide {
font-size:10px;
position:absolute;
bottom:0;
right:0;
display:block;
color:#404040;
width:100%; /*280px;*/
text-align:center;
border-top:1px solid #ccc;
}

#basketList a:hover.hide {
text-decoration:underline;
background:#f8f8f8;
}

#basketList a.checkout {
background-color:#404040;
padding:10px 20px;
color:#fff;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
display:block;
border:1px solid #101010;
text-align:center;
font-weight:bold;
margin:0 10px;
-webkit-box-shadow: 0px 1px 2px 0px #666;
-moz-box-shadow: 0px 1px 2px 0px #666;
box-shadow: 0px 1px 2px 0px #666;
}
#basketList a:hover.checkout {
background-color:#505050;
}

#basketList>div>h3 {
margin:0 0 10px;
font-size:16px;
}

#basketList>div>p {
margin:10px 5px 20px;
font-size:14px;
font-weight:bold;
text-align:right;
}

#basketList>div>span {
font-size:16px;
color:#808080;
padding:10px;
display:block;
margin: 0 0 -10px;
text-align:center;
background:#f5f5f5;
border:1px solid #ccc;
}

#basketList>div>ul {
border-bottom:1px dashed #aaa;
margin:0 0 5px; 
padding:0 0 5px;
}

#basketList>div>ul>li {
font-size:12px;
line-height:22px;
padding:10px 5px;
}

#basketList>div>ul>li:hover {
background:#f6f6f6;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

#basketList>div>ul>li>a,
#basketList>div>ul>li>span,
#basketList>div>ul>li>b {
display:table-cell; 
vertical-align:middle;
}

#basketList>div>ul>li>b {
width:30px; 
}

#basketList>div>ul>li>a {
color:#808080;
}

#basketList>div>ul>li>a>b {
display:inline-block;
font-size:10px;
line-height:10px;
color:#606060;
background:#ddd;
padding:3px;
border:1px solid #ccc;
height:10px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
margin:0 0 0 10px;
}

#basketList>div>ul>li>a>img {
float:left;
padding-right:15px;
}

#basketList>div>ul>li>a>span, .wishlist table td>a>span>span {
color:#606060;
font-size:12px;
line-height:10px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
padding:3px;
margin:0 0 8px 8px;
border:1px solid #ccc;
background:#f5f5f5;
white-space:nowrap;
}

#basketList>div>ul>li>a:hover {
text-decoration:underline;
}

#basketList>div>ul>li>a:hover>span {
text-decoration:none !important;
}

#basketList>div>ul>li>a .components {
margin-top:10px;
font-size:12px;
}
#basketList>div>ul>li>a .components b {
font-weight:600;
}

#basketList>div>ul>li>span { 
width:60px; 
text-align:right;
font-weight:bold;
padding-left:0px;
}

#basketList>div>ul>li.active-title,
#basketList>div>ul>li.active {
background-color:#ddd;
border-radius:5px;
margin:0 0 5px;
}

#basketList>div>ul>li.active-title {
text-align:center;
background:none;
margin:0;
}

#basketList>div>ul>li>a.remove-button {
float:right;
opacity:0.5;
}
#basketList>div>ul>li>a.remove-button:hover {
opacity:1;
}
#basketList>div>ul>li>a.remove-button svg {
width:20px;
height:20px;
fill:#444;
}


/* categories
------------------------*/
.categoriesWrapper {
float:left;
}
#container.reservations .categoriesWrapper, #container.reservations .category-path {
display:none;
}

#categories {
width:220px;
margin:14px 13px 0 -1px;
}
#categories h3 {
font-size:15px;
font-weight:bold;
text-align:center;
padding-top:8px;
height:27px;/*35px-padding*/
border-radius:5px 5px 0 0;
-moz-border-radius:5px 5px 0 0;
-webkit-border-radius:5px 5px 0 0;
background-color:#ff0000; /**/
color:#fff; /**/
}
#categories>ul>li {
font-size:13px;
font-weight:bold;
border:1px solid;
border-top:none;
border-color:#968e8e; /**/
}
#categories>ul>li>a {
padding:7px 10px;
background-color:#efefef; /**/
color:#333; /**/
}
#categories>ul>li:last-child, #categories>ul>li:last-child ul:last-child, #categories>ul>li:last-child>a:not(.on) {
border-radius:0 0 5px 5px;
-moz-border-radius:0 0 5px 5px;
-webkit-border-radius:0 0 5px 5px;
}
#categories ul li a {
display:block;
text-decoration:none;
}
#categories ul li a.on {
font-weight:bold;
}
#categories ul li a:hover {
background-color:#e5e6e3 !important; /**/
}
#categories>ul>li>a span {
display:block;
font-weight:normal;
font-size:9px;
}

#categories>ul>li ul {
background-color:#fff; /**/
}

#categories>ul>li li {
font-size:11px;
font-weight:normal;
}
#categories>ul>li li a {
padding:3px 10px;
color:#333; /**/
}
#categories>ul>li>ul { padding:10px 0; }

#categories>ul>li>ul>li ul { padding-bottom:10px; }

#categories>ul>li>ul>li ul li a {
padding-left:15px;
}

#categories>ul>li.extra {
background-color:#fff;
font-weight:normal;
}

#categories ul li {
position:relative;
}
#categories ul li a.link {
position:absolute;
right:0;
top:0;
text-decoration:none;
padding-right:5px;
background-color:transparent !important;
color:#aaa;
}
#categories ul li a.link:hover {
background-color:transparent !important;
color:#666 !important;
}

/* Product filters
--------------------- */
#filtersWrapper {
display:none;
}

#filters {
width:220px;
}

#filters h3 {
font-size:15px;
padding:10px 0;
}

#filters .filterName {
font-size:12px;
font-weight:bold;
}

#filters ul {
font-size:11px;
}

#filters ul li {
padding-top:5px;
position:relative;
height:12px;
}
#filters ul li.autohide,
#filtersTop ul li.autohide {
display:none; 
}

#filters .expand,
#filtersTop .expand {
display:block;
}
#filters .expand:before,
#filtersTop .expand:before {
/*content:"";
border: solid;
border-width: 0 3px 3px 0;
border-radius:2px;
display: inline-block;
padding: 3px;
margin-right:13px;
transform: rotate(45deg);*/
content:"\002B";
font-size:16px;
font-weight:600;
padding:3px;
margin-right:9px;
}
#filters .expand.expanded:before,
#filtersTop .expand.expanded:before {
/*transform: rotate(225deg);*/
content:"\2212";
}

#filters ul li label {
display:block;
position:absolute;
top:5px;
left:33px;
font-size:12px;
line-height:12px;
}

#filters ul li:hover label {text-decoration:underline;}
#filters ul li:hover .checkbox:not(.checkboxChecked) {border-color:#404040;}

#filters .checkbox {
background:#fff;
display:inline-block;
width:10px;
height:10px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border:1px solid #A0A0A0;
position:absolute;
top:5px;
left:15px;
}
#filters div.checkboxChecked {
background:#404040;
border-color:#404040;
}
#filter label.checkboxChecked {
background:none !important;
}

#filters ul.hidden {
display:none;
}
#filters .filterName.collapsable {
cursor:pointer;
}
#filters .filterName.collapsable:after {
color: #ccc;
float:right;
content:"";
border: solid;
border-width: 0 3px 3px 0;
border-radius:2px;
display: inline-block;
padding: 3px;
margin-left:10px;
transform: rotate(-135deg);
}
#filters .filterName.collapsable:hover:after, #filters .filterName.collapsable.hidden:hover:after {
color:#000;
}
#filters .filterName.collapsable.hidden:after {
color:#ccc;
transform:rotate(-315deg);
}

/* product list Grid View
------------------------*/
article {
width:610px;
float:right;
margin:15px 0 0 15px;
}    

#article-title {
background:#fff;
border-radius:5px 5px 0 0;
border:1px solid #ccc;
}

#article-title h1, #article-title h2 {
padding:10px;
font-size:19px;
color:#404040;
}

#article-title .desc {
padding:0 10px 20px;
font-size:11px;
}
#article-title .desc, #article-title .desc a, .descBottom, .descBottom a {
color:#404040;
}
#article-title .desc a, .descBottom a { text-decoration:underline; }
#article-title .desc a:hover, .descBottom a:hover { text-decoration:none; }
#article-title .desc p, .descBottom p {
padding:5px 0;
word-wrap:break-word;
}
#article-title .desc ul, .descBottom ul {
list-style:circle;
padding-left:20px;
padding-bottom:10px;
}
#article-title .desc li, .descBottom li {
padding-top:10px;
}
#article-title .desc.brandurl { display:none; }

.accordion-trigger {
font-weight:600;
cursor:pointer;
margin-top:10px;
}
.accordion-trigger:before {
content:"Prikaži več";
}
.accordion-trigger.on:before {
content:"Prikaži manj";
}
.accordion-trigger:after {
content:"\25BC";
font-size:10px;
padding-left:5px;
}
.accordion-trigger.on:after {
content:"\25B2";
}

ul.no-products li {
border:1px solid #ccc;
border-top:none;
border-bottom:none;
padding:10px;
font-size:11px;
text-shadow:none;
}

ul.no-products li>p {
display:block;
text-align:center;
font-size:22px;
line-height:40px;
color:#404040;
font-weight:normal;
}

ul.no-products li>p a {
width:auto;
display:inline-block;
font-size:24px;
line-height:24px;
color:#fff;
text-align:center;
font-family:'Open Sans',sans-serif;
padding:20px;
border-radius:5px;
background:#404040;
margin-top:60px;
}

ul.no-products li>p a:hover {
opacity:0.8;
}

.show-filters, #products #filters {
display:none;
}

ul.product-list {
border-left:1px solid #ccc;
border-top:1px solid #ccc;
width:100%;
}

ul.product-list>li {
float:left;
display:block;
width:182px;
border:1px solid #ccc;
border-top:none;
border-left:none;
padding:10px;
position:relative;
}


ul.product-list h3 {
color:#404040;
font-size:11px;
font-weight:bold;
line-height:14px;
height:28px;
overflow:hidden;
}

ul.product-list.groups h3 {
text-align:center;
}

ul.product-list>li>a>h3 {
color:#404040;
text-decoration:none;
}

ul.product-list>li h3:hover {
text-decoration:underline !important;
color:#000 !important;
}

ul.product-list p.code {
color:#ccc;
font-size:10px;
line-height:14px;
}

ul.product-list p.subtitle {
color:#606060;
font-size:10px;
font-style:italic;
line-height:14px;
height:28px;
overflow:hidden;
}

ul.product-list .img {
width:180px;
height:180px;
margin:10px 0;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
overflow:hidden;
text-align:center;
display:block; /* table-cell;*/
vertical-align:middle;
}
ul.product-list .img img {
display:block;
margin:0 auto;
}

ul.product-list p.stock {
color:#606060;
font-size:10px;
line-height:14px;
}
ul.product-list .stock a {
color:#404040;
}
ul.product-list .stock a:hover {
text-decoration:underline;
}

ul.product-list .add-basket {
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
overflow:hidden;
display:inline-block;
/*margin:-4px 0;*/
}

ul.product-list .add-basket input[type='text'] {
width:25px;
background:#fff;
border:none;
padding:4px;
margin:5px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
color:#606060;
font-size:14px;
font-weight:bold;
text-align:center;
height:12px;
float:left;
box-shadow:inset 0px 0px 3px #606060;
-webkit-box-shadow:inset 0px 0px 3px #606060;
-moz-box-shadow:inset 0px 0px 3px #606060;
font-family:Arial;
}

ul.product-list .add-basket a {
height:25px;
padding:5px 15px 0;
color:#fff;
font-size:12px;
display:block;
float:left;
line-height:18px;
}

ul.product-list .sale, ul.product-list .highlighted {
position:absolute;
background-repeat:no-repeat;
width:46px;
height:46px;
top:0;
right:0;
z-index:50;
}
ul.product-list .highlighted { background-image:url(/img/icon-highlighted.png); }

ul.product-list .sale  { background-image:url(/img/icon-sale.png); }
ul.product-list .sale b {
display:block;
font-family:'Arial',sans-serif;
color:#fff;
text-align:right;
font-size:11px;
-moz-transform: rotate(45deg);
transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}

div.clearance:before {
content:"ODPRODAJA";
}

ul.product-list p.price span {
font-size:10px;
/*text-decoration:line-through;*/
color:#808080;
font-weight:normal;
}

ul.product-list p.price {
color:#404040;
font-size:12px;
font-weight:bold;
line-height:14px;
text-align:right;
float:right;
margin-top:-1px;
}

/* Best price */
div.bestprice {
color:#888;
font-size:10px;
}
.product-list.grid .bestprice {
text-align:center;
display:block;
font-size:9px;
}
.product-detail-rightcol>ul>li.bestprice {
text-align:right;
}
/* */

ul.no-products {
background:#eee;
margin:20px 0;
padding:40px;
text-align:center;
font-size:40px;
font-weight:bold;
color:#ccc;
display:block;
border:1px dashed #ddd;
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius:8px;
background:#f5f5f5;
}

ul.no-products>li {
border:none;
font-size:40px;
font-weight:bold;
}

/* Product list - List view */

ul.product-list.list {
width:100%;
margin:0;
border-bottom:1px solid #eee;
}

ul.product-list.list>li {
width:100%;
box-sizing:border-box;
margin:0;
padding:0 0 0 130px;
height:110px;
border-top:1px solid #eee;
}

ul.product-list.list li .img {
width:auto;
height:100%;
padding:0;
}

ul.product-list.list li h3 {
padding:20px 0 10px;
font-size:16px;
color:#333;
line-height:20px;
width:50%;
}

ul.product-list.list li .price {
position:absolute;
top:20px;
right:0;
margin:0;
display:inline-block;
}

/* Product list - Table view */

.product-list.table table {
width:100%;
}
.product-list.table table tr {
border-bottom:1px solid #ddd;
}
.product-list.table table tr.highlighted {
background-color:#ffff88;
}
.product-list.table table tr:hover {
background-color:#fafafa;
}
.product-list.table table tr:first-child {
border-bottom:none;
}

.product-list.table table td, .product-list.table table th  {
/*padding:5px 3px 1px 3px;*/
font-size:13px;
line-height:20px;
color:#333;
vertical-align:middle;
}
.product-list.table table td:first-child {
padding-left:5px;
}
/*.product-list.table table td a {
color:#333;
}
.product-list.table table td a:not(.product-inquiry) {
color:#333;
text-decoration:underline;
}
.product-list.table table td a:not(.product-inquiry):hover {
text-decoration:none;
}*/
.product-list.table table th {
padding:10px;
color:#666;
background:#f5f5f5;
text-align:left;
font-weight:400;
}
.product-list.table table th a {
color:#666;
}
.product-list.table table th a:hover {
text-decoration:underline;
}
.product-list.table table th a.on {
font-weight:600;
}

.product-list.table table td span:not(.highlight) {
font-weight:600;
}

.product-list.table table td.basket {
width:107px;
padding-right:0;
padding-left:0;
white-space:nowrap;
}

.product-list.table table td {
position:relative;
}
.product-list.table table td img {
width:60px;
height:60px;
}
.product-list.table table td div.saleflag {
position:absolute;
top:0;
right:0;
font-size:8px;
line-height:8px;
color:#fff;
display:block;
padding:5px;
background-color:#ccc;
white-space:nowrap;
}
.product-list.table table td div.saleflag.id60 { background-color: #0099cc; }
.product-list.table table td div.saleflag.id104 { background-color: #cc0000; }

.product-list.table table th.c, .product-list.table table td.c {
text-align:center;}
.product-list.table table th.r, .product-list.table table td.r {
text-align:right;}
.product-list.table table td.r {
white-space:nowrap;}


.product-list.table table td.basket {
height:49px;
}
.product-list.table table a.add, 
.product-list.table table a.inquiry,
.product-list.table table a.variants {
background-color:#333;
display:inline-block;
width:50px;
height:35px;
border-radius:3px;
margin:15px 0 0 10px;
}

.product-list.table table a.add, .product-list.table table a.inquiry, product-list.table table a.variants,
.profile-wishlist table a.add, .profile-wishlist table a.inquiry, .profile-wishlist table a.variants {
background-image:none;
position:relative;
}
.product-list.table table a.inquiry {
position:absolute;
right:0;
top:0;
}
.product-list.table table a.add:before, .product-list.table table a.inquiry:before, .product-list.table table a.variants:before, 
.profile-wishlist table a.add:before, .profile-wishlist table a.inquiry:before, .profile-wishlist table a.variants:before {
font-family:"Font Awesome 5 Free";
font-weight:900;
content:"\f291";
color:#fff;
line-height:35px;
font-size:18px;
text-align:center;
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
}
.product-list.table table a.inquiry:before,
.profile-wishlist table a.inquiry:before {
content:"\f0e0";
}
.product-list.table table a.variants:before,
.profile-wishlist table a.variants:before {
content:"\f141";
}

.product-list.table table a.product-inquiry span {
display:none;
}
.product-list.table table a.product-inquiry:before  {
font-family:"Font Awesome 5 Free";
font-weight:900;
content:"\f0e0";
color:#333;
margin-right:10px;
font-size:17px;
position:relative;
bottom:-2px;
}
.product-list.table table a.product-inquiry:hover  {
background-color:#fff;
}

.product-list.table table .quantity {
display:inline-block;
}
.product-list.table table .quantity input {
background:#fff;
border-radius:3px;
display:inline-block;
border:1px solid #ddd;
width:15px;
padding:10px;
line-height:13px;
text-align:right;
top:-13px;
position:relative;
margin:0 0 0 10px;
}



/* paging
------------------------*/
#container-sorting, .pagination {
background:#ccc;
min-height:30px;
}

.pagination:not(.bottom) {
border-top:1px solid #ddd;
}

#sorting label, #pagesize label, #brandfilter label, #onlyInStock label {
float:right;
font-size:10px;
margin:11px 5px;
color:#606060;
cursor:default;
}
#onlyInStock label {
cursor:pointer;
margin:8px 0;
}

#sorting select, #pagesize select, #brandfilter select, #onlyInStock input[type=checkbox] {
margin:4px 5px 5px;
float:right;
border-radius:3px;
border:none;
font-size:12px;
padding:3px;
height:25px;
}

#sorting {
float:right;
}

#pagesize label, #brandfilter label, #onlyInStock label {
float:left;
}

#pagesize select, #brandfilter select, #onlyInStock input[type=checkbox] {
float:left;
}

.pagination {
width:600px;
padding:0 5px;
font-size:10px;
float:left;
}

.pagination span {
margin:10px 0;
color:#606060;
float:left;
}

.pagination .page-select {
float:right;
color:#606060;
}

.pagination .page-select a {
display:inline-block;
padding:5px;
margin:5px 0;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
color:#606060;
}

.pagination .page-select a:hover {
background-color:#909090;
color:#fff;
}
.pagination .page-select a.off {
cursor:default;
color:#ededed;
background-color:transparent;
}

.pagination .page-select input {
width:25px;
height:18px;
margin:4px 5px 5px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border:none;
font-size:12px;
font-weight:bold;
padding:3px;
text-align:center;
}

.pagination.bottom {
border-radius:0 0 5px 5px;
-moz-border-radius:0 0 5px 5px;
-webkit-border-radius:0 0 5px 5px;
}


div.loading { 
width:100%; 
padding:40px; 
text-align:center; 
box-sizing: border-box;
}

div.loading .loadingContainer { 
display:inline-block;
margin:0 auto;
padding:15px 30px;
background:#f5f5f5;
border-radius:2px;
}

div.loading p { 
color:#222;
font-size:15px;
line-height:15px;
display:inline-block;
vertical-align:middle;
}

div.loading i { 
color:#000;
line-height:20px;
font-size:20px;
text-align:center;
vertical-align:middle;
margin-right:20px;
}

/* viewtype toggle */

#viewtype {
float:left;
}

#viewtype a {
font-size:20px;
line-height:40px;
color:#ccc;
margin-right:10px;
}

#viewtype a.on {
color:#333;
}

#viewtype a:hover {
color:#888;
}

/* Izdelek podrobno
--------------------- */
article.normal-width {
width:740px;
}

.category-path {
font-size:12px;
padding:0 0 10px;
color:#606060;
max-width:70%;
}

.category-path>b {
display:inline-block;
width: 0px !important;
height: 0px !important;
border-top: 5px outset transparent !important;
border-bottom: 5px outset transparent !important;
background-image:none  !important;
margin:0 10px;
border-left: 5px solid #404040 !important;
border-right: none !important;
}

.category-path i {
font-weight:bold;
font-style:normal;
}

.category-path a {
color:#404040;
}

.product-detail-title {
background:#f5f5f5;
padding:10px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
box-shadow:0px 0px 3px #aaa;
-webkit-box-shadow:0px 0px 3px #aaa;
-moz-box-shadow:0px 0px 3px #aaa;
color:#606060;
font-weight:bold;
}

.product-detail-title h1 {
color:#606060;
font-size:24px;
}

.product-detail-title h1 span {
color:#606060;
font-size:10px;
line-height:10px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
padding:3px;
margin:0 0 0 8px;
border:1px solid #ccc;
background:#f5f5f5;
top:-6px;
position:relative;
white-space:nowrap;
}

.product-detail-title h2 {
font-weight:normal;
font-size:12px;
font-style:italic;
color:#808080;
}

/* desni stolpec
------------------------*/
/*aside {
width:130px;
margin:15px 0 15px 13px;
float:right;
}*/



/*.progress {
border: 1px solid #DDDDDD;
border-radius: 3px 3px 3px 3px;
position: relative;
width: 398px;
margin:10px 0 0;
font-size:10px;
}

.bar {
background-color: #B4F5B4;
border-radius: 3px 3px 3px 3px;
height: 20px;
width: 0;
}

.percent {
display: inline-block;
left: 48%;
position: absolute;
top: 3px;
}*/


/*warning*/

/*p.warning {
text-align:right;
font-size:12px;
color:#808080;
}*/




/* jQueryUI slider */
/*.filterSlider {
text-align:center;
width:180px;
}

.filterSlider .slider {
margin:10px;
}

.ui-slider {
position: relative;
text-align: left;
}

.ui-slider .ui-slider-handle {
background:#e0e0e0;
position: absolute;
z-index: 2;
width: 17px;
height: 17px;
cursor: default;
}

.ui-slider .ui-slider-range {
position: absolute;
z-index: 1;
font-size: 12px;
display: block;
border: 0;
}

.ui-slider-horizontal {
background:#e0e0e0;
height: 1px;
}

.ui-slider-horizontal .ui-slider-handle {
top: -8px;
margin-left: -.6em;
}

.ui-slider-horizontal .ui-slider-range {
top: 0;
height: 100%;
}

.ui-slider-horizontal .ui-slider-range-min {
left: 0;
}

.ui-slider-horizontal .ui-slider-range-max {
right: 0;
}*/

/*https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/*/
div.filterSlider {
position:relative;
width:180px;
text-align:center;
margin-bottom:23px;
}

div.filterSlider input {
pointer-events: none;
position: absolute;
overflow: hidden;
left: 0;
top: 15px;
width: 100%;
outline: none;
height: 18px;
margin: 0;
padding: 0;
margin-top:5px;
}

div.filterSlider input::-webkit-slider-thumb {
pointer-events: all;
position: relative;
z-index: 1;
outline: 0;
}

div.filterSlider input::-moz-range-thumb {
pointer-events: all;
position: relative;
z-index: 10;
-moz-appearance: none;
width: 9px;
}

/* slider handle */
input[type=range] {
-webkit-appearance: none; /* Hides the slider so that custom slider can be made */
width: 100%; /* Specific width is required for Firefox. */
background: transparent; /* Otherwise white in Chrome */
}
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
}
input[type=range]:focus {
outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
}
input[type=range]::-ms-track {
width: 100%;
cursor: pointer;
/* Hides the slider so custom styles can be added */
background: transparent; 
border-color: transparent;
color: transparent;
}

/* Special styling for WebKit/Blink */
input[type=range]::-webkit-slider-thumb {
height: 15px;
width: 15px;
border-radius: 2px;
background-color: #404040;
cursor: pointer;
top:-7px;
}
/* All the same stuff for Firefox */
input[type=range]::-moz-range-thumb {
height: 15px;
width: 15px;
border-radius: 2px;
background-color: #404040;
cursor: pointer;
top:-7px;
}
/* All the same stuff for IE */
input[type=range]::-ms-thumb {
height: 15px;
width: 15px;
border-radius: 2px;
background-color: #404040;
cursor: pointer;
top:-7px;
}

/* slider track */
input[type=range]::-webkit-slider-runnable-track {
width: 100%;
height: 1px;
cursor: pointer;
background: #ccc;
border-radius: 1px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
background: #ccc;
}
input[type=range]::-moz-range-track {
width: 100%;
height: 1px;
cursor: pointer;
background: #ccc;
border-radius: 1px;
}


/* Brands list 
--------------------- */

.indexBrands {
text-align:center;
margin:0 0 40px;
}

.indexBrands a {
color:#888;
font-size:20px;
line-height:20px;
display:inline-block;
margin:0 7px;
}

.indexBrands a:hover {
color:#333;
}

article.brands>ul {
float:left;
width:103%;
padding:0;
margin:0 0 0 -3%;
}


article.brands>ul>li:not(.initial) {
padding:0;
text-align:center;
width:22%;
height:150px;
margin:0 0 20px 3%;
box-sizing:border-box;
border:1px solid #ddd;
float:left;
background:#fff;
}

article.brands>ul>li.initial {
padding:30px 0;
font-size:30px;
line-height:30px;
font-weight:300;
text-align:left;
border-bottom:1px solid #ddd;
width:97%;
margin:20px 0 30px 3%;
}

article.brands>ul>li a {
position:relative;
width:100%;
font-weight:300;
font-size:20px;
height:100%;
display: flex;
align-items: center;
justify-content: center;
}
article.brands > ul > li a span {
color:#333;
}
article.brands>ul>li a img {
display:block;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
height:auto;
max-width :70%;
max-height:65%;
-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
filter: grayscale(100%);
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
}

article.brands>ul>li a:hover img {
-webkit-filter: grayscale(0); /* Safari 6.0 - 9.0 */
filter: grayscale(0);
}


/* Hamburger menu */
.nav-trigger {
position: absolute;
clip: rect(0, 0, 0, 0);
-webkit-touch-callout: none;
}
label[for="toggleSidebar"] {
position: absolute;
left: 22px; top: 22px;
z-index:9999;
display: none;
}
.nav-trigger + label {
transition:opacity 0.5s, left 0.1s;
}
.nav-trigger.hide + label.hide {
transition:opacity 0.3s;
opacity:0;
}
label[for="toggleSidebar"] span {
display:block;
width: 22px;
height: 4px;
margin-bottom: 4px;
position: relative;
background-color:#333;
border-radius: 1px;
transform-origin: 0% 100%;
transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
            background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
            opacity 0.55s ease;
}

label[for="toggleSidebar"] span:nth-last-child(3) {
transform-origin: 0% 0%;
}
label[for="toggleSidebar"] span:first-child {
transform-origin: 4px 0px;
}
.nav-trigger:checked ~ label span {
opacity: 1;
transform: rotate(-45deg) translate(0px, 5px);
width: 26px;
}
.nav-trigger:checked ~ label span:nth-last-child(3) {
opacity: 1;
transform: rotate(45deg) translate(6px, 2px);
width: 26px;
}
.nav-trigger:checked ~ label span:nth-last-child(2) {
opacity: 0;
transform: rotate(0deg) scale(0.2, 0.2);
}

@media only screen and (min-height : 300px) and (max-width : 1020px) and (min-device-height : 300px) {
label[for="toggleSidebar"] { display:block; }
}

nav#sidebar ul li {
position:relative;
}
nav#sidebar>ul>li a.expandable {
position:absolute;
padding-right:15px;
right:0;
top:0;
background-color:transparent;
}
nav#sidebar>ul>li a.expandable::after {
font-family:"Font Awesome 5 Free";
font-weight:900;
content:"\2b";
font-size:24px;
}
nav#sidebar>ul>li a.expandable.on::after {
content:"\2212";
}
nav#sidebar ul li a.selected {
font-weight:bold;
}
nav#sidebar ul li a.link {
display:none;
}
nav#sidebar ul {
float:none;
}