img{
    height: auto;
    max-width: 100%;
}
.YellowLetters{
    color: #e69e2d;
}
/* GRAFIK */
.GraficiTop{
    display: block;
    position: relative;
    font-size: 0;
    border-bottom: 1px solid #5c5c5c;
    line-height: 1;
}
.LogOut{
    display: inline-block;
    width: 80px;
    height: 80px;
    font-size: 30px;
    color: #e69e2d;
    text-align: center;
    line-height: 80px;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    border-left: 1px solid #5c5c5c;
    vertical-align: middle;
}
.LogOut:hover{
    color: #333;
    background: #e69e2d;
}
.SviGrafici{
    display: block;
    position: relative;
    font-size: 0;
    border-top: 1px solid #5c5c5c;
}
.SelectGrafik,
.SelectGrafikBack,
.SelectGrafikForward{
    display: inline-block;
    vertical-align: top;
    padding: 0;
    line-height: 70px;
    height: 70px;
    overflow: hidden;
    font-size: 20px;
    border: 1px solid #5c5c5c;
    border-top: 0;
    border-bottom: 0;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    margin-left: -1px;
    margin-top: -1px;
    width: calc(14.287% - 1px);
    text-align: center;
}
.SelectAction{
    display: inline-block;
    vertical-align: top;
    padding: 0;
    line-height: 70px;
    height: 70px;
    overflow: hidden;
    font-size: 20px;
    border: 1px solid #5c5c5c;
    border-top: 0;
    border-bottom: 0;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    margin-left: -1px;
    margin-top: -1px;
    width: calc(12.5% - 1px);
    text-align: center;
}
.HiddenNormal,
.HiddenPromena, 
.TransferTables .HideOnTransfer,
.PromenaTables .HideOnTransfer{
    display: none;
}
.TransferTables .HiddenNormal{
    display: inline-block;
}
.PromenaTables .HiddenPromena{
    display: inline-block;
}
.PromenaTables .Sto{
    display: none;
}
.PromenaTables .Zauzet{
    display: block;
    background: #e69e2d;
    color: #333;
}
.PromenaTables .OdabranStoZaPromenu{
    background: #333;
    color: #e69e2d;
}
.PromenaTables .Zauzet:after{
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    font:normal normal normal 14px/1 FontAwesome;
    font-size:inherit;
    text-rendering:auto;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    content:"\f00d";
    background: red;
}
.PromenaTables .OdabranStoZaPromenu:after{
    content:"\f00c";
    background: green;
    vertical-align: middle;
    display:inline-block;
    font:normal normal normal 14px/1 FontAwesome;
    font-size:inherit;
    text-rendering:auto;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size: 20px;
    line-height: 30px;
}
.SelectGrafik span,
.SelectAction span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.SelectGrafik:hover,
.SelectAction:hover,
.SelectGrafikBack:hover,
.SelectGrafikForward:hover{
    background: #e69e2d;
    color: #333;
}
.SelectedGrafik{
    color: #e69e2d;
}
.GraficiMiddle{
    display: block;
    position: relative;
    text-align: center;
}
.GraficiBottom{
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 140px;
}
.GrafikImg{
    position: relative;
    display: block;
    height: auto;
}
.ListaGrafika{
    display: inline-block;
    vertical-align: middle;
    width: 87.5%;
}
.Sto{
    display: block;
    position: absolute;
    background: green;
    overflow: hidden;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.1s ease;
}
.Sto:hover{
    opacity: 0.8;
}
.ShowGrafik{
    display: inline-block;
    position: relative;
}
.StoNaziv{
    margin: 15px;
    margin-bottom: 0;
    margin-right: 5px;
    white-space: nowrap;
    overflow: hidden;
    width: calc(100% - 20px);
    display: block;
    position: relative;
    font-size: 12px;
}
.StoVrednost{
    margin: 0 15px;
    margin-bottom: 0;
    margin-right: 5px;
    white-space: nowrap;
    overflow: hidden;
    width: calc(100% - 20px);
    display: block;
    position: relative;
    font-size: 15px;
}
.Zauzet{
    background: red;
}
.Tudji{
    background: gray;
}
.Zakljucan{
    background: red url(../images/lock-solid.svg) no-repeat center center / 50%;
}
.GraficiLogo{
    display: inline-block;
    vertical-align: middle;
    width: 200px;
}
.GraficiLogo img{
    display: block;
    width: calc(100% - 20px);
    padding: 10px;
}
.GraficiUser{
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    width: calc(50% - 140px);
    text-align: center;
}
.GraficiClock{
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    width: calc(50% - 141px);
    text-align: center;
}
/* GRAFIK END */
/* PORUDZBINA*/
.Porudzbina{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    font-size: 0;
    display: none;
    background: #333;
}
.PorudzbinaHeader{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    border-bottom: 1px solid #5c5c5c;
}
.PorudzbinaContent{
    position: absolute;
    top: 81px;
    left: 0;
    width: 100%;
    height: calc(100% - 81px);
}
.PorudzbinaSto,
.PorudzbinaUser,
.PorudzbinaStalniGost,
.PorudzbinaVremeDatum{
    width: calc(25% - 70px);
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
}
.PorudzbinaVremeDatum{
    width: calc(25% - 71px);
    font-size: 0;
}
.PorudzbinaVreme,
.PorudzbinaDatum{
    display: inline-block;
    vertical-align: middle;
    font-size: 15px;
    width: 50%;
    text-align: center;
    white-space: nowrap;
}
.PorudzbinaLogo{
    display: inline-block;
    vertical-align: middle;
    width: 200px;
}
.PorudzbinaLogo img{
    display: block;
    width: calc(100% - 20px);
    padding: 10px;
}
.PorudzbinaLeft{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 30%;
    height: 100%;
    border-right: 1px solid #5c5c5c;
}
.PorudzbinaRight{
    display: block;
    position: absolute;
    top: 0;
    left: calc(30% + 1px);
    width: calc(70% - 1px);
    height: 100%;
}
.PorudzbinaArtikli,
.PorudzbinaArtikliHeader{
    display: block;
    position: relative;
}
.PorudzbinaArtikliHeader{
    border-bottom: 1px solid #5c5c5c;
    border-top: 1px solid #5c5c5c;
}
.PorudzbinaArtikliNaziv{
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
    padding: 5px;
    width: calc(50% - 10px);
    text-align: left;
}
.PorudzbinaArtikliKolicina{
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
    padding: 5px;
    width: calc(20% - 10px);
    text-align: center;
}
.PorudzbinaArtikliIznos{
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
    padding: 5px;
    width: calc(30% - 10px);
    text-align: right;
}
.PorudzbinaArtikliBody{
    display: block;
    position: relative;
    overflow: auto;
}
.PorudzbinaTotalKolicina{
    position: relative;
    width: 100%;
    border-top: 1px solid #5c5c5c;
}
.PorudzbinaTotal,
.PorudzbinaTotalPay,
.PorudzbinaPopust{
    display: block;
    position: relative;
    background: #333;
}
.PorudzbinaTotalTitle{
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 10px);
    font-size: 14px;
    padding: 5px;
}
.PorudzbinaTotalValue{
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 10px);
    text-align: right;
    font-size: 14px;
    padding: 5px;
}
.PorudzbinaNumerik{
    display: block;
    position: absolute;
    font-size: 0;
    bottom: 0;
    left: 0;
    width: 100%;
}
.NumerikInputHolder{
    display: block;
    position: relative;
}
.NumerikInput{
    width: calc(100% - 16px);
    border: 0;
    padding: 8px;
    font-size: 17px;
}

.NumerikButton{
    display: inline-block;
    vertical-align: middle;
    width: calc(25% - 1px);
    line-height: 50px;
    height: 50px;
    border: 1px solid #5c5c5c;
    margin-left: -1px;
    margin-top: -1px;
    transition: all 0.5s ease;
    color: #fff;
    text-align: center;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}
