h1,h2,h3,h4,h5, .navigace, #projekt-uvod {font-family: 'Ubuntu';}
h1,h2,h3,h4,h5 {color: #61c250;}

html { height: 100%; }

body {
  height: 100%;
  background-image: url('../img/bg_stin.png'), url('../img/bg_body.jpg');
  background-position: top;
  background-repeat: no-repeat, repeat-x;
}

/*a {color: #e7750e;}
a:hover {color: #936404;}*/


hr {margin:0;}

h3 {margin-top: 1.5em;}
h2 {margin-bottom: 0.5em;}



/* ---------------------------- LAYOUT      -------------------------------------------------- */


.container {
     position: relative;
     padding-top: 40px;
}   

.lista-nahore {
  display: none;
  position: absolute; 
  top:5px; padding: 15px 0;  
  width: 100%; 
  background: #ebeded;
  
  /*border: 1px solid #ebeded;*/
  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
}

.lista-nahore .masthead .nav-pills a, .navigace li a, .ikona1, .ikona2, .trasa-img {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}


.lista-nahore .masthead .nav-pills {margin: 20px 150px 20px 40px; }
.lista-nahore .masthead .nav-pills a:hover {background: #a2aeab;}

.navigace {
  position: absolute;
  right: 0px;
  margin: -90px 0 0;
  font-weight: normal;
}

.navigace li {
  list-style-type: none;
  float: left;
  margin: 0 1em;
  font-size: 1.5em;
}

.navigace li a {color: #6f7976; padding: 0 0 10px; font-weight: 100 !important;}
.navigace li a:hover {color: #61c250; text-decoration:none;}

.navigace li.aktivni a {color: black; border-bottom: 3px solid #c6cecc;}

.carousel {margin: 0 0 50px;}

h1 {margin-bottom: 50px;}

.hero-unit {background-color: white; margin: 0; position: relative;}

.zavrit, .otevrit {background: url('../img/bg_collapse.png') center 23px no-repeat; padding: 0 0 20px;}


.otevrit {background-position: center -105px; padding: 20px 0; }

#paticka {padding: 50px 0;}
#paticka p {padding: 0; margin-top:35px;}

/*.collapse {background:  url('../img/bg_white.gif') center 12px no-repeat; }*/

/* ---------------------------- TITULKA   -------------------------------------------------- */

.ikona1, .ikona2 {
  display: block;
  background: url('../img/ico-kompas.png')  no-repeat;
  padding:0 0 30px 120px;
  color: black;
}

.ikona2 {
  background: url('../img/ico-document.png')  no-repeat;
}

.ikona1:hover, .ikona2:hover {
  text-decoration: none;
  color: #eea306;
  background-position: 20px 0px;
  
}

.oznameni {
            margin:0;
            padding:0;
            list-style:none;
            width:470px;
            height:270px;
            overflow:hidden;
        }
        
.oznameni li {
            text-align:left;
            display:block;
            width:697px;
            height:400px;
        }
.oznameni li a img {border:0;}
        
.carousel-pagination {margin:10px 0 0 30px;}
        
.carousel-pagination li {
            display:block;
            width:8px;
            height:8px;
            margin-right:5px;
            cursor:pointer;
            float:left;
            background:#c6c6c6;
        }
        
.carousel-pagination .carousel-pagination-active {
            background:#f7bc43;
        }

/* ---------------------------- O PROJEKTU   -------------------------------------------------- */

#projekt-uvod.hero-unit {background: white url('../img/img-navstevnici.jpg') right no-repeat; padding: 50px 32% 50px 50px;}

.trasa-img:hover, .navigace li a:hover {
 
 transform:scale(1.1,1.1);
 -ms-transform:scale(1.1,1.1); /* IE 9 */
 -moz-transform:scale(1.1,1.1); /* Firefox */
 -webkit-transform:scale(1.1,1.1); /* Safari and Chrome */
 -o-transform:scale(1.1,1.1);
 }
 
 #projekt-organizace>p {
  padding-right: 31%;
  
 }
 
 #projekt-organizace { background: url('../img/img-pokyny.png') right top no-repeat; }
 #projekt-bezpecnost { background: url('../img/img-helma1.png') left no-repeat; padding-left: 31%;}

.modal-trasa { width: 940px; margin-left: -470px; text-align: center; }
    
.modal-trasa .modal-header, .modal-trasa .modal-footer {text-align: center; border: 0;} 
    
.modal-trasa .modal-body {max-height: 603px; width: 900px; margin: 0 20px; padding: 0 !important; position: relative;}
 
 /* ---------------------------- EXKURZE   -------------------------------------------------- */
 
#exkurze-uvod.hero-unit {background: black url('../img/img-noc.jpg') no-repeat right; padding: 50px 32% 50px 50px; font-size: 1.1em; color: white; position: relative;}
.facebook {width:350px; height: 137px; display: block; position: absolute; left: 500px; top: 80px; background: url('../img/facebook.png') no-repeat; }
#exkurze-uvod h2 {color:white;}

 
 /* ---------------------------- OD UCASTNIKU   -------------------------------------------------- */
 
#ucastnici-uvod.hero-unit {background: white url('../img/img-zazitek.jpg') right no-repeat; padding: 50px 32% 50px 50px;} 
.well {
  padding-left: 55px; 
  background-color: white; 
  background-image: url('../img/bg_uvozovky.png'), linear-gradient(to bottom, #ffffff, #e1e3e2); 
  background-position: left 10px;
  background-repeat: no-repeat; 
  border: 1px solid #d5dbda;
} 

.well:hover {background-image: url('../img/bg_uvozovky.png'), linear-gradient(to bottom, #ffffff, #fff);} 

.well.stazeni { background-image: linear-gradient(to bottom, #ffffff, #e1e3e2); }

#map-canvas { height: 500px; }
#map-canvas img {
 max-width: none;
 }

 /* ---------------------------- REZERVACE   -------------------------------------------------- */
 
 .rezervace {
  /*background: #cdd1d0;
  background: #cdd1d0 linear-gradient(to bottom, #cdd1d0, #e8eae9);*/ 
  padding: 4em;
  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  }
  
.rezervace h3 {margin-top:0}

.rezervace-pocet {margin-top: 40px;}
.rezervace-zbyva {margin: 70px 0 20px; background: url('../img/unimog1.png') top no-repeat; padding: 10px 0 80px;}
h4.rezervace-cislo {color: #83b984; margin: 20px 0 0;font-size:5em;}
h4.rezervace-cislo.zbyvajici {color: white;}

.progress {height: 25px; border: 1px solid #c6cecc;} 

h2 .rez-barva {color: #a9b4b1; font-weight: normal;}

.form-horizontal {padding: 0; margin: 0;}

.control-label {padding: 0;  margin: 0; width: 110px !important; text-align: left !important;}

.controls.uc {margin-left: 0px !important;} 

.controls {padding: 0;  margin-left: 0px !important;}

 /* ---------------------------- SOUTEZ   -------------------------------------------------- */

.soutez h5 {margin-top:3em;}
h5.spravne {color: #5b9b28; padding-left: 30px; background: url('../img/ico-ok.png') left top no-repeat; min-height: 20px;}
h5.spatne {color: #cc0606; padding-left: 30px; background: url('../img/ico-ko.png') left top no-repeat; min-height: 20px;}


/* -------------------------- Virt echval --------------------- */

#virt {position: relative; height: 540px; background: url('../img/echval-prohlidka.png') top center no-repeat;}
.puntik {display: block; width: 25px; height: 25px; position: absolute; background: url('../img/puntik.png') top center no-repeat;}
.p1 {top: 390px; left: 300px; }
.p2 {top: 370px; left: 240px; }
.p3 {top: 330px; left: 280px; }
.p4 {top: 340px; left: 335px; }
.p5 {top: 300px; left: 330px; }
.p6 {top: 300px; left: 230px; }
.p7 {top: 270px; left: 280px; }
.p8 {top: 200px; left: 435px; }
.p9 {top: 350px; left: 650px; }
.p10 {top: 350px; left: 790px; }
.p11 {top: 350px; left: 1000px; }
.p12 {top: 390px; left: 880px; }

/* ---------------------------- RESPONSIVE CSS  -------------------------------------------------- */
    
        
    @media (max-width: 1200px) {

      
      
      body { background-image: url('../img/bg_stin1.png'), url('../img/bg_body.jpg'); }
      
      .nav-pills > li > a { width: 100px; height: 30px; vertical-align: middle; }
        
      .navigace li { margin: 0 0.8em; }   
      
    }
    
/* ----------------------- 979 ---------------- */
    
    @media (max-width: 979px) {

      .container {
           
          
      }
    }

/* ----------------------- 767 ---------------- */

    @media (max-width: 767px) {

     .lista-nahore {position: relative; margin: 0; left: 0px; font-size: 1.3em; line-height: 1.5em;} 
     .container { padding-top: 0px; }
     .navigace { position: relative; left: 0px; margin: 5px 0px 30px; }
     .navigace li { float: none; margin: 0; font-size: 1.5em; }
     .navigace li a { display: block; background: #d8dedd; padding: 14px 5px; margin: 1px 0; }
     .navigace li.aktivni a {color: black; background: #fab906; border-bottom: 0;}
     .carousel, .rezervace-zbyva, .progress-warning, .sipka, .facebook, #test.alert {display: none;}
     .rezervace {padding: 0;}
     .btn-toolbar .btn {font-size: 10px !important; padding: 4px;}
     #projekt-uvod.hero-unit, #exkurze-uvod.hero-unit, #ucastnici-uvod.hero-unit, #projekt-organizace, #projekt-bezpecnost {background: white; padding: 5px; font-size: 1em;}
     #exkurze-uvod.hero-unit {background: black;}
     #projekt-trasy .btn {margin-bottom: 100px;}
     .modal-trasa.modal {  position: relative; top: 0; left: 0; width: 300px; margin-left: 0px; }
     .modal-trasa .modal-body {max-height: 500px; width: 300px;}
     .checkbox {padding: 10px 0; margin-left: 20px;}
     .oddelovnik {background: transparent !important;}
     .rezervace h3 {margin-top: 1em;}
     input.pocet {margin:0px auto !important;}
     .rezervace .row-fluid, .rezervace .span5 {margin: 0 0 0 -10px !important; padding: 0  !important;}
     #paticka div, #paticka p {text-align: left !important;}

    }
    
    
/* ------------- BACK TO TOP BUTTON -------------------------------------------------------------------------------- */


#back-top {
	position: fixed;
	bottom: 60px;
  right: 10px;
}

#back-top a {
	width: 50px;
	height: 50px;
	display: block;
	background: #d5dad8 url('../img/up-arrow.png') no-repeat center center;

	/* transition */
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	transition: 0.2s;
  
  -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
  
  border: 0;
}

#back-top a:hover {
	background-color: #61c250;
}
    
/* ------------- INFOBOX -------------------------------------------------------------------------------- */

#test.alert {
  border: 0;
  background: #597f08;
  width: 400px;
  
  position: fixed;
  bottom: -35px;
  left: 32%;
  
  -webkit-border-radius: 15px;
     -moz-border-radius: 15px;
          border-radius: 15px;
          
          
  background: rgb(89, 127, 8) transparent;
  /* RGBa with 0.6 opacity */
  background: rgba(89, 127, 8, 0.8);
  /* For IE 5.5 - 7*/

background: url('../img/bg-infobox.png') no-repeat top;
  
  animation:alertanim 1s 1; 
  -webkit-animation:alertanim 1s 1;
  
}

#test.alert a{display: block; padding: 50px 10px 50px 100px; color: white; font-size: 2em; line-height: 1em; background: url('../img/ico-info.png') no-repeat 25px center;min-height:54px;}


@keyframes alertanim {from {bottom: -300px; opacity:0; filter:alpha(opacity=0);} to {bottom:-35px; opacity:1; filter:alpha(opacity=100);} }
@-webkit-keyframes alertanim {from {bottom: -300px; opacity:0; filter:alpha(opacity=0);} to {bottom:-35px; opacity:1; filter:alpha(opacity=100);} }    
    
    
/* -------------- POMOCNE ----------------------------------------------------------------------------- */

.skryte, h1 span {display: none;}
.obteka_vlevo {float: left; margin: 0 8px 5px 0;}
.obteka_vpravo {float: right; margin: 0 0 5px 8px;}
.neobteka {clear:both;}
.bez_ramecku {border: 0 !important;}
.hr {border-top: 1px dashed #e0e8eb; margin-top: 2em;}

section, #uvod-text, #projekt-trasy, #projekt-organizace, #projekt-bezpecnost, #projekt-kontakty, #projekt-upozorneni, #exkurze-poplatek, #exkurze-rezervace, #ucastnici-vzkazy, #ucastnici-fotogalerie
{padding-top: 50px; padding-bottom: 50px;}

.large {font-size:1.5em; line-height: 1.5em;}

.navigace li a:hover {}

.mezera-nahore {margin-top: 50px;}
.mezera-dole {margin-bottom: 50px;}
.mezery {margin: 50px 0;}
.oddelovnik {background: url('../img/hr.gif') repeat-y right;}

input.pocet {margin:0 0 0 -15px;padding:2px;height:55px;width:55px;font-size:48px;line-height:55px;text-align:center;}

/* ---------- rok 2022 ---------- */

*, body, html {background:none;}
ul.navigace {margin:-70px 3em 0; text-transform:uppercase;}
.navigace li.aktivni a {color: #61C251; border-bottom: 3px solid #61C251;}
h1 {padding:0.5em 1em; margin:0;}
h2 {color:white; font-size:340%; text-transform:uppercase; line-height:140%;}
h3 {color:#263E6A; font-size:240%;}
.nahore {background:#263E6A url("../img/bg-header.jpg") center top no-repeat; background-size:cover;}
.nahore h2 {width:50%;}
.banner {background:#263E6A url("../img/ban-dvere.jpg") center top no-repeat; background-size:cover; color:white;}
.banner {padding:6em 15% 4em 50%;}
.banner h2 {font-size:200%; line-height:120%;}
.banner p {text-transform:uppercase;}
.wide {width:100%;}
.bggray1 {background-color:#DADFE3;}
.padt {padding-top:7em; padding-top:7vw;}
.padb {padding-bottom:8em; padding-bottom:8vw;}
.padt1 {padding-top:3em;}
.padb1 {padding-bottom:3em;}
.pink {border:1px solid pink;}
.rowx {display:table-row; width:100%;}
.colx {display:table-cell; width:50%; vertical-align:top;}
.padr {padding-right:6em;}
.padl {padding-left:6em;}
a.btnx {padding:1em 2em; margin:1em 1em 1em 0; transition: all 0.4s; text-decoration:none; text-transform:uppercase; font-size:100%;}
.btnx.btn-green {color:white; background:#61C251; border:1px solid #61C251;}
.btnx.btn-white {color:#263E6A; background:white; border:1px solid #263E6A;}
.btnx.btn-green:hover {background:#263E6A; border:1px solid white;}
.btnx.btn-white:hover {color:white; background:#263E6A;}
.btnx {white-space:nowrap; display:inline-block; float:none; margin:0 1em 1em 0;}
.foot3 {background:#61C251; margin-top:4em; padding:1em 0; color:white; text-align:center;}
.foot-left, .foot-center, .foot-right {display:inline-block;}
.foot-left {float:left; text-align:left; vertical-align:top; margin-top:-2em;}
.foot-center {float:left; text-align:center; vertical-align:top; margin-left:2em;}
.foot-right {float:right; text-align:right; vertical-align:top;}
.foot-right a {margin-left:2em; color:white;}

a {color:#61c250;}
hr {display:none;}
input[type="text"], input[type="email"] {width:174px;}
input.doklad {width:144px;}

@media only screen and (max-width:1000px){
.rowx, .colx {display:block; width:100%;}
.colx p {padding-right:2em; width:80%;}
.padl {padding-left:0;}
.foot-right {margin-right:20%;}
}
@media only screen and (max-width:900px){
.foot3 img {width:60%; margin-left:2em;}
.foot3, .foot3 a {font-size:1em;}
}
@media only screen and (max-width:767px){
.foot-left {margin-top:0;}
.foot3, .foot3 a {font-size:0.8em;}
.foot-right {margin-right:1em;}
.nahore h2 {font-size:1.8em;}
.banner h2 {font-size:1.3em;}
h3 {font-size:1.2em;}
.colx p {padding-right:2em; width:100%;}
.navigace li.aktivni a {color:white; background:#61C251;}
ul.navigace {margin:0;}
}