/* CSS Document */
#graficke {  
  text-align: center;
  font-weight: bold;  
}

#graficke *{  
  color: #000000;  
}

#graficke a:hover{  
  color: #000000;  
}

#graficke .sede{
  background-color: #c2c2c2;
}

#graficke .zlute{
  background-color: #E78E0A;
}

#graficke .cervene{
  background-color: #FF0000;
}

#graficke .zelene{
  background-color: #489E14;
  cursor: pointer;
}

#graficke .zelene:hover{
  background-color: #48FF14;
  
}

#graficke .chyba{
  background-color: #FF0000;
}

#graficke #hlinky_1patro{
  background: #600000 url('../grafika/mapy/hlinky_1patro.png') top left no-repeat;
  width:560px;
  height: 355px;
  position: relative;  
  margin: 0 auto;
}
  /*  #graficke - styly jsou platné pouze v grafickém zobrazeni
      #hlinky_1patro - první patro v penzionu hlinky
      #h102B - pokoj na daném patře. odpovídá šabloně [h/z][$číslo_pokoje], kde h- hlinky, z-zubří  
    */
  #graficke #hlinky_1patro #h102B{
    display: block;
    position: absolute;
    left: 4px;
    top: 4px;
    width: 165px;
    height: 138px;
    line-height: 138px;
  }
  
  #graficke #hlinky_1patro #h102A{
    display: block;
    position: absolute;
    left: 173px;
    top: 4px;
    width: 148px;
    height: 84px;
    line-height: 84px;
  }
  
  #graficke #hlinky_1patro #h101{
    display: block;
    position: absolute;
    left: 324px;
    top: 4px;
    width: 232px;
    height: 137px;
    line-height: 137px;
  }
  
  

#graficke #hlinky_2patro{
  background: #600000 url('../grafika/mapy/hlinky_2patro.png') top left no-repeat;
  width: 560px;
  height: 337px;
  position: relative;  
  margin: 0 auto;
}
  
  #graficke #hlinky_2patro #h201C{
    display: block;
    position: absolute;
    left: 4px;
    top: 4px;
    width: 96px;
    height: 181px;
    line-height: 181px;
  }
  
  #graficke #hlinky_2patro #h201B{
    display: block;
    position: absolute;
    left: 4px;
    top: 239px;
    width: 147px;
    height: 94px;
    line-height: 94px;
  }
  
  #graficke #hlinky_2patro #h201A{
    display: block;
    position: absolute;
    left: 155px;
    top: 189px;
    width: 111px;
    height: 145px;
    line-height: 145px;
  }
  
  #graficke #hlinky_2patro #h202A{
    display: block;
    position: absolute;
    left: 270px;
    top: 189px;
    width: 136px;
    height: 145px;
    line-height: 145px;
  }
  
  #graficke #hlinky_2patro #h202B{
    display: block;
    position: absolute;
    left: 410px;
    top: 189px;
    width: 146px;
    height: 145px;
    line-height: 145px;
  }
  
  #graficke #hlinky_2patro #h202C{
    display: block;
    position: absolute;
    left: 464px;
    top: 4px;
    width: 92px;
    height: 182px;
    line-height: 182px;
  }

