html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6 {
  border: 0;
  outline: 0;
  font-size: 100%;
  font-family:   Helvetica,Arial, Verdana, sans-serif;
  font-size: 12px;
}
body,div,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{
margin:0;
padding:0;

}

*{
 /*pointer-events: none;*/
}

#route_svg, .store {
	pointer-events: none;
}
path, g, .floor{
 /* pointer-events: none;*/
}
.active_shop,path.active_shop,path.active_shop, button, #search, .zoom_button, .floor_button, .panel_button, .close, rect{
  pointer-events: fill; 
  
}

g {
  /* pointer-events: fill; */
  
}

img{
  border: none;
}
*{
    outline: none;
}

body {
  margin: 0;
  font-size: 11px;
  /*overflow: hidden;*/
  /* overflow: scroll;*/
  padding:0;
  background-color: #fafafa;
  touch-action: pan-x pan-y; /* povolen� pos�vanie, zak�zan� pinch-zoom */
}

h1 {
	text-align: center;
	font-family: Verdana;
	font-size: 100px;
	color: #333300;
}

p {
	text-align: center;
	font-family: Verdana;
	font-size: 12px;
}
br {
  clear:bouth;
}
#myPos{
  position:absolute;
  height:40px;
  width: 53px;
  z-index:7;
  background: url(../images/mypos.png) no-repeat;
  
}
/*
#myPos p{
  font-size: 8px;
  color: white;
  padding:0;
  background-color: black;
  color: white;
  text-align: center;
  margin-top:0px;
}
*/
#container{
  position: absolute;
  top:0;
  left:0;
  margin:0;
  padding:0;
  width:1920px;
  height:1080px; 
  overflow: auto; 
 /* border: 1px solid black;   */
 /* overflow-y: scroll;    */
  /*background: linear-gradient(to right,#eee, white);        */
 
}
 .bunka{
  text-transform: uppercase;
 }
 .max { -moz-border-radius-topleft: 24px; -webkit-border-top-left-radius: 24px; -khtml-border-top-left-radius: 24px; border-top-left-radius: 24px; }
 .max { -moz-border-radius-topright: 24px; -webkit-border-top-right-radius: 24px; -khtml-border-top-right-radius: 24px; border-top-right-radius: 24px; }
 .max { -moz-border-radius-bottomleft: 24px; -webkit-border-bottom-left-radius: 24px; -khtml-border-bottom-left-radius: 24px; border-bottom-left-radius: 24px; }
 .max { -moz-border-radius-bottomright: 24px; -webkit-border-bottom-right-radius: 24px; -khtml-border-bottom-right-radius: 24px; border-bottom-right-radius: 24px; }

 .max2 { -moz-border-radius-topleft: 86px; -webkit-border-top-left-radius: 86px; -khtml-border-top-left-radius: 86px; border-top-left-radius: 86px; }
 .max2 { -moz-border-radius-topright: 86px; -webkit-border-top-right-radius: 86px; -khtml-border-top-right-radius: 86px; border-top-right-radius: 86px; }
 .max2 { -moz-border-radius-bottomleft: 86px; -webkit-border-bottom-left-radius: 86px; -khtml-border-bottom-left-radius: 86px; border-bottom-left-radius: 86px; }
 .max2 { -moz-border-radius-bottomright: 86px; -webkit-border-bottom-right-radius: 86px; -khtml-border-bottom-right-radius: 86px; border-bottom-right-radius: 86px; }

*::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
* {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

#map {
  margin:0 0 0 0;
  padding:0;
  width:1920px;
  height:1080px ;
  position:absolute;
  top:0px;
  left:0;
  overflow: scroll; 
  touch-action: pan-x pan-y pinch-zoom; /* len tu povolen� zoomovanie */        
}

#map_container{
    /** overflow-y: scroll;  */     
	  height: 1500px;
      width: 1920px;
      left: 0px;    
      position: absolute;
      padding:0;
      margin:0;
      /*pointer-events: fill;*/
     /* margin-top: -2160px;  */
}

#floor0 svg{
   /* border:1px solid black;    */
   width: 2000px;  
   height: 1137px;
   position: absolute;
   /* height: 1920px;  */
}
#floor1 svg{
   /* border:1px solid black;    */
   width: 2000px;  
   height: 1137px;
   position: absolute;
   /* height: 1920px;  */
}
#floor2 svg{
   /* border:1px solid black;    */
   width: 2000px;  
   height: 1137px;
   position: absolute;
   /* height: 1920px;  */
}

#route_svg svg{
   /* border:1px solid black;    */
   width: 2000px;  
   position: absolute;
   /* height: 1920px;  */
}


.floor_map {
  position: absolute;
  /* display: none;   */
    
}
.okolie{
  position: absolute;
  left: 100px;
  z-index:0;
  opacity:100%;
}
#pozadie{
    z-index:1;
    top:-300px;    
    margin-left: 100px;
    opacity:100%;
    position: sticky;
}
#pozadie2{
    z-index:1;
    top:0px;
    position:absolute;
   /* left: 1500px;*/
    opacity:100%;
}

#floor0{
    z-index:1;
    top:2200px;  
    left:0;
    opacity:100%;
}
#floor1{
    z-index:2;
    top:1200px;
    left: 0;
    opacity:100%;
   /* zoom:100%;*/
}
#floor2{
    z-index:3;
    top:100px;
    left: -50px;
    opacity:100%;
   /* zoom:100%;*/
}

#svgline{
  pointer-events: none;  
}

image{
  pointer-events: none;  
 /* display:none;  */
  /* z-index:10;  */
}


#zoom_panel1{
  position: absolute;
  left: 20px;
  top:1300px;
  z-index:89;
  
}

