/* -----------------------------------------------------------------------------------------------------------------
Tuotehaku global styles 
----------------------------------------------------------------------------------------------------------------- */
#dnsListMainWrapper * { 
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.dnsListMainWrapper .dnsCell { position: relative; }
.dnsListMainWrapper .dnsCell { 
    padding-left:0; 
    padding-right:0; 
}
.dnsListMainWrapper .dnsRow { 
    margin-left:0; 
    margin-right:0; 
}
.dnsListMainWrapper span { display: inline-block; }
.dnsListMainWrapper label { cursor:pointer; }
.dnsListMainWrapper .dnsListItem.active,
.dnsListMainWrapper .dnsListItem > .hover { 
    -webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -ms-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
#dnsList.loading { background: url('//images.salattu.fi/scripts/preloader.gif') no-repeat center 100px; }
.dnsListMainWrapper .dnsListItem.active > .hover { visibility: visible; opacity: 1; }

#dnsListHoverPages {
    position: fixed;
    top: 50%;
    display: none;
    z-index: 1001;
}

#dnsListHoverNext, #dnsListHoverPrev {
    position: absolute;
    top: 0;
    width: 50px;
    height: 62px;
    outline: none;
    border: none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    border-radius: 4px;
    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=60)';
    filter: alpha(opacity=60);
    opacity: 0.6;
}

#dnsListHoverNext:hover, #dnsListHoverPrev:hover {
    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    filter: alpha(opacity=100);
    opacity: 1;
}

#dnsListHoverNext {
    right: -10px;
    background: url('//images.salattu.fi/tuotehaku/images/icon-page-next.png') no-repeat;
}

#dnsListHoverPrev {
    left: -10px;
    background: url('//images.salattu.fi/tuotehaku/images/icon-page-prev.png') no-repeat;
}

.currency-symbol, .currency-price { text-decoration: inherit; }

/* -----------------------------------------------------------------------------------------------------------------
Default widths for search items
----------------------------------------------------------------------------------------------------------------- */
.small.type-1 .dnsListItem, 
.small.type-2 .dnsListItem, 
.small.type-3 .dnsListItem { width: 100%; }

.medium.type-1 .dnsListItem { width: 49.50%; } 
.medium.type-2 .dnsListItem { width: 32.66666%; } 
.medium.type-3 .dnsListItem { width: 100%; }

.large.type-1 .dnsListItem { width: 32.66666%; } 
.large.type-2 .dnsListItem { width: 24.25%; } 
.large.type-3 .dnsListItem { width: 49.50%; }

.xl.type-1 .dnsListItem { width: 24.25%; } 
.xl.type-2 .dnsListItem { width: 19.20%; }
.xl.type-3 .dnsListItem { width: 49.5%; }

/* -----------------------------------------------------------------------------------------------------------------
Default styles for each view
----------------------------------------------------------------------------------------------------------------- */
.dnsListMainWrapper .dnsListItem { 
    margin-left: 1%; 
    background:#fff;
}
table#varastosaldot {
	width: 100%;
}

span.ProdStorage {
    
}
.ProdStorageCol1 {
    min-width: 100px;
}
span.green {
    color:green;
}
span.yellow {
    color:yellow;
}
span.red {
    color: red;
}

/*------- spacing between cells, ie8+ -------*/
.medium.type-1 .dnsListItem:nth-of-type(2n+1) { margin-left:0; }
.medium.type-2 .dnsListItem:nth-of-type(3n+1) { margin-left:0; }
.medium.type-3 .dnsListItem:nth-of-type(1n+1) { margin-left:0; }

.large.type-1 .dnsListItem:nth-of-type(3n+1) { margin-left:0; }
.large.type-2 .dnsListItem:nth-of-type(4n+1) { margin-left:0; }
.large.type-3 .dnsListItem:nth-of-type(2n+1) { margin-left:0; }

.xl.type-1 .dnsListItem:nth-of-type(4n+1) { margin-left:0; }
.xl.type-2 .dnsListItem:nth-of-type(5n+1) { margin-left:0; }
.xl.type-3 .dnsListItem:nth-of-type(2n+1) { margin-left:0; }

.type-1 .static .primary { width: 33%; }
.type-1 .static .secondary { width: 66%; padding: 1em; }

.small.type-1 .hover { margin-top:0.5em; }

.dnsCell .small .static .primary { width: 45%; }
.dnsCell .small .static .secondary { width: 55%; padding: 0 1em 1em; }