.NumerikButton:hover{
    background: #e69e2d;
    color: #333;
}
.NumerikButton span{
    font-size: 14px;
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.CanBeHidden{
    display: none;
}
.ExpandedKeyboard .CanBeHidden{
    display: block;
}
.ExpandedKeyboard .HiddeOnOpen{
    display: none;
}
.HiddeOnClosed{
    display: none;
}
.ExpandedKeyboard .HiddeOnClosed{
    display: inline-block;
}
.PorudzbinaArtikliDugmad{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    border-collapse: collapse;
    width: 100%;
    border-top: 1px solid #5c5c5c;
}
.StoTura{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
}
.ReloadTura{
    font-size: 14px;
    position: absolute;
    top: 0;
    right: 0;
    width: 28px;
    height: 28px;
    background: #e69e2d;
    color: #333;
    line-height: 28px;
    text-align: center;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
}
.ReloadTura:hover{
    color: #333;
    background: #fff;
}
.Rastavljanje .ReloadTura{
    display: none;
}
.StoTuraTitle{
    display: inline-block;
    position: relative;
    font-size: 12px;
    text-align: left;
    width: calc(50% - 10px);
    padding: 5px;
    vertical-align: bottom;
    border-bottom: 1px solid #5c5c5c;
    cursor: pointer;
}
.RastavljanjeRight .StoTuraTitle,
.RastavljanjeRight .StoTuraVreme{
    display: none;
}
.StoTuraVreme{
    display: inline-block;
    position: relative;
    font-size: 11px;
    text-align: right;
    width: calc(50% - 10px);
    padding: 5px;
    vertical-align: bottom;
    border-bottom: 1px solid #5c5c5c;
    cursor: pointer;
}
.PoruceniArtikal{
    display: block;
    position: relative;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}
.OpisArtikla{
    display: block;
    position: absolute;
    top: 0;
    left: calc(50% - 30px);
    width: 30px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    background: #fff;
    color: #333;
    transition: all 0.5s ease;
}
.OpisArtikla:hover{
    color: #e69e2d;
}
.OpisIcon{
    font-size: 14px;
}
.OpisContent{
    display: none;
}
.DodatniArtikal{
    width: calc(100% - 20px);
    padding-left: 20px;
}
.PoruceniArtikal:hover,
.OdabraniArtikal{
    background: #e69e2d;
    color: #333;
}
.PorudzbinaRightDugmad{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 74px);
    overflow: hidden;
}
.PorudzbinaRightAkcije,
.PorudzbinaQuickAkcije{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    border-top: 1px solid #5c5c5c;
    border-collapse: collapse;
}
.PayQuickPayment .PorudzbinaRightAkcije{
    display: none;
}
.PorudzbinaQuickAkcije{
    display: none;
}
.PayQuickPayment .PorudzbinaQuickAkcije{
    display: block;
}
.PorudzbinaRightAkcija{
    display: table-cell;
    width: 0.1%;
    text-align: center;
    line-height: 70px;
    height: 73px;
    font-size: 20px;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
    transition: all 0.5s ease;
    position: relative;
}
.DostavaActive .PorudzbinaRightAkcija[dugmeaction="Rastavljanje"]{
    display: none;
}
.PorudzbinaRightAkcija span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 100%;
}
.PrazanRegular{
    display: block;
}
.PayForDelivery .PrazanRegular{
    display: none;
}
.PrazanDelivery{
    display: none;
}
.PayForDelivery .PrazanDelivery{
    display: block;
}
.PorudzbinaRightAkcija:hover{
    background: #e69e2d;
    color: #333;
}
.PorudzbinaRightAkcija:after{
    position: absolute;
    content: "";
    width: 100%;
    height: calc(100% - 4px);
    border-left: 1px solid #5c5c5c;
    left: 0;
    top: 2px;
}
.PorudzbinaRightAkcija:first-child:after{
    display: none;
}
.Grupe, .PodGrupe, .Artikli{
    display: block;
    position: relative;
    overflow: hidden;
}
.Grupa,
.BackGrupe,
.ForwardGrupe{
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    width: 20%;
    text-align: center;
    position: relative;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
}
.Artikli,
.PodGrupe{
    border-top: 1px solid #5c5c5c;
    padding-top: 2px;
}
.PodGrupa, .Artikal,
.BackArtikli,
.ForwardArtikli,
.BackPodGrupe,
.ForwardPodGrupe, 
.NazadNaPodgrupe{
    display: inline-block;
    vertical-align: middle;
    font-size: 18px;
    width: 25%;
    text-align: center;
    position: relative;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
}
.Grupa:hover,
.GrupaSelected,
.PodGrupa:hover,
.PodGrupaSelected,
.Artikal:hover,
.NazadNaPodgrupe:hover{
    background: #e69e2d;
    color: #333;
}
.Grupa:after,
.PodGrupa:after,
.Artikal:after{
    position: absolute;
    content: "";
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    border-top: 1px solid #5c5c5c;
    border-bottom: 1px solid #5c5c5c;
    left: 2px;
    top: 0;
}
.Grupa:before,
.PodGrupa:before,
.Artikal:before,
.NazadNaPodgrupe:before{
    position: absolute;
    content: "";
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    border-left: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
    left: 2px;
    top: 2px;
}
.Grupa span,
.PodGrupa span,
.Artikal span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.GostiAkcije,
.RastavljanjeGosti{
    display: block;
    position: relative;
    font-size: 0;
}
.RastavljanjeGosti{
    border-bottom: 1px solid #5c5c5c;
}
.PayQuickPayment .GostiAkcije,
.PayForDelivery .GostiAkcije,
.RadBezGostiju{
    display: none;
}
.GostAkcija,
.RastavljanjeGostAkcija{
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    line-height: 18px;
    padding: 10px 0;
    width: calc(12.5% - 1px);
    border-right: 1px solid #5c5c5c;
    border-bottom: 1px solid #5c5c5c;
    text-align: center;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.NewGostAkcija{
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    line-height: 18px;
    padding: 10px 0;
    width: calc(12.5% - 1px);
    border-right: 1px solid #5c5c5c;
    border-bottom: 1px solid #5c5c5c;
    text-align: center;
    cursor: pointer;
    transition: all 0.5s ease;
    color: #e69e2d;
    font-size: 20px;
    font-weight: bold;
    user-select: none;
    -webkit-user-select: none;
}
.GostAkcija:hover,
.ActiveGostAkcija,
.NewGostAkcija:hover,
.RastavljanjeGostAkcija:hover{
    background: #e69e2d;
    color: #333;
}
.GostArtikli{
    display: none;
}
.ActiveGostArtikli{
    display: block;
}
/* PORUDZBINA END */
/* AKTIVNI STOLOVI */
.AktivniStolovi{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
}
.AktivniStoloviLevo{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 201px);
    height: 100%;
    font-size: 0;
    border-right: 1px solid #5c5c5c;
}
.AktivniStoloviDesno{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 100%;
    font-size: 0;
}
.AktivniStoloviPotvrdi,
.AktivniStoloviGore,
.AktivniStoloviDole,
.AktivniStoloviOtkazi{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
}
.AktivniStoloviPotvrdi:hover,
.AktivniStoloviGore:hover,
.AktivniStoloviDole:hover,
.AktivniStoloviOtkazi:hover{
    background: #e69e2d;
    color: #333;
}
.AktivniStoloviHeader{
    display: block;
    position: absolute;
    white-space: nowrap;
    border-bottom: 1px solid #5c5c5c;
    width: 100%;
    padding: 5px 0;
}
.AktivniStoloviOperater{
    display: inline-block;
    vertical-align: top;
    width: calc(60% - 10px);
    font-size: 16px;
    padding: 0 5px;
}
.AktivniStoloviSto{
    display: inline-block;
    vertical-align: top;
    width: calc(40% - 11px);
    font-size: 16px;
}
.AktivniStoloviDesno span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.AktivniStoloviBody{
    display: block;
    position: absolute;
    top: 35px;
    width: 100%;
    height: calc(100% - 35px);
    overflow: auto;
}
.AktivniStoloviRed{
    border-bottom: 1px solid #5c5c5c;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.AktivniStoloviRed:hover,
.AktivniStoloviSelected{
    background: #e69e2d;
    color: #333;
}
/* AKTIVNI STOLOVI END */
/* OPISI */
.OpisPorudzbine{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    background: #333;
    display: none;
}
.OpisPorudzbineContent{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 250px);
}
.OpisPorudzbineHeader{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    border-bottom: 1px solid #5c5c5c;
}
.OpisPorudzbineHeaderStavka{
    display: inline-block;
    position: relative;
    width: 50%;
    text-align: center;
    font-size: 16px;
    padding: 20px 0;
    transition: all 0.5s ease;
    cursor: pointer;
}
.OpisPorudzbineHeaderStavka:first-child{
    width: calc(50% - 1px);
    border-right: 1px solid #5c5c5c;
}
.OpisPorudzbineOdabranaStavka,
.OpisPorudzbineHeaderStavka:hover{
    background: #e69e2d;
    color: #333;
}
.OpisPorudzbineBody{
    height: calc(100% - 65px);
    top: 64px;
    width: 100%;
    position: absolute;
    left: 0;
}
.OpisPorudzbineBodyStavka{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.ArtikalOpisiTop{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 20px);
    height: calc(50% - 21px);
    padding: 10px;
    overflow: auto;
    border-bottom: 1px solid #5c5c5c;
}
.ArtikalOpisiBottom{
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 50%;
    overflow: auto;
    font-size: 0;
}
.PredefinisaniOpis{
    display: inline-block;
    vertical-align: top;
    padding: 10px 15px;
    border: 1px solid #5c5c5c;
    margin: 10px;
    font-size: 16px;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
}
.PredefinisaniOpis:hover{
    background: #e69e2d;
    color: #333;
}

