body, html{
   height: 100%;
  }
  body{
    font-family: 'Oswald', sans-serif!important;
  }
  .about{
background: #14314D;
position: relative;
}
  header{
   background-image: url(images/hero.jpg);
   height: 75%;
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   position: relative;
  }
  .vrstvaplosiny{
 background-image: url(images/nabidka_bg-top.svg);
 height:34px;

  }
  .vrstvaplosiny2{
 background-image: url(images/nabidka_bg_white_top.svg);
 height:34px;

  }
  .fix{
    background: #14314D;
  }
  .fix2{
  background: #E0E0E0;
  }
  .vrstva{
   position: absolute;
   bottom: 0;
   width: 100%;
   height: 150px; /* Upravte podle potřeby */
   background-image: url(images/topblau.png);
   background-size: cover; /* Pokrytí celé oblasti */
   background-position: bottom; /* Umístění obrázku úplně dole */
  }
  .topvrstva {
   position: absolute;
   top: 0;
   width: 100%;
   height: 38%; /* Upravte podle potřeby */
   background-image: url(images/top.png);
   background-size: cover; /* Pokrytí celé oblasti */
   background-position: top; /* Umístění obrázku úplně nahoře */
}

.logo {
   position: absolute;
   z-index: 2;
}
h1{
   font-weight: bold;
   font-size: 30px;
}
.h-100-extra{
   height: 100%;
}

@media screen and (max-width: 767px){
   .h-100-extra {
       height: 70%;
   }
   .topvrstva {
       background-image: url(images/responsivelayout.png);
       position: relative;
       width: 100%;
       height: 30%;
       background-repeat: no-repeat;
   }
}
@media screen and (max-width: 576px) {
   .h-100-extra {
       height: 75%;
   }
   .topvrstva {
       background-image: url(images/responsivelayout.png);
       position: relative;
       width: 100%;
       height: 22%;
       background-position-x: 14%;
       background-repeat: no-repeat;
   }
   .logo{
       padding-right: 3rem !important;
   padding-left: 3rem !important;
   }
}
.align-items-end {
   z-index: 999;
}
.header-yellow-bg {
background-image: url(images/header_mobil.svg);
background-repeat: no-repeat;
background-position: right;
padding-top: 1rem;

text-align: end;
padding-bottom: 1rem;
position: relative;
z-index: 3;
font-size: 30px;
color: #14314D;
top: -11px;
   left: 13px;
}
.header-yellow-bg h5 {
position: relative;
left: -50px!important;
font-size: 30px;
text-align: end;
color: #14314D;

}
.header-orange-bg {
background-image: url(images/header_mail.svg);
background-repeat: no-repeat;
background-position: right;

padding-top: 1rem;
text-align: end;
padding-bottom: 1rem;
position: relative;
z-index: 2;
font-size: 30px;
color: #14314D;
top: -20px;
}
.header-orange-bg h5 {
position: relative;
left:-50px!important;
font-size: 30px;
text-align: end;
color: #14314D;
}
@media screen and (max-width: 991px){

   .header-yellow-bg{
       background-position: center;
   }
   .header-orange-bg{
       background-position: center;
   }
   .header-orange-bg h5{
       text-align: center;
       left: 0px!important;
   }
   .header-yellow-bg h5{
       text-align: center;
       left: 0px!important;
   }
}
@media screen and (max-width:450px){
   .header-orange-bg{
       background-size: cover;
   }
}
@media screen and (max-width:400px){
   .header-yellow-bg{
       background-size: cover;
   }
   .header-orange-bg{
       background-size: cover;
   }
}
.plosiny {
   background-color: #E0E0E0;
}
.muted{
background: #E0E0E0;
width: 100%;
padding-top: 1rem;
}
.muted2{
background: #14314d;
width: 100%;
padding-top: 1rem;
}
.yellow-bg{
background-image: url(images/poptej_bg_yellow.svg);
background-repeat: no-repeat;
background-position: center;
padding-top: 1rem;
font-weight: bold;
font-size: 20px;
padding-bottom: 1rem;
}
.high{
color: #14314D;
font-size: 24px;
font-weight: 600;
}
.plosiny{
background-color: #E0E0E0;
}
.plosinky-bg{
background-image: url(images/nabidka_bg-top.svg);
}
.none-line {
border-bottom: none!important;
}
.under-top{
position: relative;
top: 60px;
}
.about p {
font-size: 20px;
}
.extra{
position: absolute;
bottom: 0;
}
.yes-767{
display:none!important;
}
@media screen and (max-width: 767px){

.yes-767{
display:block!important;
}
.none-767{
display: none;
}
.hydraulic-content p{
width:100%;
}
}

