﻿

body{
            font-family: 'Open Sans', sans-serif;
            margin:0;
            padding:0;
           /*// background-color: #fff;*/
            background: url(../img/wooden-texture.jpg);
            background-size: contain;
            background-attachment: fixed;
            outline:none;
        }
        a{
            text-decoration:none;
        }

        .container{
           
            margin: 0 auto; 
            width:100%;
            max-width:1100px;
            height:100%;
            padding-right:0;
            padding-left:0;
            background: #fafafa;

            -webkit-box-shadow: 0px 2px 38px 10px rgba(0,0,0,0.5);
            -moz-box-shadow: 0px 2px 38px 10px rgba(0,0,0,0.5);
            box-shadow: 0px 2px 38px 10px rgba(0,0,0,0.5);
        }
        p{
            font-size: 18px;
        }

        p.info > a {
            color:#111;
            font-weight:bold;
            font-size:17px;
            text-decoration:underline;
        }

        .footer > a {
            color:#fff;
        
        }

        .obsah{
            padding:0;
           
            font-weight:300;
            color:#222;
            margin: 0 auto;
            text-align:left;
        }

        .content{
           
            padding: 40px 20px 20px 20px;
           font-weight:300;
            color:#000;
            margin: 0 auto;
            text-align:center;
       
        }

        h1{
            font-size: 2.8em;
            color: #ce2126;
            margin-bottom: 10px;
            margin-top: 20px;
            font-weight: 700;
            
        }
        h2{
            font-size: 1.8em;
           
            color: #fff;
             text-align:left;
             display: inline;
             vertical-align:middle;
             font-weight: 600;
        }

        h3{
            color: #fff;
            font-size: 1.4em;
        }


.category{
    margin-bottom: 9px;
    font-size: 1.8em;
    background-color: rgba(82,55,43,1);
    background-color: #7d5946;
    color: #fff;
    width: calc(100% + 80px);
    padding: 16px;
    margin-left: -40px;
    padding-left: 40px;
    
}

.footer span a{
    text-decoration: none;
        color: rgba(255,255,255,0.4);
}
footer span{
        color: rgba(255,255,255,0.4);
}

        #topMenu h2{
            color:#111;
        }
         #topMenu h3{
            color:#111;
        }

          #topMenu h1{
            margin-top:5px;
        }

        .kontakt{
           padding:20px;
            background:rgba(255,255,255,0.9);
        }

        .kontakt span{
            font-size: 1.6em;
            color:#111;
            font-weight: 400;
        }

         .kontakt span > b > a{
            
            color:#ce2126;
            text-decoration:underline;
            
        }

        .kontakt a.fa{
            
           color:#fff;
            text-decoration:none;
            
        }

        .kontakt a.fa:hover{
            
           color:#fff;
            text-decoration:none;
            
        }

        .rozcestnik{
            
            background-color: rgba(82,55,43,1);
            background-color: #7d5946;
             padding: 5px 0px;
             /*border-bottom: 1px solid rgba(107,74,39,0.15);*/
             text-align:center;

             position: relative;
            top: 0;
            width: 1100px;
             
        }

@media (max-width:1100px) {
    .rozcestnik {
       
        width: 100%;
    }
}
        

        .fa{
       
            /*padding: 8px;*/
            color: white;
            background-color: #3b5998;
           
            margin: 2px;

              
    font-size: 1.2em;
    width: 1.6em;
    text-align: center;
    line-height: 1.6em;
   
    border-radius: 0.8em;
            
        }

        

        a.fa-rfid{
            font-size: 15px;
            font-weight: 700;
            bottom: 4px;
            position: relative;
            /*width: 28px;*/
            padding: 12px 5px;
            color: white;
            background-color: #ce2126;
            border-radius: 12px;
            margin: 2px;

        }

        a.fa-rfid:before{
           content: 'RFID';
        }

        .fa:hover,
        .fa-rfid:hover{
            opacity: 0.90;
            text-decoration:none;
            color:#fff;
        }
        
        .content a{
                   
                   text-align: center;
               }
       

        .rozcestnik a.odkaz{
           color: #fff;
            font-size: 18px;
            padding: 5px 0 8px 0;
            margin: 15px;
            text-transform: uppercase;
            text-decoration: none;
            vertical-align: middle;
            font-weight: 600;
            border-bottom: 2px solid transparent;
        }

        .rozcestnik a.odkaz:hover,
        .rozcestnik a.odkaz:active{
            
            border-bottom: 2px solid #fff;
            text-decoration:none;
            -moz-transition-duration: 0.3s;
            -webkit-transition-duration: 0.3s;
            transition-duration: 0.3s;
            /*transition-delay: 0.05s;*/
            /*border-radius:18px;*/
          
        }
        .zalom,
        .zalomMenu{
            display:none;
        }

        .footer{
            text-align:center;
            position:relative;
            bottom: 0;
            margin-left: auto;
            margin-right: auto;
            left: 0;
            right: 0;
            margin:0 auto;
            padding:25px;
            color: #fff;
            font-size: 14px;
            /*border-top: 1px solid rgba(107,74,39,0.15);*/
        }

        .odkazy{
            padding: 30px 0;
           
        }

        .obs{
             max-width:1100px;
             margin:0 auto;
        }

