*{
    padding:0;
    margin:0;
}
img{
    border: 0;
}


input {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

a,button::-moz-focus-inner,button::-moz-focus-outer,input::-moz-focus-inner,input::-moz-focus-outer {
    border: 0;    
    outline: 0;
}
a img{
    border: 0;
}
body{
    font-size: 14px;
    font-family: verdana,sans-serif;
    vertical-align: middle;
    
    --pagewrap-width: 1080px;
    overflow-x: hidden;
    background-color: rgb(77,77,77);
    background-image: url("../../img/noise.png");
    background-repeat: repeat;
}

html.basket body{
    background: white;
}

body.admin{
    background: white;
}

.hidden, [hidden]{
    display: none;
}
.relative{
    position: relative;
}
html body.admin #pagewrap{
    width: 100%;
    margin: 0;
    padding-left:0;
    padding-right:0;
    padding-bottom: 100px;
}

#pagewrap{
    margin: 0 auto;
    width: 1060px;
    width: var(--pagewrap-width);
    position: relative;
    border: 1px solid transparent;
    background-color: white;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
}


#pagewrap.individual-product{
    min-height: 650px;
}

.error-login{
    color: #c0392b;
    background-color: #FFE6E5;
    border: 1px solid #c0392b;
    padding:5px;
}
.error-login .fa {
    padding-right:5px;
    
}

#adminlogin{
    
    display: block;
    width: 270px;
    margin: 0 auto;
    overflow: hidden;
}

#adminlogin fieldset{
    padding: 5px;
}
#adminlogin fieldset span{
    display: block;
    overflow: hidden;
    padding:5px;
}
#adminlogin input {
    text-align:center;
    display: block;
    width: 100%;     
    border: 1px solid lightgray;    
}

#adminlogin input:valid:not([type='submit']){
    background-color: #E5FFE5;
}
#admin-products-list input{
    padding: 3px;
}

#admin-products-list input.partsime {
    width: 98%;
    padding: 1%;
}
#admin-products-list input.dostavchici {
    width: 135px;    
}


td.ime{
    min-width: 220px;
    width:auto;
}

#admin-products-list input.cena {

    text-align: right;

    display: inline-block;
    max-width: 90px;

}
span.st {
    float:right;
    display: inline-block;
    padding-top:3px;
}

span.val{
    line-height: 1em;
    position: relative;
}
#admin-products-list input.nalichnost {
    width: 98%;
}

#admin-products-list input.tip{
    width: 50px;
}
#admin-products-list input.miarka{
        width: calc(100% - 12px);
}
#admin-products-list input.sort{
    width: calc(100% - 20px);
}
#admin-products-list .adding input.sort{
    width: calc(90%);
}
#products tr.changed td,
#admin-products-list tr.changed td{
    border-color: #d78436;
    background: #ffe5b4;
}
#products tr.saved td,
#admin-products-list tr.saved td{
    border-color: rgba(37,204,62,1);
   -webkit-box-shadow: inset 0px 0px 102px -47px rgba(37,204,62,1);
-moz-box-shadow: inset 0px 0px 102px -47px rgba(37,204,62,1);
box-shadow: inset 0px 0px 102px -47px rgba(37,204,62,1);
}

#admin-products-list input.changed {
    /*background-color: #E5FFE5;*/
    border: 1px solid gray;
}

#admin-products-list th.saveall{
    padding: 0 10px;
}

#admin-products-list .save{
   /* pointer-events: none;*/
    color:gray;
   /* background: white; */
   
    border: 1px solid gray;
    padding: 3px 5px;
}


#admin-products-list .changed .save:active{
    margin-left: 1px;
    margin-top: 1px;
    margin-right: -1px;
    margin-bottom: -1px;
    background: darkgreen;
    color: white;
  }

#admin-products-list .changed .save{
    /* pointer-events: inherit; */
    color: black;
    font-weight: bold;
    padding: 3px 3px;
    background: #E5FFE5;
    border: 1px solid black;
}

/* input is not empty */
input[value]:not([value=""]){
    
}