#zoom_panel button{
   width:68px;
   height:70px;
   border: 1px solid silver;

}

#svg_touch_floor_1, #svg_touch_floor_0{
 z-index: 12; 
  
}
.touch{
 z-index: 10;   
}

#route_svg{
  position:absolute;
  display:none;   
  left:0px;
  top:0;
  z-index:15;
  padding:0;
  
 /*border: 5px solid black;    */
}

#externalWWW{
  margin:0;
  padding:0;
  width:1040px;
  height:1300px;
  display:none;
  position:absolute;
  top:400px;
  left:20px;
  z-index:200;
  
}

#externalWWWback{
  margin:0;
  padding:0;
  width:1080px;
  height:1920px;
  display:none;
  position:absolute;
  top:0;
  left:0;
  z-index:199;
  background-color:black;
}

#closeWWW{
  width:65px;
  height:65px;
  position:absolute;
  top: 1336px;
  left: 950px;
  background-color: orange;
  border: 1px solid black;
}

#backWWW{
  width:65px;
  height:65px;
  position:absolute;
  top: 1336px;
  left:880px;
  background-color: orange;
  border: 1px solid black;
}

#someIframe{
  width: 1024px;
  height:100%;
  border: 5px solid orange;
  background-color:white;
}

.ShopPhoto{
 float: left;    
 margin: 0 10px 10px 0;
 border: 3px solid black;
}
.ShopData{
  float: left;
  margin: 5px 0 0 0;
  font-size:16px;
  width:400px;
}

.ShopNote{
  float: left;
  
  font-size:12px;
  width:550px;
  height:240px;
  text-align: justify;
  overflow: auto;
  padding: 10px;
}

#panel{
  height:45px;
  
}

#clock_bodka{
  font-size: 42px;
  color: #000000 ; 

}

#clock_bodka2{
  font-size: 42px;
  /*color: #0057a3  ; */
  color: #ffffff;
  
}
#clock{
  position: absolute;
  right:50px;
  top:20px;
  width: 150px;
  height:40px;
  font-size: 36px;
  font-weight: 600;
  color:white;
  line-height:40px;
  text-align: right;
 /* border: 1px solid silver;*/
  z-index:5;
}

#meniny{
  position: absolute;
  left:1100px;
  top:50px;
  width: 250px;
  height:16px;
  font-size: 16px;
  font-weight: 600;
  line-height:20px;
  text-align: left;
 /* border: 1px solid silver;*/
  z-index:5;
}

#datum{
  position: absolute;
  left:1500px;
  top:25px;
  width: 250px;
  height:30px;
  font-size: 26px;
  font-weight: 600;
  line-height:28px;
  text-align: left;
 /* border: 1px solid silver;*/
  z-index:5;
}

#home{
   position: absolute;
   top:750px;
   left:26px;
   height:86px;
   width:86px;
   border: 1px solid silver; 
   cursor: pointer;
   background-color:white;
}
.btnShops{
  height:40px;
  width:168px;
  margin: 10px 0 0 6px;
  float: left;
  border: 1px solid silver;
   cursor: pointer; 
}
.btnShops:hover,.btnHome:hover {
 background-color: red;
}
#icons_panel {
  margin: 0;
  padding: 10px 5px 0 5px;
  height:635px;
  width:350px;
  
}

#icons{
 position:absolute;
 top:810px;
 left: 10px;
 width:700px;
 height:250px;

}

.panel,.langpanel{
  width: 120px;
  height: 50px;
 /* float: left;   */
  border-width: 1px ;
  margin: 2px 4px 4px 2px;
  cursor: pointer;
  border: 1px solid silver;
  border-radius:5px;
 /* text-align: center;    */
 /* padding:5px;     */
  background-color:rgba(255, 255, 255);
}
.panel p,.langpanel p{
  /* margin: 10px 0 auto 0; */
   text-align: center;
   height:50px;
   width: 120px;
   display: table-cell;
   vertical-align: middle;
   font-weight: normal;
   font-size:12px;
}
.panel img,.langpanel img {
 float: left;
 margin-right:10px;
}
.www{
  width: 220px;
  height: 60px;
  float: left;
  border: 1px solid silver;  
  margin: 2px 4px 4px 2px;
  cursor: pointer;
  font-size: 12px;
  text-align: left;
  padding:5px;
  background-color:rgb(115,150,83);
  
}
.www p{
  /* margin: 10px 0 auto 0; */
   text-align: left;
   height:50px;
   display: table-cell;
   vertical-align: middle;
}
.www img {
 float: left;
 margin-right:10px;
}

.panel_basic{
  width: 86px;
  height: 93px;
  float: left;
  border: 1px solid silver;  
  margin: 10px 10px 4px 2px;
  cursor: pointer;
  font-size: 10px;
  padding:5px;
  background-color:white;
}
.panel_basic_mhd {
  width: 115px;
  height: 85px;
  float: left;
  border: 1px solid silver;  
  margin: 10px 10px 4px 2px;
  cursor: pointer;
  font-size: 10px;
  padding:5px;
  background-color:rgb(204,255,153);
}
.panel_basic_mhd  img{
   float: left;
}
#icons_panel img{
  margin: 0 0 2px 0;
}

.panel:hover {
 background-color: #a3a3a3 ;
}

