:root {


--fs-xl: clamp(1.7rem, 2vw + 1rem, 2.2rem);
--fs-xlhomepage: clamp(1.7rem, 2vw + 1rem, 2rem);
--fs-h2: clamp(1.2rem, 1.7vw + 1rem, 1.7rem);
--fs-h3: clamp(1.1rem, 1.4vw + 0.7rem, 1.2rem);
--fs-h4: clamp(1.0rem, 1.2vw + 0.5rem, 1.2rem);
--fs-big: 2rem;
/* --fs-normal: 1rem; */
/* --fs-normal: clamp(0.8rem, 1.1vw + 0.2rem, 1.1rem); */
--fs-normal: clamp(0.9rem, 1.1vw + 0.2rem, 1.1rem);
--fs-small: 0.8rem;

//line height
--lh-xl: 1;
--lh-h1: 1;
--lh-h2: clamp(1.5rem, 1.7vw + 1rem, 1.9rem);
--lh-h3: clamp(1.1rem, 1.4vw + 0.7rem, 1.4rem);
--lh-h4: clamp(1.0rem, 1.2vw + 0.5rem, 1.2rem);
--lh-big: 1;
--lh-normal: 1.25;
--lh-small: 1.2;

--menumobilecolor:#C8B080;


--barva1:#D8C7A5;
--barva2:#C8B080;
--barva3:#B49452;
--barva4:#8e743e;



--zelena:rgba(126,193,26,1);
--zelena2:rgba(26,113,26,1);
--modra:rgba(39,172,248,1);
--modra2:rgba(19,132,200,1);
--modratmava:rgba(6,36,76,1);


--pozadibile:rgba(255,255,255,1);

--cervena:rgb(200,0,0);
--cervenaA:rgba(200,0,0,0.8);
--zluta:rgb(139, 69, 19);
--hneda1:rgb(102, 48, 28,1);
--hneda2:rgb(92, 51, 23,1);
--hneda3:rgb(142, 135, 122,1);
--hneda4:rgb(32, 31, 23,1);

--cerna:rgba(40,40,40,1);

font-size:16px;
}
.rozmazani {

    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    mask-image: linear-gradient(to bottom, 
        transparent 0%, 
        black 100%);
        
    pointer-events: none;

}


.footerkontakt p {
font-size:var(--fs-h2) !important;
}

.footerkontakt p a {
font-size:var(--fs-h2) !important;
text-decoration: none;
}

.footerkontakt img {
width:30px;
position: relative;
top:7px;

}




.logofooter {
width:40%;
max-width:240px;

}

.footerp {
padding:0;
font-size:var(--fs-small);
line-height:var(--lh-small);
}



.grid-item img {
max-width:300px;
}

.homepageimg {
opacity:0.48;
max-width:150px;
width:30%;
transition-delay: 500ms; 
}

.googlereview {
background-color: white;
text-decoration: none;
display: inline-block;
border-radius:10px;
margin:40px 0 10px 0;
padding:4px 10px 4px 10px;
box-sizing: border-box;
color:black !important;
text-align: center;
font-size:var(--fs-normal);
line-height:var(--lh-normal);
transition:200ms all ease;
}
.googlereview img {
width:140px;
}
.googlereview:hover {

transform:scale(1.05);
}

.homeikony {
width:100%;

}

.homeikona {
width:20%;
display: inline-block;
aspect-ratio:3/2;
border-radius:10px;
max-width:200px;
margin:0 1vw;
}

.xhomeikona1 {
background:rgba(255,255,255,0.9) url('ikonyhome1m.png') no-repeat center center;
background-size: contain;
}
.xhomeikona2 {
background:rgba(255,255,255,0.9) url('ikonyhome2m.png') no-repeat center center;
background-size: contain;
}
.xhomeikona3 {
background:rgba(255,255,255,0.9) url('ikonyhome3m.png') no-repeat center center;
background-size: contain;
}

.homeikona1 {
background: url('ikonyhome1w.png') no-repeat center center;
background-size: contain;
}
.homeikona2 {
background: url('ikonyhome2w.png') no-repeat center center;
background-size: contain;
}
.homeikona3 {
background: url('ikonyhome3w.png') no-repeat center center;
background-size: contain;
}


.logadole {
padding:10px;
text-align: center;
background-color: white;
} 


.logadole img {
width:calc(100% / 4 - 40);
min-width:100px;
max-width:160px;
background-color: white;
/* box-shadow: 2px 2px 6px rgba(0,0,0,0.1); */
margin:5px 20px;
display: inline-block;
box-sizing: border-box;
}


#bgvid {
display: block;
width:100%;
height:100%;


position: absolute;
top:0;
left:0;
box-sizing: border-box;
 
/*
   position: absolute;
    top: 30%;
    transform: translateY(-30%);
   */ 
}


#sliderslogan {
padding:0 30px;
}

#sliderslogan h2, #sliderslogan h1 {
color:white;
font-size: var(--fs-xl);
margin:0 0 10px 0;
padding:0;
text-shadow: 1px 0 4px rgba(0,0,0,0.74);
}

#sliderslogan p {
color:white;
margin:0;
padding:0 0 20px 0;
}


.basevideospace {
height:100vh;
width:100%;
object-fit: cover;
}

/* koliduje s floatboxem
* , *:before, *::after {
box-sizing: border-box;
}*/

input, table, td, p {
box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  }

* {
margin: 0;
padding: 0;
}




img, picture, svg, video {
/* display:block; */
/* max-width:100%; */
}


input, textarea, button, select {
font:inherit;
}

