div#intro-menu {width:100%; height:60px;background: rgba(0,0,0, .65); text-align:left; /*margin: 0px auto;*/padding-top: 0px; margin-bottom:0px; font-size:20px; color:#fff; position:absolute; top:0px;  opacity:0;}


div.menu-odkazy-right {
                  min-height: 60px;
				  position: relative;
				  display: flex; 
				  justify-content: flex-end;
				  align-items: center;
				  flex-wrap: wrap; 
				  margin-right:30px;
}


.btn {
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
  text-align: center;
  position: relative;
  margin-right: 30px;
  cursor:pointer;
}

a.menu{
  text-transform: uppercase;
  text-decoration: none;
  color:rgba(255, 255, 255, 1);
  transition: color .5s;
  font-size: 20px;
}

a.menu:hover{
  color:rgba(255, 255, 255, 1);
  transition: color .5s;
}


.menu1{width: 125px;} 
.menu1::before{content:"";width: 0%;height: 1px;position: absolute;background: rgba(255, 255, 255, 1); bottom: -3px;transition: width 200ms ease-in;}
.menu1:hover:before{width:100%;}
//.menu1::after{content:"";width: 0%;height: 1px;position: absolute;background: rgba(255, 255, 255, 1); bottom: 32px;transition: width 200ms ease-in;}
//.menu1:hover:after{width:100%;}

.menu2{width: 95px;} 
.menu2::before{content:"";width: 0%;height: 1px;position: absolute;background: rgba(255, 255, 255, 1); bottom: -3px;transition: width 200ms ease-in;}
.menu2:hover:before{width:100%;}
//.menu2::after{content:"";width: 0%;height: 1px;position: absolute;background: rgba(255, 255, 255, 1); bottom: 32px;transition: width 200ms ease-in;}
//.menu2:hover:after{width:100%;}

.menu3{width: 160px;} 
.menu3::before{content:"";width: 0%;height: 1px;position: absolute;background: rgba(255, 255, 255, 1); bottom: -3px;transition: width 200ms ease-in;}
.menu3:hover:before{width:100%;}
//.menu3::after{content:"";width: 0%;height: 1px;position: absolute;background: rgba(255, 255, 255, 1); bottom: 32px;transition: width 200ms ease-in;}
//.menu3:hover:after{width:100%;}

.menu4{width: 100px;} 
.menu4::before{content:"";width: 0%;height: 1px;position: absolute;background: rgba(255, 255, 255, 1); bottom: -3px;transition: width 200ms ease-in;}
.menu4:hover:before{width:100%;}
//.menu4::after{content:"";width: 0%;height: 1px;position: absolute;background: rgba(255, 255, 255, 1); bottom: 32px;transition: width 200ms ease-in;}
//.menu4:hover:after{width:100%;}

        
          
div#intro {
          background: url('../img/black-30.png'), url('../img/body.jpg');
          background-position: center bottom, center center;
          background-repeat: repeat, no-repeat;
          background-size: 100%, cover;          
          padding:0px; width:100%; min-height: 100%; min-height: 100vh; opacity:0;          
          }          


div.outer-section-white {background: #fff;  padding:0px; min-height: 100vh; padding-top:40px; border: 1px solid #f1f1f1}

div.outer-section-oddelky {
		  background: url('../img/galerie/vceli-plast.jpg');
          background-position: center center;
          background-repeat: no-repeat;
          background-size: cover;          
          padding:25px 0 25px 0; width:100%; min-height: 100%; min-height: 100vh; 
}


div.outer-section-kontakt {
		  background: url('../img/galerie/mohyla2.jpg');
          background-position: center center;
          background-repeat: no-repeat;
          background-size: cover;          
          padding:25px 0 25px 0; width:100%; min-height: 100%; min-height: 100vh; 
}



div.black_bg {
     height:auto;
	 width: 100%;
	 background: rgba(0 ,0, 0, .50);
	 box-shadow: 2px 2px 5px #000;
     padding: 20px 20px 20px 20px;
	}

div.black_bg *{color: #fff;}


div.inner-section {width:70%;text-align:center; margin: 0px auto;} 


img#hamburger {display:none}


a.hmenu{
    font-size: 24px;
    letter-spacing: 1px;
    padding: 0px 0px 5px 0px;
    margin: 12px 0px 0px 10px;
    color:#fff;
    text-decoration:none;
    display:inline-block;
}


.invisible2{
    position: fixed;
    top: 60px;
    right: -460px;
    transition: right .5s;
    }

.visible2{
    position: fixed;
    top: 60px;
    right: 0px;
    transition: right .5s;
    }



div#logo-big {position: absolute; 
  top: 15%; left: 0; 
  /*bottom: 0;*/ right: 0; 
  margin: auto;
  width: 400px;
  height: 194px; 
  cursor:pointer;
  background: url('../img/logo.png');
  background-position: center center;
  background-size: 99%;
  background-repeat: no-repeat;
  transition: background .5s, opacity .5s;
  opacity:0;
  } 

div#logo-big:hover {
  top: 15%; left: 0; 
  /*bottom: 0;*/ right: 0; 
  background: url('../img/logo2.png');
  background-position: center center;
  background-size: 100%;
  background-repeat: no-repeat;
  transition: background .5s, opacity .5s;
  opacity: 1;
  }   
 