.TuraOpisiTop{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    overflow: auto;
    padding: 10px;
}
.OpisPorudzbineKeyboard{
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    height: 250px;
    font-size: 0;
}
.QwertyKeys{
    font-size: 18px;
    width: calc(10% - 1px);
    text-align: center;
    display: inline-block;
    vertical-align: top;
    border: 1px solid #5c5c5c;
    margin-left: -1px;
    margin-top: -1px;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    line-height: 50px;
    height: 50px;
}
.QwertyKeys:hover{
    background: #e69e2d;
    color: #333;
}
.SpaceVal{
    width: calc(80% - 1px);
}
.BiggerButtonQwerty{
    width: calc(20% - 1px);
}
.NewLineArtikal{
    position: absolute;
    top: calc(30% + 89px);
    right: 0;
    width: 100px;
    border: 1px solid #5c5c5c;
    text-align: center;
    font-size: 18px;
    height: 40px;
    line-height: 40px;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.NewLineTura{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100px;
    border: 1px solid #5c5c5c;
    text-align: center;
    font-size: 18px;
    height: 40px;
    line-height: 40px;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.NewLineArtikal:hover,
.NewLineTura:hover{
    background: #e69e2d;
    color: #333;
}
/* OPISI END */
/*NAPLATA*/
.Naplata{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    background: #333;
    width: 100%;
    height: 100%;
}
.NaplataTop{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border-bottom: 1px solid #5c5c5c;
}
.NaplataLogo{
    display: inline-block;
    width: 201px;
    vertical-align: middle;
}
.NaplataLogo img{
    width: calc(100% - 20px);
    padding: 10px;
    display: block;
}
.NaplataSto,
.NaplataKorisnik,
.NaplataVreme{
    display: inline-block;
    vertical-align: middle;
    width: calc(33.33% - 98px);
}
.NaplataMiddle{
    display: block;
    position: absolute;
    top: 80px;
    left: 0;
    width: 100%;
    height: 235px;
    border-bottom: 1px solid #5c5c5c;
}
.NaplataLeft{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 33.33%;
    height: 100%;
    font-size: 0;
    overflow: hidden;
}
.ArtikliZaNaplatu{
    display: block;
    position: absolute;
    top: 80px;
    left: 0;
    width: 33.33%;
    overflow: hidden;
    height: auto;
    background: #333333;
    border-bottom: 1px solid #5c5c5c;
    border-top: 1px solid #5c5c5c;
    transition: all 0.5s ease;
}
.ArtikliZaNaplatuTitle{
    display: block;
    position: relative;
    font-size: 16px;
    text-align: center;
    border-bottom: 1px solid #5c5c5c;
}
.ArtikliZaNaplatuSadrzaj{
    display: block;
    position: relative;
    height: 200px;
    overflow: auto;
    width: 100%;
    transition: all 0.5s ease;
    color: #7c7c7c;
}
.ArtikliZaNaplatu .PoruceniArtikal:hover{
    background: transparent;
    color: #7c7c7c;
}
.NaplataCenter{
    display: block;
    position: absolute;
    top: 0;
    font-size: 0;
    left: 33.33%;
    width: calc(33.33% - 2px);
    border-left: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
    height: 100%;
    overflow: hidden;
}
.NaplataRight{
    display: block;
    position: absolute;
    font-size: 0;
    top: 0;
    left: calc(66.66% + -1px);
    width: calc(33.33% - 2px);
    border-left: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
    height: 100%;
    overflow: hidden;
}
.NaplataDetalji,
.PopustiDetalji{
    display: block;
    position: relative;
    padding: 10px;
    font-size: 0;
}
.NaplataDetalji:nth-child(odd),
.PopustiDetalji:nth-child(odd){
    background: #484848;
}
.NaplataDetaljiTitle,
.PopustiDetaljiTitle{
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    width: 50%;
}
.NaplataDetaljiValue,
.PopustiDetaljiValue{
    display: inline-block;
    vertical-align: middle;
    font-size: 18px;
    width: 50%;
    text-align: right;
    border: 0;
    background: transparent;
    color: #fff;
    padding: 3px 0;
}
.NaplataOpcije{
    display: block;
    position: absolute;
    top: 316px;
    width: 100%;
    height: calc(100% - 386px);
    border-bottom: 1px solid #5c5c5c;
}
.CrnoNaplata,
.BeloNaplata{
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 1px);
    margin-left: -1px;
    margin-top: -1px;
    border: 1px solid #5c5c5c;
    font-size: 16px;
    text-align: center;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
    transition: all 0.5s ease;
    position: relative;
}
.CrnoSifra{
    display: none;
}
.BeloNaplata{
    width: calc(100% - 1px);
}
.CrnoNaplata:hover,
.BeloNaplata:hover,
.NaplataNumeric:hover{
    background: #e69e2d;
    color: #333;
}
.CrnoNaplata:after,
.BeloNaplata:after{
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    content: "";
    border-top: 3px solid #e69e2d;
    transition: all 0.4s ease;
    border-bottom:1px solid #333;
}
.SelectedNaplata:after{
    width: 100%;
}
.CrnoNaplata span,
.BeloNaplata span,
.NaplataNumeric span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 100%;
}
.KombinovanoActivated .BeloNaplata[belo-opcija="FAKTURA"]{
    display: none;
}
.NaplataNumeric{
    display: inline-block;
    vertical-align: top;
    width: calc(33.33% - 1px);
    margin-left: -1px;
    margin-top: -1px;
    border: 1px solid #5c5c5c;
    font-size: 16px;
    text-align: center;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
    transition: all 0.5s ease;
    position: relative;
}
.NaplataBottom{
    display: block;
    position: absolute;
    top: calc(100% - 70px);
    left: 0;
    width: 100%;
    font-size: 0;
}
.NaplataButton{
    display: table-cell;
    vertical-align: middle;
    line-height: 70px;
    height: 70px;
    border: 1px solid #5c5c5c;
    font-size: 18px;
    width: 0.1%;
    text-align: center;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
    position: relative;
}
.NaplataButton:hover{
    background: #e69e2d;
    color: #333;
}
.NaplataButton span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.NaplataButton:after{
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 3px;
    background: #e69e2d;
    content: "";
    transition: all 0.4s ease;
    border-bottom:1px solid #333;
}
.SelectedOption:after,
.SelectedPredracunOption:after{
    width: 100%;
}
.KombinovanoValue{
    display: none;
    position: relative;
    width: 100%;
    padding: 10px 0;
    font-size: 18px;
    text-align: center;
    border: 0;
    background: #5c5c5c;
    color: #fff;
}
.BeloNaplata:hover .KombinovanoValue{
    color: #333;
}
.KombinovanoActivated .KombinovanoValue{
    display: block;
}
.NaplataOpcije .NaplataLeft,
.NaplataOpcije .NaplataCenter,
.NaplataOpcije .NaplataRight{
    display: inline-block;
    vertical-align: bottom;
    height: auto;
    top: initial;
    bottom: 0;
}
/*NAPLATA END*/
/* RASTAVLJANJE */
.Rastavljanje{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
}
.RastavljanjeHeader{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    border-bottom: 1px solid #5c5c5c;
}
.RastavljanjeSto,
.RastavljanjeKorisnik,
.RastavljanjeVreme{
    width: calc(33.33% - 93px);
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
}
.RastavljanjeVreme{
    width: calc(33.33% - 95px);
}
.RastavljanjeLogo{
    display: inline-block;
    vertical-align: middle;
    width: 200px;
}
.Rastavljanje img{
    display: block;
    width: calc(100% - 20px);
    padding: 10px;
}
.RastavljanjeMiddle{
    display: block;
    position: absolute;
    top: 81px;
    width: 100%;
    height: calc(100% - 151px);
}

.RastavljanjeBottom{
    display: block;
    position: absolute;
    top: calc(100% - 70px);
    width: 100%;
    border-collapse: collapse;
}
.TransferAction{
    display: table-cell;
    width: 0.1%;
    height: 70px;
    line-height: 70px;
    text-align: center;
    border: 1px solid #5c5c5c;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.4s ease;
    font-size: 18px;
}
.TransferAction span{
    line-height: 1;
    vertical-align: middle;
    display: inline-block;
    width: 100%;
}
.TransferAction:hover{
    background: #e69e2d;
    color: #333;
}

.RastavljanjeLeft{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: calc(50% - 100px);
    overflow: auto;
}
.RastavljanjeRight{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: calc(50% - 100px);
    overflow: auto;
}
.RastavljanjeCenter{
    display: block;
    position: absolute;
    top: 0;
    height: 100%;
    left: calc(50% - 100px);
    border-left: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
    width: 200px;
    border-collapse: collapse;
    font-size: 0;
}
.RastavljanjeAction{
    display: block;
    position: relative;
    width: 100%;
    border-bottom: 1px solid #5c5c5c;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
    transition: all 0.5s ease;
}
.RastavljanjeAction:hover{
    background: #e69e2d;
    color: #333;
}
.RastavljanjeKolicina,
.StornoPassword,
.RastavljanjePassword,
.FiksniPopust{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    line-height: 100vh;
    text-align: center;
    background: #333;
}
.RastavljanjeKolicinaInner,
.StornoPasswordInner,
.RastavljanjePasswordInner,
.FiksniPopustInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    border: 1px solid #5c5c5c;
    width: 320px;
    max-width: 100%;
    border-collapse: collapse;
    font-size: 0;
    text-align: center;
}
.RastavljanjeKolicinaInput,
.StornoInput,
.RastavljanjePassInput,
.FiksniPopustValue{
    display: block;
    position: relative;
    border: 0;
    padding: 20px 10px;
    width: calc(100% - 20px);
    background: transparent;
    color: #fff;
    border-bottom: 1px solid #5c5c5c;
}
.StornoKey,
.RastavljanjeKey,
.RastavljanjePassKey,
.FiksniPopustKey{
    display: inline-block;
    vertical-align: middle;
    width: calc(33.33% - 1px);
    border: 1px solid #5c5c5c;
    font-size: 16px;
    margin-left: -1px;
    height: 50px;
    line-height: 50px;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
}
.RastavljanjeKey:hover,
.RastavljanjePassKey:hover,
.StornoKey:hover,
.FiksniPopustKey:hover{
    background: #e69e2d;
    color: #333;
}
.RastavljanjeKey:last-child,
.FiksniPopustKey:last-child{
    width: calc(66.66% - 1px);
}
.StornoKey:last-child,
.RastavljanjePassKey:last-child{
    width: calc(100% - 1px);
}

