@import 'fonts.css';

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, form, label, legend,  caption, tbody, tfoot, thead, tr, th, td {
    margin: 0; padding: 0; border: 0
}
body{margin: 0; padding: 0; background-color: #FFF; font-family: Arial,sans-serif; font-size: 12px; color: #373737}

html,body { height: 100%; min-height: 100%; } /* full browser window height */

#layout { height: auto; min-height: 100%;position: relative;min-width: 1212px } /* 1st level element after body - full browser window height */

ul {
    padding: 5px 0 5px 20px;
}

ul.disc {
    padding: 5px 0 5px 50px;
    list-style-type: disc;
}

ul.circle {
    padding: 5px 0 5px 70px;
    list-style-type: circle;
}

ul.square {
    padding: 5px 0 5px 70px;
    list-style-type: square;
}
ul.decimal {
    padding: 5px 0 5px 50px;
    list-style-type: decimal;
}

ul.malarab {
    padding: 5px 0 5px 30px;
    list-style-type: lower-alpha;
}

.zarovnat {
    display: table-cell;
    vertical-align: middle;
}

.blok {
    background: #ccc;
}



.centerContent .cntBlock .content table.rules_form tbody tr td{padding: 17px 15px}
.centerContent .cntBlock .content table.rules_form tbody tr.first td{background-color: #F1F7FC; border-top: 1px solid #BECFDC; /*padding-top: 0*/}
.centerContent .cntBlock .content table.rules_form thead tr th{border-bottom: 1px solid #BECFDC /*height: 22px; padding-top: 14px*/}

.fl{float: left}
.fr{float: right}
.tleft,.right{text-align: left}
.tright,.left{text-align: right}
.cb,.clear{clear: both}
.b{font-weight: bold}
.i{font-style: italic}
.n{font-weight: normal}
.dn,.none{display: none}
.db{display: block}
.tcenter,.center{text-align: center}
.hidden{display: none}
td{vertical-align: top}

.red{color: #f12b04}
.green{color: #71b002}
.black{color: #373737}
.blue{color: #009ee0}
.vtop{vertical-align: top}
.nowrap{white-space: nowrap}

/* ==================================================== LAYOUT ====================================================== */

a{color: #37a6cc; text-decoration: none}
a:hover{color: #9f9f9f; text-decoration: underline;}

span.btn_x{width: 13px; height: 13px; background-image: url('../images/btn_x.png'); background-position: center center; background-repeat: no-repeat; display: block}

#pageBackground {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 177px;
    background: url('../images/page-bg.png') repeat-y center top;
}

.fullscreen #pageBackground {
    top: 814px
}

.mainArea {
    padding-top: 240px;
    padding-bottom: 60px;
    position: relative;
}

.centerContent {
    width: 1212px;
    margin: auto;
    position: relative;
}


.headerArea {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 250px;
    background: url('../images/header-bg.png') no-repeat center top;
}

.headerArea > .centerContent {
    /*padding-top: 9px;*/
    height: 200px;
}

.headerArea .logo {
    position: absolute;
    left: 8px;
    top: 29px
}

.headerArea .headControls {
    position: absolute;
    top: 29px;
    left: 269px;
    right: 0;
    height: 34px;
    background-color: #0e69a8;
}

.headerArea .headControls .languages {
    position: absolute;
    right: 0;
    top: 0;
    height: 34px;
    padding: 0 9px;
    background-color: #009ee0;
    vertical-align: middle;
}

.headerArea .headControls .languages .item,

.headerArea .headControls .languages .separator{
    float: left;
    line-height: 28px;
    vertical-align: middle;

}

.headerArea .headControls .languages .separator {
    color: #7db6de;
}

.headerArea .headControls .languages .item a {
    color: white;
    text-transform: uppercase;
    font-size: 13px;
    display: block;
    padding: 0 9px;

}


.headerArea .headControls .menu {
    position: absolute;
    left: 0;
    top: 0;
    list-style: none;
    padding: 0 5px;
    margin: 0;
}

.headerArea .headControls .menu li {
    float: left;
    line-height: 30px;
    padding: 0 11px;
}

.headerArea .headControls .menu li.separator {
    color: #7db6de;
    padding: 0;
    font-size: 12px;
}

.headerArea .headControls .menu a {
    text-transform: uppercase;
    color: white;
}

.headerArea .motto {
    position: absolute;
    left: 269px;
    top: 70px;
    font-family: zeppelin33,sans-serif;
    font-size: 24px;
    color: #142d3e;
}

.headerArea .motto2 {
    position: absolute;
    left: 1028px;
    top: 62px;
    font-family: zeppelin33,sans-serif;
    font-size: 11px;
    color: #142d3e;
}
.headerArea .motto span {
    color: #578fb2;
}

/* Vyp / zap pozadi, pouze docasne */
.headerArea .toggleBackground {
    position: absolute;
    right: 3px;
    top: 6px;
    display: block;
    width: 120px;
    text-align: center;
    text-transform: uppercase;
    font-size: 10px;
    font-family: 'zeppelin32',sans-serif;
    color: #009ee0;
    line-height: 22px;
    text-decoration: underline;

}

.headerArea .toggleBackground.turnoff {
    display: none;
}


.mainMenu{position: absolute; left: 0; right: 0; top: 200px; height: 33px; z-index: 5;}
.mainMenu > .menu.list.level1{border-collapse: collapse; padding: 0; background: url('../images/menu-bg.png') repeat-x left bottom; height: 33px}
.mainMenu .menu.item.level1{height: 33px; padding-right: 30px}
.mainMenu .menu.item.level1.last{padding-right: 0}
.mainMenu .menu.item.level1 > div{height: 33px; position: relative; background: url('../images/menu-bg-active.png') repeat-x left bottom}
.mainMenu .menu.item.level1 > div:hover > a,
.mainMenu .menu.item.level1.active > div > a,
.mainMenu .menu.item.level1.activeParent > div > a{background: url('../images/menu-bg-active.png') repeat-x left top}
.mainMenu .menu.item.level1 > div > a{display: block; height: 33px; line-height: 33px; font-family: zeppelin32,sans-serif; font-size: 15px; text-transform: uppercase; text-decoration: none; color: #0e69a8}

.mainMenu .menu.list.level2{display: none; position: absolute; left: 0; top: 33px; background-color: white; border: 1px solid #accee5; border-top: 0 none; padding: 12px 0; list-style: none}
.mainMenu .menu.item.level1 > div:hover > .menu.list.level2{display: block}
.mainMenu .menu.list.level2 > li.menu.item{white-space: nowrap; height: 25px; position: relative}
.mainMenu .menu.list.level2 > li.menu.item a{display: block; height: 25px; line-height: 25px; font-family: zeppelin32,sans-serif; font-size: 14px; color: #0e69a8; text-decoration: none; padding: 0}
.mainMenu .menu.list.level2 > li.menu.item:hover > a span.bgTop{background: url('../images/submenu-bg-active.png') repeat-x left top; display: block}
.mainMenu .menu.list.level2 > li.menu.item > a span.bgTop span.padd{padding: 0 9px; display: block}
.mainMenu .menu.list.level2 > li.menu.item:hover > a span.bgBottom{background: url('../images/submenu-bg-active.png') repeat-x left bottom; display: block}
.mainMenu .menu.list.level2 > li.menu.item:hover > a{color: #009ee0}

.mainMenu .menu.list.level2 > li > a{margin: 0 12px}

.mainMenu .menu.list.level3{display: none; position: absolute; left: 0; top: -13px; background-color: white; border: 1px solid #accee5; padding: 12px; list-style: none}
.mainMenu li.menu.item.level2:hover ul.menu.list.level3{display: block}
.mainMenu .menu.list.level3 > li.menu.item{white-space: nowrap; height: 25px}
.mainMenu .menu.list.level3 > li.menu.item a{display: block; height: 25px; line-height: 25px; font-family: zeppelin32,sans-serif; font-size: 14px; color: #0e69a8; text-decoration: none; padding: 0}
.mainMenu .menu.list.level3 > li.menu.item:hover > a span.bgTop{background: url('../images/submenu-bg-active.png') repeat-x left top; display: block}
.mainMenu .menu.list.level3 > li.menu.item > a span.bgTop span.padd{padding: 0 9px; display: block}
.mainMenu .menu.list.level3 > li.menu.item:hover > a span.bgBottom{background: url('../images/submenu-bg-active.png') repeat-x left bottom; display: block}
.mainMenu .menu.list.level3 > li.menu.item:hover > a{color: #009ee0}


.mainMenu a span.label{display: block;}
.mainMenu a span.external_ico{width: 13px; height: 12px; background-image: url('../images/ext_link.png'); background-repeat: no-repeat; background-position: right bottom; display: block; float: left}
.mainMenu a img.extlink {padding-left: 5px;}


.footArea {
    position: relative;
}


.centerContent .area{margin: 1px 0 25px; padding: 25px; border: 1px solid #becfdc; border-bottom: 2px solid #becfdc}
.centerContent .area.full{margin: 0; padding: 0; border: none}
.centerContent .area h1{color: #0e69a8; font-weight: normal; font-size: 22px; margin-bottom: 10px}

.languages .active{font-weight: bold; text-decoration: underline; color: #FFF}
.languages .active:hover{text-decoration: none}
/* ===================================================== CONTENT BLOCKS AND TABLES ================================== */
.centerContent .contentBlock.simple h2{color: #0e69a8; font-weight: normal; font-size: 17px; margin-bottom: 15px; padding-top: 10px; border-top: 1px solid #becfdc}
.centerContent .contentBlock.simple{margin-bottom: 10px}

.centerContent h2.min{color: #0e69a8; font-weight: normal; font-style: italic; font-size: 17px; margin-bottom: 15px}

.centerContent .cntBlock.mini{width: 555px}
.centerContent .cntBlock.mini .content{padding: 18px}
.centerContent .cntBlock.mini .content a{color: #0e69a8}

.centerContent .cntBlock h2{color: #0e69a8; border-bottom: 4px solid #0e69a8; line-height: 30px; font-size: 16px; font-weight: normal; text-align: center}
.centerContent .cntBlock .content{padding: 18px 30px; background-color: #f1f7fc}
.centerContent .cntBlock .content table{width: 100%; border: 1px solid #becfdc; border-collapse: collapse;}
.centerContent .cntBlock .content table thead th{height: 35px; padding: 0 0 0 15px; font-weight: bold; font-size: 13px; color: #0e69a8; background-color: #f1f7fc; vertical-align: middle; text-align: left}
.centerContent .cntBlock .content table tbody td{height: 35px; padding: 0 0 0 15px; font-size: 13px; background-color: #FFF; color: #121a20; vertical-align: middle}
.centerContent .cntBlock .content table tbody tr.hl td{background-color: #f1f7fc}
.centerContent .cntBlock .content table tbody td a{color: #009ee0; font-weight: normal; text-decoration: underline; display: block;}
.centerContent .cntBlock .content table tbody td a:hover{text-decoration: none}

.centerContent .cntBlock .content table.tab{width: auto; border: none; border-collapse: collapse}
.centerContent .cntBlock .content table.tab tbody th{height: 35px; padding: 0 20px 0 5px; font-size: 13px; color: #0e69a8; text-align: left; border-bottom: 1px solid #becfdc;}
.centerContent .cntBlock .content table.tab tbody td{height: 35px; padding: 0 15px 0 5px; font-size: 13px; color: #121a20; text-align: left; background: none; border-bottom: 1px solid #becfdc;}
.centerContent .cntBlock .content table.tab tbody td a{color: #009ee0; font-weight: normal; text-decoration: underline}
.centerContent .cntBlock .content table.tab tbody td a:hover{text-decoration: none}
.centerContent .cntBlock .content table.tab tbody tr.last th,
.centerContent .cntBlock .content table.tab tbody tr.last td{border: none}

.centerContent .cntBlock .content table.no{border: none}
.centerContent .cntBlock .content table.no th,
.centerContent .cntBlock .content table.no td{background: none}

.centerContent .cntBlock .content .footerLink{line-height: 24px; height: 24px; display: block; float: right}
.centerContent .cntBlock .content .footerLink a{font-size: 12px; text-decoration: underline}
.centerContent .cntBlock .content .footerLink a:hover{text-decoration: none}

.centerContent .cntBlock .contentWhite{border: 1px solid #BECFDC; border-top: none; background-color: #FFF; margin-bottom: 40px}
.centerContent .cntBlock .contentWhite table.marks{width: 100%}
.centerContent .cntBlock .contentWhite table.marks td{padding: 20px; vertical-align: middle}
.centerContent .cntBlock .contentWhite table.marks td.thumb{width: 300px}
.centerContent .cntBlock .contentWhite table.marks tr td{border-bottom: 1px solid #BECFDC}
.centerContent .cntBlock .contentWhite table.marks.noBorder tr td{border: none}
/*.centerContent .cntBlock .content table tbody td .ico{margin: 0px 15px 0px 5px}*/

.centerContent .cntBlock .firstUpper th,
.centerContent .cntBlock .firstUpper td{text-transform: capitalize}
.centerContent .cntBlock .content th.center,
.centerContent .cntBlock .content td.center{text-align: center}

.centerContent .cntBlock.warn{color: #8c1400}
.centerContent .cntBlock.warn h2{color: #c11d02; border-bottom: 4px solid #c11d02}
.centerContent .cntBlock.warn .content{background-color: #fdf5f4; margin-bottom: 3px}
.centerContent .cntBlock.warn .warnImg{width: 30px; height: 90px; margin-right: 20px; background-image: url('../images/warn.png'); background-position: center center; background-repeat: no-repeat; display: block}
.centerContent .cntBlock.warn .title{color: #c11d02; font-size: 16px; font-weight: bold; margin-bottom: 4px; display: block}
.centerContent .cntBlock.warn strong{color: #0e69a8}
.centerContent .cntBlock.warn a{color: #0e69a8; font-family: zeppelin32; font-size: 14px; text-decoration: underline}
.centerContent .cntBlock.warn a:hover{text-decoration: none}
.centerContent .cntBlock .arrMini{width: 15px; height: 22px; background-image: url('../images/arr_mini.png'); background-position: left center; background-repeat: no-repeat; display: block}

.centerContent .cntBlock .content .pagination table{width: auto; border: none}

.centerContent .cntBlock .content table.nts th{padding: 3px 10px}
.centerContent .cntBlock .content table.nts .rowsClickCnt td{/*cursor: pointer;*/ padding: 3px 10px}
.centerContent .cntBlock .content table.nts .rowsClickCnt tr:hover td{color: #9f9f9f}

.centerContent .cntBlock .content table.vertical td{height: 30px}
.centerContent .cntBlock .content table.vertical th{width: 40%; background-color: #FFF; color: #0e69a8; font-size: 14px; font-weight: normal; text-align: left; padding-left: 20px; height: 30px}
.centerContent .cntBlock .content table.vertical tr.hl th{background-color: #F1F7FC}

.contentBlock.nts{position: relative}


/* ====================================================== NAVIGATION BREADCRUMBS ==================================== */
.navigation.breadcrumbs{background-color: #ddeaf3}
.navigation.breadcrumbs ul{list-style: none}
.navigation.breadcrumbs ul li{height: 35px; color: #1a364a; background-image: url('../images/bc_arrow.png'); background-position: right; background-repeat: no-repeat; float: left}
.navigation.breadcrumbs ul li.last{background-image: none}
.navigation.breadcrumbs ul{padding: 0}
.navigation.breadcrumbs a{display: block; padding: 0px 25px 0px 15px; line-height: 35px; color: #0e69a8; text-decoration: underline; }
.navigation.breadcrumbs ul li.last span{display:  block; padding: 0 25px 0 10px; line-height: 35px}
.navigation.breadcrumbs a:hover{text-decoration: none}



/* ============================================== NEWS ITEMS ======================================================== */
.news.list.main .news{font-size: 13px; line-height: 20px}
.news.list.main .news.items{border-left: 4px solid #0e69a8}
.news.list.main .news.item{margin-bottom: 50px}
.news.list.main .news.item .date{padding-left: 20px; color: #0e69a8; line-height: 26px; font-size: 13px; font-style: italic; background-image: url('../images/date_arrow.png'); background-repeat: no-repeat; background-position: left center; display: block}
.news.list.main .news.item h2 a{color: #0e69a8; font-size: 15px; font-weight: normal; font-family: zeppelin32}
.news.list.main .news.item a.more{color: #0e69a8; line-height: 18px; font-size: 14px; text-decoration: underline; font-family: zeppelin32; font-style: italic}
.news.list.main .news.item a:hover.back{text-decoration: none}
.news.list.main .news .arrMini{width: 15px; height: 22px; background-image: url('../images/arr_mini.png'); background-position: left center; background-repeat: no-repeat; display: block}
.news.list.main .news.item .thumb{padding: 0 20px; float: left;}
.news.list.main .news.item .odd{padding-left: 20px}

.news.detail .date{color: #0e69a8; line-height: 26px; font-size: 13px; font-style: italic; display: block}
.news.detail .thumb{padding: 0 22px 15px 0; float: left;}

.databoxes .news.list .arrMmini{width: 15px; height: 25px; background-image: url('../images/arrow_mini_9x10.png'); background-position: left center; background-repeat: no-repeat; display: block}
.databoxes .news.list a.arrLink{line-height: 22px; font-style: italic; font-family: zeppelin32; color: #0e69a8; font-size: 14px; text-decoration: underline}
.databoxes .news.list a.arrLink:hover{text-decoration: none}



/*
.news .pagination table{margin: 0 auto}
.news .pagination td{padding: 0 10px; font-size: 15px; line-height: 28px}
.news .pagination td.active{padding: 0 7px; background-color: #f1f7fc; color: #121a20}
.news .pagination a{text-decoration: underline}
.news .pagination a:hover{color: #37A6CC; text-decoration: none}
.news .pagination td.prev a{background-image: url('../images/pager_arr_l.png'); background-position: left 8px; background-repeat: no-repeat; padding-left: 18px; display: block}
.news .pagination td.next a{background-image: url('../images/pager_arr_r.png'); background-position: right 8px; background-repeat: no-repeat; padding-right: 18px; display: block}
*/



/* ================================================ WATERWAYS CZ ==================================================== */
.waterways .cntBlock .content .pagination{position: relative; bottom: -18px}
.waterways .cntBlock .content .pagination td{padding: 0 10px; font-size: 15px; line-height: 28px; background-color: #F1F7FC}
.waterways .cntBlock .content .pagination td.active{padding: 0 7px; background-color: #FFF; color: #121a20}
.waterways .cntBlock .content .pagination td.disabled a{text-decoration: none; color: #121a20}
.waterways select{width: 225px}
.waterways tr.trasy input,
.waterways tr.trasy label{float: left}
.waterways tr.trasy br{display: none}
.waterways tr.trasy label{padding-right: 30px}
.centerContent .cntBlock.waterways .content{padding: 20px 12px}
.waterways .sep{float: left; width: 1px; height: 140px; background-color: #BECFDC}



/* ===================================================== FORMS ====================================================== */
label{font-size: 13px; line-height: 20px; color: #121a20}
input.button1{position: relative; top: -3px; left: -2px; padding: 8px 15px; background-color: #DDEAF3; border: none; color: #FFF; font-family: arial; font-size: 16px; border-radius: 2px; -moz-border-radius: 2px; cursor: pointer}
input.button2{position: relative; top: -3px; left: -2px; padding: 8px 15px; background-color: #0E69A8; border: none; color: #FFF; font-family: arial; font-size: 16px; border-radius: 2px; -moz-border-radius: 2px; cursor: pointer}
.buttonSh{float: left; background-color: #A5BDD6; border: none; font-family: arial; font-size: 16px; border-radius: 2px; -moz-border-radius: 2px}
.buttonSh1{float: left; background-color: #A5BDD6; border: none; font-family: arial; font-size: 16px; border-radius: 2px; -moz-border-radius: 2px}
.buttonSh2{float: left; background-color: #A5BDD6; border: none; font-family: arial; font-size: 16px; border-radius: 2px; -moz-border-radius: 2px}
.buttonSh a.button{position: relative; top: -3px; left: -2px; padding: 9px 15px; background-color: #009ee0; border: none; color: #FFF; font-family: arial; font-size: 16px; border-radius: 2px; -moz-border-radius: 2px; cursor: pointer; white-space: nowrap; display: block}
.buttonSh.nonactive a.button{background-color: #e3e8ed; cursor: default}
.buttonSh.nonactive{background-color: #009ee0;}
.buttonSh a.button:hover{text-decoration: none}
#achjo td a{color: #FFF; text-decoration: none}

select{padding: 6px 6px 4px; font-size: 13px; color: #4b5760; border: 1px solid #becfdc; border-radius: 2px; -moz-border-radius: 2px; box-shadow: 2px 3px 5px 0 rgba(0, 0, 0, 0.09) inset}
select option{padding: 0}
input.checkbox{border: 1px solid #becfdc; display: block}
input.text{padding: 7px 6px 4px; color: #4b5760; font-size: 13px; border: 1px solid #becfdc; border-radius: 2px; -moz-border-radius: 2px; box-shadow: 2px 3px 5px 0 rgba(0, 0, 0, 0.09) inset; background-color: #FFF}
select.disabled,
input.text.disabled{color: #E4E4E4; border: 1px solid #E4E4E4}


div.content div span.form-error-message{padding-left: 10px; font-weight: bold; color: #FF495F}

input.button_send {
  background-color: #eeeeee;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc));
  background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
  background-image: linear-gradient(top, #eeeeee, #cccccc);
  border: 1px solid #ccc;
  border-bottom: 1px solid #bbb;
  border-radius: 3px;
  color: #0E69A8;
  font: bold 11px/1 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  padding: 8px 0;
  text-align: center;
  text-shadow: 0 1px 0 #eee;
  width: 120px;
  height: 30px; }
  
  input.button_send:hover {
    background-color: #dddddd;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #bbbbbb));
    background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: linear-gradient(top, #dddddd, #bbbbbb);
    border: 1px solid #bbb;
    border-bottom: 1px solid #999;
    cursor: pointer;
    text-shadow: 0 1px 0 #ddd; }
  input.button_send:active {
    border: 1px solid #aaa;
    border-bottom: 1px solid #888;
    -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; }

input.button_send2 {
  background: url('../public/files/aaa.png');
  width: 230px;
  height: 40px; }

input.button_hk {
  background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc)); background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc); background-image: -moz-linear-gradient(top, #eeeeee, #cccccc); background-image: -ms-linear-gradient(top, #eeeeee, #cccccc); background-image: -o-linear-gradient(top, #eeeeee, #cccccc); background-image: linear-gradient(top, #eeeeee, #cccccc); border: 1px solid #ccc; border-bottom: 1px solid #bbb; border-radius: 3px; color: #0E69A8; font: bold 12px/1 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; padding: 8px 0; text-align: center;  text-shadow: 0 1px 0 #eee;
  color:#0E69A8!important;text-shadow: 0 1px 0 #eee;background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc)); background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc); background-image: -moz-linear-gradient(top, #eeeeee, #cccccc); background-image: -ms-linear-gradient(top, #eeeeee, #cccccc); background-image: -o-linear-gradient(top, #eeeeee, #cccccc); background-image: linear-gradient(top, #eeeeee, #cccccc);!important;border:5px solid #FFF;border-radius:3px;box-shadow:none!important; padding: 8px 0; text-align: center; font: bold 12px/1 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  width: 750px;
  height: 50px; }
  
  input.button_hk:hover {
    background-color: #dddddd;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #bbbbbb));
    background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: linear-gradient(top, #dddddd, #bbbbbb);
    border: 1px solid #bbb;
    border-bottom: 1px solid #999;
    cursor: pointer;
    text-shadow: 0 1px 0 #ddd; }
  input.button_hk:active {
    border: 1px solid #aaa;
    border-bottom: 1px solid #888;
    -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; }
  
input.button_nast {
  background-color: #eeeeee;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc));
  background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
  background-image: linear-gradient(top, #eeeeee, #cccccc);
  border: 1px solid #ccc;
  border-bottom: 1px solid #bbb;
  border-radius: 3px;
  color: #0E69A8;
  font: bold 12px/1 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  padding: 8px 0;
  text-align: center;
  text-shadow: 0 1px 0 #eee;
  width: 200px;
  height: 30px; }
  
  input.button_nast:hover {
    background-color: #dddddd;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #bbbbbb));
    background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: linear-gradient(top, #dddddd, #bbbbbb);
    border: 1px solid #bbb;
    border-bottom: 1px solid #999;
    cursor: pointer;
    text-shadow: 0 1px 0 #ddd; }
  input.button_nast:active {
    border: 1px solid #aaa;
    border-bottom: 1px solid #888;
    -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; }

input.button_save {

  background-image: url(/public/files/save.png);
  padding-top: 10px; 
  padding-left: 16px;     
  vertical-align: middle; 
  background-repeat: no-repeat;
  background-color: #eeeeee;
  border: 1px solid #ccc;
  border-bottom: 1px solid #bbb;
  border-radius: 3px;
  color: #0E69A8;
  font: bold 11px/1 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  padding: 8px 0;
  text-align: center;
  text-shadow: 0 1px 0 #eee;
  width: 154px;
  height: 40px; }
  
  input.button_send:hover {
    background-color: #dddddd;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #bbbbbb));
    background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: linear-gradient(top, #dddddd, #bbbbbb);
    border: 1px solid #bbb;
    border-bottom: 1px solid #999;
    cursor: pointer;
    text-shadow: 0 1px 0 #ddd; }
  input.button_send:active {
    border: 1px solid #aaa;
    border-bottom: 1px solid #888;
    -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; }

input.button_vstoupit {
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #003C69);
  background-image: -moz-linear-gradient(top, #3498db, #003C69);
  background-image: -ms-linear-gradient(top, #3498db, #003C69);
  background-image: -o-linear-gradient(top, #3498db, #003C69);
  background-image: linear-gradient(to bottom, #3498db, #003C69);
  -webkit-border-radius: 46;
  -moz-border-radius: 46;
  border-radius: 46px;
  text-shadow: 1px 1px 3px #666666;
  -webkit-box-shadow: 0px 1px 3px #666666;
  -moz-box-shadow: 0px 1px 3px #666666;
  box-shadow: 0px 1px 3px #666666;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}

input.button_vstoupit:hover {
  background: #a5b4bd;
  background-image: -webkit-linear-gradient(top, #a5b4bd, #33383b);
  background-image: -moz-linear-gradient(top, #a5b4bd, #33383b);
  background-image: -ms-linear-gradient(top, #a5b4bd, #33383b);
  background-image: -o-linear-gradient(top, #a5b4bd, #33383b);
  background-image: linear-gradient(to bottom, #a5b4bd, #33383b);
  text-decoration: none;
}

input.button_odeslat {
  background: # f5f5f5;
  background-image: -webkit-lineární gradient (top, # f5f5f5, #ababab);
  background-image: -moz-lineární gradient (top, # f5f5f5, #ababab);
  background-image: -ms-lineární gradient (top, # f5f5f5, #ababab);
  background-image: -o-lineární gradient (top, # f5f5f5, #ababab);
  background-image: lineární gradient (dolů, # f5f5f5, #ababab);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: Arial;
  color: # 003C69;
  font-size: 20 pixelů;
  padding: 10px 20px 10px 20 pixelů;
  text-decoration: none;
}

input.button_odeslat: hover {
  background: #ffffff;
  background-image: -webkit-lineární gradient (top, #ffffff, #ffffff);
  background-image: -moz-lineární gradient (top, #ffffff, #ffffff);
  background-image: -ms-lineární gradient (top, #ffffff, #ffffff);
  background-image: -o-lineární gradient (top, #ffffff, #ffffff);
  background-image: lineární gradient (na spodní, #FFFFFF, #FFFFFF);
  text-decoration: none;
}

.navigace a {border: 0}
.navigace a:hover {background: #EEEEEE; color: #606060; line-height: 2em}

.navigace {width: 280px}
.navigace, ul {list-style: none; padding: 0; margin: 0}

.navigace li {display: block;}
.navigace li a {display: block; padding: .5em 10px; color: #ffffff}
.navigace > li {position: relative; margin-bottom: .2em;  border: 1px solid transparent; height: 3em; background: #003C69}
.navigace > li:hover {border: 1px solid #C0C0C0; z-index: 1}
.navigace > li > a {position: absolute; top: 0; left: 0; width: 260px; line-height: 2em; background: #003C69}
.navigace > li:hover > a {z-index: 11}
.navigace li ul {display: none; position: absolute; left: 260px; top: -1px; width: 620px; padding-left: 20px; background: #003C69; border: 1px solid #C0C0C0; border-bottom-width: 3px; z-index: 10}
.navigace li:hover ul {display: block;}

.navigace ul li {display: block; float: left;}
.navigace ul a {float: left; width: 184px; text-align: center;}
.navigace ul a:hover {text-decoration: none; background: #0D6AB7; color: #fff}

/*=======================víceúrovňové menu=============================*/
ul#navbar-light {

width: 690px;

height: auto;

background: #fff;

float: left;

list-style: none;

padding-left: 0px;

}


ul#navbar-light li {

width: auto;

height: auto;

float: left;

display: block;

position: relative; /* zmena o proti puvodnimu kodu -  relativni pozice pro zaveseni menu druhe urovne */

}


ul#navbar-light li a{

width: auto;

height: auto;

padding: 11px 20px;

font-size: 14px;

font-family: Arial;

color: #000;

float: left;

text-decoration: none;

border-bottom: 3px solid #0edaff;

border-right: none;

border-top: 1px solid #ababab;

border-left: 1px solid #ababab;

-webkit-transition: border-bottom 1s; /* Efekt prechodu */

-moz-transition: border-bottom 1s;

-o-transition: border-bottom 1s;

transition: border-bottom 1s;

}


ul#navbar-light li a:hover{

border-bottom: 3px solid #0e6eff;

-webkit-transition: border-bottom 1s; /* Efekt prechodu */

-moz-transition: border-bottom 1s;

-o-transition: border-bottom 1s;

transition: border-bottom 1s;

}


ul#navbar-light li:last-child a{

border-right: 1px solid #ababab;

}


/* Druha uroven */


ul#navbar-light li ul{

position: absolute; /* nastaveni absolutni pozice */

top: 40px; /* absolutni pozice zeshora */

left: 0px; /* absolutni pozice zleva k polozce menu */

width: auto;

height: auto;

list-style: none;

z-index: 10;

padding-left: 0;

display: none;

}


ul#navbar-light li:hover ul{

display: block;

}


ul#navbar-light li:hover a {

  border-bottom: 3px solid #0e6eff;

  -webkit-transition: border-bottom 1s; /* Efekt prechodu */

  -moz-transition: border-bottom 1s;

  -o-transition: border-bottom 1s;

  transition: border-bottom 1s;

}


ul#navbar-light li:hover li a {

  border-bottom: 3px solid #0edaff;

  -webkit-transition: border-bottom 1s; /* Efekt prechodu */

  -moz-transition: border-bottom 1s;

  -o-transition: border-bottom 1s;

  transition: border-bottom 1s;

}


ul#navbar-light li:hover li a:hover {

border-bottom: 3px solid #0e6eff;

}


ul#navbar-light li ul li a{

width: 160px;

height: auto;

padding: 11px 20px;

font-size: 14px;

font-family: Arial;

color: #000;

float: left;

text-decoration: none;

border-right: 1px solid #ababab;

border-top: none;

border-left: 1px solid #ababab;

-webkit-transition: border-bottom 1s; /* Efekt prechodu */

-moz-transition: border-bottom 1s;

-o-transition: border-bottom 1s;

transition: border-bottom 1s;

}


/* Treti uroven */


ul#navbar-light li ul li ul{

position: absolute; /* nastaveni absolutni pozice */

top: 0px; /* absolutni pozice zeshora */

left: 200px; /* absolutni pozice zleva k polozce menu */

width: auto;

height: auto;

list-style: none;

z-index: 10;

padding-left: 0;

display: none !important;

}


ul#navbar-light li ul li:hover ul{

display: block !important;

}


ul#navbar-light li ul li:hover a {

  border-bottom: 3px solid #0e6eff;

}


ul#navbar-light li ul li:hover li a {

  border-bottom: 3px solid #0edaff;

  -webkit-transition: border-bottom 1s; /* Efekt prechodu */

  -moz-transition: border-bottom 1s;

  -o-transition: border-bottom 1s;

  transition: border-bottom 1s;

}


ul#navbar-light li:hover ul li:hover li a:hover {

border-bottom: 3px solid #0e6eff;

-webkit-transition: border-bottom 1s; /* Efekt prechodu */

-moz-transition: border-bottom 1s;

-o-transition: border-bottom 1s;

transition: border-bottom 1s;

}


ul#navbar-light li ul li ul li a{

width: 160px;

height: auto;

padding: 11px 20px;

font-size: 14px;

font-family: Arial;

color: #000;

float: left;

text-decoration: none;

border-right: 1px solid #ababab;

border-top: none;

border-left: 1px solid #ababab;

}


ul#navbar-light li ul li ul li:first-child a{

border-top: 1px solid #ababab;

border-left: none;

}





/* ================================================== PAGINATION ==================================================== */
#sitemap ul{list-style: none}
#sitemap ul li{margin: 10px}
#sitemap ul li ul{padding-top: 0}


/* ================================================== PAGINATION ==================================================== */
.pagination table{margin: 0 auto}
.pagination td{padding: 0 10px; font-size: 15px; line-height: 28px}
.pagination td.active{padding: 0 7px; background-color: #f1f7fc; color: #121a20}
.pagination a{text-decoration: underline}
.pagination a:hover{color: #37A6CC; text-decoration: none}
.pagination td.prev a{background-image: url('../images/pager_arr_l.png'); background-position: left 8px; background-repeat: no-repeat; padding-left: 18px; display: block}
.pagination td.next a{background-image: url('../images/pager_arr_r.png'); background-position: right 8px; background-repeat: no-repeat; padding-right: 18px; display: block}
.pagination a.disabled{text-decoration: none; color: #121a20}


/* ================================================== DATATABLES ==================================================== */
/*.dataTables_processing{display: none; position: absolute; z-index: 10; top: 150px; left: 50%; margin-left: -125px; width: 250px; height: 60px; border: 1px solid #F6F6F6; background-color: #FFF; background-image: url('../images/loader.gif'); background-position: center center; background-repeat: no-repeat}

.dgSearch{float: right}
.dgSearch input{padding: 6px 6px 3px; color: #535353; margin-top: 1px; font-size: 12px; border: 1px solid #CBCBCB; border-radius: 2px; -moz-border-radius: 2px; color: #535353; box-shadow: 2px 3px 5px 0 rgba(0, 0, 0, 0.09) inset; background-color: #FFF}
.dgSearch input.inact{color: #CBCBCB}
*/


.cntBlock #datagrid thead td{line-height: 39px; color: #0E69A8; font-weight: bold}

.dgBottom{margin-top: 10px}
.countPerPage{color: #135C74; float: left}

#datagrid td.ico{padding-left: 5px; padding-right: 5px}
#datagrid td.ico.older img{cursor: pointer}
#datagrid td{padding: 5px 5px 0 27px}
#datagrid tbody tr.even td{background-color: #F1F7FC}
#datagrid tbody tr{cursor: default}
#datagrid tr:hover td{color: #666}
#datagrid .sorting_asc{background: url('../images/table/sort_asc.png') no-repeat 8px 11px; cursor: pointer}
#datagrid .sorting_desc{background: url('../images/table/sort_desc.png') no-repeat 8px 11px; cursor: pointer}
#datagrid .sorting{background: url('../images/table/sort_both.png') no-repeat 8px 11px; cursor: pointer}
#datagrid .sorting_asc_disabled{background: url('../images/table/sort_asc_disabled.png') no-repeat 8px 11px}
#datagrid .sorting_desc_disabled{background: url('../images/table/sort_desc_disabled.png') no-repeat 8px 11px}
#datagrid .dataTables_empty{text-align: center; font-style: italic}

#datagrid td.details{padding: 0 0 10px; background-color: #FFF}
#datagrid tr.topShadow{box-shadow: 0px 3px 3px -2px #BBBBBB inset;}
#datagrid tr.bottomShadow{box-shadow: 0px -3px 3px -2px #BBBBBB inset;}

.paginator{margin-top: 3px; font-size: 13px; float: right}
.paging_full_numbers .paginate_button{display: none}

.paging_full_numbers span{float: left; display:  block}
.paging_full_numbers span a{text-decoration: none; cursor: pointer}
.paging_full_numbers span a.paginate_active{padding: 0 9px 0; line-height: 22px; color: #37A6CC; border-bottom: 2px solid #37A6CC; font-weight: bold; float: left; display: block}
.paging_full_numbers span a.paginate_button{width: auto; height: auto; padding: 4px 9px 3px; color: #135C74; font-weight: bold; background: none; float: left; display: block}
.paging_full_numbers span a.paginate_button:hover{color: #37A6CC}

.ui-tooltip.ui-widget-content{font-size: 13px}

#nts_loader{
    display: none;
    position: fixed; z-index: 999; width: 100%; height: 100%; min-width: 100%; min-width: 100%; top: 0px; left: 0px; right: 0px; bottom: 0px;
    background-color: #FFF; background-image: url('../images/loader.gif'); background-position: center 300px; background-repeat: no-repeat;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -moz-opacity:0.50; -khtml-opacity: 0.50; opacity: 0.50
}

/* ====================================================== FOOTER MENUS ============================================== */

.footArea .partners {
    width: 1210px;
    height: 100px;
    border: 1px solid #becfdc;
    padding-bottom: 55px;
}

.footArea .partners .menuSimple .title {
    display: block;
    clear: both;
    text-align: center;
    color: #0e69a8;
    font-size: 16px;
    margin-bottom: 0px;
    height: 20px
}

.footArea .partners .menuSimple {
    float: left;
    position: relative;
    top: -28px;
    left: 65px
}

.footArea .partners .menuSimple ul {
    border-top: 7px solid #0e69a8;
    list-style-type: none;
    padding: 0px;
}

.footArea .partners .menuSimple ul li {
    float: left;
    margin: 10px 17px;
    text-align: center;
}

.footArea .partners .menu li .title {
    display: block;
    clear: both;
    text-align: center;
    color: #0e69a8;
    font-size: 16px;
    margin-bottom: 18px
}

.footArea .partners .menu {
    float: right;
    position: relative;
    top: -8px;
    right: 65px
}

.footArea .partners .menu ul {
    border-top: 7px solid #0e69a8;
    list-style-type: none;
    padding: 0px;
}

.footArea .partners .menu ul li {
    float: left;
    margin: 0 25px;
    text-align: center;
    position: relative;
    top: -27px;
}

.footArea .partners .menuSimple ul li.first,
.footArea .partners .menu ul li.first {
    margin-left: 0;
}

.footArea .partners .menuSimple ul li.last,
.footArea .partners .menu ul li.last {
    margin-right: 0;
}

.footArea .partnersMenuSimple .title {
    display: block;
    text-align: center;
    color: #0e69a8;
    font-size: 16px;
    border-bottom: 7px solid #0e69a8;
}

.footArea .partnersMenuSimple {
    margin: 0 auto;
    position: relative;
    top: -28px;
}

.footArea .partnersMenuSimple .m td {
    padding:  10px 25px
}

.footArea .partnersMenuSimple .m td.first {
    padding-left: 60px
}

.footArea .partnersMenuSimple .m td.last {
    padding-right: 60px
}



/* ====================================================== FOOTER COPYRIGHT ========================================== */

.footArea .copyright {
    text-align: center;
}

.footArea .copyright .iris {
    padding-right: 38px;
}



/* ===================================================== DATABOX CONTAINER ========================================== */
.databoxes .box {
    position: relative;
    min-width: 100px;
    min-height: 100px;
}
.databoxes .box > .bg {
    position: absolute;
}
.databoxes .box > .bg.topleft,
.databoxes .box > .bg.topright{top: 0; height: 32px;}
.databoxes .box > .bg.left,
.databoxes .box > .bg.right {width: 1px; top: 32px; bottom: 0; background-color: #becfdc;}
.databoxes .box > .bg.background {
    left: 2px;
    top: 2px;
    bottom: 2px;
    right: 2px;
    background-color: #f8fafc;
}
.databoxes .box > .bg.topleft {
    width: 41px;
    left: 0;
    background: url('../images/home-box-topleft.png') no-repeat;
    padding: 2px 0 0 2px;
}
.databoxes .box > .bg.topright {
    left: 41px;
    right: 0;
    padding-left: 8px;
    background-color: #0e69a8;
    color: #ffffff;
    font-family: Arial,sans-serif;
    font-size: 15px;
    font-weight: bold;
    line-height: 32px;
}
.databoxes .box > .bg.left {left: 0;}
.databoxes .box > .bg.right {right: 0;}
.databoxes .box > .bg.bottom {
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background-color: #becfdc;
}
.databoxes .box > .inner {
    position: relative;
    padding: 32px 2px 2px 2px;
    font-size: 13px;
}

.databoxes .box > .inner.loading {
    text-align: center;
    height: 150px;
    padding-top: 100px;
}



/* ============================================== DATABOX CONTAINER - news ========================================== */
.databoxes .box.novinky .news.list {
    padding: 16px 30px;
    font-size: 13px;
}
.databoxes .box.novinky .news.list .item {
    padding-bottom: 22px;
}
.databoxes .box.novinky .news.list .item .date {
    font-style: italic;
    color: #121a20;
}
.databoxes .box.novinky .news.list .item .title {
    padding-left: 12px;
    background: url('../images/arrow-mini.png') no-repeat 0 6px;
}
.databoxes .box.novinky .news.list .item .title a {
    color: #009ee0;
}



/*==================================================== HOME - DATA =================================================== */

.homeMenu {
    height: 30px;
}

.homeMenu > .menuItem {
    float: left;
    position: relative;
}

.homeMenu > .menuItem .leftBorder {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
}

.homeMenu > .menuItem.data {
    padding-left: 11px;
}

.homeMenu > .menuItem.data > .leftBorder {
    width: 11px;
    background: url('../images/home-menu-bg.png') no-repeat 0 0;
}

.homeMenu > .menuItem.data.active > .leftBorder,
.homeMenu > .menuItem.data:hover > .leftBorder{
    background-position: 0 -30px;
}


.homeMenu > .menuItem.map {
    padding: 0 0 0 18px;
}

.homeMenu > .menuItem.waterways {
    padding: 0 18px;
}

.homeMenu > .menuItem.map > .leftBorder {
    width: 18px;
    background: transparent url('../images/home-menu-bg.png') no-repeat 0 -60px;
}

.homeMenu > .menuItem.map > .leftBorder,
.homeMenu > .menuItem.waterways > .leftBorder {
    width: 18px;
    background: #b9c9d3;
}

.homeMenu > .menuItem.map.active > .leftBorder,
.homeMenu > .menuItem.map:hover > .leftBorder,
.homeMenu > .menuItem.waterways.active > .leftBorder,
.homeMenu > .menuItem.waterways:hover > .leftBorder{
    background: transparent url('../images/home-menu-bg.png') no-repeat 0 -90px;
}

.homeMenu > .menuItem.data.active + .menuItem.map > .leftBorder,
.homeMenu > .menuItem.data.active + .menuItem.map > .leftBorder,
.homeMenu > .menuItem.data:hover + .menuItem.map > .leftBorder,
.homeMenu > .menuItem.map.active + .menuItem.waterways > .leftBorder,
.homeMenu > .menuItem.map.active + .menuItem.waterways > .leftBorder,
.homeMenu > .menuItem.map:hover + .menuItem.waterways > .leftBorder {
    background: transparent url('../images/home-menu-bg.png') no-repeat 0 -60px;
}


.homeMenu > .menuItem.data.active + .menuItem.map.active > .leftBorder,
.homeMenu > .menuItem.data.active + .menuItem.map:hover > .leftBorder,
.homeMenu > .menuItem.data:hover + .menuItem.map.active > .leftBorder,
.homeMenu > .menuItem.map.active + .menuItem.waterways.active > .leftBorder,
.homeMenu > .menuItem.map.active + .menuItem.waterways:hover > .leftBorder,
.homeMenu > .menuItem.map:hover + .menuItem.waterways.active > .leftBorder{
    background: transparent url('../images/home-menu-bg.png') no-repeat 0 -120px;
}

.homeMenu > .menuItem.map > .rightBorder,
.homeMenu > .menuItem.waterways > .rightBorder {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 18px;
    background: url('../images/home-menu-bg.png') no-repeat 0 -150px;
}

.homeMenu > .menuItem.map.active > .rightBorder,
.homeMenu > .menuItem.map:hover > .rightBorder,
.homeMenu > .menuItem.waterways.active > .rightBorder,
.homeMenu > .menuItem.waterways:hover > .rightBorder{
    background-position: 0 -180px;
}


.homeMenu > .menuItem > a {
    display: block;
    height: 30px;
    line-height: 30px;
    background-color: #b9c9d3;
    padding: 0 34px;
    font-family: zeppelin32,sans-serif;
    text-decoration: none;
}

.homeMenu > .menuItem > a > .big {
    font-size: 20px;
    color: white;
}

.homeMenu > .menuItem > a > .small {
    font-size: 15px;
    color: #f6fafc;

}

.homeMenu .menuItem.active > a,
.homeMenu .menuItem:hover > a{
    background-color: #0e69a8;

}

.homeMenu > .menuItem.active > a > .small,
.homeMenu > .menuItem:hover > a > .small {
    color: #deebf4;
}

.homepage .layoutSwitcher {
    height: 34px;
    position: relative;
    background-color: #0e69a8;
    /*padding: 25px 0 0 45px;*/
}

.homepage .layoutSwitcher .switcher {
    float: left;
    position: relative;
    margin-right: 10px;
    height: 34px;
}

.homepage .layoutSwitcher .switcher > .bg {
    position: absolute;
    top: 0;
    bottom: 0;
}

.homepage .layoutSwitcher .switcher > .bg.left {
    left: 0;
    width: 5px;
    background: url('../images/home-button-bg.png') no-repeat;
}

.homepage .layoutSwitcher .switcher > .bg.right {
    right: 0;
    width: 5px;
    background: url('../images/home-button-bg.png') no-repeat 0 -34px;
}

.homepage .layoutSwitcher .switcher > .bg.middle {
    left: 5px;
    right: 5px;
    background-color: #009ee0;
}

.homepage .layoutSwitcher .switcher > a {
    display: block;
    position: relative;
    height: 34px;
    line-height: 34px;
    padding: 0 17px;
    color: white;
    font-size: 14px;
    font-family: zeppelin32,sans-serif;
    text-transform: uppercase;
}

.homepage .dataFilter {
    padding: 33px 0 7px 0;
}

.homepage .dataFilter table {
    height: 31px;
    margin: auto;
}

.homepage .dataFilter table td {
    line-height: 31px;
    height: 31px;
}

.homepage .dataFilter table td.title {
    font-family: Arial,sans-serif;
    font-size: 15px;
    color: #0e69a8;
}

.homepage .dataFilter table td.input {
    padding: 0 16px;
    border-right: 1px solid #becfdc;
}

.homepage .dataFilter table td.input.vltavskenadrze {
    border-right: 0 none;
}


.homepage .databoxes {
    position: relative;
    width: 100%;
}

.homepage .databoxes .boxColumn {
    float: left;
}



.homepage .databoxes .boxColumn.order1,
.homepage .databoxes .boxColumn.order2 {
    width: 396px;
}

.homepage .databoxes .boxColumn.order3 {
    width: 420px
}





.homepage .box.predpoved .weatherIcons {
    padding-bottom: 18px;
}

.homepage .box.predpoved .weatherIcons .day {
    float: left;
    margin-right: 10px;
}

.homepage .box.predpoved .actualInfo,
.homepage .box.predpoved .situation,
.homepage .box.predpoved .estimation {
    padding-bottom: 15px;
}

.homepage .box.predpoved .situation .title,
.homepage .box.predpoved .estimation .title {
    color: #121a20;
    font-size: 14px;
    font-weight: bold;
}

.homepage .box.predpoved .link a {
    text-decoration: underline;
}

.homepage .box.kamery .homeCams {
    padding: 10px 40px;
}

.homepage .box.kamery .homeCams ul {
    padding: 0;
    margin: 0;
}

.homepage .box.kamery .homeCams .cam {
    min-height: 309px;
}

.homepage .box.kamery .homeCams .cam > .title {
    text-align: center;
    padding-bottom: 5px;
}

.homepage .box.kamery .homeCams .cam img {
    max-width: 336px;
    height: auto;
}


/*==================================================== HOME - MAPA =================================================== */

.mapBgTop {
    background: url('../images/map-bg-top.png') no-repeat center top;
}

.mapBgBottom {
    height: 17px;
    background: url('../images/map-bg-bottom.png') no-repeat center top;
}

.satraMap {
    position: relative;
    min-width: 1212px;
    background-color: white;
}

.satraMap > .blueStripe {
    height: 34px;
    background-color: #0e69a8;
    margin-bottom: 2px;
}

.satraMap > .mapContainer {
    border-top: 1px solid #becfdc;
    border-bottom: 1px solid #becfdc;
    padding: 1px 0;
    position: relative;
    min-height: 550px;
}

#satraMap {
    position: absolute;
    left: 0;
    right: 0;
    top: 1px;
    bottom: 1px;
}

.mapLegend {
    position: absolute;
    right: 0;
    top: 1px;
    bottom: 1px;
    width: 40px;
    overflow: hidden;
}

.mapLegend.active {
    width: 285px;
}

.mapLegend > .leftBorder {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 40px;
}

.mapLegend > .leftBorder > .button {
    position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    height: 40px;
    background: url('../images/mapfilter-button.png') no-repeat left top;
    cursor: pointer;
}

.mapLegend > .leftBorder > .shadow {
    position: absolute;
    left: 0;
    top: 40px;
    width: 40px;
    bottom: 0;
    background: url('../images/mapfilter-shadow.png') repeat-y left top;
}

.mapLegend.active > .leftBorder > .button,
.mapLegend.active > .leftBorder > .shadow {
    background-position: right top;
}

.mapLegend > .inner {
    position: absolute;
    left: 40px;
    top: 0;
    bottom: 0;
    width: 200px;
    padding: 11px 22px 0 23px;
    background-color: white;
}

.mapLegend h2 {
    color: #0e69a8;
    font-weight: normal;
    font-size: 17px;
    font-family: 'zeppelin31',sans-serif;
    text-transform: uppercase;
}

.mapLegend h3 {
    color: #464646;
    font-weight: normal;
    font-family: 'zeppelin31',sans-serif;
    text-transform: uppercase;
    font-size: 14px;
    padding-top: 20px;
}

#mapFilterForm label {
    display: block;
}


.mapInfoWindow h1 {
    color: #7fa303;
    font-family: 'zeppelin31',sans-serif;
    font-size: 15px;
    font-weight: normal;
    padding: 5px 0;
    border-bottom: 1px solid #7fa303;
}

.mapInfoWindow .info {
    padding-top: 8px;
    line-height: 1.3;
}

.mapInfoWindow .info th {
    text-align: left;
    padding-right: 10px;
}

.mapInfoWindow .link {
    padding-top: 8px;
    text-align: right;
}

.mapInfoWindow .link a {
    padding-left: 10px;
    background: url('../images/map-link-arrow.png') no-repeat left center;
}

#mapLoadingOverlay {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background-color: white;
    background-color: rgba(255,255,255,0.8);
}

#mapLoadingOverlay > .text {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    text-align: center;
    font-size: 16px;
}

#mapLoadingOverlay > .text span {
    background-color: white;
    padding: 5px 15px;
    border-radius: 5px;
}
}
/*========================================================= 3D =====================================================*/

#f1_container {
  position: relative;
  margin: 10px auto;
  width: 450px;
  height: 281px;
  z-index: 1;
}
#f1_container {
  perspective: 1000;
}
#f1_card {
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: all 1.0s linear;
}
#f1_container:hover #f1_card {
  transform: rotateY(180deg);
  box-shadow: -5px 5px 5px #aaa;
}
.face {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}
.face.back {
  display: block;
  transform: rotateY(180deg);
  box-sizing: border-box;
  padding: 10px;
  color: white;
  text-align: center;
  background-color: #aaa;
}
/*========================================================= 2 =====================================================*/
@-webkit-keyframes spinner {
  from {
    -webkit-transform: rotateY(0deg);
  }
  to {
    -webkit-transform: rotateY(-360deg);
  }
}

#stage {
  margin: 1em auto;
  -webkit-perspective: 1200px;
}

#spinner {
  -webkit-animation-name: spinner;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: 6s;
  -webkit-transform-style: preserve-3d;
}
#spinner:hover {
  -webkit-animation-play-state: paused;
}

#spinner img {
  position: absolute;
  border: 1px solid #ccc;
  background: rgba(255,255,255,0.8);
  box-shadow: inset 0 0 20px rgba(0,0,0,0.2);
}

  #spinner img {
    position: absolute;
    border: 1px solid #ccc;
    background: rgba(255,255,255,0.8);
    box-shadow: inset 0 0 20px rgba(0,0,0,0.2);
  }
/*========================================================= DGPS =====================================================*/

.dgpsStats > h2 {
    font-size: 17px;
    font-weight: normal;
    color: #0e69a8;
    border-bottom: 4px solid #0e69a8;
    text-align: center;
    padding-bottom: 3px;
}

.dgpsTable,
.dgpsAlarms{
    background-color: #f1f7fc;
    padding: 20px 27px;
    font-size: 14px;
    margin-bottom: 30px;
}

.dgpsTable table,
.dgpsAlarms table{
    width: 100%;
    border-collapse: collapse;
}

.dgpsTable td {
    padding: 5px 8px;
    border-bottom: 1px solid #becfdc;
}

.dgpsTable td.title,
.dgpsAlarms td.title{
    color: #0e69a8;
    border-bottom: 1px solid #becfdc;
}
.dgpsAlarms td {
    padding: 5px 8px;
}

.dgpsAlarms tr.even td {
    background-color: white;
}

.shortDgpsStats {
    padding: 20px 30px;
}

.shortDgpsStats h2 {
    padding-bottom: 15px;
}

.shortDgpsStats dl dt {
    font-weight: bold;
}

.shortDgpsStats dl dd {
    padding-bottom: 10px;
}