body {
min-height:100vh;
background-color: var(--pozadibile);

  margin: 0;
  padding: 0;
  text-align: center;
  font-family:'Work Sans', sans-serif;
  font-family:'Jost', sans-serif;
  font-family:'Russo One', sans-serif;
font-family:'Roboto Condensed', sans-serif;
  font-family: 'Montserrat', sans-serif;
  }

body, p, td, li{
font-size: var(--fs-normal);
line-height: var(--lh-normal);
color:black;
}

img.revealme {
transform: scale(0.5);
transition: .65s ease;
display: inline-block;
position: relative;
}


hr {
margin:30px 0;
border:0;
border-bottom:3px solid var(--zluta);
}



blockquote {
background-color: rgba(0,0,0,0.1);
padding:10px 20px;
border-radius:10px;
font-style: italic;
}

.footer hr {
border-bottom:1px solid white;
}

.footerform {
background-color: #0764bb ;
color:white;
padding:30px 20px;
}

.footermapa {
display: block;
text-decoration:none;
border-radius:10px;
background:#898989 url('mapa.jpg?') no-repeat center center;
background-size: cover;
filter: grayscale(100%) brightness(0.8) contrast(1.1);
min-height:200px;
}

.footermapa:hover {
transition:all 200ms ease-in;
filter: grayscale(100%) brightness(1) contrast(1);

}
.footer table td, .footer table td a {
color:white;
font-size:var(--fs-small);
}

.tabulkaoteviracidoba table  td:first-child {
width:60px;
font-weight: bold;
}


.formularobjednavka {
background-color: rgba(39,172,248,0.7);
background-color:#121212;
padding:20px;
border-radius:10px;

}

.formularobjednavka input {
max-width:240px;
min-width:150px;
margin:0 5px 5px 0;
text-align: left;
padding:3px 8px;
box-sizing:border-box;
border-radius:2px;
border:0;
}


.formularobjednavka input:focus {
box-shadow: inset 4px 4px 6px rgba(220,220,220,1);
outline: none;
}

.formularobjednavka textarea:focus {
box-shadow: inset 4px 4px 6px rgba(220,220,220,1);
outline: none;
}


.formularobjednavka textarea {
width:100%;
text-align: left;
padding:3px 8px;
box-sizing:border-box;
margin:0 0 5px 0;
border-radius:2px;
border:0;
}

.formularobjednavka input.inputbuttonform {
max-width:340px;
background-color:black;
color:white;
text-decoration: none;
padding:2px 20px 2px 20px;
border-radius:2px;
transition:all 200ms ease-in;
border:0;
cursor:pointer;
text-align: center !important;
}


.formularobjednavka input.inputbuttonform:hover {
background-color:#454545;
}


h2 em {
background-color: rgba(20,20,20,1);
color:white;
padding:10px 20px;
position: relative;
display: inline-block;
transform:rotate(-1deg);
font-weight: bold !important;
}

.formularobjednavka h2 {
margin:20px 0 10px 0;
text-align: left;
color:white;
}

.formularobjednavka h2 em {
color:#df1386;
}

.smalltextform {
font-size:12px;
line-height:12px !important;
display: block;
color:white;
}




h1 {
margin:0;
padding:2rem 0 1rem 0;
font-size: var(--fs-xl);
line-height:var(--lh-h1);
font-weight: bold;
font-family: 'Montserrat', sans-serif;
}

#pagehomepage h1 {
font-size: var(--fs-xlhomepage);
padding:1rem 0 0 0;
margin:0;
}


h2 {
font-size: var(--fs-h2);
line-height:var(--lh-h2);
padding:0;
margin:1rem 0 10px 0;
color:var(--hneda4);
display: block;
font-weight: bold;
font-family: 'Montserrat', sans-serif;
}

h2 span {
display: inline-block;
position: relative;
}





h3 {
font-size: var(--fs-h3);
line-height:var(--lh-h3);
padding:0;
margin:1rem 0 0rem 0;
}

h4 {
font-size: var(--fs-h4);
line-height:var(--lh-h4);
padding:0;
margin:1rem 0 0.5rem 0;
}



.referencebox {
width:50%;
margin:0;
display: inline-block;
padding:10px;
box-sizing: border-box;
aspect-ratio:4 / 2.5;
z-index:999;
opacity:0;
}

.referenceboxin {
display: block;
border-radius:10px;
position: relative;
yp:?
left:0;
width:100%;
height:100%;
overflow:hidden;
}

.referenceboxin h4 {
margin:0;
padding:30px 20px 30px 20px;
text-align: center;
color:white;
background:linear-gradient(to bottom , rgba(0,0,0,0.74),rgba(0,0,0,0));
text-shadow: 1px 0 4px rgba(0,0,0,0.74);
}

.referenceboxin h4 small {
font-weight: normal;
display: block;
padding-top:10px;
font-size:12px;
line-height:var(--lh-small);
}


.QAotazka {
background-color: #f0f0f0;
border:1px solid black;
padding:5px 15px;
border-radius:20px;
margin:10px 0;
font-weight:bold;
font-size:var(--fs-h3);
}
.QAotazka p {
margin:0;
padding:0;
}

.QAotazka .QAnadpis {
display: block;
padding-right:30px;
position: relative;
cursor: pointer;
}
.QAotazka .QAsipka {
width:10px;
height:10px;
position: absolute;
top:15px;
right:5px;
transform:rotate(135deg);
border-top:3px solid black;
border-right:3px solid black;
transition:200ms all ease-in;
}

.QAotazka .QAsipkaOtoceno {
transform:rotate(-45deg);
}

.QAodpoved {
font-weight:normal;
font-size:var(--fs-normal);
margin:0 0 10px 0;
display:none;
border-radius:20px;
padding:5px 0px;
}