div#polabi {position: absolute; 
  /*top: 0;*/ left: 0; 
  bottom: 15%; right: 0; 
  margin: auto;
  width: 150px;
  height: 138px;
  cursor:pointer;
  background: url('../img/polabi-85.png');
  background-position: center center;
  background-size: 98%;
  background-repeat: no-repeat;
  transition: background .25s;
  opacity:0;
  }
  
  
div#galerie {
    position: absolute;
    display:flex;
	flex-flow: row wrap;
    justify-items: center;
	justify-content: center;
    row-gap: 1em;
    column-gap: .5em;
    left: 0; 
    bottom: 10%; right: 0; 
    margin: auto;
    width: auto;
    height: 100px;
    opacity:0;
  }  

div#galerie img {opacity: .85; transition: opacity .5s; border: 1px solid #fff; width: auto; height: 100px}
div#galerie img:hover {opacity: 1; transition: opacity .5s;}

.cp {cursor:pointer;}
  
div#polabi:hover {
  position: absolute; 
  background-size: 100%;
  transition: background .25s;
  }         
  
  
.o-nas {
  min-height: 100vh;
  background: url('../img/vcela1.png');
  background-position: center center;
  background-size: 40%;
  background-repeat: no-repeat;
  }
  
.med {
  min-height: 100vh; 
  background: url('../img/vcela2.png'), url('../img/vcela3.png');
  background-position: left 100px, right 250px;
  background-size: 35%, 28%;
  background-repeat: no-repeat, no-repeat;
  }  
 
   
  
  h2 {display: inline-block; font-family: Caudex-Regular; color: rgba(255, 255, 255, 1); font-size: 2.2em; /*text-align:center;*/font-weight:normal; margin-top:0px; padding: 5px 20px 5px 20px; border-radius: 30px; text-shadow: 1px 1px 2px #888; line-height: 1em}
  
.shadow-dark {background: rgba(50, 123, 10); box-shadow: 1px 1px 2px #000;}
.shadow-light {background: rgba(255, 150, 0, 1); box-shadow: 1px 1px 2px #888;}


  h3 {font-family: Caudex-Bold; color: rgba(41, 117, 0, 1); font-size: 1.5em; /*text-align:center;*/ font-weight:normal; margin-top:10px; margin-bottom:0px; text-transform: uppercase;}
  
  p {font-family: Caudex-Regular; color: rgba(80, 80, 80, 1); font-size: 1.3em; text-align:center;}
  li {list-style-type: square; font-family: Caudex-Regular; color: rgba(130, 130, 130, 1); font-size: 1.4em; text-align:left;}
  
    
  ul{display:inline-block;margin:auto;text-align:center;}

#down {position: absolute; 
  left: 0; 
  bottom: 3%; right: 0; 
  margin: auto;
  height: 30px; width: 30px; cursor:pointer;
  color: #fff;
  text-shadow: 2px 2px 5px #444;
  opacity:0;
   }
   
div#upstairs {position:fixed; bottom: 3%; right: 3%; z-index:10;} 

.invisible{
    position: fixed;
    top: 129px;
    right: -499px;
    transition: right .5s;
    }

.visible{
    position: fixed;
    top: 129px;
    right: 0px;
    transition: right .5s;
    }


.visible3 {opacity: 1; cursor: pointer; transition: opacity 1s}
.invisible3 { opacity: 0; cursor: text; transition: opacity 1s}

a.down-orange {/*text-shadow: 1px 1px 1px #444;*/ text-decoration: none; color: rgba(255, 150, 0, 1);/* transition: color .5s*/}
a#to_home, a.down-white {/*text-shadow: 1px 1px 1px #444;*/ text-decoration: none; color: rgba(255, 255, 255, 1);/* transition: color .5s*/}

img#up {width:40px; height:auto}

a {text-decoration: underline; color: rgba(240, 150, 0, 1); transition: text .5s}
a:hover {text-decoration: none; transition: text .3s}

div.flexbox{
    margin-top:50px;
	display: -ms-flexbox;
	display:flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
    -ms-flex-pack: center;
	}



div.clean-15 {width:100%; height:15px}
div.clean-30 {width:100%; height:30px}
div.clean-50 {width:100%; height:50px}   


#section1a, #section1b, #section1c, #section1d, #section1e, #section2a, #section2b, #section2c, #section2d, #section2e, #section2f, #section3a, #section3b, #section3c, #section3d, #section3e, #section4a, #section4b, #section4c, #section4d, #section4e, #section4f, #section4g, #section4h {opacity:0} 


div.galerie{
    margin-top:20px;
    margin-bottom:40px;
	display: -ms-flexbox;
	display:flex;
	flex-flow: row wrap;
	justify-content: center;
    -ms-flex-pack: center;
    gap: 5px 10px;
	}
 
div.galerie a{
    
	} 
 
div.galerie img{
    border: 1px solid rgba(100, 100, 100, 1);
    opacity: .95;
    transition: opacity .5s;
	}
    
div.galerie img:hover{
    opacity: 1;
    transition: opacity .5s;
	} 
    
    
div#kontakt{
    margin-top:0px;
	display:flex;
	flex-flow: row wrap;
	justify-content: space-evenly; 
	} 

   
div#kontakt div{
    padding: 0px 30px 0px 30px;
	width:50%;
	}
    