.panel_button
{
  width: 200px;
  height: 65px;
  border: 1px solid silver;
/*  clear: both;         */
  margin: 5px 0 0 3px;
  float: left;
 /* background-color: #7b6a58;    */
  background-color: #E9E9EB; 
  
  -moz-border-radius-topleft: 8px; -webkit-border-top-left-radius: 8px; -khtml-border-top-left-radius: 8px; border-top-left-radius: 8px; 
  -moz-border-radius-topright: 8px; -webkit-border-top-right-radius: 8px; -khtml-border-top-right-radius: 8px; border-top-right-radius: 8px; 
  -moz-border-radius-bottomleft: 8px; -webkit-border-bottom-left-radius: 8px; -khtml-border-bottom-left-radius: 8px; border-bottom-left-radius: 8px; 
  -moz-border-radius-bottomright: 8px; -webkit-border-bottom-right-radius: 8px; -khtml-border-bottom-right-radius: 8px; border-bottom-right-radius: 8px; 

}
.panel_button p{
     
      font-size: 18px;
      font-weight: bold;
      display: table-cell;
      vertical-align: middle;
      height: 70px;
      text-align: left;
   
}
.panel_button .stvorec{
  width:38px;
  height:38px;
  border: 1px solid silver;  
  border-radius: 10px;
  float: left;
  margin: 10px 12px 0 10px;
  text-align: center;
  vertical-align: middle;
  line-height: 40px;
  font-size: 10px;
 
 /* -moz-border-radius-topleft: 8px; -webkit-border-top-left-radius: 8px; -khtml-border-top-left-radius: 8px; border-top-left-radius: 8px;               */
 /* -moz-border-radius-topright: 8px; -webkit-border-top-right-radius: 8px; -khtml-border-top-right-radius: 8px; border-top-right-radius: 8px;            */
 /* -moz-border-radius-bottomleft: 8px; -webkit-border-bottom-left-radius: 8px; -khtml-border-bottom-left-radius: 8px; border-bottom-left-radius: 8px;     */
 /* -moz-border-radius-bottomright: 8px; -webkit-border-bottom-right-radius: 8px; -khtml-border-bottom-right-radius: 8px; border-bottom-right-radius: 8px;  */

    
}
#slider_container { 

  overflow-x: hidden;
  overflow-y: scroll;
  height: 742px; 
  width: 320px; 
  -ms-scrollbar-base-color: darkolivegreen;
}

#auto{

   position:absolute;
   width: 550px;
   height: 30px;
   font-size: 28x;
   padding: 8px 12px 8px 36px; 
   font-weight: bold;
   margin: 0 0 0 0;
   border: 0 ;
   left:700px;
   top: 12px;
   border-radius: 10px;
   outline: none;
   
   background: #fff 
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%23999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="7"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>')
    no-repeat 12px center;
   background-size: 18px 18px;
   
}

.autoresult{
   /*float:left;*/
   width:160px;
   height:60px;
   /*line-height: 40px;    */
   font-size:16px; 
   margin: 2px 5px 2px 5px;
   text-align: left;   
   background-color:white; 
   border-radius:5px;   
}
.autoresult p{
   display: table-cell;
   vertical-align: middle;
   height: 50px;
   text-align: left;
   padding: 5px 5px;
   /*border: 1px solid black;*/
}

.bunka{
  height:37px;
  width:34px;
  margin: 4px 10px 0 0;
  font-size: 8px;
  line-height:37px;   
  text-align:center;
  border: 1px solid silver;
  /*background: url(../images/frame1.png) no-repeat;  */
  /*float:left;*/
}

.logobunka{
  display: table-cell;
  vertical-align: middle;
  height:50px;
  width:40px; 
  
  /*margin: auto 10px auto 0;*/
  /*font-size: 8px;*/
  /*line-height:37px;  */ 
  text-align:center;
  /*border: 1px solid silver;*/
  /*background: url(../images/frame1.png) no-repeat;  */
  /*float:left;*/
}

.bunka{ 
 -moz-border-radius-topleft: 6px; -webkit-border-top-left-radius: 6px; -khtml-border-top-left-radius: 6px; border-top-left-radius: 6px; 
 -moz-border-radius-topright: 6px; -webkit-border-top-right-radius: 6px; -khtml-border-top-right-radius: 6px; border-top-right-radius: 6px; 
 -moz-border-radius-bottomleft: 6px; -webkit-border-bottom-left-radius: 6px; -khtml-border-bottom-left-radius: 6px; border-bottom-left-radius: 6px; 
 -moz-border-radius-bottomright: 6px; -webkit-border-bottom-right-radius: 6px; -khtml-border-bottom-right-radius: 6px; border-bottom-right-radius: 6px; 
}

button > img,
button > span {
  vertical-align: middle;
}

.autoresult:hover {
  /*background-color: red;    */
}

.store{
  position: absolute;
  z-index:7;       
  width:140px;
  height: 48px;
  display: none;  
  padding:30px 10px 0 10px;
  font-size:10px;
  font-weight:bold;
  background: url(../images/buble3.png)  no-repeat;
  margin-left: -140px;
}

.store p{
  width: 120px;
  height: 35px;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
     font-size:11px;
}
/*
.store2{
  position: absolute;
  z-index:20;       
  width:150px;
  height:auto;
  background-color: white;
  display: none;  
  padding: 5px 5px 5px 5px;
  border: 3px solid rgb(160,160,160);
  font-size:12px;
}
.store h1{
  font-size: 16px;
  text-align: left;
  line-height:22px;
  display: block;
  margin: 0 0 0 0;
  clear:left;
}
.store h4{
  font-size:11px;
  clear:left;
  margin: 5px 0 0 0;
  font-weight: normal;
}
.store h3{
  font-size:11px;
  
}
*/
.store #photo{
 /*float: left;    */
 width:150px;
 height:100px;
 position:relative;
 top:-28px;
 margin: 0 0 -25px 0;
}

.store .logo_detail{
 margin: 0 10px 0 0;
 float: left;
 /*float: left; */
}

