/** */
:root {
  --main-padd: 5vw;
  --spinner-height: calc(30px + 1vw);  
}

@media screen and (min-width: 1980px){
:root {
  --main-padd: 10vw;
}

}


/* CSS  */
*{box-sizing: border-box;}

/* Typography */
html,body {
  font-size: 21px ;
    font-size: calc(12px + 0.45vw);
  font-family: 'Inter', Arial, Helvetica, sans-serif; 
  /*font-weight: 300;*/
  line-height: 1.6;
  color: #2E2E2E;
  margin:0;
  padding: 0 ;
  text-align: center;
  background: #fff;
      overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, dl, address, blockquote, table, .separ
{
margin: 30px 0 ;
}


/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 {  position: relative; margin-top: 40px;  line-height: 1.25;  font-weight: 400; }

h1 { font-size: 2.6em;  letter-spacing: -2px;  color: #00E7CB; margin: 60px 0; }
h2 { font-size: 2.4em; letter-spacing: -2px;  /*font-weight: 400; */ /*padding-top: 20px; */ color: #2E2E2E; padding: 80px 0 100px 0; margin:0; clear: both;}
h3 { font-size: 2em; clear: both;  font-weight: 400; color: #00BBF8;  letter-spacing: -1px; margin-top: 50px; }
h4 { font-size: 1.4em;  font-weight: 400; margin: 30px 0 10px 0;  color: #00BBF8; margin-top: 50px; }
h5 { font-size: 1em; color: #00BBF8; }
h6 { font-size: 1em;}



h2:before{
  content: "";
  display: block;
  height: 4px;
  width: 80px;
  background: #00E7CB;
  margin-bottom: .35em;
         }
/* Text elements
-------------------------------------------------------------- */

p           {/*line-height: 150%; */ margin: 30px 20px 20px 0; position: relative; }

a           {text-decoration: underline; color: #00BBF8;     transition: all ease 0.3s;}
a:visited   {/* color: #16532a; */}
a:hover     {text-decoration: none;  color: #000;}

blockquote  { padding: 1em 3em;   border-left: 2px solid #b2ca1e ;}
strong      { font-weight: bold; }
sup, sub    { line-height: 0; }
big         {font-size: 1.2em;}
small       {font-size: 0.8em; opacity: 0.7;}

/* Lists
-------------------------------------------------------------- */

ul, ol      {padding:0;  margin-left:35px; }
li          {margin:0 0 .5em 0; padding:0; line-height: 150%;  }
ul li          {list-style: square ; }
li::marker          { color: #00E7CB; }
ol li          {padding-left: 0.7em; }

ul.extra    {list-style:none;position:relative;}
ul.extra li {padding:0 0 0 20px;}

ul          { list-style-type: disc; }
ol          { list-style-type: decimal; }

li p{ margin: 0; padding: 0 ;   }

/* Tables
-------------------------------------------------------------- */
table{ margin: 50px 0 ; border-collapse:collapse; font-size: 1em;width: 100%;}
table th{ padding: 0.5em 2em .5em 0em ; text-align: left; background: #f9f9f9; color: #333; font-size:1em;font-weight:500; border-bottom:1px solid #999;}
table td{ padding: 0.4em 1em 0.4em 0em ; border-bottom:1px solid #ccc; }
table td.nowrap{ white-space: nowrap;}
table td p{ margin: 0; padding: 0 ;   }
.table-border {border: 2px solid #999;}
.table-border td {  padding: 0.5em 1em ; }
.table-border th {  padding: 0.5em 1em ; }


/* Misc classes
-------------------------------------------------------------- */

.hide       { display: none; }
.noborder   {border:none;}
.bold       {font-weight:bold;}

/* Body Elements
-------------------------------------------------------------- */

img{border: 0 ; max-width: 100%; /*height: auto;*/}
iframe{ max-width: 100%;      }
hr { margin: 50px 0; border: none; border-bottom: 1px dotted #ddd ;}

.foto{
 margin-right: 10px;
}
a:hover .foto{
 opacity: .8;
}


/* Form fields
-------------------------------------------------------------- */

form{
  padding: 0.5em 3em 2em 3em;
  border: 1px solid #ccc;
  margin: 1em 0 3em 0;
  text-align: left;
    }
.id-eshop form{
  margin: 0;
  padding: 0 ;
  border: none ;
  }      
    

fieldset{ border: none; padding: 0 ; margin: 2em 0 0 0 ;}

div.formular{ margin:20px 0; padding: 0 10px 10px 10px; border: none;background:#eee;}
table.form{margin:0; border: 0 ;}
table.form td{ border: 0 ; padding: 5px 1em 5px 0; vertical-align: top;}
form p.gdpr-note{ margin: 0 0 1em 0; line-height: 120%;          }

ul.form{margin:0;padding:0 0 0 20px;list-style:none;}
ul.form li{padding:5px 20px 0 0;float:left;width:242px;}
ul.form li.textarea, ul.form li.submit{width:505px;}

h3.form_nazev{margin:0;font-size:1.1em;font-weight:bold;position:relative;top:-10px;left:20px;color:black;}
h3.form_nazev span{border:1px solid #BDBBB7; padding:3px 20px;}

input, textarea, select{  font-family: 'Inter', Arial, Helvetica, sans-serif;  border:1px solid #BDBBB7; padding:10px 10px; border-radius: 3px;
  background: #f5f5f5;
}
label{font-weight:normal;}
.label-text{ width: 200px; display: block;           }
input{font-size:0.9em; max-width:300px;}
textarea{font-size:0.9em;   font-family: 'Inter', Arial, Helvetica, sans-serif;; width: 100%;}
select{font-size:0.9em; width:280px;}

input.submit{font-weight:bold; padding:10px 20px; position:relative;background:#16632d; color:white; border:none;
     font-family: 'Inter', Arial, Helvetica, sans-serif; font-size:1.1em; border-radius: 3px;}

label.check{float:left;margin:0px 15px 0px 0;font-weight:normal}
input.check{background:none;border:none;display:inline;margin:0 4px 2px 0;vertical-align:middle;width:auto;}

label.radio{float:left;margin:0px 15px 0px 0;font-weight:normal}
input.radio{background:none;border:none;display:inline;margin:0 4px 2px 0;vertical-align:middle;width:auto;}


/*  ID  */
#page{
  text-align:left;
  margin: 0 auto ;
  position:relative;

  padding: 0 0;
  padding-top: 89px;  /*sticky header space*/
  ax-width: 1700px;
  /*box-shadow: 0 0 100px -50px #272725;*/
  overflow-x: hidden;

}

#header{
    position: fixed;
    z-index: 999;
    margin-bottom: -1px;
    background: #fff;
    width: 100%;
    padding: 0 var(--main-padd);

    height: 90px;
    box-shadow: 0 0 50px rgba(0,0,0, .3);
    transition: all ease 0.3s;
    top: 0;
display: flex;
justify-content: end;
}
#header::after{
  content: "";
  height: 5px;
  width: 100%;
  display: block;
  /*background: rgba(21,21,21,.2);;*/
  position: absolute;
  bottom: -5px;
  left: 0;
z-index: -1;
}

/*  HEADER STICKY !*/
#header.sticky{
  position: fixed;
  top: 0;
  background: #fff;
  height: 70px;
      transition: all ease 0.3s;
    z-index: 999999;      
}

#header.sticky h1 a{
  height: 70px;
  line-height: 70px;
      transition: all ease 0.3s;
      
      
}

#header.sticky #navigation{
  height: 70px;
      transition: all ease 0.3s;
}
#header.sticky #navigation > ul > li > a {
  font-size: 0.9em;
      transition: all ease 0.3s;
}
/**/


#header h1{
  margin: 0 ;
  padding: 0 ;
  font-weight:bold;
  font-size:1em;
  letter-spacing: -1px;
  border:none;
  position: relative;
    z-index: 999999;
  }
#header h1 a{
  display: block;
  text-decoration: none;

  width: 300px;
  height: 90px;
  line-height: 40px;
  text-align: center;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 999999;
  transition: all ease 0.3s;
  
color: transparent;
      font-size: 0.6em;  

}
#header h1 a span{
  display: block;
  width: 100% ;
  height: 75% ;
  position: absolute;
  top: 10px;
  left: 0;
  cursor: pointer;
  background: url(/img/logo.svg) no-repeat left center;
  background-size: contain;

}

/*  navigation */
#navigation{
  z-index: 1000;
  position: relative;
  top: 0;
  right: 0;
    height: 90px;
    display: flex;
    justify-content: flex-end;
    align-items: center;  
flex: 1;
 }
#navigation > ul {
  display: flex;
  justify-content: flex-end;
  align-items: baseline;
  margin: 0;
  padding: 0;
  list-style: none;
  
}
#navigation > ul > li {
  list-style: none ;
  margin: 0;  
  margin-left: 1.25em;
}

#navigation > ul > li > a {
  display: block;
  /*text-transform:uppercase;*/
  line-height: 50px ;
  height: 50px;
  text-decoration: none;
  padding: 0em 0 ;

  text-align: left;
  /*letter-spacing: -1px;*/
  transition: all ease 0.3s;
  border-bottom: solid 4px  rgba(0,0,0,0) ;
  color: #2E2E2E;  
  font-weight: 500;
  letter-spacing: -1px;
}

#navigation > ul > li > a.on {
  color: #999;
  border-color: #ccc;
}

#navigation > ul > li > a:hover{
  color: #00BBF8;
  border-color: #00E7CB;
/*background-color: rgba(0,0,0,.8);*/


}