div#kontakt p{
    text-align:left;
	}     


    table.kontaktni-formular {width: 100%; margin: auto; text-align:center; margin-top:0px; margin-bottom:0px;}
    table.kontaktni-formular td {font-size: 20px; /*line-height:30px*/}
    table.kontaktni-formular input[type=text], input[type=password], table.kontaktni-formular textarea, table.kontaktni-formular select {width: 100%; padding:8px; border: 1px solid #000; border-radius: 5px; background:#fafafa; color:#444;font-size: 16px;}
    
    :focus {
      outline: none;
    }
    
    .star {color: #bea653; font-size: 36px; position:relative; top:5px; font-weight:normal}
    
    input.submit{
    display:inline-block;
    font-family: Caudex-Bold;
    font-size: 22px;
    letter-spacing: 1px;
    padding: 5px 5px 5px 5px;
    margin: 0px 0px 0px 10px;
    color: #fff;
    border:none;
    cursor:pointer;
    text-decoration:none;
    background: rgba(255, 150, 0, 1);
    border-radius: 5px;
    transition: background .25s;
    box-shadow: 1px 1px 2px #000;
    }
    
    input.submit:hover{color: #fff; background: rgba(50, 123, 10, 1); transition: background .25s;}
    
    p.msgr {font-family: Caudex-Bold; text-align:center!important; margin:0; color:#fff;}
    p.msgf {font-family: Caudex-Bold; text-align:center!important; margin:0; color:rgba(255, 150, 0, 1);}
    
    
    
    
    
    
/* -------------------------------------------------------------------------------- R E S P O -------------------------------------------------------------------------------------------------------- */ 

@media (max-width: 1600px){
        div.inner-section {width:85%}   
}

@media (max-width: 1400px){
        div.inner-section {width:90%}
} 

@media (max-width: 1200px){
        div.inner-section {width:100%; padding-left:10px; padding-right:10px }          
}







@media (max-width: 1050px){

    div#kontakt div{
    display: inline;
    padding: 0px 0px 0px 0px;
	width:100%;
    margin: 0px auto;
    text-align: center;
	}

}  


@media (max-width: 900px){

    div#kontakt div._100_{
    padding: 0px 0px 0px 0px;
	width:100%;
	}
 
 div.menu-odkazy-left, div.menu-odkazy-right {display:none}  
      
      #hamburgermenu{
    z-index:199;
    min-width: 250px;
    min-height: 100px;
    padding: 1em;
    text-align: left;
    background: rgba(255, 150, 0, 1);
    color:#fff;
    font-family: Caudex-Regular;
    font-weight: normal;
    box-shadow: -5px 5px 10px #444;
}

    img#hamburger{
      position:absolute;
      top:15px;
      right:25px;
      display:block;
      z-index:220;
      width: 51px;
      height: 31px;
      } 
    
    div#galerie {
    position: absolute;
    left: 0; 
    bottom: 10%; right: 0;
  }  
                                  
 }
 
 
 
 
 @media screen and (max-width: 1200px) and (orientation: landscape) {

    div#logo-big, div#logo-big:hover {position: absolute; 
      top: 15%; left: 0; 
      right: 0; 
      margin: auto;
      width: 300px;
      height: 146px; 
      background: url('../img/logo.png');
      background-position: center center;
      background-size: 100%;
      background-repeat: no-repeat;
      opacity:0;
      } 

 
 
 
} 
 