.StornoKeys,
.RastavljanjeKeys,
.RastavljanjePassKeys,
.FiksniPopustKeys{
    display: block;
    width: 100%;
}
/* RASTAVLJANJE END*/
/* PROMENA OEPERATERA */
.PromenaOperatera{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    text-align: center;
    line-height: 100vh;
}
.PromenaOperateraInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 320px;
    max-width: 100%;
    border: 1px solid #5c5c5c;
}
.Operater{
    display: block;
    position: relative;
    padding: 15px;
    border-bottom: 1px solid #5c5c5c;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
    font-size: 15px;
}
.Operater:hover{
    background: #e69e2d;
    color: #333;
}
.OdabraniOperater{
    color: #e69e2d;
    background: #333;
}
.PromenaOperateraOdustani{
    display: block;
    position: relative;
    padding: 15px;
    border-bottom: 1px solid #5c5c5c;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
    font-size: 18px;
    color: #e69e2d;
}
.PromenaOperateraOdustani:hover{
    background: #e69e2d;
    color: #333;
}
.SifraOperatera{
    display: block!important;
}
.SifraOperateraInput{
    display: block;
    position: relative;
    width: calc(100% - 20px);
    padding: 10px;
    border: 0;
    color: #fff;
    background: #333;
    border-bottom: 1px solid #5c5c5c;
}
.PromenaKeys{
    display: block;
    position: relative;
    font-size: 0;
}
.PromenaKey{
    display: inline-block;
    vertical-align: middle;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    width: calc(33.33% - 1px);
    border-bottom: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.PromenaKey:hover{
    background: #e69e2d;
    color: #333;
}
.PromenaKey:last-child{
    border: 0;
    width: 100%;
}
.PopUpTitle{
    display: block;
    position: relative;
    font-size: 16px;
    text-align: center;
    border-bottom: 1px solid #5c5c5c;
    padding: 10px 0;
}
/* PROMENA OEPERATERA END */
/* USLUZENI GOSTI */
.UsluzeniGosti, .OtkljucavanjeStola{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    text-align: center;
    line-height: 100vh;
}
.UsluzeniGostiInner, .OtkljucavanjeStolaInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 320px;
    max-width: 100%;
    border: 1px solid #5c5c5c;
}
.BrojPosluzenihGostiju, .OtkljucavanjeStolaMedjuzbir{
    display: block;
    position: relative;
    width: calc(100% - 20px);
    padding: 10px;
    border: 0;
    color: #fff;
    background: #333;
    border-bottom: 1px solid #5c5c5c;
}
.GostiKeys, .OtkljucavanjeKeys{
    display: block;
    position: relative;
    font-size: 0;
}
.GostiKey, .OtkljucavanjeKey{
    display: inline-block;
    vertical-align: middle;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    width: calc(33.33% - 1px);
    border-bottom: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.GostiKey:hover, .OtkljucavanjeKey:hover{
    background: #e69e2d;
    color: #333;
}
.GostiKey:last-child, .OtkljucavanjeKey:last-child{
    border: 0;
    width: 100%;
}
/* USLUZENI GOSTI END*/
.StalniGosti{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    display: none;
}
.StalniGostiKeyboard{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 0;
}
.StalniGostiKeyboard .QwertyKeys{
    line-height: 50px!important;
    height: 50px!important;
}
.StalniGostiTop{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 255px);
}
.SearchStalniGosti{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.StalniGostiLeft{
    display: block;
    position: absolute;
    left: 0;
    width: calc(100% - 201px);
    height: 100%;
    font-size: 0;
    border-right: 1px solid #5c5c5c;
}
.FindGuest, .SearchGuests{
    display: inline-block;
    vertical-align: top;
    padding: 20px 10px;
    width: calc(50% - 22px);
    border: 1px solid #5c5c5c;
    margin: 0;
    background: #333;
    color: #fff;
    font-size: 16px;
    border-top: 0;
}
.SearchResults{
    display: block;
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    height: calc(100% - 60px);
    overflow: auto;
}
.SearchResults thead td{
    font-size: 14px;
    padding: 5px;
    font-weight: bold;
}
.SearchResults td{
    font-size: 14px;
    padding: 5px;
    border-bottom: 1px solid #5c5c5c;
}
.StalniGostiRight{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 100%;
    overflow: hidden;
}
.GrupeGostiju{
    display: block;
    position: relative;
    font-size: 18px;
    border-bottom: 1px solid #5c5c5c;
    text-align: center;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}
.GrupeGostiju:hover{
    background: #e69e2d;
    color: #333;
}
.GrupeGostiju span{
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    line-height: 1;
}
.CreateStalniGosti{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    background: #333;
    height: 100%;
    display: none;
}
.CreateStalniGosti label{
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 30px);
    padding: 15px;
}
.CreateStalniGosti span{
    display: block;
    position: relative;
    font-size: 14px;
}
.CreateStalniGosti input{
    display: block;
    position: relative;
    font-size: 16px;
    padding: 10px;
    width: calc(100% - 20px);
    color: #000;
}
.CreateStalniGosti select{
    display: block;
    position: relative;
    font-size: 16px;
    padding: 10px;
    width: 100%;
    color: #000;
}
.SearchStalniGosti tbody tr{
    transition: all 0.5s ease;
    cursor: pointer;
}
.SearchStalniGosti tr.AlwaysHidden{
    display: none!important;
}
.SearchStalniGosti tbody tr{
    display: none;
}
.SearchStalniGosti tbody tr:hover,
.SearchStalniGosti tbody tr.SelectedGost{
    background: #e69e2d;
    color: #333;
}
/* GOTOVINSKI */
.Gotovinski{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    display: none;
}
.GotovinskiRacuni{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.PrikazGotovinski{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 201px);
    height: 100%;
    overflow: auto;
}
.AkcijeGotovinski,
.GotovinskiKupciAkcije{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 200px;
    border-left: 1px solid #5c5c5c;
    overflow: hidden;
}
.GotovinskiRacun{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    display: none;
}
.FindGotovinski{
    display: inline-block;
    position: relative;
    width: calc(50% - 121px);
    padding: 15px 10px;
    border: 0;
    font-size: 16px;
    border-bottom: 1px solid #5c5c5c;
    background: transparent;
    color: #fff;
}
.BrojIseckaGotovinski{
    display: inline-block;
    position: relative;
    width: calc(50% - 120px);
    padding: 15px 10px;
    border: 0;
    font-size: 16px;
    border-bottom: 1px solid #5c5c5c;
    border-left: 1px solid #5c5c5c;
    background: transparent;
    color: #fff;
}
.GotovinskiKupci{
    display: block;
    position: absolute;
    top: 50px;
    left: 0;
    width: calc(100% - 201px);
    height: calc(100% - 50px);
    overflow: auto;
}
.GotovinskaTastatura{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 255px;
    font-size: 0;
}
.ListaGotovinskih{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 255px);
    font-size: 0;
}
.KreiranjeGotovinskog{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 255px);
    font-size: 0;
    overflow: auto;
    display: none;
    background: #333;
}
.CreateGotovinski label{
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 20px);
    padding: 10px;
}
.CreateGotovinski span{
    font-size: 14px;
    display: block;
    position: relative;
}
.CreateGotovinski input{
    display: block;
    position: relative;
    font-size: 16px;
    padding: 10px;
    width: calc(100% - 20px);
    color: #000;
}
.AkcijaGotovinski,
.GotovinskiKupciAkcija{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
}
.AkcijaGotovinski span,
.GotovinskiKupciAkcija span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 100%;
}
.AkcijaGotovinski:hover,
.GotovinskiKupciAkcija:hover{
    color: #333;
    background: #e69e2d;
}
.Gotovinski thead td{
    font-weight: bold;
    font-size: 14px;
    padding: 5px;
}
.Gotovinski tbody td{
    font-size: 14px;
    padding: 5px;
    border-top: 1px solid #5c5c5c;
}
.Gotovinski tbody tr{
    cursor: pointer;
    transition: all 0.5s ease;
}
.Gotovinski tbody tr:hover,
.SelectedRacun,
.SelectedGotovinski{
    background: #e69e2d;
    color: #333;
}
/* GOTOVINSKI END */
/* ADMIN MENI */
.AdminMeni, .AdminMeniPodesavanja{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    font-size: 0;
    display: none;
    overflow: auto;
}
.AdminMeniStavka{
    display: inline-block;
    padding: 0 20px;
    width: calc(50% - 41px);
    text-align: center;
    font-size: 18px;
    transition: all 0.5s ease;
    cursor: pointer;
    border-right: 1px solid #5c5c5c;
    border-bottom: 1px solid #5c5c5c
}
.AdminMeniStavka span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 100%;
}
.AdminMeniStavka:hover{
    background: #e69e2d;
    color: #333;
}
.OdaberiDatum{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    line-height: 100vh;
    text-align: center;
    background: #333;
    display: none;
}
.OdaberiDatumInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 320px;
    border: 1px solid #5c5c5c;
    max-width: calc(100% - 2px);
    font-size: 0;
}
.OdaberiDatum label{
    display: inline-block;
    position: relative;
    width: 50%;
    cursor: pointer;
}
.OdaberiDatum span{
    display: block;
    text-align: center;
    font-size: 14px;
    padding-top: 10px;
}
.OdaberiDatum input{
    display: block;
    padding: 10px;
    width: calc(100% - 20px);
    border: 0;
    font-size: 16px;
    background: transparent;
    color: #fff;
    border-bottom: 1px solid #5c5c5c;
    text-align: center;
}
.PotvrdiDatum{
    display: block;
    position: relative;
    font-size: 16px;
    line-height: 1;
    padding: 10px 0;
    cursor: pointer;
    transition: all 0.5s ease;
    background: #e69e2d;
    color: #333;
    border-bottom: 1px solid;
}
.PotvrdiDatum:hover{
    color: #e69e2d;
    background: #333;
}
.OtkaziDatum{
    display: block;
    position: relative;
    font-size: 16px;
    line-height: 1;
    padding: 10px 0;
    cursor: pointer;
    transition: all 0.5s ease;
    color: #e69e2d;
}
.OtkaziDatum:hover{
    color: #fff;
}
.SviRacuni, .JournalData{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    display: none;
}
.SviRacuniLeft, .JournalDataLeft{
    display: block;
    position: absolute;
    top: 45px;
    left: 0;
    width: calc(100% - 201px);
    height: calc(100% - 45px);
    overflow: auto;
}
.SviRacuniRight, .JournalDataRight{
    display: block;
    position: absolute;
    top: 45px;
    right: 0;
    width: 200px;
    border-left: 1px solid #5c5c5c;
    height: calc(100% - 45px);
    overflow: auto;
    overflow: hidden;
}
.SviRacuniAkcija, .JournalDataAkcija{
    display: block;
    height: calc(33vh - 1px);
    line-height: calc(33vh - 1px);
    text-align: center;
    border-bottom: 1px solid #5c5c5c;
    cursor: pointer;
    transition: all 0.5s ease;
    font-size: 18px;
}
.SviRacuniAkcija:hover,
.JournalDataAkcija:hover{
    background: #e69e2d;
    color: #333;
}
.SviRacuni td,
.JournalData td{
    border-bottom: 1px solid #5c5c5c;
    padding: 5px;
    font-size: 14px;
}
.SviRacuni tr,
.JournalData tr{
    transition: all 0.5s ease;
    cursor: pointer;
}
.SviRacuni tr.SelectedRacun,
.SviRacuni tbody tr:hover,
.JournalData tr.SelectedJournal,
.JournalData tbody tr:hover
{
    background: #e69e2d;
    color: #333;
}
.OdaberiTipStampe,
.OdaberiTipStampePopis{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    line-height: 100vh;
    text-align: center;
    font-size: 0;
    display: none;
}
.OdaberiTipStampeInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 400px;
    max-width: calc(100% - 2px);
    max-height: calc(100% - 2px);
    border: 1px solid #5c5c5c;
}
.UgasiTipStampe,
.UgasiTipStampePopis{
    display: block;
    position: relative;
    font-size: 16px;
    line-height: 70px;
    height: 70px;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    border-top: 1px solid #5c5c5c;
}
.UgasiTipStampe:hover,
.UgasiTipStampePopis:hover{
    background: #e69e2d;
    color: #333;
}
.TipStampeOdabir,
.TipStampePopisOdabir{
    display: inline-block;
    vertical-align: top;
    height: 80px;
    line-height: 80px;
    text-align: center;
    width: calc(50% - 1px);
    font-size: 20px;
    cursor:pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
}
.TipStampeOdabir:nth-child(2),
.TipStampePopisOdabir:nth-child(3){
    border-right: 1px solid #5c5c5c;
}
.TipStampeOdabir:hover,
.TipStampePopisOdabir:hover{
    background: #e69e2d;
    color: #333;
}
.OdaberiOdeljenja{
    display: block;
    position: relative;
    font-size: 0;
}
.SelectOdeljenja{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    font-size: 16px;
    padding: 15px;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}