input[type=number]{}

input,textarea,button,select,option{
    background:white;
    color: black;
}

header{
    /*/box-shadow: -1px -4px 15px 10px #f27800;*/
    /*margin-bottom: 10px;*/
    -moz-transition: all 1s;
    -webkit-transition: all 1s;
    transition: all 1s;
    width: 1080px;
    width: calc( var(--pagewrap-width) +  1px);
    margin: 0 auto;
    position: relative;
}
/*header:hover{
    box-shadow: -1px -4px 30px 20px #f27800;
}*/

header .phone{
    float: right;
    color: white;
    text-shadow: 0px 0px 4px orange;
    font-weight: bold;
    text-decoration: none;
    font-size: 24px;
    transition: text-shadow 0.7s ease-out;
}
header .phone:hover{
    text-shadow: 0px 0px 6px white;

}
.clearboth{
    clear:both;
}
header #logo{
    height: 80px;
    background-color: #515151;
    background-image: url('../../img/header.png');
    background-repeat: no-repeat;
    width: 100%;
    display: block;
    position: relative;
}
header #logo a.gotobase{
    width: 81%;
    height: 100%;
    position: absolute;
}
header #logo img{
    
}

#menu-shadow{
    background-image: url(../../img/menu-shadow.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: calc( 100% + 23px);
    height: 6px;
    position: absolute;
    top: 100%;
    left: -13px;
    z-index: 99;
}

nav {
    
    margin-left: -13px;
    margin-right: -10px;
    
    padding-left:10px;
    padding-right:10px;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffa143+0,f27800+100 */
    background: #ffa143; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffa143 0%, #f27800 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ffa143 0%,#f27800 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ffa143 0%,#f27800 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa143', endColorstr='#f27800',GradientType=0 ); /* IE6-9 */

    border-top: 1px solid #c86e00;
}

nav ul{
    display: inline-block;
}

nav li{

    margin-bottom: 6px;
    margin-top: 6px;
    display: inline-block;
    /*border-left: 1px solid white;*/
}

.admin nav ul{
    margin-left: 16px;
}
nav li a {
    padding: 2px 10px;
    display: inline-block;
}
nav li:first-child{
    /*border-left: none;*/
}

/*nav li.active{
     
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
    border-bottom: 1px solid white;
     
}*/

nav li.active{
    -webkit-box-shadow: inset 0px 0px 10px 2px rgba(0,0,0,0.75);
    -moz-box-shadow: inset 0px 0px 10px 2px rgba(0,0,0,0.75);
    box-shadow: inset 0px 0px 10px 2px rgba(0,0,0,0.75);
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;    
    border-left: none;
}

nav li:hover:not(.active){
    -webkit-box-shadow:   1px 1px 1px 1px rgba(0,0,0,0.5);
    -moz-box-shadow:   1px 1px 1px 1px rgba(0,0,0,0.5);
    box-shadow:   1px 1px 1px 1px rgba(0,0,0,0.5);
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;    
    /*border-left: none;*/
}

nav li.active + li {
    border-left: 0px;
}
nav li a{
    font-size: 1.4em;
    color: #fff;
    text-decoration: none;
    outline: 0;
}
nav li a:hover{
    color: #884401;
}
nav li:active{
    background:#ffbd7b;
}

#products{
    width: 100%;
    margin: 41px 0;
}
#products.adding{
    margin-left: -10px;
}

#products tr:nth-child(even) td {
    background-color: #eee;
}

#products td{
    /*border: 1px solid gray;*/
    padding: 0 10px;
    height: 63px;
}



#products tbody {
    width: 1060px;
    width: var(--pagewrap-width);
}
#products thead {
    width: 1060px;
    width: var(--pagewrap-width);
}

#products tr {
    width: 1060px;
    width: var(--pagewrap-width);
}
#products td.pic {
    width: 101px;
     
    padding:0;    
}

td.pic.empty img,
td.pic  img.empty,
td.pic img[src='pictures/empty.png']{
    width: 1px!important;
    height: 1px!important;
}