#navigation > ul > li ul {
  display: none;
}
#navigation > ul > li:hover ul {
  display: block;
}
#navigation > ul > li:hover  {
}

#navigation > ul > li:hover > a {

}



#navigation ul ul {
  position: absolute;
  margin: 0 0 0;
  padding: 18px 0;
  list-style: none;
  background: rgba(0,0,0,0.9);
  min-width: 400px;
}
#navigation ul ul li {
  list-style: none ;
  margin: 0;
  padding: 0 ;
border-bottom: 1px solid rgba(112,112,112, .5);
}

#navigation ul ul li:last-of-type {
border-bottom: none;
}

#navigation ul ul a {
  line-height: 1.5;
  font-size: 0.7em;

  padding: 10px 2.5em ;
  text-decoration: none;
  text-transform: none;
  display: block;
  font-weight: 500;
color: #FFF;

background: url(/img/ico_arrow_yellow.svg) no-repeat 20px center;
    background-size: 5px;
}

#navigation ul ul a:hover{
  color: #ECD500;
}

#navigation ul ul ul {
  display: none;
}

#navigation .m_langs {
display: none;
}


#navitagion_controls {
display: flex;
align-items: center;
}

#navitagion_controls .ico_cart {
height: 40px;
width: 40px;
}

#navitagion_controls .ico_user {
height: 40px;
width: 41px;
padding-left: 10px;
    margin-right: 20px;
}

#navitagion_controls .ico_user img {
height: 26px;
    margin-top: 4px;
    margin-bottom: 3px;
}

#navitagion_controls .ico_user:hover {
opacity: .5;
}

#navitagion_controls .langs {
height: 100%;
border-left: 1px solid #ccc;
display: flex;
align-items: center;
position: relative;
cursor: pointer;
}

#navitagion_controls .langs > span {
height: 100%;
width: 90px;
text-decoration: none;
color: #2E2E2E;
transition: all ease 0.3s;
padding-left: 20px;
display: flex;
align-items: center
}


#navitagion_controls .langs > span img {
padding-right: 10px;
height: 25px;
}

#navitagion_controls .langs .langs_submenu {
display: none;
    position: absolute;
    top: 90px;
    background: #FFF;
z-index: 10;
width: 120px;
}

.sticky #navitagion_controls .langs .langs_submenu {
top: 70px;
}

#navitagion_controls .langs .langs_submenu a {
padding: 10px 20px;
display: block;
text-decoration: none;
}

#navitagion_controls .langs .langs_submenu a span {
display: flex;
align-items: center;
}

#navitagion_controls .langs .langs_submenu img {
padding-right: 10px;
height: 25px;
}



/* content */

 #content{
  padding: 0 var(--main-padd) ;
        }
        
#content.section{

  }  
 