.QAotazka p {
margin:0;
padding:10px 0 10px 0;
}

.hlavniobsah  ul {
  list-style: none; /* Remove default bullets */
margin:10px 0 24px 0;
padding: 0 0 0 45px;
}

.hlavniobsah  ul li {
margin:10px 0;
padding:0;
}



.hlavniobsah li::before {
  content: '+';
  color: #121212;
  display: inline-block;
  font-weight:normal;
  width: 1em;
  margin-left: -1em;
  position:relative;
  top:2px;
  }


.hlavniobsah li {
list-style: none url();
padding-left:30px;
}

.hlavniobsah li p {
margin :0;
padding:0;
display: inline;
}



.homebutton {
cursor:pointer;
background-color: var(--barva3);
color:white !important;
padding:3px 16px;
text-decoration: none !important;
display: inline-block;
border-radius:5px;
transition:all 200ms ease-in;
position: relative;
text-shadow: 0 0 0 rgba(0,0,0,0.4);
transition:left 700ms ease-in, letter-spacing 200ms ease-in, background-color 100ms ease-in  !important;
}
.homebutton:hover {
background-color:var(--barva4);

letter-spacing:0.5px;
}

.homebuttongrey {
background-color:var(--barva3);;
color:white !important;
padding:3px 16px;
text-decoration: none !important;
display: inline-block;
border-radius:5px;
transition:all 200ms ease-in;
}
.homebuttongrey:hover {
transform:scale(1.105);
}



.poptavkabutton {
margin:20px 0;
background-color: var(--barva3);
font-size:var(--fs-h3);
color:white !important;
padding:6px 26px;
text-decoration: none !important;
display: inline-block;
border-radius:5px;
transition:all 200ms ease-in;
position: relative;
text-shadow: 0 0 0 rgba(0,0,0,0.4);
transition:rotate 400ms ease-in,left 700ms ease-in letter-spacing 200ms ease-in, background-color 100ms ease-in  !important;
transform:rotate(-20deg);
}

.poptavkabutton:hover {
background-color:var(--barva4);

letter-spacing:0.5px;
}

.pagecounter a {
background-color: var(--zluta);
color:white !important;
padding:3px 16px;
text-decoration: none !important;
display: inline-block;
border-radius:5px;
transition:all 200ms ease-in;
}

.pagecounter a:hover {
transform:scale(1.05);
}


.pagecounter a.actual {
background-color: var(--zluta);
color:black;
}

/*obrazkove podzadi*/
.hlavniobsahobrazek ,
/* barevne pozadi*/
.hlavniobsahsablona0, .hlavniobsahsablona1, .hlavniobsahsablona2, .hlavniobsahsablona3, .hlavniobsahsablona4
{
padding:20px 0;
box-sizing:border-box;
margin:0 auto;
}

.hlavniobsahsablona0 {
background-color: var(--pozadibile);

background:linear-gradient(to bottom , rgba(255,255,255,1) 50%,rgba(225,225,225,1)); 

background:#f5f5f5 url('pozadi0ch3.jpg') no-repeat top center;

background-attachment: fixed;
background-size: 100%;
 position: relative;
 }
 
 .hlavniobsahsablona0:before {
 background:linear-gradient(to bottom , rgba(255,255,255,0) 50%,rgba(125,125,125,0.1));
 content:'';
 position: absolute;
 bottom:0;
 left:0;
 width:100%;
 height:100%;
 }
 
.hlavniobsahsablona0 p {}
.hlavniobsahsablona0 a {color:var(--barva4)}

.hlavniobsahsablona1 {background-color:#e0e0e0;}

/*
.hlavniobsahsablona1 {background:linear-gradient(to right bottom,rgba(200,200,210,1), rgba(250,250,250,1),rgba(210,220,220,1)); }
*/

.hlavniobsahsablona1 {
border-top:1px solid #909090;
background:#e2e2e2 url('pozadibile.jpg') repeat top center;
background-attachment: fixed;

}



/*
.hlavniobsahsablona1 p {color:white;}
.hlavniobsahsablona1 h2 {color:white;}
.hlavniobsahsablona1 h3 {color:white;}
.hlavniobsahsablona1 a {color:white;}
.hlavniobsahsablona1 li::before {color:white;}
.hlavniobsahsablona1 li {color:white;}
*/

/*.hlavniobsahsablona2 {background:linear-gradient(to right bottom,#898989, #b2b2b2, #898989 ); } */
.hlavniobsahsablona2 {
background:#8e743e url('pozadihnede.jpg') repeat-x top center;
background-attachment: fixed;
}

.hlavniobsahsablona2 p {color:white;}
.hlavniobsahsablona2 h2 {color:white;}
.hlavniobsahsablona2 h3 {color:white;}
.hlavniobsahsablona2 a {color:white;}
.hlavniobsahsablona2 li::before {color:white;}
.hlavniobsahsablona2 li {color:white;}

.hlavniobsahsablona3 {
background:#909090 url('pozadizlate.jpg') repeat center center;

background-attachment: fixed;
text-shadow: 2px 2px 4px rgba(0,0,0,0.74);
}
.hlavniobsahsablona3 p {color:white;}
.hlavniobsahsablona3 h2 {color:white;}
.hlavniobsahsablona3 h3 {color:white;}
.hlavniobsahsablona3 a {color:white;}
.hlavniobsahsablona3 li::before {color:white;}
.hlavniobsahsablona3 li {color:white;}



.hlavniobsahsablona4 {
background-color:#242424;
}

.hlavniobsahsablona4 p {color:white;}
.hlavniobsahsablona4 h2 {color:white;}
.hlavniobsahsablona4 h3 {color:white;}
.hlavniobsahsablona4 a {color:white;}
.hlavniobsahsablona4 li::before {color:white;}
.hlavniobsahsablona4 li {color:white;}

/*
.hlavniobsahsablona4 p {color:white;}
.hlavniobsahsablona4 h2 {color:white;}
.hlavniobsahsablona4 h3 {color:white;}
.hlavniobsahsablona4 a {color:white;}
.hlavniobsahsablona4 li::before {color:white;}
.hlavniobsahsablona4 li {color:white;}
*/


.hlavniobsahobrazek {position:relative;

}
.hlavniobsahobrazek p {}
.hlavniobsahobrazek a {}

.hlavniobsahobrazekoverlay {
position: absolute;
left:0;
top:0;
height:100%;
width:100%;
/* filter: blur(4px) grayscale(0%) opacity(30%); */
}



.homeboxcolorbg {
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
opacity: 0.1;
filter: grayscale(100) blur(1px);
overflow:hidden;

}




.homeboxcolor1 {
position: relative;
background-color:#121212;
//linear-gradient(to right, rgba(0,0,00,1),rgba(200,200,200,0.8),rgba(0,0,0,1));
color:white;
padding:0px 0;
margin:0px 0 0 0;
/* border-left:10px solid var(--modra); */
box-sizing:border-box;
}

.homeboxcolor1 p, .homeboxcolor1 h2 {
color:white;
}


.homeboxcolor2  {
margin:0px 0 0 0;
position: relative;
padding:0px 0;
background-color:#e0e0e0;
color:black;
/* border-right:10px solid var(--zluta); */
box-sizing:border-box;
}



/* flex START */
.flex-container h2 {
padding:0 0 10px 0;
margin:0;
}

.flexdiv33container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.flexdiv33 {
  flex: 1 1 0;
  min-width:200px;
}


.flex-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center; 
  }