.SelectedOdeljenje{
    background: #e69e2d;
    color: #333;
}
.TriTrojke{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #333;
    overflow: hidden;
    display: none;
}
.TriTrojkeLeft{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 201px);
    height: 100%;
    border-right: 1px solid #5c5c5c;
}
.TriTrojkeRight{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    text-align: center;
}
.TriTrojkeAction{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
    transition: all 0.5s ease;
}
.TriTrojkeAction:hover{
    color: #333;
    background: #e69e2d;
}
.TriTrojkeAction span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    font-size: 18px;
}
.TriTrojkeContent{
    display: block;
    position: relative;
    height: calc(100vh - 45px);
    overflow: auto;
}
.ReportTable{
    position: relative;
    margin-bottom: 40px;
    width: 100%;
}
.ReportTable td,
.ReportTable th{
    text-align: right;
    padding: 5px;
    border-bottom: 1px solid #5c5c5c;
}
.ReportTable td:first-child,
.ReportTable th:first-child{
    text-align: left;
}
.ReportTable th{
    background: #5c5c5c;
}
/* ADMIN MENI END */
/* FAKTURA */
.Faktura{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    display: none;
}
.FakturaKupciAkcije{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 200px;
    border-left: 1px solid #5c5c5c;
    overflow: hidden;
}
.FindKupca{
    display: inline-block;
    position: relative;
    width: calc(100% - 221px);
    padding: 15px 10px;
    border: 0;
    font-size: 16px;
    border-bottom: 1px solid #5c5c5c;
    background: transparent;
    color: #fff;
}
.FakturaKupci{
    display: block;
    position: absolute;
    top: 50px;
    left: 0;
    width: calc(100% - 201px);
    height: calc(100% - 50px);
    overflow: auto;
}
.FakturaTastatura{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 255px;
    font-size: 0;
}
.ListaFaktura{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 255px);
    font-size: 0;
}
.KreiranjeFakture{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 255px);
    font-size: 0;
    overflow: auto;
    display: none;
    background: #333;
}
.CreateFaktura label{
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 20px);
    padding: 10px;
}
.CreateFaktura span{
    font-size: 14px;
    display: block;
    position: relative;
}
.CreateFaktura input{
    display: block;
    position: relative;
    font-size: 16px;
    padding: 10px;
    width: calc(100% - 20px);
    color: #000;
}
.FakturaKupciAkcija{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
}
.FakturaKupciAkcija span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 100%;
}
.FakturaKupciAkcija:hover{
    color: #333;
    background: #e69e2d;
}
.Faktura thead td{
    font-weight: bold;
    font-size: 14px;
    padding: 5px;
}
.Faktura tbody td{
    font-size: 14px;
    padding: 5px;
    border-top: 1px solid #5c5c5c;
}
.Faktura tbody tr{
    cursor: pointer;
    transition: all 0.5s ease;
}
.Faktura tbody tr:hover,
.SelectedFaktura{
    background: #e69e2d;
    color: #333;
}
.FakturaBi{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    text-align: center;
    line-height: 100vh;
}
.FakturaBiInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 320px;
    max-width: 100%;
    border: 1px solid #5c5c5c;
}
.FakturaBrojIsecka{
    display: block;
    position: relative;
    width: calc(100% - 20px);
    padding: 10px;
    border: 0;
    color: #fff;
    background: #333;
    border-bottom: 1px solid #5c5c5c;
}
.FakturaBiKeys{
    display: block;
    position: relative;
    font-size: 0;
}
.FakturaBiKey{
    display: inline-block;
    vertical-align: middle;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    width: calc(33.33% - 1px);
    border-bottom: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.FakturaBiKey:hover{
    background: #e69e2d;
    color: #333;
}
.FakturaBiKey:last-child{
    border: 0;
    width: 100%;
}
/* FAKTURA END */
/* MENI */
.Meni,
.CreateMenu{
    position: fixed;
    top: 0;
    left: 0;
    background: #333;
    width: 100%;
    height: 100%;
    display: none;
}
.MeniLeft{
    position: absolute;
    top: 0;
    left: 0;
    width: 60%;
    height: 100%;
}
.MeniRight{
    position: absolute;
    top: 0;
    right: 0;
    width: calc(40% - 1px);
    height: 100%;
    border-left: 1px solid #5c5c5c;
}
.MeniList{
    position: absolute;
    top: 45px;
    width: 100%;
    height: calc(100% - 126px);
    overflow: auto;
}
.MenuItem{
    display: block;
    position: relative;
    padding: 10px;
    transition: all 0.5s ease;
    cursor: pointer;
    border-bottom: 1px solid #5c5c5c;
}
.MenuItem:hover,
.MenuSelected{
    background: #e69e2d;
    color: #333;
}
.MeniActions{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    border-top: 1px solid #5c5c5c;
}
.MeniAction{
    display: inline-block;
    vertical-align: middle;
    line-height: 80px;
    height: 80px;
    width: 33.33%;
    text-align: center;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.5s ease;
}
.MeniAction:hover{
    background: #e69e2d;
    color: #333;
}
.MeniAction:nth-child(2){
    width: calc(33.33% - 2px);
    border-left: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
}
.MeniAction span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    user-select: none;
    -webkit-user-select: none;
}
.MenuInput{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    font-size: 0;
}
.MenuInput span{
    display: inline-block;
    position: relative;
    padding: 10px;
    width: 100px;
    font-size: 14px;
    vertical-align: middle;
}
.MenuInput input{
    display: inline-block;
    vertical-align: middle;
    padding: 10px 10px;
    width: calc(100% - 140px);
    border: 0;
    font-size: 20px;
    text-align: right;
    background: transparent;
    color: #fff;
}
.MenuKeys{
    position: absolute;
    top: 180px;
    left: 0;
    font-size: 0;
    width: 100%;
    height: calc(100% - 260px);
    border-collapse: collapse;
    overflow: hidden;
}
.MenuKey{
    display: inline-block;
    font-size: 18px;
    vertical-align: middle;
    width: calc(33.33% - 1px);
    text-align: center;
    cursor: pointer;
    transition: all 0.5s ease;
    border: 1px solid #5c5c5c;
    margin-left: -1px;
    margin-bottom: -1px;
    user-select: none;
    -webkit-user-select: none;
}
.MenuKey:hover{
    background: #e69e2d;
    color: #333;
}
.NewMenuName{
    display: block;
    position: relative;
    font-size: 18px;
    padding: 10px;
    width: calc(100% - 40px);
    border: 0;
    border-bottom: 1px solid #5c5c5c;
    background: transparent;
    color: #fff;
    margin: 50px 10px;
}
.CreateMenuKeyboard{
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    user-select: none;
    -webkit-user-select: none;
}
.CloseMenu{
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(50% - 1px);
    border-right: 1px solid #5c5c5c;
    border-top: 1px solid #5c5c5c;
    line-height: 80px;
    height: 80px;
    text-align: center;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.ConfirmMenu{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50%;
    border-top: 1px solid #5c5c5c;
    line-height: 80px;
    height: 80px;
    text-align: center;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.CloseMenu:hover,
.ConfirmMenu:hover{
    background: #e69e2d;
    color: #333;
}
/* MENI END */
/* DOSTAVA */
.Dostava{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    display: none;
}
.DostavaKeyboard{
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    user-select: none;
    -webkit-user-select: none;
}
.DostavaTop{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 255px);
}
.DostavaLeft{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 201px);
    height: 100%;
}
.DostavaSearch{
    display: block;
    position: relative;
    font-size: 16px;
    padding: 15px;
    width: calc(100% - 30px);
    border: 0;
    background: transparent;
    color: #fff;
    border-bottom: 1px solid #5c5c5c;
}
.DostavaSearch::placeholder{
    color: #666;
}
.DostavaLista{
    display: block;
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    height: calc(100% - 50px);
    overflow: auto;
}
.DeliveriesTable{
    width: 100%;
    font-size: 16px;
}
.DeliveriesTable td{
    padding: 10px;
    position: relative;
}
.DeliveryRow{
    transition: all 0.5s ease;
    cursor: pointer;
}
.DeliveryRow:nth-child(odd){
    background: #484848;
}
.CurrentDelivery{
    color: #e69e2d;
}
.DeliveryRow:hover, .DeliveriesTable .SelectedDelivery{
    background: #e69e2d;
    color: #333;
}
.DostavaAkcije{
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 200px;
    border-left: 1px solid #5c5c5c;
    height: 100%;
    overflow: hidden;
}
.DostavaAkcija{
    display: block;
    position: relative;
    text-align: center;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
    border-bottom: 1px solid #5c5c5c;
}
.SelectedDeliveryFilter:after{
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 3px;
    background: #e69e2d;
}
.DostavaAkcija span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    font-size: 18px;
}
.DostavaAkcija:hover{
    background: #e69e2d;
    color: #333;
}
.PretragaDostava,
.ListaAdresa{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    text-align: center;
    line-height: 100vh;
}
.PretragaDostavaInner,
.ListaAdresaInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 320px;
    max-width: 100%;
    border: 1px solid #5c5c5c;
}
.DostavaTelefon{
    display: block;
    position: relative;
    width: calc(100% - 20px);
    padding: 10px;
    border: 0;
    color: #fff;
    background: #333;
    border-bottom: 1px solid #5c5c5c;
    font-size: 16px;
}
.DostavaKeys{
    display: block;
    position: relative;
    font-size: 0;
}
.DostavaKey{
    display: inline-block;
    vertical-align: middle;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    width: calc(33.33% - 1px);
    border-bottom: 1px solid #5c5c5c;
    border-right: 1px solid #5c5c5c;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.DostavaKey:hover{
    background: #e69e2d;
    color: #333;
}
.DostavaKey:last-child{
    border: 0;
    width: 100%;
}
.NovaAdresa{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    display: none;
}
.NovaAdresaTop{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 255px);
}
.DostavaAdresaKeyboard{
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    font-size: 0;
}
.InsertDostava{
    display: block;
    position: absolute;
    width: calc(100% - 201px);
    height: 100%;
    top: 0;
    left: 0;
    font-size: 0;
    overflow: auto;
}
.NovaAdresaAkcije{
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 200px;
    height: 100%;
    border-left: 1px solid #5c5c5c;
    text-align: center;
    overflow: hidden;
}
.NovaAdresaAkcija{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.NovaAdresaAkcija:hover{
    background: #e69e2d;
    color: #333;
}
.DostavaZaglavlje,
.DostavaZaglavljeEdit{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
}
.DostavaAdrese,
.DostavaAdreseEdit{
    display: block;
    position: relative;
}
.DostavaAdresa{
    display: block;
    position: relative;
    text-align: left;
    font-size: 0;
    border-bottom: 1px solid #5c5c5c;
    cursor: pointer;
    transition: all 0.5s ease;
}
.DostavaAdresaTitle{
    font-size: 14px;
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 61px);
    padding: 10px;
}
.SelectedDostavaAdresa,
.DostavaAdresa:hover{
    background: #e69e2d;
    color: #333;
}
.DostavaAdresaUredi{
    display: inline-block;
    vertical-align: top;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 18px;
    border-left: 1px solid #5c5c5c;
    text-align: center;
    cursor: pointer;
    transition: all 0.5s ease;
    background: #333;
    color: #fff;
}
.DostavaAdresaUredi:hover{
    background: #e69e2d;
    color: #333;
}
.AdreseAkcije{
    display: block;
    position: relative;
}
.AdreseAkcija{
    position: relative;
    font-size: 16px;
    padding: 12px 0;
    border-bottom: 1px solid #5c5c5c;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    transition: all 0.5s ease;
}
.BiggerButton{
    padding: 25px 0;
    font-size: 20px;
}
.AdreseAkcija:hover{
    background: #e69e2d;
    color: #333;
}
.NovaAdresa label{
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 30px);
    margin: 15px;
}
.NovaAdresa input{
    padding: 10px;
    border: 0;
    font-size: 16px;
    background: transparent;
    color: #fff;
    border-bottom: 1px solid #5c5c5c;
    width: calc(100% - 20px)
}
.NovaAdresa input::placeholder{
    color: #666;
}
.DostavaIme{
    display: block;
    position: relative;
    font-size: 18px;
    padding: 10px;
    padding-bottom: 0;
}
.DostavaTelefonOdabir{
    font-size: 16px;
    display: block;
    position: relative;
    padding: 10px;
}
.StareDostave{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    display: none;
}
.StareDostaveBottom{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    border-top: 1px solid #5c5c5c;
}
.StareDostaveTop{
    display: block;
    position: absolute;
    top: 45px;
    height: calc(100% - 116px);
    width: 100%;
    overflow: auto;
}
.StaraDostava{
    display: block;
    position: relative;
    clear: both;
}
.StaraDostavaTitle{
    display: block;
    position: relative;
    font-size: 0;
    line-height: 1;
    border-top: 1px solid #5c5c5c;
    border-bottom: 1px solid #5c5c5c;
}
.StaraDostavaText{
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 104px);
    font-size: 16px;
    padding: 10px;
}
.StaraDostavaTitle span{
    display: inline-block;
    vertical-align: top;
    width: 40px;
    border: 1px solid #5c5c5c;
    font-size: 18px;
    text-align: center;
    height: 40px;
    line-height: 40px;
    transition: all 0.5s ease;
    cursor: pointer;
}
.PonoviDostavu{
    color: #e69e2d;
}
.StaraDostavaTitle span:hover{
    background: #e69e2d;
    color: #333;
}
.StaraDostavaArtikli{
    display: none;
    position: relative;
    transition: all 0.5s ease;
}
.StaraDostavaPrikazano .StaraDostavaArtikli{
    display: block;
}
.StaraDostavaArtikal{
    display: block;
    position: relative;
    padding: 10px;
}
.StaraDostavaArtikal:nth-child(odd){
    background: #484848;
}
.StaraDostavaKolicina{
    text-align: right;
    float: right;
}
.StaraDostavaDugme{
    display: inline-block;
    vertical-align: middle;
    height: 70px;
    line-height: 70px;
    text-align: center;
    width: calc(33.33% - 1px);
    border-right: 1px solid #5c5c5c;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}
.StaraDostavaDugme span{
    display: inline-block;
    width: 100%;
    font-size: 20px;
}
.StaraDostavaDugme:hover{
    background: #e69e2d;
    color: #333;
}
/* DOSTAVA END */
/* ARTIKLI EXPANDER */
.ArtikliExpander{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    text-align: center;
    line-height: 100vh;
    display: none;
}
.ArtikliExpanderInner{
    display: inline-block;
    vertical-align: middle;
    width: 400px;
    max-width: calc(100% - 2px);
    border: 1px solid #5c5c5c;
    line-height: 1;
    max-height: 100%;
    height: 400px;
    position: relative;
}
.ArtikliExpanderItem{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    text-align: left;
    font-size: 0;
}
.ArtikliExpanderItemNaziv{
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 55px);
    font-size: 14px;
    padding: 10px 5px;
}
.ArtikliExpanderItemKolicina{
    display: inline-block;
    vertical-align: top;
    text-align: right;
    width: 40px;
    padding: 10px 5px;
    padding-left: 0;
    font-size: 14px;
}
.ArtikliExpanderList{
    height: calc(100% - 108px);
    overflow: auto;
    width: 100%;
    border-bottom: 1px solid #5c5c5c;
    display: block;
    position: absolute;
    top: 37px;
}
.ArtikliExpanderClose{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    line-height: 70px;
    height: 70px;
    font-size: 18px;
    cursor: pointer;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
}
.ArtikliExpanderClose:hover{
    background: #e69e2d;
    color: #333;
}
.ExpandInvoiceItems,
.PrintOrderItems{
    float: right;
    color: #e69e2d;
    padding: 0 5px;
    border: 1px solid;
    cursor: pointer;
    transition: all 0.5s ease;
}
.SelectedDelivery .ExpandInvoiceItems,
.DeliveryRow:hover .ExpandInvoiceItems,
.SviRacuni tr:hover .ExpandInvoiceItems,
.SviRacuni tr.SelectedRacun .ExpandInvoiceItems,
.SelectedDelivery .PrintOrderItems,
.DeliveryRow:hover .PrintOrderItems{
    color: #333;
}
.ExpandInvoiceItems:hover,
.PrintOrderItems:hover{
    background: #333;
    color: #e69e2d!important;
}
.ExpandInvoiceItems:after,
.PrintOrderItems:after{
    content: "";
    clear: both;
    position: relative;
    display: block;
}
/* ARTIKLI EXPANDER END */
/* BRZA NAPLATA */
.brzaNaplata .GraficiTop,
.brzaNaplata .GraficiMiddle,
.brzaNaplata .GraficiBottom{
    display: none!important;
}
.brzaNaplata .Porudzbina{
    display: block!important;
}
/* BRZA NAPLATA END */
/*PODESAVANJA KASE */
.PodesavanjeKase{
    position: fixed;
    top: 0;
    left: 0;
    background: #333;
    height: 100%;
    width: 100%;
    display: none;
}
.PodesavanjeKaseTitle{
    display: block;
    position: relative;
    font-size: 18px;
    text-align: center;
    line-height: 40px;
    border-bottom: 1px solid #5c5c5c;
}
.PodesavanjeForma{
    display: block;
    position: relative;
    height: calc(100% - 41px);
    overflow: auto;
    width: calc(100% - 201px);
    font-size: 0;
}
.PodesavanjaAkcije{
    display: block;
    position: absolute;
    right: 0;
    top: 41px;
    height: 100%;
    text-align: center;
    width: 200px;
    border-left: 1px solid #5c5c5c;
}
.PodesavanjaAkcijePotvrdi,
.PodesavanjaAkcijeOtkazi{
    display: block;
    position: relative;
    font-size: 0;
    cursor: pointer;
    transition: all 0.5s ease;
}
.PodesavanjaAkcijePotvrdi{
    border-bottom: 1px solid #5c5c5c;
}
.PodesavanjaAkcijeOtkazi span,
.PodesavanjaAkcijePotvrdi span{
    line-height: 1;
    vertical-align: middle;
    display: inline-block;
    font-size: 18px;
}
.PodesavanjaAkcijePotvrdi:hover,
.PodesavanjaAkcijeOtkazi:hover{
    background: #e69e2d;
    color: #333;
}
.PodesavanjeLabel{
    display: inline-block;
    vertical-align: top;
    width: 33.33%;
    border-bottom: 1px solid #5c5c5c;
    padding-top: 15px;
}
.PodesavanjeLabel span{
    display: block;
    position: relative;
    font-size: 14px;
    padding: 5px 0;
}
.PodesavanjeLabel input{
    display: block;
    position: relative;
    width: calc(100% - 11px);
    padding: 10px 5px;
    font-size: 16px;
    border: 0;
    border-left: 1px solid #5c5c5c;
}
.PodesavanjeLabel select{
    display: block;
    position: relative;
    width: 100%;
    padding: 10px 5px;
    font-size: 16px;
    border: 0;
    border-left: 1px solid #5c5c5c;
}
/* PODESAVANJA KASE END */
/* PODESAVANJA GRUPA */
.PodesavanjeGrupa,
.PodesavanjePodGrupa,
.PodesavanjeStampaca,
.PodesavanjeArtikala,
.PodesavanjeKonobara,
.PodesavanjeStopa{
    background: #333;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: none;
}
.PodesavanjeGrupaTitle{
    display: block;
    width: calc(100% - 200px);
    position: absolute;
    top: 0;
    left: 0;
    font-size: 18px;
    text-align: center;
    border-bottom: 1px solid #5c5c5c;
    height: 30px;
    line-height: 30px;
}
.PodesavanjeGrupaAkcije,
.PodesavanjePodGrupaAkcije,
.PodesavanjeStampacaAkcije,
.PodesavanjeArtikalaAkcije,
.PodesavanjeKonobaraAkcije,
.PodesavanjeStopaAkcije{
    display: block;
    position: absolute;
    right: 0;
    width: 200px;
    border-left: 1px solid #5c5c5c;
    height: 100%;
}
.PodesavanjeGrupaLista,
.PodesavanjePodGrupaLista,
.PodesavanjeStampacaLista,
.PodesavanjeKonobaraLista,
.PodesavanjeStopaLista{
    display: block;
    position: absolute;
    top: 30px;
    left: 0;
    width: calc(100% - 200px);
    overflow: auto;
    height: calc(100% - 30px);
}
.PodesavanjeGrupe,
.PodesavanjePodGrupe,
.PodesavanjeStampac,
.PodesavanjeKonobar,
.PodesavanjeStope{
    display: block;
    position: relative;
    font-size: 16px;
    padding: 5px;
    border-bottom: 1px solid #5c5c5c;
    transition: all 0.5s ease;
    cursor: pointer;
    line-height: 24px;
}
.PodesavanjeArtikal{
    position: relative;
    font-size: 16px;
    border-bottom: 1px solid #5c5c5c;
    transition: all 0.5s ease;
    cursor: pointer;
    line-height: 24px;
}
.PodesavanjeArtikalHeader{
    font-size: 16px;
    border-bottom: 1px solid #5c5c5c;
    transition: all 0.5s ease;
    cursor: pointer;
    line-height: 24px;
    color: #5c5c5c;
}