.intro{
  background: radial-gradient(50% 50% at 50% 50%, #036AC9 0%, #003C88 100%);
  /*background: url(/img/intro_bg.jpg) no-repeat center center ;*/
  background-size: cover;
  /* opacity: 0.9; */

  color: #fff;
  margin: 0 calc(-1* var(--main-padd));
  padding: 6vh var(--main-padd) ;
  position: relative;
  display: flex;
     }
.intro-2{
  background: radial-gradient(50% 50% at 50% 50%, #036AC9 0%, #003C88 100%); 
  /*background: #009280 url(/img/intro2_bg.jpg) no-repeat center center ;*/
  background-size: cover;
  background: linear-gradient(95.4deg, #009289 11.96%, #00E7CB 89.44%);
  /* opacity: 0.9; */
  color: #fff;
  margin: 0 calc(-1* var(--main-padd));
  padding: 0vh var(--main-padd) ;
  position: relative;
  display: flex;
  margin-bottom: 150px;
     }   

.intro-2  .col:first-of-type {
    padding-top: 10vh;
    padding-bottom: 10vh;  
}        
   
.intro-3{
  /* background: #009280 url(/img/intro3_bg_full.jpg) no-repeat center bottom ; */
  background: #009280 url(/img/intro3_bg_full.webp) no-repeat center bottom ;
  background-image: url(/img/intro3_bg_full.jpg);
  background-image: -webkit-image-set( url('/img/intro3_bg_full.webp') 1x);
  background-image: image-set( url('/img/intro3_bg_full.webp') 1x);
  background-size: cover;

  /* opacity: 0.9; */
  color: #fff;
  margin: 0 calc(-1* var(--main-padd));
  padding: 10vh var(--main-padd) ;
  padding-bottom: 15vh;
  position: relative;
  display: flex;
  margin-bottom: 100px;
     }     
   
    
     
.col-laptop{
    margin-bottom: 0;
    position: absolute;
    bottom: -90px;
    width: 50%;
    height: 100%;
    right: 5%;
           } 
            
#laptop{
  width: 100%;
  height: 100%;  
  object-fit: cover;
       }
       
.onloadleft{
    animation: onloadleft 0.5s 0.2s ease-in both  alternate ;
           } 
.onloadright{
    animation: onloadright 0.5s 0.2s ease-in both  alternate ;
           }            
.onloadtop{
    animation: onloadtop 0.3s 0s ease-in both  alternate ;
           }
.onloadbottom{
    animation: onloadbottom 0.3s 0s ease-in both  alternate ;
           }  
.delay2{
  animation-delay: 0.2s;
       }                                      
                     
@keyframes onloadleft{
  from{     transform: translateX(50px); opacity: 0; }
  to {    transform: translateX(0px); opacity: 1;  }
} 
@keyframes onloadright{
  from{     transform: translateX(-50px); opacity: 0; }
  to {    transform: translateX(0px); opacity: 1;  }
} 

@keyframes onloadtop{
  from{     transform: translateY(50px); opacity: 0; }
  to {    transform: translateY(0px); opacity: 1;  }
} 
@keyframes onloadbottom{
  from{     transform: translateY(-50px); opacity: 0; }
  to {    transform: translateY(0px); opacity: 1;  }
} 



#dashboard{
      animation: dashscroll 11s 2.5s ease-in-out  infinite alternate ;
      position: relative;
              }   

/*
@keyframes dashscroll{
  from{     transform: matrix(3.0165, 0, 0, 3.0165, 827.3823, 376.9746) ; }
  to {    transform: matrix(3.0165, 0, 0, 3.0165, 827.3823, -6800) ;  }
} 
 */
@keyframes dashscroll{
  from{     y: 366px ; }
  to {    y: -7000px ;  }
}  

     
     
.intro .col{
  width: 50%;
  align-self: center;  
        }     
.intro .extra{
  font-size: 3em;
  line-height: 120%;
  
      }        
.intro p{
  max-width: 85%;
        }  
  
.intro h4{
  /* color: inherit; */
  color: #12ffe2;
  
  opacity: 0.9; 
  font-weight: 600; 
  margin: 10px 0; 
  font-size: .9em;
  text-transform: uppercase;
        }  
  
                 
.intro-2 p, .intro-2 ul  {
  color: #fff !important;
  text-shadow: 2px 1px 10px rgba(0,0,0,0.25);
 }    
.intro-2 h4  {
  color: #fff !important;
  opacity: 1;
 }  
          
.intro-2 .button  {
    background: #fff;
  border: 2px solid #fff ;  
 }  
 
.intro .button:hover{
  background-color: #fff;
  color: #2e2e2e;
  border: 2px solid #fff ;
       }      
       
/**/       
     
 

/**/
        
.intro .extra{
  /* line-height: var(--spinner-height); */
        }  
                

.spinner{

  color: #000;
   font-weight: 700;

  overflow: hidden;
  height: var(--spinner-height);
  display: inline-block;  
  vertical-align: bottom;
  border-radius: 5px;
}

 
        
.spinner strong {
  background: #00E7CB;
  background: #ffffff;  
  text-align: center;
  padding: 0 0.5em ;
  
    display: block;
    margin-top: 0em;
    line-height: var(--spinner-height);
    position: relative;
    transition: all ease 0.3s;
    animation: spinning 6s 1s ease-in  infinite alternate ;    

}        
  
.spinner strong:first-of-type {
    display: block;    

}      
       
@keyframes spinning{
  0%{     top: 0px;  }
  10% {    top: 0px;  }
  20% {    top: calc(-1 * 1 * var(--spinner-height));  }
  30% {    top: calc(-1 * 1 * var(--spinner-height));   }
 40% {    top: calc(-1 * 1 * var(--spinner-height));  }  
 50% {    top: calc(-1 * 2 * var(--spinner-height));  }
 60% {    top: calc(-1 * 2 * var(--spinner-height));  }
 70% {    top: calc(-1 * 2 * var(--spinner-height));  }
 85% {    top: calc(-1 * 3 * var(--spinner-height));  }

 100% {    top: -calc(-1 * 3 * var(--spinner-height));   }
  
}        
       
        
/**/


.switcher-obce{
 margin-top: -180px;
 float: right;
 position: relative;
 z-index: 9999;
}


a#pro-obce.active {
    color: black;
    text-decoration: none;
}
a#pro-obcany.active {
    color: black;
    text-decoration: none;
}



.cidla-vypis{
  display: flex;
  flex-wrap: wrap;
            }

.cidlo{
  width: 50%;
  /* float: left; */
  padding-bottom: 4em;
      }
.cidlo h3{
  margin-top: 0;
      }  
.cidlo h4{
  opacity: 0.4; 
  font-weight: 600; 
  margin: 10px 0; 
  font-size: .9em;
  color: inherit;
      } 
.cidlo a {
      text-decoration: none;
}       
.cidlo a img{
      transition: all ease 0.3s;
      height: auto;
}         
.cidlo a:hover img{
  opacity: .8;
}            
            
.cidlo p{
  max-width: 80%;
      }  
.cidlo:nth-of-type(even){
 /* clear: both;*/
      } 
       
.cidlo.pro-obce,
.cidlo.pro-obcany{
  transition: all ease 0.3s;
                }
.cidlo.pro-obcany{
  /*display: none;*/  /*   defaultni stav - vypnuti cidel pro obcany */
                          }
          
.cidlo.pro-obce.pro-obcany{
  display: block;
                          }
          
       
          
.cidla-moduly .cidlo{
    width: 33%;
    padding-right: 1em;
    padding-bottom: 3em;
            }
.cidla-moduly .cidlo p{
    max-width: 60%;
    
            }             
.cidla-moduly .cidlo h3{
    font-size: 1.4em;
    margin-bottom: -0.5em;
            } 
.cidla-moduly .cidlo h4{
    display: none;
            }          
          
          
          
.mobile-app, .contact, .two-cols{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  clear: both;
  border-top: 1px solid #ccc ;
  margin: 0 calc(-1* var(--main-padd));
  padding: 10vh var(--main-padd) ;
  position: relative;
           }
           
.mobile-app{  border-bottom: 1px solid #ccc ;} 

.button-app{
  margin: 10px 0;
           }
.button-app img{
  vertical-align: middle;
  max-width: 40%;
           }           
           
          
.contact{ } 
          
.two-cols{  
  padding-top: 5vh;
  padding-bottom: 5vh;
   border-bottom: 1px solid #ccc ;
   margin-bottom: 80px;
         }           

.two-cols + .two-cols {
margin-top: -80px;
border-top: none ;
}            
           
           
.mobile-app .col,
.contact .col,
.two-cols .col
{
  width: 50%;
           }
           
.mobile-app .p,
.contact p,
.two-cols p{
  max-width: 80%;
           }  
           
           
.two-cols h2{
   /*  margin: 50px 0 130px */ 
           }            


.contact-obce .col:first-of-type h4{
  color: #000 !important;
}
             
.contact .col:nth-of-type(2){
  padding-left: 10%;
}             
             

.contact-obce:before {
    content: "";
    background: #222 url(/img/bg_contact.jpg) no-repeat ;
    background-size: cover;
    position: absolute;
    left: 0;
    width: 50vw;
    height: 100%;
}   

.contact h4{
  color: #00E7CB !important;
  opacity: 1;
           }         
           
#form-dostupnost {
  margin-top: 3em; 
 /* padding: 0 ;*/

                   }  
#form-dostupnost form{
    margin: 0;
  border: none ;
  padding: 0 ;
  
 }
                            