.info{margin:0 auto;
      font-weight:400;
      padding-bottom:5px;
     /*color:white;*/

      text-align:left;
}

li.info{font-size:18px;}

.oddelovac{margin-bottom:12px;}


@-webkit-keyframes arrow-animation {
  0% {
    -moz-transform: translate(-50%, 0) rotate(315deg);
    -o-transform: translate(-50%, 0) rotate(315deg);
    -ms-transform: translate(-50%, 0) rotate(315deg);
    -webkit-transform: translate(-50%, 0) rotate(315deg);
    transform: translate(-50%, 0) rotate(315deg);
  }
  50% {
    -moz-transform: translate(-50%, 26px) rotate(315deg);
    -o-transform: translate(-50%, 26px) rotate(315deg);
    -ms-transform: translate(-50%, 26px) rotate(315deg);
    -webkit-transform: translate(-50%, 26px) rotate(315deg);
    transform: translate(-50%, 26px) rotate(315deg);
  }
  100% {
    -moz-transform: translate(-50%, 0) rotate(315deg);
    -o-transform: translate(-50%, 0) rotate(315deg);
    -ms-transform: translate(-50%, 0) rotate(315deg);
    -webkit-transform: translate(-50%, 0) rotate(315deg);
    transform: translate(-50%, 0) rotate(315deg);
  }
}

@-moz-keyframes arrow-animation {
  0% {
    -moz-transform: translate(-50%, 0) rotate(315deg);
    -o-transform: translate(-50%, 0) rotate(315deg);
    -ms-transform: translate(-50%, 0) rotate(315deg);
    -webkit-transform: translate(-50%, 0) rotate(315deg);
    transform: translate(-50%, 0) rotate(315deg);
  }
  50% {
    -moz-transform: translate(-50%, 26px) rotate(315deg);
    -o-transform: translate(-50%, 26px) rotate(315deg);
    -ms-transform: translate(-50%, 26px) rotate(315deg);
    -webkit-transform: translate(-50%, 26px) rotate(315deg);
    transform: translate(-50%, 26px) rotate(315deg);
  }
  100% {
    -moz-transform: translate(-50%, 0) rotate(315deg);
    -o-transform: translate(-50%, 0) rotate(315deg);
    -ms-transform: translate(-50%, 0) rotate(315deg);
    -webkit-transform: translate(-50%, 0) rotate(315deg);
    transform: translate(-50%, 0) rotate(315deg);
  }
}

@-ms-keyframes arrow-animation {
  0% {
    -moz-transform: translate(-50%, 0) rotate(315deg);
    -o-transform: translate(-50%, 0) rotate(315deg);
    -ms-transform: translate(-50%, 0) rotate(315deg);
    -webkit-transform: translate(-50%, 0) rotate(315deg);
    transform: translate(-50%, 0) rotate(315deg);
  }
  50% {
    -moz-transform: translate(-50%, 26px) rotate(315deg);
    -o-transform: translate(-50%, 26px) rotate(315deg);
    -ms-transform: translate(-50%, 26px) rotate(315deg);
    -webkit-transform: translate(-50%, 26px) rotate(315deg);
    transform: translate(-50%, 26px) rotate(315deg);
  }
  100% {
    -moz-transform: translate(-50%, 0) rotate(315deg);
    -o-transform: translate(-50%, 0) rotate(315deg);
    -ms-transform: translate(-50%, 0) rotate(315deg);
    -webkit-transform: translate(-50%, 0) rotate(315deg);
    transform: translate(-50%, 0) rotate(315deg);
  }
}

@-o-keyframes arrow-animation {
  0% {
    -moz-transform: translate(-50%, 0) rotate(315deg);
    -o-transform: translate(-50%, 0) rotate(315deg);
    -ms-transform: translate(-50%, 0) rotate(315deg);
    -webkit-transform: translate(-50%, 0) rotate(315deg);
    transform: translate(-50%, 0) rotate(315deg);
  }
  50% {
    -moz-transform: translate(-50%, 26px) rotate(315deg);
    -o-transform: translate(-50%, 26px) rotate(315deg);
    -ms-transform: translate(-50%, 26px) rotate(315deg);
    -webkit-transform: translate(-50%, 26px) rotate(315deg);
    transform: translate(-50%, 26px) rotate(315deg);
  }
  100% {
    -moz-transform: translate(-50%, 0) rotate(315deg);
    -o-transform: translate(-50%, 0) rotate(315deg);
    -ms-transform: translate(-50%, 0) rotate(315deg);
    -webkit-transform: translate(-50%, 0) rotate(315deg);
    transform: translate(-50%, 0) rotate(315deg);
  }
}

