/* CSS Document */

/*ZAKAZANI KURZORU*/
    *{
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-tap-highlight-color: rgba(0,0,0,0);
      -webkit-tap-highlight-color: transparent;
     
      //cursor: none !important;
    }

@font-face {
  font-family: mepismo;
  src: url("./font/texgyreadventor-regular.otf");
}

body {

 background-color: #000000;
 background-position: center; 
  background-repeat: no-repeat; 
  background-size: contain;
  margin: 0px;
  padding: 0px;
  color: white;
}

#rotace {
    //background-image: url("./obr_sys/pozadi.png");
    background-color: #000000;
    background-position: center; 
    background-repeat: no-repeat; 
    background-size: contain;
    margin: 0px;
    padding: 0px;
  
    transform: rotate(-90deg);
    transform-origin:bottom right;
    
    position:absolute;
    top: -100vw;
    left: 74vh;
    
    height:100vw;
    width:100vh;

    overflow:none;
}



#play1 {
background-image: url("./obr_sys/play.png");
background-position: 40% 50%; 
background-repeat: no-repeat; 
background-size: cover;
position: absolute;
top: 180px;
left: 105px;
height: 100px;
width: 100px;
border: 2px solid #7d7f80;
border-radius: 50%;  
}

#obr1 {
background-image: url("./obrazky/1setkani_mistru_sveta.jpg");
background-position: 50% 50%; 
background-repeat: no-repeat; 
background-size: cover;
position: absolute;
top: 190px;
left: 115px;
height: 350px;
width: 350px;
border: 2px solid #7d7f80;
border-radius: 50%;
z-index: -10;  
}

#popis1 {
position: absolute;
top: 555px;
left: 105px;
height: 50px;
width: 300px;
//border: 2px solid #7d7f80;
font-family: mepismo;
font-size: 30px;
color: white;
text-align: left;
z-index: 10;
}

#play2 {
background-image: url("./obr_sys/play.png");
background-position: 40% 50%; 
background-repeat: no-repeat; 
background-size: cover;
position: absolute;
top: 555px;
left: 605px;
height: 100px;
width: 100px;
border: 2px solid #7d7f80;
border-radius: 50%;  
}

#obr2 {
background-image: url("./obrazky/2antonin_baborovsky.jpg");
background-position: 50% 50%; 
background-repeat: no-repeat; 
background-size: cover;
position: absolute;
top: 565px;
left: 615px;
height: 350px;
width: 350px;
border: 2px solid #7d7f80;
border-radius: 50%;
z-index: -10;  
}

#popis2 {
position: absolute;
top: 930px;
left: 605px;
height: 50px;
width: 300px;
//border: 2px solid #7d7f80;
font-family: mepismo;
font-size: 30px;
color: white;
text-align: left;
z-index: 10;
}

#play3 {
background-image: url("./obr_sys/play.png");
background-position: 40% 50%; 
background-repeat: no-repeat; 
background-size: cover;
position: absolute;
top: 930px;
left: 105px;
height: 100px;
width: 100px;
border: 2px solid #7d7f80;
border-radius: 50%;  
}

#obr3 {
background-image: url("./obrazky/3jaroslav_falta.jpg");
background-position: 50% 50%; 
background-repeat: no-repeat; 
background-size: cover;
position: absolute;
top: 940px;
left: 115px;
height: 350px;
width: 350px;
border: 2px solid #7d7f80;
border-radius: 50%;
z-index: -10;  
}

#popis3 {
position: absolute;
top: 1305px;
left: 105px;
height: 50px;
width: 300px;
//border: 2px solid #7d7f80;
font-family: mepismo;
font-size: 30px;
color: white;
text-align: left;
z-index: 10;
}

#play4 {
background-image: url("./obr_sys/play.png");
background-position: 40% 50%; 
background-repeat: no-repeat; 
background-size: cover;
position: absolute;
top: 1305px;
left: 605px;
height: 100px;
width: 100px;
border: 2px solid #7d7f80;
border-radius: 50%;  
}

#obr4 {
background-image: url("./obrazky/4jiri_churavy.jpg");
background-position: 50% 50%; 
background-repeat: no-repeat; 
background-size: cover;
position: absolute;
top: 1315px;
left: 615px;
height: 350px;
width: 350px;
border: 2px solid #7d7f80;
border-radius: 50%;
z-index: -10;  
}

#popis4 {
position: absolute;
top: 1680px;
left: 605px;
height: 50px;
width: 300px;
//border: 2px solid #7d7f80;
font-family: mepismo;
font-size: 30px;
color: white;
text-align: left;
z-index: 10;
}


/* Video stránka - používá stejný otočený blok #rotace jako hlavní stránka */
.video-stranka {
    display: flex;
    justify-content: center;
    align-items: center;
}

.video-stranka video {
    max-width: 95%;
    max-height: 95%;
    background: #000000;
}

#zpet {
    position: absolute;
    left: 30px;
    bottom: 30px;
    padding: 20px 35px;
    border: 2px solid #7d7f80;
    border-radius: 12px;
    font-family: mepismo;
    font-size: 30px;
    color: white;
    background: rgba(0,0,0,0.7);
    z-index: 100;
}