.flex-item2 {
  width: 50%;
  margin: 0px;
  position: relative;
  overflow: hidden;
  padding:60px 20px;
  box-sizing: border-box;
}

.flex-item3 {
  width: 33%;
  margin: 0px;
  text-align: center;
}
.flex-item4 {
  width: 25%;
  margin: 0px;
  text-align: center;
}

.flex-itemtop {
  
  margin: 0px;
  position: relative;
  
  margin:0;
  padding:30px 20px 0px 20px;
  box-sizing: border-box;  
}
.flex-itemtop1 {
width:60%;
}
.flex-itemtop2 {
width:40%;
padding-left:50px;
}

.flex-itemtop2 p {
color:white;
line-height:var(--lh-small);
}



.flexpaddingleft {
padding:30px 20px 30px 40px;
text-align: left;
max-width:600px;
box-sizing: border-box;
margin:0 0 0 auto;
}

.flexpaddingright {
padding:30px 40px 30px 20px;
text-align: left;
max-width:600px;
box-sizing: border-box;
margin:0 auto 0 0;
}


.flex-image  {
min-height: 400px;
transform:scale(0.8) rotate(3deg);
margin: 0;
box-sizing:border-box;
min-width:400px;
background-color: red;
transition:200ms all ease-in;
}

.homeboxcolor2 .flex-image  {
transform:scale(0.8) rotate(-3deg);
}

.homepageboxypadding {
padding:0px 0px;
}

.flexitem4smallholder {
max-width:200px;
font-size:12px;
margin:0 auto;
}

.flexitem4smallholder strong {
font-size:35px;
background: -webkit-linear-gradient( #00c8aa,#00a88a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
font-weight:bolder;

}

.flexitem4smallholder p {
padding:0;
margin:0;
}
/* flex END */




iframe {
/* youtube iframe */
width:100%;
height:auto;
aspect-ratio:3/2;
}








p {
margin:0;
padding:10px 0 10px 0;
}


 img {
  border: none;
 }




 body {

 }



.div30vlevo {
float:left;
width:calc(100% / 3);
}






.div50vlevo {
float:left;
width:48%;
}

.div50vpravo {
float:right;
width:48%;
}



img.revealme {
transform: scale(0.5);
transition: .65s ease;
}

.textimage_right {
width:40%;
border-radius:10px;
max-width:400px;
float:right;
margin:0 0px 10px 20px;
}


.textimage_left {
width:40%;
max-width:400px;
float:left;
margin:0 20px 10px 0;
}


.textimage {
border-radius:5px;
width:100%;
margin:0 auto 10px auto;
display: block;
}


.textimage169 {
width:90%;
height:300px;
background-color: red;
margin:0 auto;
}



.revealmeleft
{
 opacity:0;
 position: relative;
 left:-300px;
 transition: 1s ease;
}

.revealmeright
{
 opacity:0;
 position: relative;
 left:300px;
 transition: 1s ease;
}

.revealmebottom
{
 opacity:0;
 position: relative;
 top:300px;
 transition: 1s ease;
}





.fadeinauto {
        -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 2s; /* Firefox < 16 */
        -ms-animation: fadein 2s; /* Internet Explorer */
         -o-animation: fadein 2s; /* Opera < 12.1 */
            animation: fadein 2s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}




.hidemobile {
display: block;
}

.showmobile {
display: none;
}
.hidemobilemenu {
display: block;
}

.showmobilemenu {
display: none;
}


#logo {
position: absolute;
left:15px;
top:10px;
display: inline-block;
z-index:99;
text-decoration: none;
width:100%;
max-width:240px;
height:60px;
background: url('logobarevne.svg') no-repeat center/contain;
background-size: contain;
transition:all 200ms ease-in;
}