p.highlight {
   font-size: 20px;
   border-bottom: 5px solid #14314D;
   padding-bottom: 7px;
   font-weight: bold;
}
.hydraulic-content p {
   position: relative;
   display: inline-block;
   width: 70%;
   border-bottom: 2px solid #14314D;
   padding-bottom: 5px;
   margin-bottom: 10px;
}
.yellow-bg{
background-image: url(images/poptej_bg_yellow.svg);
background-repeat: no-repeat;
background-position: center;
padding-top: 1rem;
font-weight: bold;
font-size: 20px;
padding-bottom: 1rem;
}
.high{
color: #14314D;
font-size: 24px;
font-weight: 600;
}
@media screen and (max-width: 576px) {
.line {
   width: 96vw;
}
.mobile-padding{
 padding-top: 0.75rem;
 padding-bottom: 0.75rem;
}
}
.hydraulicka-ruka{

}
.hydraulicka-ruka h2{
color: #14314D;
font-size: 34px;
font-weight: bold;
text-transform: uppercase;
}
.plosiny h2{
color: #14314D;
font-size: 33px;
font-weight: bold;
text-transform: uppercase;
}
.hydraulic-content p {
position: relative;
display: inline-block; /* Zajistí, že šířka se aplikuje pouze na čáru */
width: 70%; /* Šířka čáry (75 % šířky rodiče) */
border-bottom: 2px solid #14314D; /* Modrá čára pod textem */
padding-bottom: 5px; /* Mezera mezi textem a čárou */
margin-bottom: 10px; /* Mezera mezi jednotlivými odstavci */


}
p.highlight {
font-size: 20px; /* Větší velikost písma */
border-bottom: 5px solid #14314D; /* Tučnější čára pod textem */
padding-bottom: 7px; /* Větší mezera mezi textem a čárou */
font-weight: bold;
}
.orange-bg{
background-image: url(images/poptej_bg_orange.svg);
background-repeat: no-repeat;
background-position: center;
padding-top: 1rem;
text-align: center;
padding-bottom: 1rem;
font-weight: bold;
font-size: 20px;
}
footer{
background-color: #14314D;

}
footer h2{
 font-weight: 700;
}
.footer-logo{
 text-transform: uppercase;
 font-size: 32px;
 color:white;

}
.behind-img {
 position: absolute;
top: -14px;
left: 88px;
width: 65%;
z-index: 1;
}
.topfooter{
background: white;
 width: 100%;
 padding-top: 1rem;
}
.behind-img-hand{
position: absolute;
top: -14px;
left: 130px;
width: 65%;
z-index: 1;
}
.line{
width: 70%;
color: #FFE434;
opacity: 1;

}
hr:not([size]) {
height: 2px;
}
.z-index-2{
z-index: 2;
}
.layout{
background-color: #14314D;
}
.font-bold{
  font-weight: bold;
}
@media screen and (max-width: 1200px){
  .vrstvaplosiny2{
    height:29px;
  }
  .vrstvaplosiny{
    height:29px;
  }
footer p{
font-size: 14px!important;
}
footer h2{
font-size: 26px!important;
}
}
@media screen and (max-width: 991px) {
   .under-top {
       position: relative;
       top: 0px !important;
       margin-bottom: 2rem;
   }
}
@media screen and (max-width: 767px) {
   .hydraulic-content p {
       width: 100%;
   }
}
@media screen and (max-width: 991px) {
   .d-none-992 {
       display: none;
   }
}

@media screen and (max-width: 991px) {
   .line {
       width: 100%;
   }
}
@media screen and (max-width: 576px) {
   .line {
       width: 96vw;
   }
}