#form-dostupnost form fieldset{
    margin: 0;  
 }
      
#form-dostupnost h4, #form-dostupnost label{
  display: none;
                   }    
#form-dostupnost td:first-of-type {
    display: none;
}                   

#form-dostupnost .button{
  width: auto;
                   }   
                   
#form-dostupnost .gdpr-note{
  display: none;
                   }   
                                      
                          
           
/**/

.faq{
  padding: 2vh var(--main-padd) 15vh var(--main-padd) ;
    }
h2[style="text-align: center;"]:before{
  margin-left: auto;
  margin-right: auto;
         }  
         
h2[style="text-align: right;"]:before{
  margin-left: auto;
  margin-right: 0;
         }  
                    

.question{
  border-top: 2px solid #ccc ;
  background: #fff url(/img/ico_plus.svg) no-repeat 98% center ;
  padding: 0.85em 5em 0.85em 0;
  cursor: pointer;
  transition: all ease .2s;
}
.answear:last-of-type{
  border-bottom: 2px solid #ccc ;
                      }
                      
.question:hover{
  color: #00BBF8;  
  background-blend-mode: luminosity; 
   }
.question.open{
    background: #fff url(/img/ico_minus.svg) no-repeat 98% center ;
         }



.answear{ 
  height: 0;
  margin: 0 ;
  padding: 0 5em 0 2em;
  overflow: hidden;
  transition: all ease .2s;
  
  font-size: 0.8em;
}

.open + .answear{ 
  height: auto;
  padding: 2em 5em 3em 2em;
  overflow: visible;
}

/**/

.timeline{
  display: flex;
  flex-flow: column;
  list-style: none;
  margin: 1em 0;
  position: relative;
  
  overflow-x: hidden;
}
.timeline:before{
  content: "";
  position: absolute;
  left: 50%;
  width: 3px;
  height: 88%;
  background: #00E7CB;  
}

.timeline li{
width: calc(50% - 106px);
    background: #f6f6f6;
    list-style: none;
    padding: 2em 2em;
    margin: 0 0 90px 0;
    position: relative;
    text-align: right;
}
.timeline li:nth-of-type(even){
  margin-left: auto;
  text-align: left;
  
}

.timeline li .date{
position: absolute;
    right: -245px;
    opacity: 0.3;
    top: .65em;
}

.timeline li:nth-of-type(even) .date{
    left: -260px;
  
}


.timeline li:after{
  content: "";
  display: block;
  position: absolute;
  right: -30px;
  top: 30px;
  
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 30px 0 0;
  border-color: #f6f6f6 transparent transparent transparent;
    
}  
 
.timeline li:nth-of-type(even):after{
  left: -30px;
  border-width: 0 30px 30px 0 ;
  border-color: transparent #f6f6f6  transparent transparent;
}  

.timeline li:before{
    content: "";
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 3px solid #00e7cb;
    height: 60px;
    width: 60px;
    border-radius: 60px;
    position: absolute;
    top: 0;
    right: -140px;
    background-color: #fff;
    background-image:  url(/img/ico_mail.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 36px;  
}
.timeline li:nth-of-type(2):before{
    background-image: url(/img/ico_attachment.svg) ;
}
.timeline li:nth-of-type(3):before{
    background-image:  url(/img/ico_settings.svg);
}
.timeline li:nth-of-type(4):before{
    background-image:  url(/img/ico_user.svg) ;
}
.timeline li:nth-of-type(5):before{
    background-image:  url(/img/ico_sound.svg) ;
}
.timeline li:nth-of-type(6):before{
    background-image:  url(/img/ico_cart.svg) ;
}
.timeline li:nth-of-type(7):before{
    background-image:  url(/img/ico_settings.svg) ;
}
.timeline li:nth-of-type(8):before{
    background-image:  url(/img/ico_thumbsup.svg) ;
}



.timeline li:nth-of-type(even):before{
  left: -138px;
}     
            
    
/**/

img.partners-item {
    border: 1px solid #eee;
}
    
            
/**/    
    
    

.results_search form{
  padding: 1.5em 3em ;
  border-color: #eee;
                 }    
.results_search form .button{
  margin-left: 0.3em;
                 }        
            

/*  xxx     */


.id-aktuality #articles {
display: none;
}

.news-item{
  padding:  0 ;
  margin-top: 1em;
          }
.news-item h4{
  margin: 0 0 15px 0;
  font-weight: 500;
}
.news_photo img {
  float: right;
  margin: -60px 0 30px 60px;
            }
.news-item p {
  margin-right: 15%;
            }            


#articles {
background: #F6F9EF;
padding: 60px 0 80px 0;
margin-top: 50px;
}

#articles h2 {
margin: 20px 0;
}



#articles .news-item {
width: 47%;
margin-top: 30px;
}


#articles h4 {
margin: -20px 0 20px 0;
}

#articles a {
/*color: #C22800;*/
text-decoration: none;
font-size: 31px;
font-weight: 500;
}
#articles .news_photo a:hover  img {
  opacity: 0.8;
}

#articles .news_photo img {
  float: none;
  margin: 0;
  display: block;
}

#articles .separ {
display: none;
}






/*   layout    */
.container-reset{
  margin-left: -100px ;
  margin-right: -100px ;
          }  




.container{
  margin: 0 auto;

  display: flex;
  justify-content: space-between;
   flex-wrap:wrap;
   /**/ width: 100%;
}
.container.center{
  justify-content: center;
}



.col--100{
  width: 100%;
}
.col--80{
width: 80%;
}
.col--66{
  width: 66.66667%;
}
.col--60{
  width: 60%;
}
.col--50{
  width: 50%;
}
.col--40{
width: 40%;
}
.col--33{
  width: 33.333334%;
}
.col--30{
  width: 30%;
}
.col--25{
  width: 25%;
}
.col--20{
  width: 20%;
}


          
.col-content{
  order: 2;
            }


.col--33 p, .col--25 p, .col--20 p{
  width: 90%;
  margin-left: auto;
  margin-right: auto;
            }


.boxes{
  display: flex;
  
      }
.boxes p{
  background: #eeeeee73;
    padding: 2em 1.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    
    margin: 1em;
    width: 100%;    
}

.boxes-border{
  border: 1px solid #ddd ;
  padding: 2em 1.5em 3em 1.5em ;
  margin-top: 1em;
  
  display: flex;
  flex-flow: column;
  justify-content: space-between;
}

.boxes-border + .boxes-border{
  margin-left: -1px;                             
                             }



/**/

/*  owl   */


.owl-carousel {
border-bottom: 10px solid #000;
}

.owl-theme .owl-dots, .owl-theme .owl-nav {
	text-align: center;
	-webkit-tap-highlight-color: transparent
}
.owl-theme .owl-nav {
  position: absolute;
  z-index: 99999;
  left: 0;
  right: 0;
  top: 55%;
  font-size: 80px;
}
.owl-theme .owl-nav [class*=owl-] {
/*
	color: #f2e748 !important;
	font-size: 14px;
	margin: 5px;
	padding: 4px 7px;
	border-radius: 3px
  
  */	
  display: inline-block;
	cursor: pointer;

}
.owl-theme .owl-nav [class*=owl-]:hover {
	color: #fff;
	text-decoration: none
}
.owl-theme .owl-nav button:focus,
.owl-theme .owl-nav span:focus
 {
	outline: 0;
}
.owl-theme .owl-nav span {
	display: none;
}
.owl-theme .owl-nav .disabled {
	opacity: .5;
	cursor: default
}
.owl-theme .owl-nav.disabled+.owl-dots {
	margin-top: 10px
}
.owl-theme .owl-dots .owl-dot {
	display: inline-block;
	zoom: 1
}
.owl-theme .owl-dots .owl-dot span {
	width: 50px;
	height: 4px;
	margin: 5px 7px;
	background: #fff;
	display: block;
	-webkit-backface-visibility: visible;
	transition: opacity .2s ease;

}
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
	background: #ECD500;
}