td.pic img{
    width:100%;
    object-fit: scale-down; /* Do not scale the image */
    object-position: center; /* Center the image within the element */
}

#products td.miarka{
    width:114px;
}
#products td.nalichni{
    width:144px;
}
#products td.dostavchik {
    width:144px;
}
#products td.katalozhen {
    width:150px;
}
#products td.kategoria {
    width:150px;   
}
#products td.sort {
    width:79px;   
}
#products td.tip {
    width: 80px;
    
    padding-left: 12px;
    text-align: center;
}
#products td.tip input.combified{
    margin-left: 2px;
}

.admin #products td.tip,
.admin #products td{
    padding: 0;
    margin: 0;
    text-align: center;
}


#products th {
    padding-right: 18px;
    padding-left: 18px;
    padding-top: 10px;
    padding-bottom: 10px;

    font-size: 1.2rem;
    font-weight: normal;

    border: 1px solid gray;
    position: relative;

}


#products.adding th{
    padding-right: 4px;
    padding-left: 4px;
}

#products th.pic{
    padding: 0;
}

#products th.headerSortDown,#products th.headerSortUp{
    
}
#products th .fas,
#products th .fa {
    visibility: hidden;
    display: inline-block;
    position: absolute;
    right: 3px;
    font-size: 1rem;
    top: 50%;
    margin-top: -8px;
}

#products th.headerSortUp .fa-sort-down{
    visibility: visible;
}

#products th.headerSortDown .fa-sort-up{
    visibility: visible;
    
    
}

#products td.cena{
    text-align: center;
    width: 125px;
}
#products td.cena span{
    margin-bottom: 3px;
    display: inline-block;
}

body #products td.empty {
    text-align: center;
    font-size: 1.3rem;
    width: 100%;
    padding: 10px;
}
.fa-exclamation-triangle{
    color: yellow;
    padding-right: 5px;
    font-size: 1.3rem;
    text-shadow: 1px 1px 5px black;
    
}

#izhod{
    
}

h1 {
    padding: 10px 0px 10px 0px;
}
h2{
    margin-top: 10px;
    margin-bottom: 10px;
}

h2 a{
    color:black;
    text-decoration: none;
}
h2 a:hover{
    text-decoration: underline;
}

.ac_button {
    width: 25px;
    margin-right: -3px;
}

#tablewrap{
    position: relative;
}
/* tablesorter.pageer */
#pager {
    position: absolute;
    top: -40px;
    padding: 10px 0 10px 0;

    text-align: center;
    left: 0;
    right: 0;
    user-select: none;
}
#pager *{
    user-select: none;
}
.admin #pager{
    top: -40px;
}
#pager.scrolled{
    /*background: red;*/
    top:auto;
    bottom: -40px;
}
#pager span {
	padding: 0 5px 0 5px;
}
#pager .prev:active{
    margin-top: 1px;
    margin-bottom:-1px;
    
}
#pager .next:active {
    margin-top: 1px;
    margin-bottom:-1px;
    
}
#pager .prev {
	width: auto;
	margin-right: 5px;
}
#pager .next {
	width: auto;
	margin-left: 5px;
}
#pager .next,#pager .prev,#pager input  {
	/*font-size: 8px;*/
	width: 30px;
        height: 19px;
	border: 1px solid #330000;
	text-align: center;
        vertical-align: middle;
        display: inline-block;
        background: white;
        cursor: pointer;
        padding: 0px;
       
}
#pager .pagedisplay{
    pointer-events: none;
    width: 40px;
}
#pager select:focus{
    background-image:
        linear-gradient(45deg, black 50%, transparent 50%),
        linear-gradient(135deg, transparent 50%, black 50%),
        linear-gradient(to right, #000, #000);
    background-position:
        calc(100% - 3px) calc(.5em + 1px),
        calc(100% - 8px) calc(0.5em + 1px),
        calc(200%) 0.5em;
    background-size:
        5px 5px,
        5px 5px,
        1px 1.5em;
    background-repeat: no-repeat;
    
    outline: 0;
}
#pager select{
    border: 1px solid black;
    display: inline-block;
    height: 21px;
    margin-left: 5px;
    vertical-align: middle;
    padding: 0.0em 1rem 0em 5px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    
    background-image:
        linear-gradient(45deg, transparent 50%, black 50%),
        linear-gradient(135deg, black 50%, transparent 50%)
        ,linear-gradient(to right, #000, #000);
    background-position:
        calc(140% - 20px) calc(.5em + 1px),
        calc(140% - 15px) calc(0.5em + 1px),
        calc(200%) 0.5em;
    background-size:
        5px 5px,
        5px 5px,
        1px 1.5em;
    background-repeat: no-repeat;
    
    
}
#pager select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

