@import url(https://fonts.googleapis.com/css?family=Fira+Sans:100,200,300,400,500,200italic,300italic&subset=latin,latin-ext);
body, html   { font-family:'Fira Sans', Calibri, Myriad, Arial, sans-serif; font-size: 100%; font-weight: 300; margin: 0px; text-rendering: optimizelegibility }
b, strong    { font-weight: 300 }
.clear       { clear:both; height: 0px; width:100% }
.nobr        { white-space: nowrap }
.nowrap *    { white-space: nowrap }
.center      { text-align: center }
.hidden      { display: none }
.unvisible   { visibility: hidden }
.clickable   { cursor: pointer }
.desktop     { display: block }
.mobile      { display: none !important }

h1,h2,h3,h4  { font-weight: 400 }

/*div          { float: left }*/


/*

silver #e6e6e6
yellow #ffba00 / #7b5b06

light gray: f5f5f5

gray: 515152	
	
	
	
*/

a img        { border: none; }
img[onclick] { cursor: pointer }
a            { color: #91772e; text-decoration: none; }
a:hover      { text-decoration: none }
a.nounderline { text-decoration:  none !important}

.nnx-cms     { /* CMS generated content */ }

.block { width: 100% }
.block.clear { clear: both }

.block.top-navi { background: #464646; color: #fff;padding: 14px 0 }

.block.master-bg { min-height: 180px; background: #fff url(/img/bg/foto.jpg); background-repeat: no-repeat; background-clip: border-box; background-size: cover }
.block.master-navi { background: rgba(255, 255, 255, .8); padding: 10px 0 }

.container { max-width: 1100px; margin: 0 auto; padding: 0 15px }

/* -- ico ball -- */
.ico-ball-over { width: 100%; text-align: center; margin-top: -1.5em }
.ico-ball{ background:rgba(255, 255, 255, 0.78); color: gray; display: inline-block; width: auto; height: 3.5em; border-radius: 3em; line-height: 3.5;
min-width: 3.5em; padding: 1px; font-size: 80%; margin-left: auto; margin-right: auto }


/* -- content type -- */
.content-home { margin-bottom: 70px }
.content-page { padding: 10px 15px 100px 15px }
.content-accomm { padding: 40px 15px }


.breadcrumb { list-style: none; overflow: hidden; margin: 0; padding: 6px 0 8px 0 }
.breadcrumb li { float: left; padding: 0 6px 0 0; font-size: 80%; font-weight: 500 }
.breadcrumb li a { position: relative; padding-right: 10px;  display: block; float: left; }



/* -- header -- */
header { font-size: 90% }
.block.top-navi { }
.block.top-navi .claim { float: left; width: 50%; text-transform: uppercase }
.block.top-navi nav { float: right; color: black }
.block.top-navi nav a { padding: 0 8px; color: #e6e6e6; }
.block.top-navi nav a:hover { color:#ffba00  }

.block.master-navi .logo { width: 30%; float: left }
.block.master-navi nav { width: 60%; float: right; padding: 25px 0 0 0; text-align: right}
.block.master-navi nav a { font-size: 140%; font-weight: 300; color: #515152; padding: 0 15px }
.block.master-navi nav a:hover { color: #000 }

a .navibox { color: #000 }
a .navibox .ico-ball i { font-size: 140% }
a .navibox:hover { background:rgba(255, 187, 0, 1)  }
a .navibox:hover .ico-ball { background:rgba(255, 187, 0, 1) }
.navibox { width: 30%; float: left !important; background:rgba(255, 255, 255, 0.8); box-sizing: border-box; margin-top: 40px; margin-bottom: 20px }
.navibox h2 { padding: 10px 20px 20px 20px; font-weight: 500 !important; font-size: 170%; line-height: 120% }
.navibox p { padding: 0 20px 20px 20px; }
.navibox.mid { margin-left: 5%; margin-right: 5% }

.news { background: #ffae00; padding: 15px 0; text-align: center; color: #000 }
.news div.news-inlay { padding: 0 15px; line-height: 140%; text-align: left}
.news div.news-inlay h3 { font-weight: 400; font-size: 130%; margin-bottom: 8px }
.news a.link-line { display: block; margin: 8px 0 12px 0; border-bottom: 1px solid #000; color: #000 }
.news a.link-line:hover { font-weight:500 }


/* left side sub-menu-box */
.sub-menu-box { padding: 10px; background: #ebebeb; color: #686868  }
.sub-menu-box:hover span.readmore { background: #ffba00}
.sub-menu-box h2.sub { font-size: 120% }
span.readmore { background: #f5f5f5;}
span.readmore, span.readmore i { padding: 2px 3px 1px 8px; border-radius: 6px; font-size: 90%; white-space: nowrap }

.chapters { width: 30%; margin: 0 1.5% 25px 1.5%; min-height: 150px; float: left; box-sizing: border-box; padding: 15px; background: #f2e3b9; line-height: 130% }
.chapters:hover { background: #eddcad }




/* homepage */
a .menu-box { color: #000; font-size: 140%; font-weight: 400;}
a .menu-box:hover { background: #ffba00 }
.menu-box { min-height: 200px; width: 90%; margin: 0 5%; margin-top: 25px }
.menu-box span { display: block; padding: 4px 16px 8px 16px }
.menu-box .img-box { height: 250px; position: relative; margin-bottom: 8px }
.menu-box .img-box span { position: absolute; left: 0; bottom: 0; padding: 8px 16px; color: #fff; background: rgba(0, 0, 0, 0.6); text-transform: uppercase; }
.menu-box .img-box span i { padding-right: 10px; color: #ffba00 }


/* ubytovani */
.accomm { padding: 10px; box-sizing: border-box; margin-bottom: 25px; height: 400px; overflow: hidden; cursor: pointer } 
.accomm:hover { background:#f5f5f5; padding: 10px  }
.accomm .inlay { width: 100%; overflow: hidden}
.accomm .inlay .image { height: 200px; position: relative; background:#f5f5f5 }
.accomm .inlay .image.banned img { opacity: .03}
.accomm .inlay .image img { height: 100%; }
.accomm .inlay .image div { width: 50%; overflow: hidden; height: 200px}
.accomm .inlay .image span.sticker { position: absolute; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.7); color: #fff; padding: 4px 10px; font-size: 90% }
.accomm .inlay .image span.sticker i { color: #ffba00; padding-right: 8px }
.accomm .inlay h2 { font-size: 115%; padding: 12px 0 }
.accomm .inlay p.dist { font-size: 80%; color: gray; line-height: 140%; padding-bottom: 6px }
.accomm .inlay p.desc { font-size: 85%; color: #494949; line-height: 140% }

.typ-sticker { display: inline-block; background: #ffba00; padding: 1px 20px 0px 12px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; color: #fff; font-size: 80% }
.content-accomm h1.acm {padding-top: 8px !important}
.content-accomm .sticker { display: inline-block; font-size: 90%; padding-left: 25px; font-weight: bold }
.content-accomm .sticker i { color: #ffba00; padding-right: 8px }

.content-accomm .image { width: 100%; overflow: hidden; text-align: center; background: #fff; margin: 25px 0 0 0 }
.content-accomm .image img { max-width: 100% }
.content-accomm .icons { width: auto; margin: 0 auto; text-align: center} 
.content-accomm .icons .icon { cursor: pointer; opacity: .8; display: inline-block; width: 55px; height: 40px; margin: 3px; overflow: hidden; background-position: center center; background-size: cover }
.content-accomm .icons .icon:hover { opacity: 1 }

.content-accomm ul { box-sizing: border-box; padding: 0 20px 0 0; margin: 0 0 0 15px; font-size: 90%; font-weight: 400 }
.content-accomm ul li { list-style-position: outside; padding: 0; margin: 0}

.content-accomm form h4 { font-size: 120%}
.content-accomm form label { font-size: 90%; display: block; margin-top: 15px }
.content-accomm form input[type=number], .content-accomm form input[type=date], .content-accomm form input[type=text], .content-accomm form input[type=password], .content-accomm form textarea { 
	width: 99%; padding: 5px; height: 35px; box-sizing: border-box; font-size: 100%; border: 1px solid #a6a6a6;
}
.content-accomm input[type=submit], .content-accomm button { background:#ffba00; color: #000; padding: 8px 18px; border:none; border-radius: 5px; font-size: 105%; cursor: pointer; margin: 25px 0 8px 0  }
.content-accomm form textarea { height: auto }
.content-accomm form input:focus, .content-accomm form textarea:focus{ border-color:#ffba00 }

.accomm-sidebar { background: #f5f5f5; box-sizing: border-box; padding: 15px }
.accomm-sidebar a { text-decoration: none !important  }
.accomm-sidebar a h3.acm { font-size: 110%; margin: 10px 0 0 0; padding: 0px; color: #7b5b06; }
.accomm-sidebar a:hover h3.acm { color:#ffba00 }
.accomm-sidebar .disclaimer { font-size: 80%; line-height: 120%; color: gray }

.preloader { width: 100%; text-align: center; padding: 70px 0 }
#savestatus { padding-top: 10px; font-weight: bold }

/* footer */
footer { font-size: 90% }

.accommodation { background: #f5f5f5; float: left; padding-bottom: 30px; box-shadow: 0px 13px 8px 8px black; }
.accommodation .ico-ball { background: #f5f5f5; color: #4d4d4d; font-size: 150% }
.accommodation h2 { font-size: 160%; color: #464646; margin-top: -20px; margin-bottom: 20px }
.accomm-butt {  border: none; border-radius: 3px; background:#e6e6e6; color: #464646; padding: 10px 16px; font-size: 110%; font-weight: 400; text-decoration: none !important; cursor: pointer; margin: 8px 3px }
.accomm-butt:hover { background: #ffba00 }

.impressum { background: #cccccc; padding: 35px 0 10px 0; position: relative; border-top:1px solid silver }
.impressum .links { padding: 15px 15px }-
.impressum .links h4 { font-size: 105%; text-transform: uppercase; color: #464646; line-height: 130% }
.impressum .links ul { display: inline; list-style: none }
.impressum .links ul a { color: #464646; text-decoration: underline }
.impressum .links ul a:hover { text-decoration: none}
.impressum .links ul li { padding: 5px 0}
.impressum .links button { border: none; border-radius: 3px; background:#009bff; color: #fff; padding: 8px 16px; font-size: 100%; cursor: pointer; margin: 8px 3px }

.impressum .copyright { border-top:1px dotted silver; padding: 15px 0 0 0; font-weight: 400; font-size: 90%; margin-top: 15px }
.impressum .copyright a { color: gray }





/* adv */
small.adv-info, .adv-info { font-size: 80%; color: silver}

a .accomm-box { color: #000; line-height: 120%; box-sizing: border-box; padding: 8px 20px }
a .accomm-box h4 { font-weight: 400; font-size: 115%; margin-bottom: 8px }
a .accomm-box p { font-size: 90%; color: #898989 }
a .accomm-box:hover p { color: #000 }

.master-adv a { margin: 8px 0; display: block}



@media screen and (max-width: 820px) {  
	
    a.accomm-butt { display:  inline-block; margin: 3px}
    
    .chapters { width: 46%}
    .chapters p { font-size: 90%;  }
}


@media screen and (max-width: 620px) {  
    
    .block.top-navi nav { display: none }
    .block.top-navi .claim { width: 100%; text-align: center}

    .navibox { width: 100% }
    .navibox.mid { margin: 0 }
    
    
    .block.master-navi .logo { display: none }
    .block.master-navi nav { width: 100%; text-align: center; font-size: 80%; padding: 0; margin: 0;   }
    .block.master-navi nav a { padding: 5px 8px; background: #fff; border-radius: 4px; display: inline-block; margin:5px; font-weight:400}       
    
    .nnx-col.nnx-pre-sidebar { width: 100% }
    
    .chapters { width: 100%; margin: 5px 0}
    .chapters p { font-size: 90%;  }    
    
}