.spin{
  position: absolute;
  z-index:5;       
  width:95px;
  height:141px;
  background: url(../images/spin.png) no-repeat; 
  display: none;    
}
#popisovac{
  position: absolute;
  z-index:10;       
  width:auto;
  height:auto;
  background-color: white;
  background-image: url(../images/xxx.png) ;   
  text-align: center;
  display: none;
  padding: 10px 5px 10px 5px;
  border: 1px solid black;
}



.bunka,.autoresult, button, #search,  { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -khtml-border-top-left-radius: 4px; border-top-left-radius: 4px; }
.bunka,.autoresult, button, #search,  { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -khtml-border-top-right-radius: 4px; border-top-right-radius: 4px; }
.bunka,.autoresult, button, #search,  { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; -khtml-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; }
.bunka,.autoresult, button, #search,  { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; -khtml-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; }

 

#shops{
  background-color: white;
  z-index:50;   
  position: absolute;
  display: none;
  width: 1500px;
  height: auto;
  border: 3px solid silver;
  top:70px;
  left:10px ;

}

.mapImage{
   z-index:1; 
   position: absolute;
   display: none;
}

.topbtn{
  height: 55px;
  width:100px;
  margin: 18px 0 0 5px;
  border: none;
  color: white;
  font-size: 16px;
  border: none;
}
#poschodie:hover, #prizemie:hover{
 background-color: silver;
}

#top_buttons{
   z-index:100; 
   position: absolute;
   left: 300px;
}
#poschodie{
 /* background: url(../images/poschodie.png);       */
 background-color: rgb(87,82,153);
}

#prizemie{
 /* background: url(../images/prizemie.png);  */
   background-color: rgb(235,127,34);
}
.logo{
 position: absolute;
 top: 10px;
 left:40px;
 z-index: 10; 
 height: 120px;
}
.mapImage{
   z-index:1; 
   position: absolute;
   display: none;
}
.BWmapImage{
   z-index:3; 
   position: absolute;
   display: none;
}
.resPanel{
   z-index:5; 
   position: absolute;
   top: 500px;
   height:auto;
   width: auto;
   display: none;
   background-color: white;
   font-size: 20px;
   padding: 15px;
   margin: 0 auto 0 50px;
   border: 4px solid red;
  
}

.ulleft{
    float:left;
   /* display:block;   */
}
#logo_panel{
  position: absolute;
  top:1880px;
  left:0;
  width: 1080px;
  height:55px;
  background-color: white;
  z-index:11;
}
#scroller {
 white-space: nowrap;
 /*line-height: 36px;     */
 font-size: 28px;
}
#scroller img{
  margin: 5px 15px;
  
}
#scroller p{
  margin: 5px 0 5px 0;
  font-size:28px;
  float: left;
}
.buses{
  float:left;
  width:124px;
  height:155px;
  padding:10px;
  text-align: center;
  border: 1px solid silver;
  background-color: white;
  margin:3px;
  font-size: 18px;
}
.bushead{
  font-size:22px;
  margin: 0 0 5px 0;
  border: 1px solid silver;
  color: black;
  padding:5px;
  font-weight:bold;
}
.buses h3{
  font-size:12px;
  font-weight:bold;
  margin: 0 ;
  padding:0 0 5px 0 ;
}
h4{
  font-size:18px;
  font-weight:bold;
  margin: 0 ;
  padding:0 ;
}
.bus1{
  width:45%;
  height:auto;
  float:left;
  font-size:14px; 
 /* border-right: 1px solid silver;   */
}
.bus2{
  width:45%;
  height:auto;
  float:left;
  color:red;
  font-size:14px; 
}
#bus_popis{
  position:absolute;
  top: 1008px;
  left:20px;
  font-size:16px;
  z-index:2;
  
}
.shopbtn{
  float:left;
  width:150px;
  height:55px;
  font-size:12px;

}

#keyboard{
  /*border: 1px solid silver;  */
  width:auto;
  padding:3px;
  z-index:999;   
  position: absolute; 
  display: none; 
  top: 200px;  
  left:700px;   
  padding: 20px;
  background-color:#3d85c6cc;
  border-radius:15px;
 }
 
.rad1{
  clear: left;  
  margin: 0 ;
}
.rad2{
  clear: left;  
  margin: 0 0 0 20px;
}

.rad3{
  clear: left;  
  margin: 0 0 0 40px;
}
.rad4{
  clear: left;  
  margin: 0 0 0 60px;
}
.rad5{
  clear: left;  
  margin: 0 0 0 80px;
}

#keyboard .key{
 width:50px;
 height:50px;
 font-size: 18px;
 float: left;
 margin:2px;
 border-radius: 10px;
}

#keyboard .del{
 width:50px;
 height:50px;
 float: left;
 margin:2px;
 border-radius: 10px;
}

.close{   
 float: right;
 padding: 0 5px;
 z-index:9999;       
}  
#close_shop{ 
  z-index:999;
}

#keyboard #del_all{
 width:50px;
 height:50px;
 font-size: 10px;
 float: left;
  margin:2px;
 border-radius: 10px;
}

#keyboard .space{
 width:500px;
 height:55px;
  float: left;
  margin:2px;
  border-radius: 10px;
}

#keyboard .entr{
   width:110px;
   height:50px;
   float: left;
   margin:2px;
   border-radius: 10px;
}
#keyboard button{

/* background-color: #cbbba0 ;  */
   background-color:#fff;
   border: 1px solid #ccc;
}