/**/

.owl-theme .owl-nav .owl-prev,
.owl-theme .owl-nav .owl-next
 {
    border: none ;
	  border-left: 2px solid #FFF !important;
    border-bottom: 2px solid #FFF !important;
    width: 40px;
    height: 40px;
    border-radius: 0;
    outline: 0;
    transform: rotate(45deg);
    border-radius:0;
}

.owl-theme .owl-nav .owl-next  {
    border: none !important;
	  border-right: 2px solid #FFF !important;
    border-bottom: 2px solid #FFF !important;
    transform: rotate(-45deg);
}
.owl-theme .owl-nav .owl-prev:hover,
.owl-theme .owl-nav .owl-next:hover
 {
    border-color: #ECD500 !important;
}

        
.owl-dots{
  position: absolute;
  z-index: 99999;
  left: 0;
  right: 0;
  bottom: 50px;
        }
        
        
.owl-prev{
  position: absolute;
  left: 2.5vw;
  
        } 
        
.owl-next{
  position: absolute;
  right: 2.5vw;
        }   
        
.slider{
  margin-bottom: 70px;
  background: #16532A;
  animation: show-opacity .5s;
}

@keyframes show-opacity{
  from { opacity: 0;
       }
 top{ opacity: 1;
    }       

}

.owl-carousel .title{
  position: absolute;
  top: 165px;
  left: 200px;
  width: 32%;
  color: #fff;
  font-size: 1.5em;
  font-weight: 500;
    text-shadow: 0 0 20px rgba(0,0,0,0.7);
}



           
.owl-carousel .item--description{
  color: #fff;
  font-size: 1.3em;
    
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    top: 45%;
} 
.owl-carousel .item--description .container{
  display: block;
} 
.owl-carousel .item--description .container p{
  padding-left: 10%;
  padding-right: 10%;
font-size: calc(2vw + 10px);
font-weight: 500;
}           

.owl-carousel .item--description .red-separ {
color: #C22800;
padding: 0 10px;
}
      





/**/


.maincontent{
  padding: 10px 0px 20px 0px ;
  position: relative;
}
.extra{
  font-size:1.8em;
  letter-spacing: -0.02em;
  line-height:140%;
  position:relative;
  z-index:110;
  margin-bottom: 40px;
}
p strong{
 
}






/**/

.flex{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
     }
.aic{
  align-items: center;
}

.jca{
  justify-content: space-around;
    }  
.jcc{
  justify-content: center;
    }     
       

/**/

.button{
-webkit-appearance: none;


  margin: 10px 0;
  border-radius: 5px ;
  padding: 0.65em 2.5em  0.5em 2.5em ;
  display: inline-block;
  transition: all ease 0.2s;
  color: #000;
  text-decoration: none;
  /*font-size: .9em;*/
  font-size: 0.8em;
  background: #00E7CB;
  border: 2px solid #00E7CB ;  
  font-family: inherit;
  cursor: pointer;
}

.button:hover{
  background-color: #2E2E2E;
  color: #fff;
  border: 2px solid #2E2E2E ;
       }       

.button-secondary{
  background: transparent;
  border: 2px solid #2E2E2E ;
  color: #2E2E2E;
  
}
.button-secondary:hover{
  background: transparent;
  border: 2px solid #00E7CB ;
  color: #00E7CB;
}




/* footer */
#footer{
  padding: 10vh var(--main-padd) ;
  clear: both;
  font-size: .8em;
  /*	color:#666666;*/
  /*background: linear-gradient(90deg, #003272 0%, #00C2FF 99.99%);*/
  background: linear-gradient(95.4deg, #009289 11.96%, #00E7CB 89.44%);
  color: #fff;
  margin-top: 150px;
	  }
#footer p{
  margin:20px 0;
	  }
#footer h3{
  font-size: 1.5em;
  color: #fff;
  font-weight: 500;
  margin-top: 0;
}
#footer ul{
  margin: 0;
  padding: 0 ;
  list-style: none;
  
}
#footer ul li{
  list-style: none;
  margin-bottom: .5em;
}



#footer p.extra{
  font-size: 1.7em;
  line-height: 1.6;
         }
#footer a{
    text-decoration: none;
    color: #fff;
}
#footer a:hover{
    color: #00E7CB;
    text-decoration: underline;
}

#footer .creactive a{ 
  font-size: .8em;
  text-decoration: none;
  color: #999;
  }

#footer .cc {
border-top: 5px solid #F6F9EF;
padding-top: 50px;
margin-top: 50px;
}

#footer .col--25{
  margin-bottom: 2em;  
            }

#footer .nav-social {
    margin: 2em 0;
}
.nav-social li {
    display: flex;
}

.nav-social a {
    border: 1px solid #fff;
    border-radius: 60px;
    width: 60px;
    height: 60px;
    vertical-align: middle;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 1em;
}


.counters{
  height: 0px;
  overflow: hidden;
         }

/**/

.panels {
padding-top: 60px;
padding-bottom: 60px;
}

.panels .col-sidebar {
text-align: center;
padding-right: 60px;
}

.contact-box {
background: #F6F9EF;
idth: 80%;
padding: 50px 50px 60px 50px;
text-align: left;
margin: 20px auto 0px 0;
}

.contact-box h4 {
font-size: 22px;
margin-top: 0;
    margin-bottom: 25px;
}

.contact-box img {
float: left;
margin: 0px 15px 0px 0px ;
}

.contact-box p {
margin: 0;
}


.panels .rozcestnik ul {
margin: 0;
padding: 0px 50px 0 0;
}

.panels .rozcestnik li {
list-style: none;
border-bottom: 5px solid #F6F9EF;
}

.panels .rozcestnik a {
font-size: 26px;
/*color: #C22800;*/
text-decoration: none;
background: url('/img/ico_arrow_yellow.svg') no-repeat left center;
padding: 30px 0 30px 25px;
display: block;
font-weight: 500;
}

@media screen and (min-width:1400px){

.id-index .panels .rozcestnik a {
font-size: 38px;
line-height: 50px;
padding-left: 30px;
}

}


/*  class   */
.noscreen, .none{display: none;}
.separ {border-bottom: 1px dotted #ccc ; line-height: 1px; font-size: 1px; height: 1px; 
margin: 40px 0px 40px 0;  clear: both; }
.break {clear: both; line-height: 0px; font-size: 1px; height: 0px; margin: 0 ;}
.left { text-align: left;}
.right { text-align: right;}
.center { text-align: center;}
.justify {text-align: justify;}
.fl { float: left; position: relative;}
.fr { float: right; position: relative;}


