html,body{
    width: 100%;
    height: 100%;
}

body{
  z-index: -10;
  background-color: black;
}
.section_top{
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    z-index: -1;
} 

.section_top::before{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-image: url(pictures/waves.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: brightness(20%);
    z-index: -1;
}


.rum{
  position: absolute;
    z-index: 1;
    margin-left: 65%;
    scale: 83%;
    top: 15%;
    filter: brightness(80%);
}

.rum1{
  position: absolute;
    z-index: 1;
    filter: brightness(25%);
    scale: 83%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.rum2{
  position: absolute;
    z-index: 1;
    filter: brightness(25%);
    scale: 70%;
    left: 45%;
    top: 45%;
    transform: translate(-50%, -50%);
}

.rum3{
  position: absolute;
  z-index: 1;
  filter: brightness(25%);
  scale: 50%;
  left: 20%;
  top: 35%;
  transform: translate(-50%, -50%);
}

.content{
    justify-content: center;
    position: absolute;
    top: 20%;
    left: 15%;
    color: whitesmoke;
}

.contentResize2{
  z-index: 5;
  justify-content: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: whitesmoke;
}

.contentResize3{
  scale: 75%;
  z-index: 5;
  justify-content: center;
  position: absolute;
  left: 36%;
  top: 40%;
  transform: translate(-50%, -50%);
  color: whitesmoke;
}

h1, h2, h3{
    text-align: center;
}

.nadpis{
  text-align: center;
  text-transform: uppercase;
  font-family: "lust-display-didone", serif;
  font-weight: 400;
  font-style: normal;
}

.nadpis1{
  font-family: "massilia", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 150px;
}

.nadpis1a{
  font-family: "massilia", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 100px;
}

.nadpis2{
  font-family: "massilia", sans-serif;
  font-weight: 600;
  font-style: normal;
  margin-top: -7%;
  letter-spacing: 4px;
  font-size: 75px;
}

.nadpis2a{
  font-family: "massilia", sans-serif;
  font-weight: 600;
  font-style: normal;
  margin-top: -7%;
  letter-spacing: 4px;
  font-size: 50px;
  margin-bottom: -5px;
}

.nadpis3{
  font-family: "filmotype-lacrosse", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size:135px ;
  margin-bottom: -42px;
}

.nadpis3a{
  font-family: "filmotype-lacrosse", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size:100px ;
  margin-bottom: -33px;
}

.nadpis4{
  font-family: "massilia", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 90px;
  margin-top: -3%;
}

.nadpis4a{
  font-family: "massilia", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 80px;
  margin-top: -3%;
}

.pozadi{
  padding-top: 5%;
  padding-bottom: 5%;
  color: whitesmoke;
  background-color: black;
}

.pozadi1{
  background-color: black;
  color: whitesmoke;
  padding-bottom: 10%;
}
.pozadi2{
  background-color: black;
  color: whitesmoke;
}

hr{
  border-top: 1px solid whitesmoke;
  width: 25%;
}

.lead{
  padding-left: 15%;
  padding-right: 15%;
}

video {
  border: 2px solid white;
  border-radius: 40px;
}

.obrazek{
  scale: 70%;
  margin-top: -18%;
}

.videoLeft{
  padding-left: 12%;
}   

.videoRight{
 padding-right: 15%;
}

a{
  text-decoration: none;
  color: whitesmoke;
}

a:hover{
  color: whitesmoke;
  text-decoration: none;
}

.kontakt{
  font-size: 135%;
}

#prechod{
  width: 100%;
  height: 7%;
  bottom: 0;
  background-image: linear-gradient(to top, rgb(0, 0, 0),rgb(0,0,0),rgb(0,0,0),rgb(0,0,0),rgb(0,0,0,.9),rgb(0,0,0,.8),rgb(0,0,0,.7),rgb(0,0,0,.6),rgb(0,0,0,.5),rgb(0,0,0,.4),
  rgb(0,0,0,.3),rgb(0,0,0,.2),rgb(0,0,0,.1),rgb(0,0,0,.0));
  z-index: 5;
  position: absolute;
}


.demo a {
  position: absolute;
  left: 43%;
  top: 112%;
  z-index: 2;
  display: inline-block;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  color: #fff;
  font : normal 400 20px/1 'Josefin Sans', sans-serif;
  letter-spacing: .1em;
  text-decoration: none;
  transition: opacity .3s;
  z-index: 8;
}

.demo a:hover {
  opacity: .5;
}

  
#section10 a {
  padding-top: 60px;
}

#section10 a span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 30px;
  height: 50px;
  margin-left: -15px;
  border: 2px solid #fff;
  border-radius: 50px;
  box-sizing: border-box;
}

#section10 a span::before {
  position: absolute;
  top: 10px;
  left: 50%;
  content: '';
  width: 6px;
  height: 6px;
  margin-left: -3px;
  background-color: #fff;
  border-radius: 100%;
  -webkit-animation: sdb10 2s infinite;
  animation: sdb10 2s infinite;
  box-sizing: border-box;
}

@-webkit-keyframes sdb10 {
    0% {
      -webkit-transform: translate(0, 0);
      opacity: 0;
    }
    40% {
      opacity: 1;
    }
    80% {
      -webkit-transform: translate(0, 20px);
      opacity: 0;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes sdb10 {
    0% {
      transform: translate(0, 0);
      opacity: 0;
    }
    40% {
      opacity: 1;
    }
    80% {
      transform: translate(0, 20px);
      opacity: 0;
    }
    100% {
      opacity: 0;
    }
  }

.odkaz{
  font-family: "filmotype-lacrosse", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 250%;
}