#logo span {
display: none;
}

#logo:hover{
opacity:0.7;
}



.mobilemenu {

width:32px;
height:28px;
position: absolute;
top:24px;
right:20px;
}



.mobilemenu span,.mobilemenu:before,.mobilemenu:after {
background-color:var(--menumobilecolor);
}



.mobilemenu span {
transition:all 100ms ease;
content:'';
position: absolute;
top:12px;
left:0;
width:32px;
height:4px;
border-radius:4px;
}

.mobilemenu:before {
transition:all 200ms ease;
content:'';
position: absolute;
top:0;
left:0;
width:32px;
height:4px;
border-radius:4px;
}

.mobilemenu:after {
border-radius:4px;
transition:all 200ms ease;
content:'';
position: absolute;
bottom:0;
left:0;
width:32px;
height:4px;
transform:rotate(0deg);
}



.mobilemenu.fadeOut:after {
transform:rotate(-40deg);
bottom:12px;
height:5px;
}

.mobilemenu.fadeOut:before {
transform:rotate(40deg);
top:12px;
height:5px;
}

.mobilemenu.fadeOut span {
opacity:0;
}



#menum {
z-index:99999;
width:100%;
display:none;
box-sizing:border-box;
padding:20px 20px 10px 20px;
position: relative;
top:80px;
max-height:calc(100vh - 90px);
left:0;
background-color: white;
overflow: auto;
max-height:95hv;
/* border-bottom:3px solid var(--modra); */
box-shadow: 0px 20px 20px rgba(0,0,0,0.5);
}


#menum ul li,#menum ul ul li {
list-style: none;
text-align: left;
}

#menum ul li a {
color:black;
display: block;
padding:10px;
text-decoration: none;
font-size:16px;
overflow: hidden;
}

#menum ul li a:hover,#menum ul ul li a:hover {
background-color:#f0f0f0;
color:black;
border-radius:4px;
}

#menum ul li a.actual {
background-color:var(--barva1);
color:white;
border-radius:4px;
}

#menum ul li li a.actual {
background-color:var(--barva3);
color:white;
}

#menum ul ul li a {
font-size:14px;
color:black;
overflow: hidden;
display: block;
background-color:#f0f0f0;
padding:8px 8px 8px 20px;
text-decoration: none;
}

#menum ul , #menum ul ul, #menum ul li, #menum ul ul li {
padding:0;
margin:0;
}

#menu #menum ul li {
display: block;
}


#menu ul li:last-child a {
background-color: var(--barva3);
color:white;
padding:5px 12px;
border-radius:3px;
top:0;
}

#menu ul li:last-child a:hover, #menu ul li:last-child a.actual {
background-color: var(--barva4) !important;

}

#menu ul li:last-child a:hover:before, #menu ul li:last-child a.actual:before{
display:none;
}


 .holder {
  max-width: 1100px;
  width:100%;
  margin: 0 auto;
  text-align: left;
  position: relative;

 }
.holderin {
padding:0 20px;
}








 #menudiv {
 font-family:'Roboto Condensed', sans-serif;
 position: fixed;
 text-align: left;
 top:0px;
 width:100%;
 height:80px;
 z-index:999;
 box-sizing: border-box; 
 background:linear-gradient(to right, rgba(25,25,25,1),rgba(25,25,25,0.8));
 
 box-shadow: 0px 0px 10px rgba(0,0,0,0.25);

 backdrop-filter: blur(7px) saturate(150%);
  -webkit-backdrop-filter: blur(7px) saturate(150%); /* Safari */
  
  border-bottom:4px solid var(--barva3);
  
 }
 
 #menudivin {
 box-sizing: border-box; 
 
 position: relative;
 width:100%;
 height:80px;
 border-radius:5px;
 background-color:rgba(25,25,25,0.86);
 background:linear-gradient(to right, rgba(25,25,25,1),rgba(25,25,25,0.8));
 

 }
 
 
 
 
 #menudivlogin {
top:60px;
position: fixed;
 text-align: left;
 box-sizing: border-box;
 width:100%;
 height:20px;
  }
#menudivlogin .holder {
 height:20px;
padding: 0 ;
margin:0 auto;
}


 .menudivpodstin {
position: absolute;
top:70px;
left:0px;

height:10px;
width:calc(100%);
 }


.menudivloginin {
position: absolute;
background-color: rgba(0,0,0,0.4);
top:0px;
left:0px;
height:20px;
width:calc(100%);

font-size:var(--fs-small);
line-height:var(--lh-small);
box-sizing: border-box;
padding:3px 20px 0 0;
text-align: right;
}

.menudivloginin,.menudivloginin a {
color:#c0c0c0;
}
.menudivloginin .holder {
text-align: right;
}

.menudivpodstin2 {
position: absolute;
top:20px;
left:0px;
background:linear-gradient(to bottom, rgba(0,0,0,0.4),rgba(0,0,0,0));
height:10px;
width:calc(100%);
 }







 #menu {
 position: absolute;
 right:10px;
top:23px;
letter-spacing: 1px;
 }

.h1box {
padding:90px 0px 50px 0px;
margin:0 0 0px 0;
background-color: white;
text-align: left;
position: relative;
}

.h1box h1 {
color:white;
font-family: 'Montserrat', sans-serif;
}

.h1boxinner,.h1boxinnerbarva, .h1boxinnerbarva2 {
width:100%;
height:100%;
top:0;
left:0;
position: absolute;
filter:grayscale(80%);
}

.h1boxinnerbarva {

background:linear-gradient(to top, rgba(95,95,95,0.8),rgba(95,95,95,0.8));
}