.green{  color: #00c5ad   ; }
.soft{ opacity: .5;     }
.primary-color{ color: #00E7CB ;              }

.mega{  font-size: 1.8em;
}

img[style*="float: left"] {
  margin: 30px 50px 50px 0px;
}

img[style*="float: right"] {
  margin: 30px 0px 50px 50px;
}


h3 img {
float: right;
margin: 0;
}




/*  Katalog   */
p.breadcrumbs{
  font-size:0.7em;
  margin:3em 0 1em 0;
  color:#aaa;
}
p.breadcrumbs a{
  color:#999; text-decoration: none;
}

h2 strong{
  color: #b2ca1e;
  font-weight: 700;
         }


p.extra.fl{}


/**/
ul.subnav{
  margin: 0 0 100px 0;
  padding: 0 ;
  display: flex;  
  flex-flow: column;
  flex-flow: row;
  flex-wrap: wrap;
  order-bottom: 2px solid #eee;
         }
         
.subnav li{
  min-width: 30%;
  padding: 0.5em 0;
  margin-left: 1em;  
 }         

ul.subnav .subnav{
  flex-flow: row;
  flex-wrap: wrap;
  /**/ justify-content: center;
   margin-bottom: 50px;  
         }  
ul.subnav .subnav li{
  min-width: 5vw;
  max-width: 20%;
  width: auto;
  margin: 0;
  padding: 0 ;
  
  display: flex;
         }  
                
         

li.cat_0 {
  width: 100%;
  list-style: none ;
  position: relative;
  margin: 0;
  padding: 0 ;
}

li.cat_1{
  width: 47%;
  margin-right: 2%;
  list-style: none ;
  position: relative;
}


li.cat_0 a{
  display: block;
  
  font-weight: 400;
  top: 0;
  margin: 10px ;
  padding: 20px 10px ;
  font-size: 1.3em;
  text-decoration: none;
  text-align: center;
}

li.cat_0 a img{
  /*width: 55%;*/
  -webkit-transition: all 0.2s linear 1s;
  transition: all 0.2s linear ;
  display: block;
  opacity: 1;
  margin: 15px auto;
  padding: 0 ;
}


li.cat_0 > a {
    font-size: 1.5em;
    color: #222;
}

li.cat_0 > a > img{
    display: none;
}


li.cat_0 a:hover img{
  opacity: 0.7;  

}


li.cat_1 a{
 font-size: 1em;
 
 display: flex;
    flex-flow: column;
    font-size: 1em;
    justify-content: space-between;
        }
li.cat_1 a img{
  width: 75%;
  margin: 0px auto 10px auto;

}

.paging{
  clear: both;
  text-align: center;
       }
/**/

.detail_left{
  float: left;
  width: 50%;
  padding-right: 2em;
            }
.detail_right{
  float: left;
  width: 50%;
  margin-bottom: 60px;
            }            

#blueimplinks  {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
}



#blueimplinks a:first-of-type {
    width: 100%;
}
#blueimplinks a {
    width: 25%;
}


.buy {
    padding: 0.1em 1.5em;
    background: #f6f6f6;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.buy form {
  margin: 0;
  padding: 0 ;
  border: none ;
}
.buy .button {
  font-size: 1em;
}
.buy .price{
  text-align: right;
    }
.buy small{
  opacity: .6;
    }

.buy .word_price {
display: none;
}

.buy.product_disable_order .price, .buy.product_disable_order form {
display: none;
}

.buy.product_disable_order .word_price {
text-align: center;
display: block;
width: 100%;
}
 
.table_files{
  margin: 0 0 30px 0;
            }
.files{
  margin: 20px 0;
      }
.detail_right .files + .files {
  margin-top: -20px;
                               }      
.detail_right .files + .files h4{
  display: none;
                               }        
      
.notice{
    background: #ffeb3b;
    padding: 1.5em 2em;
       }                

a.more{
  color:#fff;
  font-size:0.9em;
  font-weight:bold;
  position:relative;
  top:10px;
  text-decoration:none;
  padding:3px 95px 3px 10px;
}
a.more:hover{

}



.cart_big td{
  padding: .8em 0 ;
            }

tr.high {
    color: #999;
}
tr.total{
    background: #f3f3f3;
    border-top: 3px #333 solid;
}

.count input{
  width: 3em;
}
.nostrong strong{
  font-weight: normal;
}

.eshop{
  font-size: 1em;
  width: auto;
  margin-bottom: 2em;
  max-width: none;
      }
.quiet{
  opacity: 0.5;
}

.cart_big input.radio{
  margin: 5px 20px 40px 0  ;
    width: 25px;
    height: 25px;  
  float: left;
}

.cart_transport{
  float: left;
  width: 45%;
               }
.cart_payment{
  float: right;
  width: 45%;
               }    
               
.terms{
  margin:50px 0px 20px 0; text-align:right;
}

.missing-ic-, .missing-dic-{
  display: none;
                           }

#eshop_nav{
  clear: both;
          }

.id-eshop h2{
  margin-bottom: 20px;
  padding-bottom: 20px;
  
         }
.ico_cart{
  margin-left: 40px;
         } 
.lang-pl .ico_user, .lang-en .ico_user,   .ico_user{
  margin-left: 40px;
                  }         
           
.ico_cart:hover{
  opacity: .5;
         }            
.ico_cart img{
  vertical-align: top;
         }                 

#payment_1 td,
#payment_2 td,
#payment_3 td,
#payment_4 td,
#payment_5 td
{ display: block !important ;
          }                          

#fak_adress{
  display: none;
           }
.cart_user {
  width: auto;
             }           
.cart_user td{
  border: none ;
             } 
.cart_user th{
  background: none;
  color: #00BBF8;
  border: none ;
  
             }    
.errors{
  color: red;
       }                       
             
         
#zasilkovna{
    padding-left: 45px;
           }                       

/* product-item */

.product-list{
  display: flex;
  margin-bottom: 100px;
  justify-content: start;
  flex-wrap: wrap;
             }

.product-item{
  margin: 0 -1px -1px 0;
  width: 25%;

  position: relative;
  background: #fff;
    text-align: center;
  /*  border-radius: 5px ;*/
    border: 1px solid #eee;   
    padding-bottom: 1em; 
    transition: all ease 0.2s;
}


.product-item img{
  position:relative;
  margin:0 0;
  padding: 0 ; 
  display: block;
  width: 100%;
  height: auto;
  border-radius: 5px ;  
}
.product-item h3{
  margin:0;
  padding: 0 ;
  font-size: 1em;
  border: none;
  clear: none;
  letter-spacing: 0;
}


.product-item h3 a{
  text-decoration:none;
  display: block;
  padding: 0 ;
  position: relative;
      transition: all ease 0.2s;

}

.product-item h3 a span{
  padding: 2px 15px 5px 10px;
  display: block;
}

.product-item .price{
  margin: 0 ;
  font-size:1em;
  font-weight: 400;
}

.product-item .price.product_disable_order {
display: none;
}

.product-item p.price strong{
  font-weight: normal;
}

.product-item:hover{
  /*border-color: #111  ;*/
  border-color: #666;
  z-index: 99999;
}
.product-item h3 a:hover img{
  opacity: .8;
}


/*      katalog list/grid      */
.id-kat h2{
  margin-bottom: 40px;
          }
.category_description{
  max-width: 90%;
                     }  