.units{
  position: absolute;
  width:12px;
  height:12px;
  color: white;
  display: block;
  z-index:4;
  font-size:7px;
  text-align: center;
  padding: 4px 0 0 2px;
  font-family: helvetica;
  overflow: visible;
  white-space:nowrap;
  display: none;
  background: url(../images/krizikW.png) no-repeat;
  opacity: .6;  
}
.doors{
  position: absolute;
  width:12px;
  height:12px;
  color: red;
  display: block;
  z-index:4;
  font-size:7px;
  text-align: center;
  padding: 4px 0 0 2px;
  font-family: helvetica;
  overflow: visible;
  white-space:nowrap;
  display: none;
  background: url(../images/krizik.png) no-repeat;  
  opacity: .6;  
}
}

.u_shop{
  /*background: url(../images/route.png) no-repeat;     */
  /*color: black;        */
}
.u_equipment{
  /*background: url(../images/koleckoW.png) no-repeat;  */
  color: black;
  font-weight:bold;
}
.u_kiosk{
  background: url(../images/koleckoR.png) no-repeat;
  color: white;
}
.hlavicka{
  text-align: left;
  padding: 0 0 0 10px;
  width:750px;
  height:70px;
  
}
.hlavicka img{
  float: left;
  padding: 0 10px 0 0 ;
}
.hlavicka p{
  font-size:32px;
  font-weight:bold;
  height:50px;
  text-align: left;
  display: table-cell;
  vertical-align: middle;
  color: white;
 /* line-height:25px;  */
  }

#route_image, #route_image1, #route_image2, #route_svg1, #route_svg2{
  position:absolute;
  display:none;
  width: 1059px;
  height: 552px;
  left:0;
  top:0;
  z-index:4;
  padding:0;
}



#layer_image{
  position:absolute;
  display:none;  
  width: 1861px;
  height:1016px;
  left:10px;
  top:10px;
  z-index:5;
  padding:0;
}

#touch_image{
  position:absolute;
  width: 1861px;
  height:1016px;
  left:0;
  top:0;
  z-index:6;
  padding:0;
}

.layer{
  position:absolute;
  /*display:none;   */
  width: 1900px;
  height:2180px;
  left:0;
  top:0;
  z-index:4;
  padding:0;
}
#route2{
  position:absolute;
  display:none;
  width: 1550px;
  height:750px;
  left:0;
  top:0;
  z-index:5;
  padding:0;
}
#poly{

    position: absolute;z-index:1;top:0;left:0 ;
}
#category_panel{
     position: absolute;
     z-index:1;
     top:775px;
     left:17px ;
}
.category_original_button{
  height:40px;
  width:155px;
  float: left;
  border:1px solid silver;
  margin:2px;
  display: table-cell;
  vertical-align: middle
}
 #floor_message{
  position: absolute;
  z-index: 20;
  top:335px;
  left:885px;
  display: none;      
  width: 100px;
  height:60px;
  border: 3px solid orange;
  background-color: white;
  color: red;
  padding: 5px;
  text-align:center;
}

#big_message{
  position: absolute;
  display: none; 
  z-index:9999;
  width: 430px;
  height:550px;
  background-color:rgb(241,243,244);
  top:100px;
  left:620px;
  border: 5px solid gray;
}
#big_message img{
    float:left;
    margin:10px;
}
#big_message .pokec{
  font-size: 28px;
   float:left;
   width: 350x;
   text-align: center;
   color:gray;
   padding:10px;
}
#nastupistia{
  position: absolute;
  display:none;      
  background: url(../maps/nastupistia.jpg) no-repeat;
  left:400px;
  top:25px;
  z-index:9999;
  height: 980px;
  width:686px;
  border: 5px solid silver;
}
#navigate_panel{
  position:absolute;
  top:700px;
  left:1200px;
  z-index:9999;
  height:250px;
  width:250px;
  text-align: center;
}

#navigate_panel button{
   width:58px;
   height:70px;
   border: 1px solid silver;
  
}

#zoom_panel button{
   width:68px;
   height:70px;
   border: 1px solid silver;

}
#control_panel{
   width:1080px;
   height:250px;
   position: absolute;
   top: 1240px;
   left:0;
   z-index:11;
   background-color: white;
}
#basic_icons{
  position: absolute;
  width:200px;
  height:220px;
  top:1350px;
  left:860px;
  z-index:20;
  /*border: 1px solid black;   */
}
#category_icons{
   display: none;
   margin: 20px 0 0 0 ;
   position: absolute;
   left: 250px;
   top:600px;
   width:350px;
   height: auto;
   z-index: 20;
   padding: 40px;
  /* background-color: black;   */
   background: rgba(25, 25, 25, .3);
   /*opacity: .3;  */
  -moz-border-radius-topleft: 8px; -webkit-border-top-left-radius: 8px; -khtml-border-top-left-radius: 8px; border-top-left-radius: 8px; 
  -moz-border-radius-topright: 8px; -webkit-border-top-right-radius: 8px; -khtml-border-top-right-radius: 8px; border-top-right-radius: 8px; 
  -moz-border-radius-bottomleft: 8px; -webkit-border-bottom-left-radius: 8px; -khtml-border-bottom-left-radius: 8px; border-bottom-left-radius: 8px; 
  -moz-border-radius-bottomright: 8px; -webkit-border-bottom-right-radius: 8px; -khtml-border-bottom-right-radius: 8px; border-bottom-right-radius: 8px; 
}
#category_icons .panel{
    background-color: #fff;
}
#category_icons p{
   
}



#www_icons{
  width:250px;
  height:220px;
  position: absolute;
  top:2px;
  left:1125px;

  /*border: 1px solid black;  */
}
#lang_bar{
  position: absolute;
  width:150px;
  height:220px;
  top:2px;
  left:10px;
 
}
#lang{
      margin: 0 0 25px 0;
}
.langbtn{
  width: 155px;
  height: 93px;
  float: left;
  border: 1px solid silver;  
  margin: 2px 4px 4px 2px;
  cursor: pointer;
  text-align: left;
  padding:2px;
  background-color:rgb(200,211,73);
}
.langbtn img {
 float: left;
 margin:0 10px 0 10px;
}