.h1boxinnerbarva2 {
background:linear-gradient(to bottom right, rgba(158,0,48,0.8),rgba(49,81,128,0.9));
}



 #page {
  padding:0px 0 0 0;
  margin:0;
 }
 #pagehomepage {
  padding:0px 0 0 0;
 }




 .footer {
  background-color:#8e743e ;
  padding:40px 20px 20px 20px;
  color:white;
 }

 .footer a, .footer p {
font-size:var(--fs-small);
line-height:var(--lh-small);
 color:white;
}

.footer h3 {

}

.footerlogo {
margin:0;
padding:0;
display: inline-block;
background:url('rabenelektro.png') no-repeat left center;
background-size: contain;
width:100%;
height:40px;
}

.footerlogo strong {
display: none;
}




#grid-container a {
background:url('/_tpl/default/preload.gif') no-repeat center center;
}

.grid-item {
display: inline-block;
}
 .grid-item:hover {
background-color: #d0d0d0;
 }


.grid-item img {
z-index: 1;
border-radius:10px;
transition:transform 200ms ease-in
}

.grid-item img:hover {

transform:scale(1.05);
}


.checktext {
position: relative;
top:3px;
width:30px;
}

.procvybratin {
background:#8e743e url('pozadihnede.jpg') no-repeat right top;
background-size: 100%;
border-radius:5px;
height:100%;
overflow: hidden;
}

.procvybrathlavicka {
padding:2rem 1rem 0.25rem 1rem;
box-sizing: border-box;
}

.procvybrathlavicka h3 {
padding:0;
margin:0;
display: block;
font-size:var(--fs-small);
line-height:var(--lh-small);
font-weight: normal;
}


.procvybratin h4 {
padding:15px 0 10px 0;
margin:0;
display: block;
font-size:var(--fs-h3);
line-height:var(--lh-h3);
font-weight: bold;
color:white;
}



.procvybrattext {
padding:10px 0 20px 0;

margin:0;
}
.procvybrattext p {
padding:0;
margin:0;
font-size: var(--fs-small);
}


.procvybratfotka {
height:200px;
width:100%;
}

/* zprava */

 .zprava {
width:calc(100% / 3 - 20px);
float:left;
margin:10px;
text-align: left;
text-decoration: none;
box-sizing: border-box;
height:300px;
border-radius:5px;
overflow: hidden;
display:inline-block;
}



.zpravadatum {
font-size:var(--fs-small);
line-height:var(--lh-small);
}


.zpravain {
height:100%;
width:100%;
box-sizing: border-box;
display:inline-block;
position: relative;
overflow: hidden;
/* background:linear-gradient(to top, rgba(19,132,200,1),rgba(39,172,248,1)); */
background-color:#121212;
background-size: 100%;
}

.zpravaobrazek {
position: absolute;
left:0;
bottom:0px;
width:100%;
height:100%;
transition:500ms all ease;
filter:grayscale(00%);
opacity:0.7;
}

.zpravaobrazekprechod {
position: absolute;
left:0;
bottom:0px;
width:100%;
height:100%;
max-width:200px;
background:linear-gradient(to right, rgba(12,12,12,0.5),rgba(12,12,12,0));
}

.zprava:hover {

}

.zprava:hover .zpravaobrazek {
filter:grayscale(10%);
transform:scale(1.05);
opacity:1;
}



.zpravavnitrek {
}

.zpravanadpis {
font-weight: bold;
display: block;
font-size:var(--fs-h3);
line-height:var(--lh-h3);
padding:0 0 10px 0;
text-shadow: 1px 1px 7px rgba(0,0,0,1),  1px 1px 17px rgba(0,0,0,1);
}

.zpravatext {
position: absolute;
bottom:40px;
left:0;
color:white;
width:100%;
padding:20px 20px 10px 20px;
box-sizing: border-box;
}

.zpravastext {
background-color: rgba(0,0,0,0.63);
display:block;
margin:0 0 10px 0;
font-size: var(--fs-small);
line-height: var(--lh-small);
padding:10px 10px 10px 10px ;
box-sizing: border-box;
max-width:400px;
}


.ikonydole {
overflow: hidden;
padding:0 0 15px 0;
}


.ikonadole {
display: inline-block;
margin:0 20px;
}
.ikonadole img {
width:35px; height:35px;
}

.ikonadole b {
font-weight: normal;
font-size:var(--fs-normal);
display: inline-block;
line-height:var(--lh-normal);
padding:0 10px;
top:-10px;
position: relative;
}



@media (min-width: 750px) {
.zpravapocet1, .zpravapocet4 {
width:calc(100% / 3 * 2 - 20px);
}



}

.zpravain .homebutton {
position: absolute;

left:20px;
}

 .clearer {
  clear: both;
 }





/*  diskuze  */

.diskuze-zprava {
background-color:#e9e9e9;
margin:8px 0 8px 0;

padding:10px;
}
.diskuze-zprava-odpoved {
background-color:#e9e9e9;
margin:8px 0 8px 0;
padding:10px;
}

.diskuze-sml {
background-color:#e9e9e9;
height:40px;
text-align:right;
padding-right:10px;
border-right:1px solid #8b8b8b;
margin:5px 0 5px 0;
cursor:pointer;
}

.diskuze-sml2 {
background-color:#e9e9e9;
text-align:right;
padding:10px 10px 0 0;

margin:5px 0 5px 0;
}

.diskuze-sml span {
padding:13px 5px 0 0;
display:block;
}

.diskuze-sub1{
padding-left:10px;
}
.diskuze-sub2{
padding:0 0 10px 10px;
border-left:1px dotted #8b8b8b;
}