#graficke #hlinky_3patro{
  background: #600000 url('../grafika/mapy/hlinky_3patro.png') top left no-repeat;
  width: 560px;
  height: 337px;
  position: relative;  
  margin: 0 auto;
}
  
  #graficke #hlinky_3patro #h301A{
    display: block;
    position: absolute;
    left: 155px;
    top: 189px;
    width: 111px;
    height: 145px;
    line-height: 145px;
  }
  
  #graficke #hlinky_3patro #h301B{
    display: block;
    position: absolute;
    left: 4px;
    top: 189px;
    width: 147px;
    height: 144px;
    line-height: 144px;
  }
  
  #graficke #hlinky_3patro #h301C{
    display: block;
    position: absolute;
    left: 4px;
    top: 4px;
    width: 97px;
    height: 181px;
    line-height: 181px;
  }
  
  #graficke #hlinky_3patro #h302A{
    display: block;
    position: absolute;
    left: 270px;
    top: 189px;
    width: 136px;
    height: 144px;
    line-height: 144px;
  }
  
  #graficke #hlinky_3patro #h302B{
    display: block;
    position: absolute;
    left: 410px;
    top: 189px;
    width: 147px;
    height: 145px;
    line-height: 145px;
  }
  
  #graficke #hlinky_3patro #h302C{
    display: block;
    position: absolute;
    left: 464px;
    top: 4px;
    width: 93px;
    height: 182px;
    line-height: 182px;
  }
  
#graficke #hlinky_4patro{
  background: #600000 url('../grafika/mapy/hlinky_4patro.png') top left no-repeat;
  width: 560px;
  height: 323px;
  position: relative;  
  margin: 0 auto;
}
  
  #graficke #hlinky_4patro #h401{
    display: block;
    position: absolute;
    left: 4px;
    top: 4px;
    width: 252px;
    height: 121px;
    line-height: 121px;
  }
  
  #graficke #hlinky_4patro #h404{
    display: block;
    position: absolute;
    left: 396px;
    top: 4px;
    width: 160px;
    height: 316px;
    line-height: 316px;
  }
  
  #graficke #hlinky_4patro #h402{
    display: block;
    position: absolute;
    left: 4px;
    top: 178px;
    width: 113px;
    height: 142px;
    line-height: 142px;
  }
  
  #graficke #hlinky_4patro #h403{
    display: block;
    position: absolute;
    left: 120px;
    top: 178px;
    width: 105px;
    height: 142px;
    line-height: 142px;
  }
  
#graficke #hlinky_prizemi{
  background: #600000 url('../grafika/mapy/hlinky_prizemi.png') top left no-repeat;
  width: 560px;
  height: 310px;
  position: relative;  
  margin: 0 auto;
}
#graficke #zubri_1patro{
  background: #600000 url('../grafika/mapy/zubri_1patro.png') top left no-repeat;
  width: 560px;
  height: 362px;
  position: relative;  
  margin: 0 auto;
}

  #graficke #zubri_1patro #z16{
    display: block;
    position: absolute;
    left: 14px;
    top: 11px;
    width: 80px;
    height: 120px;
    line-height: 120px;
  }
  
  #graficke #zubri_1patro #z15{
    display: block;
    position: absolute;
    left: 98px;
    top: 11px;
    width: 81px;
    height: 120px;
    line-height: 120px;
  }
  
  #graficke #zubri_1patro #z14{
    display: block;
    position: absolute;
    left: 14px;
    top: 176px;
    width: 80px;
    height: 120px;
    line-height: 120px;
  }
  
  #graficke #zubri_1patro #z13{
    display: block;
    position: absolute;
    left: 98px;
    top: 176px;
    width: 81px;
    height: 120px;
    line-height: 120px;
  }
  
  #graficke #zubri_1patro #z19{
    display: block;
    position: absolute;
    left: 381px;
    top: 67px;
    width: 80px;
    height: 120px;
    line-height: 120px;
  }
  
  #graficke #zubri_1patro #z20{
    display: block;
    position: absolute;
    left: 465px;
    top: 67px;
    width: 80px;
    height: 120px;
    line-height: 120px;
  }
  
  #graficke #zubri_1patro #z17{
    display: block;
    position: absolute;
    left: 381px;
    top: 233px;
    width: 80px;
    height: 120px;
    line-height: 120px;
  }
  
  #graficke #zubri_1patro #z18{
    display: block;
    position: absolute;
    left: 465px;
    top: 233px;
    width: 80px;
    height: 120px;
    line-height: 120px;
  }