.category_subcategories{
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  list-style: none;
  margin: 0 0 15px 0;
  padding: 0 ;
}   
.category_subcategories li{

  list-style: none;
   /* margin: 0 0 20px 0; */
  margin: 0 -1px -1px 0;
  padding: 0 0 ;
  text-align: center;
      width: 25%;
  line-height: 120%;
  font-size: 0.85em;
  /* border: 1px solid #eee;  */
} 
.category_subcategories li:before{
  display: none !important;
}

.category_subcategories li a{
  padding: 0 10px 0 0;
  
    display: flex;
    align-items: center;
    text-align: left;
    border: 1px solid #eee; 
      position: relative; 
} 
.category_subcategories li a:hover{
  border-color: #666;
  z-index: 99999;
} 
.category_subcategories li a img {
    order: -1;
    max-width: 110px;
}
      
      
                          

.product-list:after {
	content: '';
	display: block;
	clear: both;
}

#productListDisplay {
  margin-top: 0px;
  margin-bottom: 10px;
	text-align: right;
}

#productListDisplay a {
	display: inline-block;
	text-decoration: none;
	position: relative;
	padding: 5px;
}

#productListDisplay a:hover, #productListDisplay a.activeDisplay {

}

#productListDisplay svg {
	opacity: 0.2;
}

#productListDisplay a:hover svg, #productListDisplay a.activeDisplay svg {
	opacity: 1;
}

#productListDisplay a:first-of-type {
	margin-right: 5px;
}
.product-list.list {
	flex-flow:column;
}

.product-list.list .product-item {
    width: 100%;
    min-height: 90px !important;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1em ;
}


.product-list.list .product-item h3 {
	float: left;
}

.product-list.list .product-item h3 a {
	display: table;
}

.product-list.list .product-item h3 br {
	display: none;
}

.product-list.list .product-item h3 img  {
	display: table-cell;
	    width: 70px;
    padding: 10px;
}

.product-list.list .product-item h3 span {
	display: table-cell;
	vertical-align: middle;
  font-size: 1.1em;
  padding: 0 5px  ;
}



.product-list.list .labels {
	display: none;
}




.labels{
  position: absolute;
  z-index: 99;
  width: 100%;
  text-align: center;
  font-size: 1em;
       }



/* Tisknout a nahoru  */
.c2a{
  background-color: #eee;
  padding: 1px 20px ;
}
.meta{
  text-align: right;
  padding-top:10px;
  margin: 100px 50px;
  border-top:1px dotted #ccc;
}
.meta a{
padding: 2px 0px 5px 22px ;
color:#666666;
font-size:0.9em;
}
.meta a:hover{
color:#cd0000;
}

/*  ico  */
.ico{
	padding-left: 22px;
  background-position: 5px 5px;
  background-repeat: no-repeat;
}
.up{background-image: url(../img/ico/go_home.gif);}
.print{background-image: url(../img/ico/printer.gif);}


#header button {
display: none;
}















/*    NAJDI OBEC    */

.obec-search{
  box-shadow: 0 0 40px -20px;
    padding: 1rem 2rem;
    text-align: center;
            }
.obec-search-result{
    margin: 0px;
    padding: 1em 1em 3em 1em;
    text-align: center;
    box-shadow: 0px 0px 40px -20px inset;
    /* border: 10px solid rgb(176 176 176); */
    background: #f9f9f9;
}    
.obec-search-result form{
    border: none ;
    margin: 2rem auto;
    padding: 0 ;
}  
        
.obec-search-result table.form{
    margin: 1rem auto;
    width: auto;
}  
.obec-search-result h4{
    display: none;
} 

.obec-search-result input[type=text],.obec-search-result textarea{
    background: #fff;
} 
.obec-search-result input[type=text]::placeholder, .obec-search-result textarea::placeholder {
    color: #ccc;
}
   
   
   
input#L191 {
    position: relative;
    width: 1.1rem;
    height: 1.1rem;
}   
input#L191:after {
    display: inline;
    content: attr(placeholder);
    width: 470px;
    position: absolute;
    left: 1.5rem;

}
textarea#L190 {
    height: 4.7em;
}

label[for=L191]{
  display: none;
}



.typeahead {
    width: 90%;
    max-width: 700px;
    margin: auto;
    display: block;
    padding-bottom: 30px;
    position: relative;
}

.typeahead input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 700px;
    padding: 10px;
    opacity: 1;
    background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);
}

.twitter-typeahead {
    /*width: 100%; MM*/
        vertical-align: middle;
        margin: -2px 1px 0 1em
    
}

.twitter-typeahead .tt-query,
.twitter-typeahead .tt-hint {
    margin-bottom: 0;
}

.typeahead ul, .typeahead li {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
}


.tt-menu, .ui-menu {
    /* width: 100%;  MM*/
    text-align: left;
    width: 130%;
    max-width: 700px;
    margin-top: 2px;
    padding: 5px 0;
    background-color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;

}

.tt-suggestion, .ui-menu-item {
    display: block;
    padding: 6px 20px;
}

.tt-selectable:hover {
    cursor: pointer;
    background: #eee;
}

.ui-helper-hidden-accessible {
    display: none;
}

.typeahead-footer{
    border-top:1px solid #eee;
    margin-top:10px;
    padding: 20px;
}

/*  // NAJDI OBEC  */

















/*  RESPONSIVE  */


/*              */
@media screen and (max-width:1400px){
 body{
    }

.col--50.poptavka{
  width: 100%;
}    
 


#header button {
  display: block;
  /*position: absolute;*/
  right: 15px;
  top: 8px;
  color: #00E7CB;
  padding: 6px 6px;
    background-color: transparent;
    border: 2px solid #FFF;
    border-radius: 5px;
    font-size: 2em;
  z-index: 99999;
  transform: scaleX(2);
}

#header button:focus{
  outline: none;
                    }


#navigation{
  display: none;
  position: absolute;
  top: 89px;
  left: 0;
  height: auto;
  background: #eee;
  z-index: 99;
padding-bottom: 1em;
           }
#navigation ul{
  display: flex;
  flex-flow: column;
  width: 100%;
  padding: 1em 0 ;
padding-bottom: 0;
           }   
#navigation ul li{
   width: 100%;
   margin: 0;
           }            
#navigation ul li a{
   text-align: center;
   font-size: 1.3em;  /* stejne .sticky*/
   border: none ;
   color: inherit;
           }               
#header.sticky #navigation{
  height: auto;
top: 70px;
                          }  
#header.sticky #navigation > ul > li > a{
   font-size: 1.3em;  
                                        }   
                                        
#navigation ul ul {
  display: none !important;
                  }                                                                        
           
   /*        
.ico_cart{
  display: none;
         }
*/

ul.subnav .subnav li{
  max-width: 33%;
                    }  

#navigation .m_langs {
display: block;
text-align: center;
}

#navigation .m_langs a {
    display: inline-block;
    text-align: center;
    height: 50px;
    line-height: 50px;
font-size: 1.3em;
text-decoration: none;
transition: all ease 0.3s;
color: #2e2e2e;
}

#navigation .m_langs a:hover {
color: #00BBF8 ;
}

#navigation .m_langs a img {
height: 40px;
margin-right: 10px;
}

#navigation .m_langs a span {
display: flex;
align-items: center;
margin: 0 15px;
}




#navitagion_controls {
flex: 1;
justify-content: flex-end;

}