#pager .next i,#pager .prev i{
    /*margin-top: 3px;*/
}

/* /tablesorter.pager */

/**
*   Multiselect
*/

.multiselect.kat {
    min-width: 268px;
}
.multiselect {
    min-width:10em;
    width: auto;
    height:12em;
    margin-right: 5px;
    overflow-x:unset;
    overflow-y:auto;
}
.multiselect input[type=checkbox]{
    margin-right: 5px;

} 
.multiselect > label {
    display: flex;
    cursor: pointer;
    white-space: nowrap;
    word-break:keep-all;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;  

    position: relative;
    align-items: stretch;
    justify-content: space-between;
    padding-top: 2px;
    padding-bottom: 2px;
}

.multiselect .val{
    flex-grow: 2;
    line-height: 1;
}

label .count{
    margin-top:-1px;
    right: 0px;
    color:darkgray;
    padding-left:13px;
}

.multiselect label.all{
    border-bottom: 1px dashed black;
}
.multiselect label.all.multiselect-on {
    border-bottom: 1px dashed white;
    }
.multiselect input{
    padding-right: 5px;
}
 
.multiselect-on {
    color:#ffffff;
    background-color:#000099;
}
#filters {
    margin-bottom: 10px;
}
/*#filters.closed{*/
    /*display: none;*/
/*}*/

#filters fieldset{
    display:inline-block;
    padding: 5px 0 5px 5px;
    margin-right: 5px;
    vertical-align: top;
}
#filters fieldset:last-child{
    margin-right: 0px;
}

#filters .cena:first-of-type{
    margin-bottom: 5px;
}
#filters .cena{
    padding-left: 5px;
    width: 75px;
    margin-right: 5px;    
    height: 20px;
}

#filters .nalichnost{
    width: 99px;
    padding-right: 0px;
    padding-left: 3px;
    padding-bottom: 1px;
    margin-right: 5px;
}

#mainfilter{
    width: 385px;
    
    padding: 4px 4px 4px 4px;
    margin: 5px 0;
}

#mainfilterlabel{
    margin-right: -10px;
    position: absolute;
    top: 9px;
    left: 8px;
}