.PodesavanjeArtikal td,
.PodesavanjeArtikalHeader td{
    padding: 5px;
}
.PodesavanjeGrupe:hover,
.SelectedPodesavanjeGrupe,
.PodesavanjePodGrupe:hover,
.SelectedPodesavanjePodGrupe,
.PodesavanjeStampac:hover,
.SelectedPodesavanjeStampac,
.SelectedPodesavanjeArtikal,
.PodesavanjeArtikal:hover,
.SelectedPodesavanjeKonobar,
.PodesavanjeKonobar:hover{
    background: #e69e2d;
    color: #333;
}
.PodesavanjeGrupaAkcija,
.PodesavanjePodGrupaAkcija,
.PodesavanjeStampacaAkcija,
.PodesavanjeArtikalaAkcija,
.PodesavanjeKonobaraAkcija,
.PodesavanjeStopaAkcija{
    display: block;
    position: relative;
    text-align: center;
    border-bottom: 1px solid #5c5c5c;
    transition: all 0.5s ease;
    cursor: pointer;
    user-select: none;
}
.PodesavanjeGrupaAkcija span,
.PodesavanjePodGrupaAkcija span,
.PodesavanjeStampacaAkcija span,
.PodesavanjeArtikalaAkcija span,
.PodesavanjeKonobaraAkcija span,
.PodesavanjeStopaAkcija span{
    line-height: 1;
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    font-size: 16px;
}
.PodesavanjeGrupaAkcija:hover,
.PodesavanjePodGrupaAkcija:hover,
.PodesavanjeStampacaAkcija:hover,
.PodesavanjeArtikalaAkcija:hover,
.PodesavanjeKonobaraAkcija:hover,
.PodesavanjeStopaAkcija:hover{
    background: #e69e2d;
    color: #333;
}
.KreiranjeGrupe,
.KreiranjePodGrupe,
.KreiranjeStampaca,
.KreiranjeArtikala,
.KreiranjeOperatera{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    line-height: 100vh;
    text-align: center;
    background: #333;
    display: none;
}
.KreiranjeGrupeInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: calc(100% - 20px);
    max-width: calc(100% - 2px);
    border: 1px solid #5c5c5c;
    overflow: auto;
    max-height: 100vh;
    text-align: left;
}
.KreiranjeGrupeTitle,
.KreiranjeSubTitle{
    border-bottom: 1px solid #5c5c5c;
    font-size: 16px;
    line-height: 24px;
    padding: 5px;
    text-align: center;
}
.CreateGroupForm,
.CreateSubGroupForm,
.CreatePrinterForm,
.CreateProductForm,
.CreateOperatorForm{
    padding: 5px;
    display: block;
    font-size: 0;
}
.CreateGroupLabel{
    display: inline-block;
    position: relative;
    margin: 10px;
    vertical-alignL: top;
    width: calc(33.33% - 22px);
}
.CreateGroupLabel span{
    display: block;
    position: relative;
    text-align: left;
    font-size: 13px;
}
.CreateGroupLabel input[type="text"],
.CreateGroupLabel input[type="number"],
.CreateGroupLabel input[type="password"]{
    display: block;
    width: calc(100% - 20px);
    border: 0;
    padding: 10px;
    font-size: 16px;
    color: #fff;
    border-bottom: 1px solid #5c5c5c;
    background: transparent;
}
.CreateGroupLabel select{
    display: block;
    width: 100%;
    border: 0;
    padding: 10px;
    font-size: 16px;
    color: #5c5c5c;
    border-bottom: 1px solid #5c5c5c;
    background: transparent;
}
.CreateGroupLabel input[type="checkbox"] {
  position: relative;
  background: #fff;
  width: 70px!important;
  height: 30px;
  -webkit-appearance: initial;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: none;
  font-size: 14px;
  cursor: pointer;
  border: 1px solid #ebecf0;
}
.CreateGroupLabel input[type="checkbox"]:after {
  position: absolute;
  top: 5%;
  display: block;
  line-height: 22px;
  width: 45%;
  height: 90%;
  background: #fff;
  box-sizing: border-box;
  text-align: center;
  transition: all 0.3s ease-in 0s;
  color: #333;
  border: #333 1px solid;
}
.CreateGroupLabel input[type="checkbox"]:after {
  left: 2%;
  content: "Ne";
  background: #5c5c5c;
  color: #fff;
}
.CreateGroupLabel input[type="checkbox"]:checked:after {
  left: 53%;
  content: "Da";
  background: #e69e2d;
  color: #fff;
}
.CloseCreateGroup,
.CloseCreateSubGroup,
.CloseCreatePrinter,
.CloseCreateProduct,
.CloseCreateOperator{
    display: inline-block;
    vertical-align: middle;
    width: calc(50% - 2px);
    border: 1px solid #5c5c5c;
    cursor: pointer;
    transition: all 0.5s ease;
    height: 40px;
    line-height: 40px;
    border-top: 1px solid #5c5c5c;
    font-size: 16px;
    text-align: center;
}
.CloseCreateGroup:hover,
.CloseCreateSubGroup:hover,
.CloseCreatePrinter:hover,
.CloseCreateProduct:hover,
.CloseCreateOperator:hover{
    background: #e69e2d;
    color: #333;
}
.ConfirmCreateGroup,
.ConfirmCreateSubGroup,
.ConfirmCreatePrinter,
.ConfirmCreateProduct,
.ConfirmCreateOperator{
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    border: 0;
    padding: 0;
    margin: 0;
    font-size: 16px;
    height: 41px;
    line-height: 41px;
    background: #e69e2d;
    color: #fff;
    transition: all 0.5s ease;
    cursor: pointer;
}
.ConfirmCreateGroup:hover,
.ConfirmCreateSubGroup:hover,
.ConfirmCreatePrinter:hover,
.ConfirmCreateProduct:hover,
.ConfirmCreateOperator:hover{
    background: #fff;
    color: #333;
}
.PodesavanjePretragaArtikala{
    display: block;
    position: absolute;
    top: 30px;
    left: 0;
    width: calc(100% - 200px);
    overflow: auto;
    height: 70px;
    border-bottom: 1px solid #5c5c5c;
    font-size: 0;
}
.PodesavanjeArtikalaLista{
    display: block;
    position: absolute;
    top: 101px;
    left: 0;
    width: calc(100% - 200px);
    overflow: auto;
    height: calc(100% - 101px);
}
.PodesavanjePretragaLabel{
    display: inline-block;
    vertical-align: bottom;
    width: calc(40% - 10px);
    margin: 5px;
}
.PodesavanjePretragaLabel input{
    display: block;
    width: calc(100% - 20px);
    border: 0;
    padding: 10px;
    font-size: 16px;
    color: #fff;
    border-bottom: 1px solid #5c5c5c;
    background: transparent;
}
.PodesavanjePretragaLabel select{
    display: block;
    width: 100%;
    border: 0;
    padding: 10px;
    font-size: 16px;
    color: #5c5c5c;
    border-bottom: 1px solid #5c5c5c;
    background: transparent;
}
.PodesavanjePretragaLabel span{
    display: block;
    position: relative;
    font-size: 12px;
    height:13px;
    line-height: 13px;
    overflow: hidden;
}
.PodesavanjePretragaDugme{
    display: inline-block;
    vertical-align: bottom;
    width: calc(20% - 10px);
    margin: 5px;
    height: 50px;
    border: 1px solid #5c5c5c;
    background: #e69e2d;
    color: #fff;
    transition: all 0.5s ease;
    cursor: pointer;
} 
.PodesavanjePretragaDugme:hover{
    background: #5c5c5c;
}
.OFPager{
    display: block;
    position: relative;
    border-bottom: 1px solid #e69e2d;
    text-align: center;
}
.OFPagerLink{
    display: inline-block;
    vertical-align: top;
    font-size: 16px;
    padding: 17px;
    line-height: 1;
    transition: all 0.5s ease;
    cursor: pointer;
    border-left: 1px solid #5c5c5c;
}
.OFPagerLink:last-child{
    border-right: 1px solid #5c5c5c;
}
.OFPagerLink:hover{
    background: #5c5c5c;
    color: #fff;
}
.OFPageIsActive{
    background: #e69e2d;
    color: #fff;
}
.HiddenMostImportant{
    display: none!important;
}
/* PODESAVANJA GRUPA END */
/* EFISKAL */
.Efiskalizacija{
    display: block;
    position: relative;
    font-size: 0;
}
.OnlineFiskalizacijaPolje{
    display: inline-block;
    vertical-align: top;
    width: 50%;
    border-top: 1px solid #5c5c5c;
}
.OnlineFiskalizacijaPoljeCelo{
    display: block;
    width: 100%;
    border-top: 1px solid #5c5c5c;
}
.Efiskalizacija input,
.Efiskalizacija select,
.OdabirRefakcije input,
.OdabirRefakcije select{
    display: block;
    width: 100%;
    background: #fff;
    color: #000;
    padding: 10px 0;
    font-size: 20px;
    border-bottom: 0;
    margin: 0;
    border-width: 1px;
}
.PagerJournalHolder{
    display: block;
    position: relative;
    font-size: 0;
    text-align: center;
}
.PagerJournal{
    display: inline-block;
    position: relative;
    padding: 10px;
    font-size: 16px;
    border: 1px solid;
    transition: all 0.5s ease;
    cursor: pointer
}
.PagerJournal:hover{
    color: #e69e2d;
    color: #5c5c5c;
}
.PageIsActive{
    background: #e69e2d;
    color: #5c5c5c;
}
.OdabirRefakcije,
.PretragaArtikala,
.PretragaSobaHotel{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    line-height: 100vh;
    background: #333;
    text-align: center;
    display: none;
}
.OdabirRefakcijeInner{
    line-height: 1;
    vertical-align: middle;
    display: inline-block;
    width: 400px;
    max-width: 100%;
    border: 1px solid #5c5c5c;
    font-size: 0;
}
.PretragaArtikalaInner, .PretragaSobaHotelInner{
    line-height: 1;
    vertical-align: top;
    display: inline-block;
    width: calc(100% - 2px);
    max-width: 100%;
    border: 1px solid #5c5c5c;
    font-size: 0;
}
.PretragaArtikalaRezultati{
    max-height: calc(100vh - 360px);
    overflow: auto;
}
.OdabirRefakcijeTitle,
.PretragaArtikalaTitle,
.PretragaSobaHotelTitle{
    font-size: 16px;
    padding: 10px 0;
}
.OdabirSobeZaPrebacivanje{
    display: block;
    position: absolute;
    height: calc(100% - 38px);
    overflow: auto;
    width: 100%;
    text-align: left;
    font-size: 0;
    top: 38px;
    left: 0;
}
.CloseChooseHotelGuest,
.SelectHotelRoom{
    display: inline-block;
    vertical-align: top;
    width: calc(20% - 1px);
    line-height: 100px;
    font-size: 16px;
    border-right: 1px solid;
    border-bottom: 1px solid;
    transition: all 0.5s ease;
    cursor: pointer;
    text-align: center;
}
.CloseChooseHotelGuest span,
.SelectHotelRoom span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.CloseChooseHotelGuest:hover,
.SelectHotelRoom:hover{
    background: #e09a2d;
    color: #333;
}
.OnlineFiskalizacijaPoljeNaslov,
.PretragaArtikalaHolder span{
    font-size: 14px;
    display: block;
    position: relative;
}
.CloseOdabirRefakcije,
.ClosePretragaArtikala{
    display: inline-block;
    width: calc(50% - 2px);
    font-size: 18px;
    padding: 15px 0;
    border: 1px solid;
    transition: all 0.5s ease;
    cursor: pointer;
}
.ConfirmOdabirRefakcije,
.ConfirmPretragaArtikala{
    display: inline-block;
    width: 50%;
    font-size: 18px;
    padding: 16px 0;
    transition: all 0.5s ease;
    cursor: pointer;
    border: 0;
    line-height: 1;
}
.CloseOdabirRefakcije:hover,
.ClosePretragaArtikala:hover{
    background: #5c5c5c;
    color: #fff;
}
.ConfirmOdabirRefakcije:hover,
.ConfirmPretragaArtikala:hover{
    background: #e69e2d;
    color: #333;
}
.PretragaArtikalaHolder{
    padding-top: 10px;
    border-top: 1px solid #5c5c5c;
}
.PretragaArtikalaKeyboard{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 0;
}
.PretragaArtikalaInput{
    display: block;
    width: calc(100% - 20px);
    padding: 10px;
    font-size: 16px;
    border: 0;
    border-top: 1px solid #5c5c5c;
    border-bottom: 1px solid #5c5c5c;
}
.PretragaArtikalaRezultat{
    display: block;
    position: relative;
    font-size: 14px;
    text-align: left;
    padding: 8px;
    border-bottom: 1px solid #5c5c5c;
    transition: all 0.5s ease;
    cursor: pointer;
}
.PretragaArtikalaRezultat:hover,
.PretragaArtikalaOdabraniRezultat{
    background: #e69e2d;
    color: #333;
}
.ImportArtikala{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    line-height: 100vh;
    text-align: center;
    background: #333;
    overflow: hidden;
    display: none;
}
.ImportArtikalaInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    width: 400px;
    border: 1px solid #5c5c5c;
}
.ImportArtikalaTitle{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    font-size: 16px;
    padding: 10px;
}
.ImportArtikalaAkcije{
    display: block;
    position: relative;
    font-size: 0;
}
.ImportArtikalaAkcija{
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    font-size: 16px;
    padding: 20px 0;
    transition: all 0.5s ease;
    cursor: pointer;
}
.ImportArtikalaAkcija:last-child{
    border-left: 1px solid;
    width: calc(50% - 1px);
}
.ImportArtikalaAkcija:hover{
    background: #e69e2d;
    color: #333;
}
.ImportArtikalaLabel{
    display: block;
    position: relative;
}
.ImportArtikalaLabel span{
    display: block;
    padding: 5px;
}
.ImportArtikalaLabel input{
    display: block;
    padding: 10px;
    border: 1px solid #5c5c5c;
    width: calc(100% - 22px);
}
.ImportArtikala a{
    display: block;
    position: relative;
    border-bottom: 1px solid #5c5c5c;
    padding: 5px;
    color: #e69e2d;
    transition: all 0.5s ease;
    cursor: pointer;
}
.ImportArtikala a:hover{
    color: #5c5c5c;
}
.JournalSearchForm{
    display: block;
    position: relative;
    font-size: 0;
    padding-bottom: 10px;
}
.JournalSearch{
    display: inline-block;
    vertical-align: top;
    width: 33.33%;
}
.JournalSearch input{
    width: calc(100% - 21px);
    border: 0;
    padding: 10px;
    font-size: 16px;
}
.JournalSearchForm button{
    width: 33.33%;
    border: 0;
    font-size: 16px;
    padding: 10px;
    background: #e69e2d;
    cursor: pointer;
    transition: all 0.5s ease;
}
.JournalSearchForm button:hover{
    background: #333;
    color: #e69e2d;
}