.langbtn p {
 font-size:14px;
 margin:7px 0 0 0 ;
}

#search {
  position:absolute;
  left:170px;
  top: 1400px;
  padding:10px 5px 10px 5px;
  height:350px; 
  width:700px;
  border: 1px solid silver;   
  background-color:rgba(200,200,200,0.5) ;
  font-size:14px;
  font-weight: bold;
  z-index: 999;
  display: none;     
}

#search:hover {
 /*background-color: rgb(200,211,0);    */
 
}
#closeSearch{ 
 display: none;     
  margin: 5px 10px 0 0 ;
  width: 100px;
  height: 40px;
  float:right;
  background-color: red;
  color: white;
}

#autocomplete {
  position: absolute;
  top:2px;
  left: 1580px;
  font-size:18px;
  margin: 10px 0 0 0 ;
  width: 320px;
  height: 813px;
  z-index:99;
  overflow:hidden;
  background-color:rgb(115,150,83) ;
  padding: 10px 5px 5px 6px;
  display: none;
  color: white;
}
#autocomplete .result{
   float:left;
   height: auto ;

}
#show_shops{
   position: absolute;
   top:130px;
   left: 1575px;
   width:330px;
   height:60px;
   background-color:rgb(200,211,73);
   border: 1px solid silver;
   font-size:14px;
   font-weight: bold;
}
#spacer{
   width:1080px;
   height:1200px;
   clear:both;
   position:absolute;
   top:1300px;
}
#spacerR{
   width:500px;
   height:1300px;
   clear:both;
   position:absolute;
   top:0px;
   left: 1900px;
}
#touch{
 position: absolute ;
 z-index:20;
 display: none;
}
#formular{
  position:absolute;
  top:300px;
  left:852px;
  height:360px;
  width:695px;
  border: 3px solid silver;
  background-color: white;
  padding: 20px 10px 10px 10px;
  z-index:1000;
 
  display: none;
}
#formular input {
  width:286px;
  height:25px;
  margin: 5px 0 10px 0;
  clear: both;
}
#formular textarea {
  width:670px;
  height:150px;
  margin: 5px 0 15px 0;
  padding:5px;
}
#formular button {
  width:86px;
  height:40px;
  margin: 0 20px 0 0 ;
  background-color:  rgb(200,211,73);
}
#formular p{
  float:left;
  display: block;
 
}
p.msg{
  color: red;
  margin: 0 0 0 15px;
}
div.hl{
  height:15px;
}
#reklama{
  position: absolute;
  z-index: 5;
  width: 1080px;
  height: 380px;
  top:  0px;
  left: 0px;
  display: none;
  overflow: hidden;
}
#reklama2{
  position: absolute;
  z-index: 200;
  width: 850px;
  height: auto;
  top:  450px;
  left: 110px;
  display: none;
  overflow: hidden;
}
#externalWWWback2{
  margin:0;
  padding:0;
  width:1080px;
  height:1920px;
  display:none;
  position:absolute;
  top:0;
  left:0;
  z-index:199;
  background-color:black;
}

.ui-corner-max{ 
 -moz-border-radius-topleft: 14px; -webkit-border-top-left-radius: 14px; -khtml-border-top-left-radius: 14px; border-top-left-radius: 14px; 
 -moz-border-radius-topright: 14px; -webkit-border-top-right-radius: 14px; -khtml-border-top-right-radius: 14px; border-top-right-radius: 14px; 
 -moz-border-radius-bottomleft: 14px; -webkit-border-bottom-left-radius: 14px; -khtml-border-bottom-left-radius: 14px; border-bottom-left-radius: 14px; 
 -moz-border-radius-bottomright: 14px; -webkit-border-bottom-right-radius: 14px; -khtml-border-bottom-right-radius: 14px; border-bottom-right-radius: 14px; 
}



#search_result{
  position: absolute;    
  left: 20px;   
  top:400px;    
  width: 1040px;
  height: auto;      
  border: 1px solid black;
  z-index: 55;
  padding: 15px 5px 25px 5px;
  display: none;
 /* margin: auto  0 auto 0;      */
}
#search_result{
  background:rgb(0,0,0);
	background: transparent\9;
	background:rgba(0,0,0,0.4);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4c000000,endColorstr=#4c000000);
	zoom: 1;
}
#search_result:nth-child(n) {
	filter: none;
}

.floor_result{
  display: block;
  color: white;
  height:30px;
  padding: 10px;
  font-size: 32px;
  clear: both;
  
}
.center {
     display:table-cell;
     vertical-align:middle;
}

/* put the two elements next to each other */
.center img, .center form {
     display: inline-block;
}
#center {
  position: absolute;   
  left: 0;   
  top:0;  
  height: 1920px;
  width: 1080px;  
  border: 1px solid black;
}
#panel_search, #category_search{
	
	display: flex;
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
    height: 120px; /* Set height to 120px */
    width: 120px; /* Optional: to make divs take full width of the container */
    text-align: center; /* Center text */
    border: 1px solid #000; /* Optional: to visualize the divs */
	font-size: 20px;
}

#panel_search .stvorec, #category_search .stvorec{
 /*  background-color: red;            */
   color: white;
}

.poschodie{
   font-size: 24px;
   position: absolute;
   left:150px;
   top: 70px;
}

@keyframes dash {
  to {
    stroke-dashoffset: -1000;
  }
}
#scroller {
 white-space: nowrap;
 /*line-height: 36px;     */
 font-size: 28px;
}
#scroller img{
  margin: 5px 15px;
  
}
#scroller p{
  margin: 5px 0 5px 0;
  font-size:28px;
  float: left;
}

