html, body{
    height: 100%;
	margin: 0;
	padding: 0;
}

body 
{
background: #A5BD54;
background-image : url('pics/children.gif');
background-size: 100% 120%;  
background-repeat: no-repeat;
}

/*======= glavno menu ============*/
.menu{
    border:0px;
    border-width:0px 0;
    list-style:none;
    margin:0;
    text-align:center;
    padding-top: 20px;
    height: 85px;
}

.menu li{
    display:inline;
}
.menu li a{
    font-family: "Verdana", serif;
    font-size: 20px;
    display:inline-block;
    padding:10px;
    text-decoration: none;
    color: white;
    border: 2px solid white;
    border-radius: 15px;
}

.menu li a:hover{
  border: 2px solid red;
}


.words{
    border:0px;
    border-width:0px 0;
    margin:0;
    text-align:center;
        list-style:none;
}

.words li a{
    font-family: "Verdana", serif;
    font-size: 20px;
    display:inline-block;
    padding:10px;
    text-decoration: none;
    color: white;
    border: 2px solid white;
    border-radius: 15px;
}

.words li a:hover
{
  border: 2px solid red;
}

.menu-top
{
z-index:10;
width: 117px; 
border: 2px solid white; 
position: fixed;
top: 0; 
text-align: center; 
margin: 6px; 
padding: 8px; 
padding-bottom: 4px;
border-radius: 8px;
}

.menu-top-right
{
z-index:10;
width: 110px; 
border: 2px solid white; 
position: fixed;
top: 0;
right: 0;
text-align: center; 
margin: 6px; 
padding: 8px; 
padding-bottom: 4px;
border-radius: 8px;
}

.menu-top-right a {
  text-decoration: none;
  font-style: normal;
  font-size: 15px; 
  font-family: "arial";
  color:white;
}


.menu-bottom-left
{
z-index:10;
position: fixed;
bottom: 0;
left: 0;
margin: 5px;
}

.menu-bottom-right
{
z-index:10;
position: fixed;
bottom: 0;
right: 0;
margin: 5px;
}

.menu-bottom-right a
{
  text-decoration: none;
  font-style: normal;
  font-size: 15px; 
  font-family: "arial";
  color:white;
}

.conteyner
{
position:relative;
}

.box {
display: inline-block;
vertical-align: top;
float: center; 
width: auto;
height: auto;
margin-bottom: 5px;  
}

a.inbox
 {
  text-decoration: none;
  font-style: normal;
  font-size: 15px; 
  font-family: "arial";
  color:black;
 }

.dumi{
display: none;
/*position: absolute; 
top:105px; 
padding-left: 25px;
min-width: 210px;*/
}
 
.shape {
  min-height: 20px;
  min-width: 40px;
  margin-right: 10px;
  padding: 7px;
  margin-bottom: 10px;
  border-radius: 10px;
  border: 2px solid white;  
}

.onhover:hover{
border-color: red;
}

.green-border {  
  border-color: #789430;
}

.orange-border{  
   border-color: #ff7c00;
}

.blue-border {
   border-color: #55a1e5;
}

.bluewhite {  
 background: #55a1e5;
}

.orange {
    background: #ffc90e;
}

.orangedark { 
    background: #ff8000;
}

.green {
    background: #00ff00;
}

.lila {
    background: #a349a4;
}

.white {
    background: white;  
}

.transparent-white {
    /*background-color: rgb(0,0,0);  Fallback color */
    background-color: rgba(255,255,255,0.8); /* Black w/ opacity */
}

.transparent{
    /*background-color: rgb(0,0,0);  Fallback color */
    background-color: rgba(0,0,0,0.5); /* Black w/ opacity */  
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 100; /* Sit on top */
    left: 0;
    top: 0;
    text-align: center;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.5); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    display: inline-block;
    background-color: white;
    margin: 5% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 2px solid #ff8000; /*ffc90e 55a1e5*/
    width: fit-content; /* Could be more or less, depending on screen size */
    border-radius: 15px;
}