.type-3 .static .primary { width: 20%; }
.type-3 .static .secondary { width: 80%; padding: 0 1em; }


.type-3 .dnsListItem .hover, .type-3 .active .hover { 
    display:none; 
    visibility: hidden; 
    opacity:0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.type-3 .static .secondary .prodBuy, .type-3 .static .secondary .prodBuyInfo { 
    margin-top: 1em;
    font-weight: 700;
    /*color:#fff;*/
    /*background:#333;*/
    padding:0.5em 1em;
}
.medium.type-3 .static .secondary .prodBuy, 
.large.type-3 .static .secondary .prodBuy,
.medium.type-3 .static .secondary .prodBuyInfo, 
.large.type-3 .static .secondary .prodBuyInfo { 
    width: 40%;
    min-width: 200px;
}
.type-3 .static .dnsCell .hidden {
    display:block !important;
    visibility: visible;
}

/*------- fix for phones & ie8 -------*/
.small .dnsRow  .dnsListItem { margin-left: 0; }
.small.type-1 .dnsListItem, .small.type-2 .dnsListItem,
.oldIE .type-1 .dnsListItem, .oldIE .type-2 .dnsListItem,
.lt-ie9 .type-1 .dnsListItem, .lt-ie9 .type-2 .dnsListItem { margin-left:0; margin-right: 0; }

/* -----------------------------------------------------------------------------------------------------------------
Search results
----------------------------------------------------------------------------------------------------------------- */
/*------- Product  -------*/
.dnsListMainWrapper .dnsListItem {
    padding:0.5em;
    font-weight: normal;
    color:inherit;
    z-index:9;
    margin-bottom: 1%;
    border-style: solid;
    border-color: #eee;
    border-width: 1px 1px 5px;
    -webkit-backface-visibility: hidden;
}
#dnsListWrap .dnsListItem {
    float: left;
    /* added 13.11.2018 */
    display: flex;
    flex-direction: column;
}
.dnsListMainWrapper .dnsListItem.active {
    background:#fff;
    z-index:10;
    -moz-box-shadow:0 0 21px rgba(0,0,0,0.18);
    -webkit-box-shadow:0 0 21px rgba(0,0,0,0.18);
    box-shadow:0 0 21px rgba(0,0,0,0.18);
}
/* hovers not needed for phones? */
.dnsListMainWrapper.small .dnsListItem.active {
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    box-shadow:none;
}
/*------- Product image -------*/
.dnsListItem .dnsListImg {
    position: relative;
    max-height: 240px;
    min-height: 120px;
    overflow: hidden;
    background:#fff;
    padding:10px;
}
.dnsListItem .dnsListImg.empty { background: #f3f3f3 url('//images.salattu.fi/system/images/tuotehaku/icon-noimage.png') no-repeat center; }
.dnsListItem .dnsListImg.empty:after {
	display: block;
	padding-bottom: 100%;
	content: '';
}
.small .dnsListItem .dnsListImg {
    max-height: 200px;
    min-height: 100px;
}
.medium.type-2 .dnsListItem .dnsListImg {
    max-height: 180px;
    min-height: 180px;
}
.medium.type-3 .dnsListItem .dnsListImg {
    max-height: 180px;
    min-height: 120px;
}
.dnsListItem .dnsListImg > img {
    height: auto;
    position: relative;
    vertical-align: middle;
    max-width: 100%;
    border:0;
}
.lt-ie9 .dnsListImg img { -ms-interpolation-mode: bicubic; zoom: 1; }
.dnsListItem .dnsListImgZoom {
    background: transparent url("//images.salattu.fi/system/images/tuotehaku/icon-zoom.png") no-repeat center;
    height: 36px;
    width: 36px;
    top:50%;
    left:50%;
    margin-left: -18px;
    margin-top: -18px;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;    
    position: absolute;
    z-index: 10;
    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    filter: alpha(opacity=0);
    opacity: 0;
}
.dnsListItem.active .dnsListImgZoom {
    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)';
    filter: alpha(opacity=50);
    opacity: 0.5;
}
.dnsListItem.active .dnsListImgZoom:hover, .small .dnsListItem .dnsListImgZoom {
    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    filter: alpha(opacity=100);
    opacity: 1;
}
.small .dnsListItem .dnsListImgZoom { display: none !important; }
/*------- Product content (name, price etc.) -------*/
.dnsListItem .secondary { 
    padding: 7px;
}
.dnsListItem .secondary > span {
    color:inherit;
    width: 100%;
}
.dnsListItem .ProdName {
    font-weight: 700;
    font-size: 1.1em;
    line-height: 1.2;
}
.dnsListItem .ProdPrice {
    font-weight: 400;
    font-size: 0.9em;
}