.org.btn {
  background: #ffa200;
  background-image: -webkit-linear-gradient(top, #ffa200, #e67300);
  background-image: -moz-linear-gradient(top, #ffa200, #e67300);
  background-image: -ms-linear-gradient(top, #ffa200, #e67300);
  background-image: -o-linear-gradient(top, #ffa200, #e67300);
  background-image: linear-gradient(to bottom, #ffa200, #e67300);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border: 1px solid transparent;
  border-radius: 5px;
  text-shadow: 1px 1px 3px #000;
  -webkit-box-shadow: 1px 1px 3px #666666;
  -moz-box-shadow: 1px 1px 3px #666666;
  box-shadow: 1px 1px 3px #666666;
  color: #ffffff;
  font-size: 1.2rem;
  line-height: 10px;
  margin: 0 auto;
  padding: 4px 6px 6px 6px;
  display: block;
  text-decoration: none;
}

.org.btn:hover {
  background: #ffd900;
  background-image: -webkit-linear-gradient(top, #ffd900, #e09200);
  background-image: -moz-linear-gradient(top, #ffd900, #e09200);
  background-image: -ms-linear-gradient(top, #ffd900, #e09200);
  background-image: -o-linear-gradient(top, #ffd900, #e09200);
  background-image: linear-gradient(to bottom, #ffd900, #e09200);
  text-decoration: none;
}

.cyan.btn {
  background: #00dede;
  background-image: -webkit-linear-gradient(top, #00dede, #00bfff);
  background-image: -moz-linear-gradient(top, #00dede, #00bfff);
  background-image: -ms-linear-gradient(top, #00dede, #00bfff);
  background-image: -o-linear-gradient(top, #00dede, #00bfff);
  background-image: linear-gradient(to bottom, #00dede, #00bfff);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border: 1px solid transparent;
  border-radius: 5px;
  text-shadow: 1px 1px 3px #000;
  -webkit-box-shadow: 1px 1px 3px #666666;
  -moz-box-shadow: 1px 1px 3px #666666;
  box-shadow: 1px 1px 3px #666666;
  color: #ffffff;
  font-size: 1.2rem;
  line-height: 10px;
  margin: 0 auto;
  padding: 4px 4px 6px 4px;
  display: block;
  text-decoration: none;
}

.cyan.btn:hover {
 background: #00fff7;
  background-image: -webkit-linear-gradient(top, #00fff7, #00e6c0);
  background-image: -moz-linear-gradient(top, #00fff7, #00e6c0);
  background-image: -ms-linear-gradient(top, #00fff7, #00e6c0);
  background-image: -o-linear-gradient(top, #00fff7, #00e6c0);
  background-image: linear-gradient(to bottom, #00fff7, #00e6c0);
  text-decoration: none;
}

.btn:active,
.org.btn:active,.cyan.btn:active{
    position: relative;
    top: 1px;
    left: 1px;
    -webkit-box-shadow: 0px 0px 0px transparent;
    -moz-box-shadow: 0px 0px 0px transparent;
    box-shadow: 0px 0px 0px transparent;
}

.searchgo:active{
    position: relative;
    top:1px;
    left:1px;
}
.searchgo,.searchtoggle{
    -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border: 1px solid #000;
  border-radius: 5px;
  padding-top: 3px; 
  padding-bottom: 3px; 
  padding-left: 6px;
  padding-right: 6px;
  -webkit-box-shadow: 1px 1px 3px #666666;
  -moz-box-shadow: 1px 1px 3px #666666;
  box-shadow: 1px 1px 3px #666666;
  color: black;
  margin-left: 5px;
  cursor: pointer;
  width:33px;
  height:29px;    
}
.searchtoggle{
    vertical-align: middle;
}
.searchtoggle.closed .fa-chevron-up{
    display: none;    
}
.searchtoggle.opened .fa-search{
    display: none;
}

#exampleimage {
    position: relative;
    
    margin: 10px auto;
    
    width: 580px;
    height: 240px;
}
#exampleimage img{
    position: absolute;
    top:0;
    left: 50%;
    margin-left: -290px;
    right: 0;
    width: 580px;
    height: 240px;
    background:white;
    /*z-index: -1;*/
}
#exampleimage img.def{    
    /*z-index: 2;*/
}


.xdebug-var-dump{
    position: relative;
    z-index: 9999999;
}

.admin #kategorii td,.admin #kategorii th{
    padding: 10px;
}
.admin #kategorii td{
    
    border: 2px double #eee;
}

.admin #kategorii tr:nth-child(2n) td {
    
}
.admin #kategorii tr.sub td{
background-color: #eee;
    
}

.cgreen{
    color:green;
}
.cred{
    color:red;
}
pointer,
map,map section,map area {
    cursor: pointer;
    
}


.tiptable h2:hover a{
    text-decoration: underline;
}
.tiptable h2 a{
    color: black;
    text-decoration: none;
}
 
.tiptable {
    margin: 0 auto;
    /* 10 x 100 */
    /*width: 1036px*/
}
.tiptable .tip {
    width: 105px;
    height: 60px;
    padding: 0;
    display: inline-block;
    margin: 0 0 35px;
}
.tiptable .tip a{
    text-decoration: none;
    color: black;
}
.tiptable .tip img{
    margin: 0;
    padding: 0;
    width: 100px;
    height: 100px;
    object-fit: scale-down;
    object-position: center;
}

.tiptable .tip span{
    display: block;
    text-align: center;
}

#gototop.scrolled{
   opacity: 1;
   -webkit-transition: opacity 0.6s ease-out;  /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6  */
          transition: opacity 0.6s ease-out;  /* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+  */
}
#gototop{
   position: fixed;
    bottom: 13px;
    left: 84%;
    width: 76px;
    opacity: 0;
    background: rgba(0,0,0,.5);
    border-radius: 5px;
    padding: 10px;
  -webkit-transition: opacity 0.6s ease-out;  /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6  */
          transition: opacity 0.6s ease-out;  /* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+  */

}
#gototop a{
    text-decoration: none;
    color: white;
}

.t-a-center{
    text-align: center;
}



/*
@media(orientation:portrait) {
   
}
@media(orientation: landscape) {
   
} 
*/



th .mobile{
    display: none;
}
@media (max-width:640px) , (max-width:360px), (max-width:768px), (max-width:1050px){
    #exampleimage{
        width: 100vw;
        overflow-x: hidden;
        overflow-y: hidden;
    }
    #exampleimage img{
        /*left: 0px;*/
        max-width: 100vw;
        height:auto;
        position: absolute;
        left:0;
        right:0;
        margin:initial;
    }
    #exampleimage::after{
        content: "";
        display:block;
        width: 580px;
        height: 265px;
        
    }
    .tiptable .tip,.tiptable .tip img{
        width: 75px;
    }
    .shema img{
        width: 100%;
    }
    #products th{
        padding: 0;
    }
    #products td{
        padding: 0!important;
        word-break: break-word;
    }
    #products td.ime{
        min-width: auto;
    }
    #pagewrap{
        text-align: center;
    }
    #filters{
        display: inline-block;
        text-align: left;
    }

    #filters.hidden{
        display:none;
    }
     th .mobile{
        display: inline-block;
    }
    th .desktop{
        display: none;
    }
    body header{
        width: 100%;
    }
    header #logo{
        background-position-x: -8px;
    }
    h1,h2,h3{
        text-align: center;
    }
     #pagewrap{
         
        padding: 0;
    }
}

