body {
 background: #FFF;
 margin:0px ;
 padding:0px ;
 font-size: 12px;
}

#wrapper {
 background: #FFF;
//   width:950px;
//   padding:1px 1% 1px 1% ;
 padding:1px 0% 1px 0.2% ;
//   margin: 0px auto;
 margin: 0px ;
}

#header {
 background:#C0C0C0;
//   height: 13vmin; //70min; //   height:6vmin;
 height: 6vh; //6vmin;
 margin:0 0 1px 0 ;
 padding:1px 0px 1px 0px ;
//   font-size: 2.5em;
//   font-size: 2em;
 font-size:3vmin; //4vmin;
//   text-transform: uppercase;
 text-wight: bold;
 text-align: left; //center;
 vertical-align: middle; //bottom; //
}

img[class="logo"] {
 height:"100%";
//   width:"10%";
 padding: 0px;  
 margin: 0px;
}

#nav {
 //  display: inline-block;
 background: gray;
 font-size: 1.5em;
 vertical-align: middle;
 height: 4vmin; //3vh; //
 padding: 0% auto  0%  auto;  
 margin: 0px 0px 0px 0px ;
}

#main {
 background: #E6E6E6;
//   height:450px;
 height:78vh; //77vh; 
//   width:78%; 
//   width:81%;
 width:82.6%;
 float:left;
 margin: 0px 1px 0px 0.2% ;
 padding: 1% 0% 1% 1% ;
 font-font-family: Arial, Times, sans-serif;
// font-size: 3vmax;//1.5vmax;
 font-size: 1.5em; //2vmax;//1.5vmax; 
// overflow:scroll;
}

#rightbar {
 background:#C0C0C0;
 //   height:450px;
 height: 78vh; //77vh;
 width:15%;
 font-size: 1.5em;
 float:right;
 margin: 0px 0% 0% 0px;
 padding: 2% 1% 0% 0% ;
}

p {
 font-size: 1em;
 background-color: lime ;
}

p.skrolani {
 overflow:scroll; 
 font-size: 1em;  
 height: 6vmax;
}

a{
 target: _self;
}


#transformed {
 background-color: green;
 width:12%;
 height: 8%;
 transition: transform 2s;
}

#transformed:hover {
 transform: skew(20deg,10deg)  ;
 -ms-transform: skew(20deg,10deg)  ;
 -webkit-transform: skew(20deg,10deg)  ;
}

div[id^="nav"] ul {
 text-decoration: none;
 font-family: Arial, Verdana;
 // font-size: 1.5vmax;
 font-size: 2vh; //1.1vmax;
 margin: 0;
 padding: 0;
 list-style: none;
}

div[id^="nav"] ul li {
 //   width: 20vmax;
 //   width: 15vmax;
 //   width: 8vmax; //10vmax;
 //   height: 4vmax;
 height: 3vh; //2vmax; //2vmax;  
 //font-size: 1.2vmax; //1.5vmax;
 font-size: 1.1vmax; //1.5vmax;2vh; //
 background-color: gray  //#E6E6E6;
 font-family: Arial;
 //   color:lime; 
 display: block;2v; //
 position: relative;
 float: left;
}

div[id^="nav"] li ul {
 display: none;
}

div[id^="nav"] ul li a {
 display: block;
 text-decoration: none;
 color: #ffffff;
//    border-top: 1px solid #ffffff;
 border-right: 1px solid #ffffff;
 padding: 5px 10px 5px 8px;
 background: gray; //#2C5463;
 margin-left: 1px;
 white-space: nowrap;
}

div[id^="nav"]>ul li a:hover  {
 background: #C0C0C0;//#617F8A;
}

div[id^="nav"] li:hover ul   {
 display: block;
 position: absolute;
}

div[id^="nav"] li:hover li   {
 float: none;
 //   font-size: 11px;
 font-size: 1.1vmax; //1vmax;
}

div[id^="nav"] li:hover a   {
 background: #C0C0C0; //#617F8A;
}

div[id^="nav"] li:hover a:hover   {
 background: gray ; //#95A9B1;
}

hr {
 margin: 0px 1% 1px 1% ;
 clear: both;
}

#slika {
 text-align: center;
}

#footer {
 text-align: center ;
 background: #C0C0C0;
 height:3vmax;
//   clear:both;
 font-size: 1.5em;
 vertical-align: middle;
 padding: 1% auto  1%  auto;  
//   margin: 0px 1%  ;
 margin: 0px 0% 0px 0.2%;
}

#headB {
 horizontal-align: right;
 //width:50%;
 height:3vh; //3vmax;
 float: right;
 padding:0 1% 0 0;
 margine:0 1% 0 0;
 display:inline-block;
 overflow: visible;
 //position: fixed;
 position: relative;
 top:10%;
}

#burger {
   height:"100%";
   margin: 0px  ;
// display:none;
}

#closeBtn{
 height:"100%";
 margin: 0px  ;
 display:none;
}

#jezik {
 valign:middle;
 position:absolute; 
// top:0px; 
 top:10px; 
 right:0px; 
// width:50px; 
 width:100px; 
 padding: 0px;margin: 0px;
 //opacity: 0.7;
 // filter:alpha(opacity=70);
 height:20px   :
}

#menub {
 height: 0; /* Specify a height */
 width: 98%; /* 0 width - change this with JavaScript */
 position: fixed; /* Stay in place */
 z-index: 1; /* Stay on top */
 top: 4.5vh; //9vmin;  3vmax ; // 0;
 left: 1%;
 background-color: #C0C0C0; 
 opacity: 0.9;             
 color: black;
 margine:1% auto 0 0%;
 text-align:left;
 font-size: 3vh ; // 15px;
 display:block;
 list-style: none;
 text-decoration: none;
 overflow-x: hidden; /* Disable horizontal scroll */
 transition: 0.5s; 
}

#menub a {
//  padding: 8px 8px 8px 32px;
 text-decoration: none;
 font-size: 3vh; //15px; //1.5em; //
//  font-size: 1vmax;
 color: black;
 display: block;
 transition: 0.3s;
}

#menub>ul {
//  padding: 8px 8px 8px 32px;
 text-decoration: none;
 font-size: 3vh; //1.5vh; //20px;
//  font-size: 1vmax;
 color: black;
 display: block;
 transition: 0.3s;
}

#menub ul{
 display:inline-block;
 height: 0%;
 font-size: 3vh; //1.5vmax;
 list-style: none;
//clear:right;
 overflow:visible;
}

#menub li:hover a:hover   {
 background: #E6E6E6;
}


@media screen and (max-width:399px)  {
#main {
 color:black;
 width:98%;
 height:94vh; //83vh;
  }
#nav, #rightbar, #jezik, #footer  {
  display:none;
  }
}

@media screen and (max-device-width:399px)  {
#main {
 color:black;
 width:98%;
 height:94vh; //83vh;
  }
#nav, #rightbar, #jezik, #footer  {
  display:none;
  }
}


@media screen and (min-width:400px) and (min-device-width:400px){
#main {
 color:black;
 height:79vh;
// font-size:1.5em;
  }
#rightbar  {
 height:79vh;
  }
#burger, #menub, #closeBtn {
  display:none;
  }
}

#anima {
 top:20%; 
 //left:0%;
 position:absolute; 
} 


#anima {
 top:20%; 
 //left:0%;
 position:absolute; 
} 

#anima1 {
 top:85%;
 right:1%;
 //left:100px;
 position:absolute;
}

#logoL,#logoD {
 width:36px;
 height:32px;
 left:0px;
 //top:0px
}