.diskuze-form {
padding-right:10px;
padding-bottom:10px;
text-align:right;
}

.diskuze-formular {
text-align:left;
width:100%;
height:210px;

background-color:#e0e0e0;
}

.diskuze-formular form {
padding:8px 0 8px 8px;
display:block;
margin:0;
float:right;
}


.diskuze-formular form input,.diskuze-formular form textarea {
width:100%;
max-width: 400px;
font-size:14px;
}

.diskuze-formular input.submitter {
cursor: pointer;
background-color: black;
color:white;
border:0 ;
padding:8px 0;
font-size: 16px;
}

.diskuze-formular input.submitter:hover {
background-color: #787878;
}

.article_keywords {
background-color: #e0e0e0;
padding:5px;
margin:10px 0 10px 0;
}






.r3d {
margin:0;
padding:0;
line-height: 1;
text-align: right;
display: block;
line-height:var(--lh-small);
font-size: 12px;
}

.r3d a {
text-decoration: none;
font-size: 12px;
line-height:var(--lh-small);
}

.r3d a:hover {
color:white;
}


.cookiemessage {
line-height:var(--lh-small);
color:#e0e0e0;
font-size: 12px;
margin:0;
padding:0;
display: block;
}

.procleny {
line-height:var(--lh-small);
color:#f0f0f0;
font-size: 12px;
margin:0;
padding:0 0 20px 0;
display: block;
}
.procleny a {
color:white;
}


.bxsliderholder, .videoholder {
overflow: hidden; 
position: relative;
}

.bxslider {
padding:0;
margin:0px 0 0 0;
height:70vh;
width:100%;
box-sizing: border-box;
display: block;
}

.bxsliderholder, .videoholder {

background-color: black !important;
padding:0;
margin:0px 0 0 0;
box-sizing: border-box;
display: block;
position: relative;
width:100%;

margin:0 auto;
margin-top:0px;
max-height:70vh;
aspect-ratio:4 /2;
}


.homebutt {
color: white;
border:1px solid white;
text-decoration: none;
padding:6px 20px;
border-radius:20px;
margin: 0 10px;
position: relative;
overflow: hidden;
transition:200ms all ease-in;
}

.homebutt::before {
content:'';
transition:200ms all ease-in;
border-radius:20px;
position: absolute;
left:calc(50%); 
top:0;
height:100%;
width:0;
background-color: white;
z-index:-1;
opacity:0;
border-radius:0;
}

.homebutt:hover::before {
width:100%;
border-radius:20px;
left:0;
opacity:1;
}

.homebutt:hover {
color:var(--barva4);
}



.videoholder video {
width:100%;
position: absolute;
left:50%;
transform: translateX(-50%);
min-width:1200px;
}

.bxsliderprekryv {
position: absolute;
padding:0;
margin:0px 0 0 0;
height:100%;
width:100%;
top:0;
left:0;

 background:linear-gradient(to top, rgba(0,0,0,.31),rgba(0,0,0,1)); 
 background:linear-gradient(to top, rgba(0,0,0,1),rgba(0,0,0,0.394)); 
 
 background:linear-gradient(to top, rgba(0,0,0,.21),rgba(0,0,0,.41));

display: block;
}
/*
rgb(92, 51, 23) – tmavý ořech

rgb(102, 48, 28) – mahagonovější tón

rgb(120, 60, 32) – tmavý teak

rgb(110, 55, 35) – rustikální hnědá
/**/





.bxslider li {
-webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}




.bxsliderholder, .videoholder,  .bxslider {
background-color: white;
}



.centered-div  {
position: absolute;
padding:40px 0 0 0;
margin:0px 0 0 0;
height:100%; 

box-sizing: border-box;

background-color: rgba(0,0,0,0);
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top:0px;
    left:0;
    width:100%;


max-height:70vh;
aspect-ratio:4 /2;
}



#sliderlogo {
padding: 20px 40px ; ;
max-width:500px;
width:50%;
box-sizing: border-box;
background-color:rgba(255,255,255,0.7);
 backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px); /* Safari */
}


#sliderlogoin {
width:100%;
}





/* LOGIN FORM */


.loginform {
background-color: rgba(0,0,0,0.1);
max-width:500px;
width:100%;
padding:20px;
border-radius:10px;

margin:40px auto 40px auto;
box-sizing:border-box;
text-align: left;

}

.loginformContainer {
display: flex;
    flex-wrap: wrap;
gap:10px;
box-sizing:border-box;
}

.loginformFlexItem {
box-sizing:border-box;
display:block;
width:225px;
align-items: center;
justify-content: center;
}

.loginform input, .loginform select {
margin:4px 0;
padding:3px 4px;
width:100%;
box-sizing:border-box;

font-size:var(--fs-normal);
line-height:var(--lh-normal);
position: relative;
border:0;
border-radius:4px;
display: block;
}

.loginform label {
font-size:var(--fs-small);
line-height:var(--lh-small);
padding:0;
margin:0;
display: block;
}

.loginform .loginformSubmit {
margin:20px 0;
color:black;
background-color: var(--zluta);
transition:all 200ms ease-in;
cursor: pointer;
}

.loginform .loginformSubmit:hover {
color: var(--zluta);
background-color: black;
}

.loginform hr {
margin:15px 0;
}


.loginform .warning {
background-color: #890000;
color:white;
padding:5px 10px;
text-align: center;
margin:0 0 20px 0;
}

.loginform .warninggreen {
background-color: #008900;
color:white;
padding:5px 10px;
text-align: center;
margin:0 0 20px 0;
}



.loginform .loginwarningRamecek {
background-color: #ffe0e0;
}