.dnsListItem .ProdResv {
    font-size: 0.9em;
}

.ProdResvGreen {
    color: green !important;
}

.ProdResvRed {
    color: red !important;
}

.type-3 .dnsListItem .ProdPrice, .type-3 .dnsListItem .ProdText, .type-3 .dnsListItem .ProdHinnastoText { 
    margin-bottom: 0.5em;
}
.dnsListItem .ProdPrice > span {
    white-space: nowrap;
    width: auto;
}
.dnsListItem .ProdPrice > span:first-child { margin-right: 0.5em; }
.dnsListItem .ProdPrice .ProdPriceSale {
    font-weight: 700;
    color:#FF302D;
}
.dnsListItem .ProdPrice .ProdPriceOvh {
    text-decoration: line-through;
}
/*------- Product badges -------*/
.dnsListItem .badge {
    display: block;
    position: absolute;
    z-index: 9;
    height: auto;
    width: auto;
    padding:0.3em 0.5em;
    font-size: 0.86em;
    font-weight: 700;
}
.dnsListItem .badge.sale {
    background: #ff302d;
    color:#fff;
}
.dnsListItem .badge.new {
    background: #3b5998;
    /*height: 63px;*/
    /*width: 63px;*/
    right:0;
    color:#fff;
}

.dnsListItem .badge.custom {
    background: #ff00dc;
    right:0;
    top: 200px;
    color:#fff;
}

.type-1 .dnsListItem .badge.new, .small.type-3 .dnsListItem .badge.new {
    left:0;
    right:auto;
    bottom:0;
}
.small.type-2 .dnsListItem .badge.new {
    bottom: auto;
    top: 0;
    left:0;
    right:auto;
}
/*------- Product hover wrapper -------*/
.dnsListMainWrapper .dnsListItem > .hover {
    visibility: hidden;
    opacity: 0;
    height:auto;
    left:0;
    top:100%;
    z-index: 10;
    width:100%;
    position: absolute;
    background:#fff;
    -moz-box-shadow:0 21px 21px rgba(0,0,0,0.18);
    -webkit-box-shadow:0 21px 21px rgba(0,0,0,0.18);
    box-shadow:0 21px 21px rgba(0,0,0,0.18);
    -webkit-backface-visibility: hidden;
}
.dnsListItem > .hover > .dnsCell { 
    padding-right:14px;
    padding-left:14px; 
    padding-bottom: 7px;
}
.small .dnsListItem > .hover > .dnsCell { 
    padding-right:7px;
    padding-left:7px; 
}
.dnsListItem > .hover > .dnsCell:last-child { padding:inherit; }
.dnsListItem > .hover > div.dnsCell.prod-buy-cell { padding:inherit; }

.dnsListItem > .hover > div.dnsCell.ean-cell {
	padding-right:15px;
    padding-left:15px; 
    padding-bottom: 7px;
}
.small .dnsListItem > .hover > div.dnsCell.ean-cell { 
	padding-right: 8px;
    padding-left: 8px;
}

/* hovers not needed for phones */
.dnsListMainWrapper.small  .dnsListItem > .hover {
    visibility: visible;
    opacity: 1;
    position: static;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    box-shadow:none;
}
/*------- Product hover content -------*/
.dnsListItem .ProdText, .dnsListItem .ProdHinnastoText, .dnsListItem .ProdCode, .dnsListItem .ProdBrand, .dnsListItem .ProdYksikkoMaara, .dnsListItem .ProdEAN, .dnsListItem .ProdVat2 > span {
    color:inherit;
    width: 100%;
    line-height: 1.2;
    font-size:0.8em;
}

.ProdBrand {
    text-align: center;
}

.dnsListItem .prodBuy, .dnsListItem .prodBuyInfo, .dnsListItem .ProdAddToComp  {
    display: block;
    clear:both;
    color:#fff;
    font-weight: 700;
    background:#333;
    padding: 0.5em;
    text-align: center;
}