#graficke #zubri_prizemi{
  background: #600000 url('../grafika/mapy/zubri_prizemi.png') top left no-repeat;
  width: 560px;
  height: 337px;
  position: relative;  
  margin: 0 auto;
}
  
  #graficke #zubri_prizemi #z6{
    display: block;
    position: absolute;
    left: 10px;
    top: 10px;
    width: 63px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z5{
    display: block;
    position: absolute;
    left: 77px;
    top: 10px;
    width: 65px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z4{
    display: block;
    position: absolute;
    left: 145px;
    top: 10px;
    width: 64px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z3{
    display: block;
    position: absolute;
    left: 10px;
    top: 165px;
    width: 63px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z2{
    display: block;
    position: absolute;
    left: 77px;
    top: 165px;
    width: 65px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z1{
    display: block;
    position: absolute;
    left: 145px;
    top: 165px;
    width: 64px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z10{
    display: block;
    position: absolute;
    left: 354px;
    top: 63px;
    width: 63px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z11{
    display: block;
    position: absolute;
    left: 420px;
    top: 63px;
    width: 65px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z12{
    display: block;
    position: absolute;
    left: 488px;
    top: 63px;
    width: 63px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z7{
    display: block;
    position: absolute;
    left: 351px;
    top: 215px;
    width: 66px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z8{
    display: block;
    position: absolute;
    left: 420px;
    top: 215px;
    width: 65px;
    height: 112px;
    line-height: 112px;
  }
  
  #graficke #zubri_prizemi #z9{
    display: block;
    position: absolute;
    left: 488px;
    top: 215px;
    width: 63px;
    height: 112px;
    line-height: 112px;
  }
  
#graficke #zubri_chatky{
  background: url('../grafika/mapy/zubri_chatky.jpg') top left no-repeat;
  width: 560px;
  height: 433px;
  position: relative;  
  margin: 0 auto;
}
  
  #graficke #zubri_chatky #zch1{
    display: block;
    position: absolute;
    left: 188px;
    top: 67px;
    width: 17px;
    height: 23px;
    line-height: 21px;
  }
  
  #graficke #zubri_chatky #zch2{
    display: block;
    position: absolute;
    left: 237px;
    top: 67px;
    width: 17px;
    height: 23px;
    line-height: 21px;
  }
  
  #graficke #zubri_chatky #zch3{
    display: block;
    position: absolute;
    left: 285px;
    top: 67px;
    width: 17px;
    height: 23px;
    line-height: 21px;
  }
  
  #graficke #zubri_chatky #zch4{
    display: block;
    position: absolute;
    left: 352px;
    top: 1px;
    width: 26px;
    height: 27px;
    line-height: 27px;
  }
  
  #graficke #zubri_chatky #zch5{
    display: block;
    position: absolute;
    left: 385px;
    top: 43px;
    width: 26px;
    height: 27px;
    line-height: 27px;
  }
  
  #graficke #zubri_chatky #zch6{
    display: block;
    position: absolute;
    left: 418px;
    top: 86px;
    width: 26px;
    height: 27px;
    line-height: 27px;
  }
  
  #graficke #zubri_chatky #zch7{
    display: block;
    position: absolute;
    left: 399px;
    top: 161px;
    width: 26px;
    height: 27px;
    line-height: 27px;
  }
  
  #graficke #zubri_chatky #zch8{
    display: block;
    position: absolute;
    left: 443px;
    top: 186px;
    width: 26px;
    height: 27px;
    line-height: 27px;
  }
  
  #graficke #zubri_chatky #zch9{
    display: block;
    position: absolute;
    left: 442px;
    top: 244px;
    width: 26px;
    height: 27px;
    line-height: 27px;
  }
  
  #graficke #zubri_chatky #zch10{
    display: block;
    position: absolute;
    left: 485px;
    top: 269px;
    width: 26px;
    height: 27px;
    line-height: 27px;
  }