@media (max-width: 600px){
    h2 {font-size: 1.4em;}
    h3 {font-size: 1.2em;}
    p, li {font-size: 1em;}
    
    
  div#logo-big, div#logo-big:hover {position: absolute; 
  top: 15%; left: 0; 
  /*bottom: 0;*/ right: 0; 
  margin: auto;
  width: 300px;
  height: 146px; 
  background: url('../img/logo.png');
  background-position: center center;
  background-size: 100%;
  background-repeat: no-repeat;
  opacity:0;
  } 
    
    
    table.kontaktni-formular td {font-size: 1em; line-height:36px}
    table.kontaktni-formular input[type=text], input[type=password], table.kontaktni-formular textarea, table.kontaktni-formular select {font-size: 14px;}
    div.clean-50 {height:0px}                                   
 } 
 

@media (max-width: 500px) and (orientation: portrait){ 
 
       div#logo-big {position: absolute; 
        top: 15%; left: 0; 
        /*bottom: 0;*/ right: 0; 
        margin: auto;
        width: 165px;
        height: 80px; 
        cursor:pointer;
        background: url('../img/logo.png');
        background-position: center center;
        background-size: 99%;
        background-repeat: no-repeat;
        transition: background .5s, opacity .5s;
        opacity:0;
        } 
      
       
        
       div#galerie {
        position: absolute;
        display:flex;
    	flex-flow: row wrap;
        justify-items: center;
    	justify-content: center;
        row-gap: 1em;
        column-gap: .5em;
        left: 0; 
        bottom: 10%; right: 0; 
        margin: auto;
        width: auto;
        height: 100px;
        opacity:0;
      }  
    
    div#galerie img {opacity: .85; transition: opacity .5s; border: 1px solid #fff; width: auto; height: 75px}
    div#galerie img:hover {opacity: 1; transition: opacity .5s;} 
        
          
}


@media (max-width: 1000px) and (orientation: landscape){ 
 
       div#logo-big {position: absolute; 
        top: 15%; left: 0; 
        /*bottom: 0;*/ right: 0; 
        margin: auto;
        width: 300px;
        height: 146px; 
        cursor:pointer;
        background: url('../img/logo.png');
        background-position: center center;
        background-size: 99%;
        background-repeat: no-repeat;
        transition: background .5s, opacity .5s;
        opacity:0;
        } 

        
        
       div#galerie {
        position: absolute;
        display:flex;
    	flex-flow: row wrap;
        justify-items: center;
    	justify-content: center;
        row-gap: 1em;
        column-gap: .5em;
        left: 0; 
        bottom: 10%; right: 0; 
        margin: auto;
        width: auto;
        height: 100px;
        opacity:0;
      }  
    
    div#galerie img {opacity: .85; transition: opacity .5s; border: 1px solid #fff; width: auto; height: 75px}
    div#galerie img:hover {opacity: 1; transition: opacity .5s;} 
        
          
}