/* EFISKAL END */
@media (max-width:1400px){
    .StoNaziv{
        margin: 5px;
        width: calc(100% - 10px);
    }
    .StoVrednost{
        margin: 0 5px;
        width: calc(100% - 10px);
    }
}
@media (max-width:1100px){
    .StoNaziv{
        margin: 2px;
        width: calc(100% - 4px);
    }
    .StoVrednost{
        margin: 0 2px;
        width: calc(100% - 4px);
    }
}
.FocusedElement{
    background: #fff!important;
    color: #333!important;
}
.UnosBrojaStola{
	margin: auto;
    display: block;
    position: relative;
    top: 0;
    left: 0;
	width: 50%;
    height: 30%;
    line-height: 40vh;
    text-align: center;
    background: #333;
}

.UnosBrojaStolaInner{
    display: inline-block;
    vertical-align: middle;
    line-height: 0.8;
    border: 1px solid #5c5c5c;
    width: 240px;
    max-width: 80%;
    border-collapse: collapse;
    font-size: 0;
    text-align: center;
}

.PopUpTitleBrojStola{
    display: block;
    position: relative;
    font-size: 14px;
    text-align: center;
    border-bottom: 1px solid #5c5c5c;
    padding: 8px 0;
}

.UnosBrojaStolaInput{
    display: block;
    position: relative;
    border: 0;
	height: 60%;
    padding: 2px 4px;
    width: calc(100% - 10px);
    background: transparent;
    color: #fff;
    border-bottom: 1px solid #5c5c5c;
	text-align: center;
	font-size: 20px;
}

.UnosBrojaStolaKeys{
    display: block;
    width: 100%;
}

.UnosBrojaStolaKey{
    display: inline-block;
    vertical-align: middle;
    width: calc(33.33% - 1px);
    border: 1px solid #5c5c5c;
    font-size: 16px;
    margin-left: -1px;
    height: 31px;
    line-height: 31px;
    transition: all 0.5s ease;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
}

.UnosBrojaStolaKey:hover{
    background: #e69e2d;
    color: #333;
}

.UnosBrojaStolaKey:last-child{
    width: calc(100% - 1px);
}