@media (max-width: 500px) {
.loginformFlexItem {
 width:100%;
 }

.loginform {
margin-left:10px;
margin-right:10px;
width:calc(100% - 20px);
}


}






@media (max-width: 2200px) {

.placeholder {
}


 .zprava {
}



}



@media (max-width: 1400px) {

.placeholder {
}


 .zprava {
 }



}


@media (max-width: 1090px) {

.placeholder {
}

#menudivin {
border-radius:0;
}



}

@media (max-width: 990px) {

.placeholder {
}

.holder {
width:100%;
}
.holderin {
padding:0 20px;
}

 .zprava {

}


.h1box {
padding:100px 0px 30px 0px;
margin:0 0 0px 0;
}




}

@media (max-width: 880px) {



.ikonydole {
padding:0 0 15px 0;
}


.ikonadole {
display: inline-block;
margin:0 20px;
padding:7px 0
}
.ikonadole img {
width:25px; height:25px;
}

.ikonadole b {
font-weight: normal;
font-size:var(--fs-small);
display: inline-block;
line-height:var(--lh-small);
padding:0 10px;
top:-10px;
position: relative;
}



.placeholder {
}

#menudiv {
top:0;
}

.hidemobilemenu {
display: none;
}

.showmobilemenu {
display: block;
}



.flexpaddingleft, .flexpaddingright {
padding:30px 20px 30px 20px;
max-width: 100%;
}


.flexdiv33 {
flex: 1 1 100%;
}



.procvybrathlavicka {
width:50%;
box-sizing: border-box;
display: inline-block;
float:left;
}


.procvybratfotka {
height:100%;
width:50%;
float:right;
}




.bxslider, .videoholder, .bxsliderholder,.centered-div  {
height:80vh;
}

.bxsliderholder,.videoholder {
    aspect-ratio: auto;
}

.div30vlevo {
float: none;
width:100%;
}


.flex-container {
  display: block;
  }

.flex-item2 {
  width: 100%;
}
.flex-item3 {
  width: 100%;
  order:1;
}
.flex-item4 {
  width: 100%;
  order:1;
}

.flex-itemtop {
  width: 100%;
  padding:0;
}
.flex-itemtop1 {
padding:20px 0 0 0;
}
.flex-itemtop2 {
padding:0 0 20px 0;
}

.flexpaddingright, .flexpaddingleft {
padding:20px 0;
text-align: left;
}



.flex-image  {
min-height: 200px;
min-width:0;
max-width:100%;
aspect-ratio:2/1;
}



.div50vlevo, .div50vpravo {
width:100%;
box-sizing: border-box;
padding:0;
float: none;
}


 .zprava {
}

.hidemobile {
display: none;
}

.showmobile {
display: block;
}

.vypiszprav {
padding:0;
}

#menudiv {
 /* position: absolute; /**/

}

 #menu {
position: absolute;
left:0px;
top:0px;
width:100%;
 }


}

@media (max-width: 750px) {

.placeholder {
}





.videoholder video {
width:auto;
height:100%;
position: absolute;
left:50%;
transform: translateX(-50%);

}



 .zprava {

width:calc(100% / 2 - 21px);
height:300px;
margin:7px;
float: none;
display: inline-block;
}







#sliderlogo {
padding:10px 20px;
}

#sliderlogoin {

}




.homeikona {

display: inline-block;
aspect-ratio:3/2;
border-radius:10px;
width:75px;
margin:0 1vw;
}


.logadole img {
width:20%;
max-width:160px;
margin:5px 10px;
}


.homepageimg {
width:20%;
}


}

@media (max-width: 500px) {

.placeholder {
}

.homepageimg {
width:20%;
display:none; 
}







.hlavniobsahsablona0 {
background:#f5f5f5 url('pozadi0ch3.jpg') no-repeat top right;
background-size: 150%;
background-attachment: scroll;
}


.hlavniobsahsablona2 {
background:#8e743e url('pozadihnede.jpg') repeat-x top center;
background-size: 150%;
background-attachment: scroll;
}


.hlavniobsahsablona3 {
background-size: 150%;
background-attachment: scroll; 
}




.textimage_right, .textimage_left {
min-width:100%;
width:100%;
max-width:1000px;
float:none;
margin:20px 0px 20px 0;
}




.centered-div p {
display: none;
}

#sliderslogan h2, #sliderslogan h1 {
margin:0 0 30px 0;
}

.procvybrathlavicka {
width:100%;
float: none;
}


.procvybratfotka {
height:150px;
width:100%;
float: none;
}

#sliderlogo {
padding:20px 15px;
}

#sliderlogoin {

}


 .zprava {
width:calc(100%);
height:300px;
float: none;
margin:0 0 10px 0;
height:150px;
display: inline-block;
}

.zpravatext {
 /* top:10px; */
 bottom:30px;
padding:10px;
}
.zpravastext {
/* display: block !important; */
font-size:10px;
padding:5px;

}





.zpravain .homebutton {
position: absolute;
xbottom:10px;
left:10px;
}
.zpravastext {
xdisplay: none;
}





.referenceboxin h4 small {
font-weight: normal;
font-size:10px !important;
line-height:14px !important;
}


.zpravaobrazeklogo {
background:url('logo.png') no-repeat center center;
background-size: contain;

display: block;

box-sizing:border-box;
}








 body {

}



.textimage_right {
max-width:50%;
}



.textimage_left {
max-width:50%;
}



.referencebox {
width:100%;
margin:0;
}


.logadole img {
width:25%;
max-width:160px;
margin:5px 10px;
}



}





@media (max-width: 320px) {

.placeholder {
}


 .zprava {
}


}