@keyframes arrow-animation {
  0% {
   
    transform: translate(-50%, 0) rotate(315deg);
  }
  50% {
    
    transform: translate(-50%, 26px) rotate(315deg);
  }
  100% {
    
    transform: translate(-50%, 0) rotate(315deg);
  }
}

        .sipka{
            
            display: block;
            width: 15px;
            height: 15px;
            border: 2px solid #111;
            border-width: 0 0 2px 2px;
            line-height: 0;
            font-size: 0;
           position:relative;
           left:138px;

           text-align:center;
            -moz-transform: translate(-50%, 0) rotate(315deg);
            -o-transform: translate(-50%, 0) rotate(315deg);
            -ms-transform: translate(-50%, 0) rotate(315deg);
            -webkit-transform: translate(-50%, 0) rotate(315deg);
            transform: translate(-50%, 0) rotate(315deg);
           margin:0 auto;
            /* -webkit-animation: arrow-animation 2s infinite; */
            -moz-animation: arrow-animation 2s infinite;
            -ms-animation: arrow-animation 2s infinite;
            -o-animation: arrow-animation 2s infinite;
            animation: arrow-animation 2s infinite;
        }

        .header{
                background-color: transparent;
            color: #fff;
           display: inline-block;
        }

        .main-logo{
            width:70px;
            margin-left:25px;
            margin-right:15px;
        }

         .main-logo2{
            width:80px;
            
        }

       


         .mini-logo{
            width: 55px;
            margin-left: 35px;
            margin-top: 6px;
            visibility:hidden;
            left: 0;
            top: 0;
            position: absolute;
         }


         .obal-kontakt{
             background:rgba(0,0,0,0.4);
             margin-left: calc(50% - 275px);
             max-width:550px; 
             width:550px;
             color:#111;
             padding: 0px;
             margin-top:40px; 
             text-align:center;
         }

         .drz-dole{
             text-align:right;
             bottom: 0;
             position: absolute;
             right: 0;
         }


        @media (max-width:767px){
            .obal-kontakt{
             background:rgba(0,0,0,0.4);
             margin-left: 0%;
             width:100%; 
             max-width:700px;
             color:#111;
             padding: 0px;
             margin-top:40px; 
             text-align:center;
         }
            
            p{
                font-size:17px;
            }
            li.info {
                font-size: 17px;
            }
            
            .rozcestnik{
                display:none;
            }
            
            .rozcestnik.fixed-header{
                display:block;
            }

            .drz-dole{
           
             position: relative;
           
         }

            .mini-logo{
            width: 39px;
            margin-top: 5px;

         }


            .container{
         
        }
         


            .footer {
                padding:20px;
                font-size: 16px;
                border-top: 1px solid rgba(107,74,39,0.15);
            }

            .content{
                padding: 20px;
                margin: 0px;
                    padding-top: 30px;
            }
             .zalom{
            display:block;
            line-height: 0.8;
           
        }
             h1{
                 font-size:2.8em;
             }
             h2{
                 font-size:1.5em;
                 font-weight:700;
             }
        
             .rozcestnik{
                 text-align: center;
                 border-bottom: 1px solid rgba(107,74,39,0.15);
             }

             .rozcestnik a.odkaz{
                 font-size:16px;
             }

             .fa{
                 margin-top:20px;
       
                 font-size: 1.3em;
                width: 1.6em;
                text-align: center;
                line-height: 1.6em;
                color: #fff;
                border-radius: 0.8em;
             }

            
               a.fa-rfid{
            font-size: 12px;
            padding: 12px 7px;
            bottom: 4px;
            margin: 2px;
            margin-top: 10px;
            

        }
               .content a{
                  
                   text-align: center;
                   
               }

            .sipka {
            left:127px;
            }

            .oddelovac{
                margin-bottom: -10px;
            }


               .main-logo{
                text-align:left;
            width:60px;
            margin-left:0;
            margin-top:5px;
            margin-right:15px;
        }

        }

        @media (max-width:500px) {

            .zalomMenu{
                display:block;
                line-height: 0.8;
            }

            body {
                background-size: 100%;
            }
        }

        @media (max-width:350px) {

            .sipka{
                display:none;
            }
        }



        #btn div {
            
    width: 30px;
    height: 3px;
    margin-bottom: 5px;
    padding-right: 15px;
     background-color: #fff;
    /*-webkit-transition: -webkit-transform 500ms cubic-bezier(0.6, 0.05, 0.28, 0.91), opacity 500ms, box-shadow 250ms, background-color 500ms;
    transition: transform 500ms cubic-bezier(0.6, 0.05, 0.28, 0.91), opacity 500ms, box-shadow 250ms, background-color 500ms;*/
}

        #btn{
            display:inline-block;
            float:none;
            margin-right:20px;
            margin-top:10px;
        }

        .logo-main{
            vertical-align:middle;
            float:none;
            display:inline-block;
        }

        .menicko{
            display:inline-block;
                 background-color: transparent;
              padding:15px;
        }


        