#navitagion_controls .langs {
display: none;
}

#navitagion_controls .ico_user {
    padding-left: 0;
margin-left: 10px;
}

#navitagion_controls .ico_user, #navitagion_controls .ico_cart {
position: relative;
top: 5px;
}


}  


/*                  */
@media screen and (max-width:1200px){

.owl-carousel .title {
top: 120px;
}

.owl-theme .owl-nav {
top: 2.5em;
}

.owl-dots {
bottom: 30px;
}

.category_subcategories li{
  /*width: 20%;*/
 }

}


/*                        */
@media screen and (max-width:1100px){
h2{
  margin: 50px 0;
  padding: 0 0 30px 0 ;
  }
#page{
  padding-top: 69px;
     }
#header  {
  height: 70px;
}
#header h1 a {
  top: 0px;
  height: 70px;
/*  max-width: 70%;*/
}

#navigation{
top: 70px;
           }

                    
.intro-2{
  text-align: center;  
  flex-flow: column;
  margin-bottom: 80px;
        }
        
.intro-3{
  padding-top: 4vh;
  padding-bottom: 0vh;
  flex-flow: column;
  text-align: center; 
  margin-bottom: 0px; 
        }        
        
.intro .col{
  width: 100%;
  padding-top: 2em;
  padding-bottom: 2em;
           }
.intro-2 .col:first-of-type{
  padding-top: 2em;
   padding-bottom: 0;
                           }
           
.col-laptop{
  position: relative;
  width: 100%;
  right:0;
  bottom: 0;
           }           

                          
.intro ul{
  padding: 0 ; list-style: none ;
  margin: 2em 0;
        }
.intro li{
  padding: 0 ; list-style: none ;
  margin: 0;
        }        
              
.intro p{
  max-width: 100%;
        } 

.two-cols h2 {
    margin: 60px 0;
}

.switcher-obce {
    margin-top: -150px;
}
 
.col--20{
  width: 33%;
  margin-top: -1px;
  margin-left: -1px;
}

.col--25{
  width: 50%;
  margin-top: -1px;
  margin-left: -1px;
       }
       
#footer{
  padding-top: 5vh;
          }          
 
                       
                        
}  


/*                  */
@media screen and (max-width:1000px){

.owl-carousel .title {
width: 50%;
top: 100px;
}

.owl-theme .owl-nav {
top: 2em;
}

.owl-dots {
bottom: 30px;
}

.category_subcategories li{
  width: 33%;
}



}


/*                        */
@media screen and (max-width:800px){


h1{margin: 30px 0;}
h2{ margin: 30px 0;  padding: 0 ; }
h3{ margin: 30px 0;   }
h4{ margin: 20px 0;   }

p{
  margin: 20px 0;
 }
       
.owl-carousel .item--description{
    top: 30%;
}       


.col--100,
.col--80,
.col--66,
.col--60,
.col--50,
.col--40,
.col--33,
.col--30,
.col--25,
.col--20
{
  width: 100%;
}

.owl-theme .owl-dots .owl-dot span {
width: 20px;
}


.owl-carousel .title {
width: 80%;
top: 10%;
left: 10%;
}

.owl-theme .owl-nav {
top: calc(50% - 20px);
}

.owl-dots {
bottom: 10px;

.news_photo img {
  float: none;
  margin: 0;
            }

}

.col-laptop{
  bottom: 0;
           } 

.cidlo{
  width: 100%;
  padding-bottom: 0;
  margin-bottom: 0;
  
      }
.cidlo p{
  max-width: 100%;
        }  
        
.cidla-moduly .cidlo{
    width: 50%;
  }            

.mobile-app, .contact, .two-cols{
  padding-top: 2vh; 
  padding-bottom: 4vh;
                                }
.mobile-app .col, .contact .col, .two-cols .col{
  width: 100%;
                                               }
.contact-obce:before{
  display: none;
                    } 
.contact .col:nth-of-type(2) {
    padding-left: 0;
}              
.mobile-app .p, .contact p, .two-cols p {
    max-width: 100%
       }     
.faq {
    padding: 5vh 0 10vh 0;
}
.answear{
  font-size: 0.9em;
        }  
      
.timeline{
      overflow: visible;
      padding-top: 50px;
    }    
.timeline:before{
  top: 30px;
}    
.timeline li, .timeline li:nth-of-type(even){
  width: 100%;
  text-align: center;
  padding: 3em 1em 2em 1em;
}      
.timeline li:before, .timeline li:nth-of-type(even):before{
  top: -40px;
  right: 0;
  left: 0;
  margin: 0 auto !important;
}   
.timeline li:after, .timeline li:nth-of-type(even):after{
  display: none;
}    
.timeline li .date{
  position: static;
  display: block;
  margin-top: .5em;
}


.boxes p{
   display: block;
   margin-bottom: 0;
              }


ul.subnav{
  border: none ;
  margin-bottom: 30px;
}
ul.subnav .subnav li{
  display: flex;
  line-height: 130%;
}
li.cat_0 a{
  padding: 10px 5px ;
  margin: 5px;
  border: 1px solid #eee;
}
li.cat_0 > a{
  border: none;
}

li.cat_0 a img{
  margin: 0 auto;
}
ul.subnav .subnav li{
  max-width: 50%;
                    }  
li.cat_1 a img{
  width: 90%;
}                                                                   



.category_subcategories li{
  width: 50%;
}


.product-item{
  width: 50%;
}

.detail_left, .detail_right{
  float: none;
  width: auto;
}
.bi-gallery img{
  max-width: 90%;
}
.buy .price{
  text-align: left;
}
.eshop{
  display: block;
  text-align: center;
  margin: 1em 0;
  padding: 1em  ;
  width: 100%;
  max-width: none;
  margin-bottom: 0;
}
.cart_big{
  margin: 20px 0;
}
.cart_big td {
    padding: .8em .35em;
}

.cart_transport, .cart_payment{
  width: 100%;
}
.cart_big input.radio{
  margin-bottom: 25px;
}
.cart_user{ margin: 20px 0;}
#customer_note textarea{
  width: 100% !important;
}

.terms{
  margin: 20px 0; text-align:center;
}

table.form td{
  display: block;
  padding: 5px 0 ;
}
table.form td textarea{
  width: 100% !important;
}
table.form td .button{
  font-size: 1em;
}
#form{
  width: 100%;
}
#form-dostupnost{
  margin-top: 1em;  
 }

.switcher-obce{
 margin-top: -160px;
 float: right;
}

         
.subnav li{
  min-width: 90%;
  /*padding: 0.5em 0;*/
  /*margin-left: 1em;  */
 }
 
 


}

/***/
@media screen and (max-width:540px){
#header h1 a {
    width: 170px;
}

  .buy{
  display: block;
  }
  .buy .price{
  margin-bottom: 0;
}
.cidla-moduly .cidlo{
    width: 100%;
    text-align: center;
  } 
.cidla-moduly .cidlo p{
    margin-left: auto;
    margin-right: auto;
  } 

#navitagion_controls .ico_user {

margin-right: 10px;
}



}



/*/
@media screen and (max-width:540px){
.owl-carousel .title {
font-size: 16px;
width: 90%;
left: 5%;
}

.owl-dots {
bottom: -5px;
}

.owl-carousel .item--description{
    top: 15%;
}  


}