@media   (max-width:1050px) {
    body{
        --pagewrap-width: 640px;
    }  
}
 
@media(max-width:360px) {
    body{
        --pagewrap-width: 360px;
    }
    #gototop{
        left: 70%;
    }     
    body #products td.pic {
        width :67px;
    }
    .pic img{
        width:100%;
        object-fit: scale-down; /* Do not scale the image */
  object-position: center; /* Center the image within the element */
    }
   th.desktop,td.desktop{
        display: none;
    }
    #products td{
        font-size: 12px;
    }
    #products th{
        font-size: 1rem;
    }

    #mainfilter{
        width: 260px;
    }
}

@media(max-width:640px) {
    body{

        --pagewrap-width: 640px;
    }
    #pagewrap{
        width: auto;
    }
}

@media only screen and (min-width: 640px){
    .hideOnWideByDef{
        display:none;
    }
}

/* @@05-02-2020 */

@media(max-width:639px) {
    #exampleimage {
        display: none;
    }
    nav#main ul li {
        display: block;
    }
    nav#main ul.collapsed li {
        display:none;
    }
    nav#main ul.collapsed li.navtoggler {
        display: block;
    }
    nav#main ul li#home-icon{
        display:none;
    }
}


body .fa-3 {
    font-size: 4em;
}
body .fa-2 {
    font-size: 2em;
}

#products  td.pic > input[type="button"]{
    display: block;
    margin: 0 auto;
}