/* -----------------------------------------------------------------------------------------------------------------
Sorting elements: pager, sorting, views
----------------------------------------------------------------------------------------------------------------- */
.dnsListMainWrapper .sortingWrap   {
    background: #fcfcfc;
    border: solid 1px #e2e2e2;
    margin-bottom: 4px;
    padding: 5px 0;
}
.sortingWrap .dnsCell { 
    width: 33.33333%; 
    padding: 5px;
}
.dnsListFiltersWrap .dnsCell {padding: 0 5px;}
.small .sortingWrap .dnsCell { width: 100%; }
.sortingWrap .four { padding-top:5px; }
.sortingWrap .four > input, .sortingWrap .four > label { 
    vertical-align: middle;
    display: inline-block;
}
.sortingWrap .four > label { margin-right: 0.5em; }
.sortingWrap .dnsListPage {
    /*font-size: 90%;*/
    line-height: 1.4;
    background: #fff;
    padding: 0;
    border: solid 1px #e2e2e2;
    color: #939393;
    margin-right: 0.3em;
    min-width: 1.5em;
}
.sortingWrap .dnsListPage:hover, .sortingWrap .dnsListPage.active {
    background: #424242;
    color: #fff;
}
.sortingWrap .dnsListPage.active { cursor:default; }
.sortingWrap .sorter { text-align: center; padding: 0 5px; }
.small .sortingWrap .sorter { text-align: center; }
.small .sortingWrap .viewer, .small  .dnsListFiltersWrap  { display:none; }
.sortingWrap .viewer { text-align: right; }
.sortingWrap .viewer .view {
    overflow: hidden;
    border:0;
    vertical-align: middle;
    width:19px;
    padding: 0 2px;
    height:16px;
    text-indent: -999px;
    margin-right: 4px;
    background-color: transparent;
    background-image: url('//images.salattu.fi/system/images/tuotehaku/icon-views.png');
    background-repeat:  no-repeat;
    background-position: -25px 0;
    opacity:0.5;
}
.sortingWrap .viewer .current {
    opacity:1;
    cursor:default;
}
.sortingWrap .viewer .two { background-position: 2px 0; }
.sortingWrap .viewer .three { background-position: -51px 0; }
.dnsListBottomSortingWrap .dnsCell { width: 50%; }
.sortingWrap .dnsListBackToTop {
    cursor:pointer;
    padding-right: 35px;
    background: url('//images.salattu.fi/system/images/tuotehaku/icon-arrow-up.png') no-repeat 97% center;
    text-align: right;
}

/* -----------------------------------------------------------------------------------------------------------------
Select2 3.4.8 overrides
----------------------------------------------------------------------------------------------------------------- */
.sortingWrap .select2-container { width:100%; }
.sortingWrap .select2-container .select2-choice,
.sortingWrap .select2-container .select2-arrow, 
.select2-drop { 
    border-color: #ddd;
    border-radius: 0; 
    font-weight: 400; 
}
.sortingWrap .select2-container .select2-choice { 
    border:solid 1px #ddd;
    background: -moz-linear-gradient(top, #fff 0%, #f2f2f2 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #fff), color-stop(100%, #f2f2f2));
    background: -webkit-linear-gradient(top, #fff 0%, #f2f2f2 100%);
    background: -o-linear-gradient(top, #fff 0%, #f2f2f2 100%);
    background: -ms-linear-gradient(top, #fff 0%, #f2f2f2 100%);
    background: linear-gradient(to bottom, #fff 0%, #f2f2f2 100%);
    filter:none;
    line-height: 32px;
    height:32px;
}
.sortingWrap .select2-dropdown-open .select2-choice {
    background: -moz-linear-gradient(top, #f2f2f2 0%, #fff 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #f2f2f2), color-stop(100%, #fff));
    background: -webkit-linear-gradient(top, #f2f2f2 0%, #fff 100%);
    background: -o-linear-gradient(top, #f2f2f2 0%, #fff 100%);
    background: -ms-linear-gradient(top, #f2f2f2 0%, #fff 100%);
    background: linear-gradient(to bottom, #f2f2f2 0%, #fff 100%);
}
.sortingWrap .select2-container .select2-arrow { border-left:solid 1px #ddd; }
.sortingWrap .select2-container-multi.select2-container-active .select2-choices {
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    box-shadow:none;
    border: 1px solid #ccc;
}
.sortingWrap .select2-container-multi .select2-choices {
    border: 1px solid #ddd;
}