@media (max-width:700px) {
     .logo-main{
            vertical-align:middle;
            float:left;
            margin-left:20px;
        }
     #btn{
            display:inline-block;
            float:right;
            margin-right:20px;
            margin-top:13px;
            
        }

      .header{
         
            padding-bottom: 0px;
            display: block;
            
        }
     .obsah{
       
        }

     .menicko{
            display:none;
            
            z-index:99999;
           
            /*-webkit-transition: height 1s;
                transition: height 1s;*/
        }

     .menicko a{
         display:block;
     }
}


@media (min-width:700px) {

    #btn{
        display:none;
    }
}

/* tabulka */

.tab{
    background: #fff;
    width: 80%;
    margin: 0 auto;
    margin-top:60px;
    border: 1px solid rgba(82,55,43,1);
}

.tab h3{
    font-weight:600;
    font-size:1.5em;
}

.tab span{
   
        font-size: 1.15em;
    font-weight: 400;
    
}

.tab > .row {
    line-height: 3em;
    
    
}

.pole{
    background: rgba(0,0,0,0.04);
  

     -moz-transition: all 0.1s ease-in;
    -webkit-transition: all 0.1s ease-in;
    -o-transition: all 0.1s ease-in;
    transition: all 0.1s ease-in;
}

.pole2{
    background: rgba(0,0,0,0.55);
   

     -moz-transition: all 0.1s ease-in;
    -webkit-transition: all 0.1s ease-in;
    -o-transition: all 0.1s ease-in;
    transition: all 0.1s ease-in;
}

.pole2 p{
    line-height: 1.4;
    padding:10px 0;
    font-weight:400;
    margin: 5px;
    color:#000;
}

.pole:hover{
    background: rgba(0,0,0,0.08);
    font-weight:bold;

 
     -moz-transition: all 0.1s ease-in;
    -webkit-transition: all 0.1s ease-in;
    -o-transition: all 0.1s ease-in;
    transition: all 0.1s ease-in;
}

.rame{
    border-top: 1px solid #aaa;
   text-align:left;
    
}

.ramer{
        padding-top: 5px;
        padding-bottom: 5px;
}

@media (min-width:768px) {
    .rame {
        border:none;
        padding-top: 5px;
        padding-bottom: 5px;
    }
}

@media (max-width:768px) {
    .tabulka {
        width: 100%;
        margin-bottom:20px;
    }
    .rame {
     
        line-height: 1.4em;
        padding-top: 10px;
    }

    .no-border-mobile {
        border:none;
    }

    .tab{
        width:100%;
    }
    
    .header {
        padding-bottom: 39px;
    }
   #btn {
        top: 3px;
        position: relative;
        margin-top: 7px;
    }
    
    .kontakt span {
    font-size: 1.4em;
    }
}

.row {
    margin-right: 0px;
    margin-left: 0px;
}

.fixed-header{
    position:fixed;
    z-index:9999999;
    background-color: rgba(82,55,43,0.98);
    background-color: #7d5946;
    box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.4);
}

  .bann{
            height: 300px;    padding-right: 0;
    padding-top: 80px;
    padding-left: 0;
         }

  .okraj{
           padding: 0px 20px 0px 20px; 
  }

  .ods2{
      padding-left: 40px;
  }

  .okraj2{
      padding: 5px 40px 10px 40px;
  }

  .my-brown {
    background-color: #7d5946;
  }

  .my-brown.transp {
    background-color: rgba(133,106,92,.97);
  }

  .okraj3{
      text-align: center;
    vertical-align: middle;
    padding: 20px;
    margin: 0;
      background-color: rgba(82,55,43,1);
      background-color: #7d5946;
  }

         @media (max-width:768px){
               .bann{
            height: 315px;    
             
            padding:0;
            padding-top: 20px;
            
         }
             
             .category {
   
    width: calc(100% + 40px);
   font-size: 1.6em;
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 20px;
}
             
             .rozcestnik.fixed-header {
    width: calc(100% - 32px);
}
             
             .container {
    margin-left:16px;
    margin-right:16px;
    width:calc(100% - 32px);
}
             
               .ods2{
      padding: 10px 20px;
  }

                .okraj2{
      padding: 20px;
  }
                 .okraj3{
      padding: 15px;
  }

               .okraj{
           padding: 0px; 
  }
         }