.visuallyhidden{
    position: absolute !important;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    padding:0 !important;
    border:0 !important;
    height: 1px !important;
    width: 1px !important;
    overflow: hidden;
    opacity: 0.1%;
}
.main-page-kat-tile-holder{
    text-align: center;
    min-height: calc(100vh - 145px);
}
.main-page-kat-tile:hover{
    -webkit-box-shadow:  5px 5px 5px -1px rgba(0,0,0,0.3);
    -moz-box-shadow:  5px 5px 5px -1px rgba(0,0,0,0.3);
    box-shadow:  5px 5px 5px -1px rgba(0,0,0,0.3);
}
.main-page-kat-tile{
    display: inline-block;
    margin: 10px;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;


    border-top: 2px solid #ffa143;
    border-bottom: 4px solid #d46a00;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffa143), to(#d46a00));
    background-image: -webkit-linear-gradient(#ffa143, #d46a00);
    background-image: -moz-linear-gradient(#ffa143, #d46a00), -moz-linear-gradient(#ffa143, #d46a00);
    background-image: -o-linear-gradient(#ffa143, #d46a00), -o-linear-gradient(#ffa143, #d46a00);
    background-image: linear-gradient(#ffa143, #d46a00), linear-gradient(#ffa143, #d46a00);
    -moz-background-size: 2px 100%;
    background-size: 2px 100%;
    background-position: 0 0, 100% 0;
    background-repeat: no-repeat;

}
.main-page-kat-tile:first-child{
    margin-left: auto;
}
.main-page-kat-tile:last-child{
    margin-right: auto;
}

.main-page-kat-tile:hover a{
    text-decoration: underline;
}
.main-page-kat-tile a{
    color: black;
    text-decoration: none;
    padding: 20px;
    display: inline-block;
}

.main-page-kat-tile img{
    display: block;
    margin: 0 auto;
}

.toggle-ajax{
    cursor: pointer;
}


.btnridge{

    border: 1px solid #000;

    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 6px;
    padding-right: 6px;
    -webkit-box-shadow: 1px 1px 3px #666666;
    -moz-box-shadow: 1px 1px 3px #666666;
    box-shadow: 1px 1px 3px #666666;
    color: black;
    margin-left: 5px;


    height:29px;
}

.btnridge[disabled]{
    border: 1px solid #999;
}


.btnround{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.slightboxshadow{
    -webkit-box-shadow: 1px 1px 3px #666666;
    -moz-box-shadow: 1px 1px 3px #666666;
    box-shadow: 1px 1px 3px #666666;
}


.prod-edit,.prod-extended-edit{
    border: 2px solid #eee;
    margin-left: 16px;
    min-width: 30vw;
}

.prod-extended-edit tr td ,
.prod-edit tr td {
    box-shadow: inset 0px 1px 21px -9px transparent;

}
.prod-extended-edit tr:hover td ,
.prod-edit tr:hover td {

    box-shadow: inset 0px 1px 21px -9px orange;

}
.prod-extended-edit  tr:nth-child(2n) td ,
.prod-edit tr:nth-child(2n) td {

    background-color: #f9f9f9;

}
.prod-extended-edit td, .prod-extended-edit th,
.prod-edit td,.prod-edit th {

    position: relative;
    padding: 5px;
    border: 2px double #efefef;

}

.dynamic-gen-input{
    border: 1px solid black;
    /*            display: inline-block; */
    box-sizing: border-box;
    min-width: 0;
    width: 100%;

    background:transparent;

    font-size: 16px;
    height:26px;
    padding-left:5px;

    margin: 0;
    line-height: 18px;
}

.saved{
    border-color: rgba(37,204,62,1);
    -webkit-box-shadow: inset 0px 0px 102px -47px rgba(37,204,62,1);
    -moz-box-shadow: inset 0px 0px 102px -47px rgba(37,204,62,1);
    box-shadow: inset 0px 0px 102px -47px rgba(37,204,62,1);
}

.processing{
    border-color: hsl(58, 58%, 54%);
    -webkit-box-shadow: inset 0px 0px 102px -47px  hsl(58, 58%, 54%);
    -moz-box-shadow: inset 0px 0px 102px -47px  hsl(58, 58%, 54%);
    box-shadow: inset 0px 0px 102px -47px  hsl(58, 58%, 54%);
}


.warn{
    border-color: hsl(20, 68%, 48%);
    -webkit-box-shadow: inset 0px 0px 102px -47px hsl(20, 68%, 48%);
    -moz-box-shadow: inset 0px 0px 102px -47px hsl(20, 68%, 48%);
    box-shadow: inset 0px 0px 102px -47px hsl(20, 68%, 48%);
}


.inputable.input-created{
    padding:0;
}

td.save {

    width: 70px;
    height: 30px;
    padding: 0;

}
td.save button.savebtn {
    padding: 0;
    margin:0;
    width: 100%;

}


.pointer {
    cursor: pointer;
}

.pointer.disabled{
    cursor:not-allowed;
}

.fas,
.fa {
    vertical-align: middle;
}

table#products tbody tr td a{
    color: black;
    text-decoration: none;
}

table#products tbody tr td:hover a{
    text-decoration: underline;
    color: black;
}


.product-mainprops,
.product-properties
{
    border: 0px;
    border-spacing: 2px;
    border-collapse: separate;

}

.product-properties td,
.product-mainprops td{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
     box-shadow: -1px -1px 1px hsl(38.8, 100%, 88%), 1px 1px 1px rgba(190, 190, 190,1);
    padding: 2px 10px;
}

.gallery-with-thumbs {
    width: 430px;
    min-height: 400px;


    float: right;
    display: flex;
    justify-content: center;
    flex-direction: column;


    border-radius: 6px;
    margin-top:10px;

    overflow: hidden;
}


.gallery-thumb{
    width: 96px;
    height: 96px;
    border: 2px solid rgba(0,0,0,0.1);
    border-radius: 4px;
}

.gallery-thumb.active,
.gallery-thumb:hover{
    border-color: #f98d22;
}

.gallery-thumb img {
    width: 100%;
    object-fit: scale-down;
    object-position: center;
    max-height: 96px;
    max-width: 96px;

    flex:1;
}

.gallery-thumb a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;

    white-space: nowrap;
    text-align: center;
    width: 96px;
    height: 96px;
}


.gallery-thumb-list{
    flex: 1;

    display: flex;

    flex-wrap: wrap;

    align-content: space-between;

    justify-content: normal;

    min-height: 205px;
    padding: 0px 6px 6px;

}

.gallery-selected-small{
    min-width: 300px;
    min-height: 300px;
    flex: 3;
    flex-shrink: 0;
}

.gallery-selected-small .gallery-main-click{
    width: 100%; height: 100%;
    position: relative;
    display: inline-block;
}

.gallery-selected-small .gallery-main-click img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 100%;
    max-height: 100%;
}
.gallery-selected-small .gallery-main-click span{
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translate(-50%, 0);
    color: black;
    background: rgba(255,255,255,0.5);
    width: 100%;
    text-align: center;
}

.gallery-selected-small .gallery-main-click span.empty{
    display: none;
}

.gallery-selected-small .imgwrap{

    height: 300px;
    width: 430px;
    overflow: hidden;
}


.gray-round-border{
    border: 2px solid #c0c0c0;
    border-radius: 5px;
    -webkit-box-shadow: 1px 0px 1px #bcbcbc;
    box-shadow: 1px 0px 1px #bcbcbc;
}

.hover-box-shadow-light:hover,.box-shadow-light{
    box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.3),-1px -1px 13px -9px rgba(0,0,0,0.4);
}

/*button.delete-prop{*/

/*}*/

/*button.delete {*/

/*}*/


.fileicon{
    vertical-align: middle;

    padding-right:3px;
}


.placeholder-img{

}

#admin-kats-list{
    padding: 30px;
}

#admin-kats-list td{
    padding-top:5px;
    padding-bottom:5px;
    line-height: 1;
}

#admin-kats-list .ac_container{
    display: inline-block;
}

#admin-kats-list input[type=text]{
    padding: 3px;
}

.visuallydisabled{
    background: lightgrey;
    color: #212121;
    cursor:not-allowed;
    filter:saturate(0%);
}

button.delete {
    border: 0px;
    cursor: pointer;
}