#scroller {
            position: absolute;
            width:auto;
            height: 100%;
            margin: 0;
            line-height: 50px;
            text-align: center;
            -moz-transform: translateX(1080);
            -webkit-transform: translateX(1080);
            transform: translateX(1080);
            animation: scroll-left 150s linear infinite;
        }
        
        @-moz-keyframes scroll-left {
            0% {
                -moz-transform: translateX(1080px);
            }
            100% {
                -moz-transform: translateX(-100%);
            }
        }
        
        @-webkit-keyframes scroll-left {
            0% {
                -webkit-transform: translateX(1080px);
            }
            100% {
                -webkit-transform: translateX(-100%);
            }
        }
        
        @keyframes scroll-left {
            0% {
                -moz-transform: translateX(1080px);
                -webkit-transform: translateX(1080px);
                transform: translateX(1080px);
            }
            100% {
                -moz-transform: translateX(-100%);
                -webkit-transform: translateX(-100%);
                transform: translateX(-100%);
            }
        }

    .blink_me {
              
        animation-name: blinker;
        animation-duration: 2s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
    }
    
     .blink_me2 {
        -webkit-animation-name: blinker;
        -webkit-animation-duration: 1s;
        -webkit-animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        
        -moz-animation-name: blinker;
        -moz-animation-duration: 1s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
        
        animation-name: blinker;
        animation-duration: 3s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
    }
    
      
    @keyframes blinker {  
        0% { opacity: 1 }
        50% { opacity: .3 }
        100% { opacity: 0 }
    }
    
     @keyframes blinker2 {  
        0% { opacity: 1 }
        70% { opacity: 1 }
        90% { opacity: .3 }
        100% { opacity: .1 }
    }
    
    
#myPos{
  position:absolute;
  height:80px;
  width: 45px;
  z-index:5;
  background: url(../images/pin.svg) no-repeat;
  pointer-events: none;   
  animation-name: blinker;                  
  animation-duration: 1s;      
   animation-timing-function: linear;
  animation-iteration-count: infinite;
   
}


     @keyframes blinkerMyPos {  
        0% { opacity:0; }
        50% { opacity: 1; }
       
    }
    
    .mapZoom  {
        animation-name: mapZoom2;
        animation-duration:1s;
        animation-timing-function: linear;
        animation-iteration-count: 1;
        animation-fill-mode: forwards;
        
    }
    
     @keyframes mapZoom2  {            
           
               
           to {
                 transform: scale(1.8) translateX(0px);                        
                               
            }             
                        
        }
    
    .mapUnZoom{
        animation-name: mapUnZoom2;
        animation-duration: .1s;
        animation-timing-function: linear;
        animation-iteration-count: 1;
        animation-fill-mode: forwards;
        
    }
    
     @keyframes mapUnZoom2  {                    
                                             
           to {
                 transform: scale(1) translateX(0px);   
                             
            }
            
                        
      }   
       @keyframes mapZoom3  {                    
                                             
           to {
                 transform: scale(.34) translateY(800px);   
                             
            }
            
                        
      }     
      
/************ cesty routovanie *********************/
.path {
  /*stroke-dasharray:4000;          */
 /* stroke-dashoffset:4000;           */
   animation: dash 10s linear forwards;   
}

@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}

.pathDot {
  /*stroke-dasharray:4000;          */
 /* stroke-dashoffset:4000;           */
   animation: dash2 20s linear forwards; 
   animation-iteration-count: infinite;   
}

@keyframes dash2 {
  to {
    stroke-dashoffset: -50%;
/*	stroke-dasharray: 10,10;*/
  }
}

.route_floor {
  /*stroke-dasharray:4000;          */
   animation: dash3 30s linear forwards;
 /* stroke-dashoffset:4000;           */
  animation-iteration-count: infinite; 
  /*display:none; */  
}

@keyframes dash3 {
  to {
    stroke-dashoffset: 50%;
/*	stroke-dasharray: 10,10;*/
  }
}

.noPosition{
   fill: red;
}

#napis0{
    position: absolute;
    top: 200px;
    left: 900px;
    font-size: 32px;
    width: 500px;
    font-weight: bold;
}

#napis1{
    position: absolute;
    top: 200px;
    left: 900px;
    font-size: 32px;
    width: 500px;
    font-weight: bold;
}

#bubble{
    position: absolute;
    z-index: index 999;    
    pointer-events: none;
}
.bubble{
    position: absolute;
    z-index:15;
    pointer-events: none;
}
.bubble2{
    position: absolute;
    z-index:15;
    pointer-events: none;
}

.st118, .st147, .st174, .st124{
  /*  display: none;*/
}

 g[id^="kiosk-pin"] {
    display: none;
  }
 
 path[id^="map-item-"] {
    display: none;
  }
  


#listaTop{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 70px;
    background-color: #3d85c6;
    z-index:9;
}

#poschodia .label {
   height:35px;
   width: 50px;
   border: 1px solid #ccc;
   margin:10px;
   text-align: center;
   line-height:30px;
   font-size: 16px;
   background-color: black;
   color: white;
}

#poschodia{
  position: absolute;
  right: 0px;
  bottom:0px;
  z-index:30;
  display: flex;
  gap: 10px;  
  flex-direction: column;
  padding: 20px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.3);
  border-top-left-radius: 8px;
}

.floor_button, .zoom_button{
   height: 65px;
   width: 65px;
   font-size: 24px;
   font-weight:500;
   background-color: rgba(255,255,255,.7);
   border-radius: 8px;
   box-shadow: 0 3px 6px rgba(0,0,0,0.3);
   background: #222;
   color: #fff;
   border: none;
   display: flex;
   align-items: center;
   justify-content: center;
}
 

