/* -----------------all and mobile style--------------------- */



.ikona img {
    width: 80px;
    height: auto;
    transition: 0.3s;
}

.ikona img:hover {
    transform: scale(1.15);
    opacity: 0.8;
}
.ikona {
    position: fixed;
    top: 20px;
    left: 20px;
}

.ikona img {
    width:7vw;
    min-width: 40px;
    height: auto;
}



h1 {
  text-align: center;
font-family: packard-new-style, sans-serif;
font-weight: 700;
font-style: normal;
}

p {
  text-align: left;
  font-size: 1.5rem;
font-family: packard-new-style, sans-serif;
font-weight: 400;
font-style: normal;
color:#a36560
}






body {
    background-color: black;
    color: #8a403b;
    height: 100vh;
    margin: 0;
}
.flex {
display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.container {
display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin: 2em 0 2em 0;
}
.logo {
    width: auto;
    height: 100px;
   
}

    

.parent {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    grid-template-rows: 1fr ;
    gap: 1em;
    margin: 1em ;
}
.parent img {
    width: 100%;
    height: auto;
}





    

.parent .video {
   /*  grid-column: span 3 / span 3;
    grid-column-start: 1;
    grid-row-start: 3; */
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.parent .slozka1 {
   /*  grid-column-start: 1;
    grid-row-start: 4; */
}

.parent .slozka2{
   /*  grid-column-start: 2;
    grid-row-start: 4; */
}

.parent .slozka3 {
   /*  grid-column-start: 3;
    grid-row-start: 4; */
}

.logo2{
    grid-row: span 2 / span 2;
    grid-column-start: 1;
    grid-row-start: 6;
    justify-content: left;
}

.about-us {
    overflow: hidden;
display: grid;
width: 80vw;
grid-template-columns: 100%;
gap: 20px;
padding: 20px;
align-items: center;
/*max-width: 1000px;*/
margin: 0 auto;

}

.container-logo2 {
     width: 100%;
    height: auto;
    display: block;
    
}

.blok_textu {
    margin-top: 0;
    margin-bottom: 0;
  max-width: 500px;
}


.text {
    grid-column: span 2 / span 2;
    grid-row: span 2 / span 2;
    grid-column-start: 2;
    grid-row-start: 6;
}

.logo{
    grid-column: span 3 / span 3;
    grid-column-start: 1;
    grid-row-start: 2;
}

iframe{
    width: 100vw;
    aspect-ratio: 16 / 9;
}
        
/*
.pan {
    width: 300px;
    height: auto;
}
.cici {
    width: 300px;
    height: auto;
}
.pav {
    width: 300px;
    height: auto;
}*/


/* -----------------desktop  style--------------------- */
@media screen and (min-width: 800px ) {

    .container {
width:  50vw;
margin: 2em auto;
}
.logo {
    width: 400px;
    height: 200px;
   
}
p {
  text-align: left;
  font-size: 2rem;
  }  

.parent {
   width: 40vw;
    margin: 2em auto ;
}

iframe{
    width: 777px;
    aspect-ratio: 16 / 9;
}
.about-us {
    overflow: hidden;
display: grid;
width: 40vw;
grid-template-columns: 50% 50%;
}
}
@media screen and (max-width: 800px ) {
.about-us {

    gap: 10px;
    text-align: left;
    padding: 15px;

}
.container-logo2 {
justify-content: center;
max-width: 100%;
    
}
.logo-text {
   max-width: auto;
}
.blok_textu {
    max-width: 100%;
}

}