#navigacia {
    position: absolute;
    top: 350px;
    left: 0px;
    width: 250px;
    height: auto;
    /* border: 1px solid silver; */
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    z-index: 99;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    align-items: stretch;
    background-color: white;
    padding: 25px;
}


#navigacia2{
    position: absolute !important;;
    top: 300px;
    left: 0px;
    width: 250px;
    height: auto;
    /* border: 1px solid silver; */
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    z-index: 50;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    align-items: stretch;
    background-color: white;
    padding: 25px;
}


#navigacia2 .nav_button{
    width: 250px;
    height: 60px;
    border: none;
    background-color: #f8f5f0;
    border-radius:10px;
    padding:0;
    display:flex;
}
 
.icona {
    width:60px;
    height: 100%;
    background-color: #3d85c6;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    display:flex;
    align-items: center;
    justify-content: center;
}

.icona img{
    width:35px;
}

.label{
  display:flex;
  flex: 1;
  text-align: left;
  padding: 0 25px;
  font-size: 18px;
  font-weight: 600;
  min-width: 0;           /* umo�n� skracova� obsah */
  overflow: hidden;
  align-items: center;
  justify-content: left;
  white-space: normal;
  /*text-overflow: ellipsis; /* � pri dlhom texte */
  /* border: 1px solid black;*/
 
}

#start{
    position:absolute;
    z-index:9999;
    top:1000px;
    left: 430px;
    color: black;
    background-color:#fddb00;
    width: 200px;
    height:70px;
    border-radius: 8px;
    border:0 ;
    font-size:22px;
    font-weight: 600;
    font-family: "Nexa";
}


#shop_detail{
  position: absolute;
  z-index:52; 
  display: none; 
  top: -1100px;
  left:0px;
  width: 380px;
  height: 1080px;
  background-color: white;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}

#shop_detail h1{
  font-size:28px;
  line-height:36px;
  margin: 0 0 5px 12px;
  text-align: left;
}

#shop_detail h4{
  font-size:14px;
  margin: 10px 0 0 0;
  font-weight: normal;
}

#shop_detail h3{
  font-size:14px;
}


#shops_list{
  position: absolute;
  z-index:12; 
  display: none; 
  top: -1080px;
  left:0px;
  width: 380px;
  height: 1080px;
  background-color: #fff;
  overflow: scroll;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  padding-top:0;
  text-align: center;
  display: flex;
  flex-wrap: wrap;     /* dva ved�a seba + zalamovanie */
  gap:10px;
  justify-content: center;
  align-items: flex-start;
  align-content: flex-start; 
}

#shops_list .shop_btn {
  width: 150px;
  height: 150px;
  padding: 0;
  border: none;
  border-radius: 10px;
  font-size: 16px;
  font-weight: 600;
  background-color: #f8f5f0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;  /* logo hore, title dole */
  align-items: center;
  overflow: hidden;                /* aby sa zaoblenie vz�ahovalo aj na vn�tro */
}

.btn_logo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 1;                    /* vypln� zvy�ok priestoru */
}

.btn_logo svg {
  max-height: 75px;
  width: 75px;
}

.cat_logo { 
 width: 100px;
 height: 100px;
}

.btn_title {
  width: 95%;
  background-color: #fddb00;   /* in� farba pozadia */
  color: #333;
  padding: 6px 6px  6px 6px !important;
  font-size: 14px;
  min-height: 35px;
  display: flex;               /* aktivuje flexbox */
  align-items: center;         /* vertik�lne centrovanie */
  justify-content: center;     /* horizont�lne centrovanie */
  text-align: center;
}

.left_name{
    width:100%;
    height:115px;
    display: flex;               /* aktivuje flexbox */
    align-items: center;         /* vertik�lne centrovanie */
    justify-content: center;     /* horizont�lne centrovanie */
    text-align: center;  
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px; 
    background-color:  #fddb00;  
    font-size:36px;
    font-weight:900;
    margin-bottom:20px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    /*position: fixed;*/
}

#sidebar{
  position: absolute;
  z-index:11; 
  /*d isplay: none; */
  top: 0;
  left:0px;
  width: 380px;
  height: 1080px;
  background-color: white;
  /*border-radius:16px;*/
  /*border:1px solid silver;*/
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

#zoom-wraper{
     position: absolute;
     bottom:0;
     right:120px;
     width:280px;
     height:130px;
     text-align: center;
     font-size:22px;
     font-weight: 600;
     box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
     border-top-left-radius:8px;
     border-top-right-radius:8px;

}

.zoom_label{
     font-size:18px;
     font-weight: 600;
}

.zoom-controls {
  position: absolute;
  top: 30px;
  left: 30px;
  z-index:31;
    
  display: flex;        
  flex-direction: row;  
  gap: 10px;            
  flex-wrap: nowrap;    
 }


.zoom-controls button {
  background: #222;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 15px;
  font-size: 38px;
  width:65px;
  height:65px;
  cursor: pointer;
  box-shadow: 0 3px 6px rgba(0,0,0,0.3);
  transition: background 0.2s;  
}
 
.zoom-controls button:hover {
  background: #444;
}


.back-button {
  position: absolute;
  bottom: 5px;
  right: 10px;
  height: 40px;
  border-radius: 8px;
  background-color: black;
  color: white;
  font-size: 15px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  transition: background-color 0.2s, transform 0.2s;
}

.back-button:hover {
  background-color: #333;
  transform: translateX(-2px);
}

.back-button .arrow {
  font-size: 22px;
  line-height: 1;
  transition: transform 0.2s;
}

.back-button:hover .arrow {
  transform: translateX(-3px);
}

.invalid_active {
  background-color: #ff5555ff;
}