/* CSS Document */
/*animace pozadí*/
@-webkit-keyframes tapeta {
  0%   {-webkit-transform: scale(1.0) translate(0px, 0px)}
  20%  {-webkit-transform: scale(1.6) translate(-200px, -200px);}
  40%  {-webkit-transform: scale(2.0) translate(-260px, 100px);}
  60%  {-webkit-transform: scale(2.5) translate(-300px, -300px)}
  80%  {-webkit-transform: scale(1.8) translate(-100px, -290px);}
  90%  {-webkit-transform: scale(1.4) translate(100px, -200px);}
  100% {-webkit-transform: scale(1.0) translate(0px, 0px)}
}
@keyframes tapeta {
  0%   {transform: scale(1.0) translate(0px, 0px)}
  20%  {transform: scale(1.6) translate(-200px, -200px);}
  40%  {transform: scale(1.8) translate(-260px, 100px);}
  60%  {transform: scale(2.0) translate(-260px, -300px)}
  80%  {transform: scale(1.8) translate(-100px, -290px);}
  90%  {transform: scale(1.4) translate(100px, -200px);}
  100% {transform: scale(1.0) translate(0px, 0px)}
}
#bg {
  -webkit-animation-name: tapeta;
  animation-name: tapeta;
  -webkit-animation-duration: 240s;
  animation-duration: 240s; 
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
  -ms-animation-delay: 5s;
  -o-animation-delay: 2s;
  animation-delay: 2s;
  position: fixed; 
}
  body {
  margin: 0;
  padding: 0;
  text-align: center;
  background: rgb(0,0,0);    
  min-height: 1080px;
  font-family: "Times New Roman";    
}
#bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 110%;
  min-width: 1400px;
  min-height: 100%;
   max-height: 2000px;
  z-index: -1;    
}

@keyframes lis-10 {
  0%   {opacity: 0;}
  90%  {opacity: 0;}
  100% {opacity: 1;}
}
.home #content article {
  animation-name: lis-10;
  animation-duration: 4s; 
  animation-delay: 2.0s;
  animation-fill-mode: backwards; 
}

  #box { 
  width: 350px;
  line-height: 0px;
  text-align: center;
  background-color: transparent;
  overflow: visible;
}
 
.animation {
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  box-shadow: 10px 10px 10px #000;
  border: 1px solid; 
  border-radius: 100%;
}
 
.animation:hover { 
  -webkit-transform:  scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
  box-shadow: 25px 25px 25px #000;
 }

 table {margin: 50;
        font-family:tahoma;
        font-size:30px;
        text-shadow: 0px 5px 3px #111}
 td {
      width=50%; 
      padding=20px;  
    }

  .effects {
    margin-top: 0;
  
}
#effects a {
    color: #2098D1;
    text-decoration: none;
    background: rgba(50,50,50,0.5);
    padding:30px;
    position: top:-60px;
    border-radius: 30px;
}

.footer a:hover,
.nav:hover {
    color: #207AD1;
}


/* Wobble Top */
@-webkit-keyframes hvr-wobble-top {
  16.65% {
    -webkit-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    transform: skew(0);
  }
}

@keyframes hvr-wobble-top {
  16.65% {
    -webkit-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    transform: skew(0);
  }
}

.hvr-wobble-top {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform-origin: 0 100%;
  transform-origin: 0 100%;
  box-shadow: 10px 10px 10px #000;
}
.hvr-wobble-top:hover, .hvr-wobble-top:focus, .hvr-wobble-top:active {
  -webkit-animation-name: hvr-wobble-top;
  animation-name: hvr-wobble-top;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

 #kontakt {
  position: fixed;
  bottom: -10px;
  left: -10px;
  background: radial-gradient(#fff, #202020);
  font-size: 22px;
  padding: 20px;
  border-top-right-radius: 60px;
  box-shadow: 2px 2px 6px 1px black;
  text-shadow: 1px 1px 3px grey; 
  transition-duration: 0.4s;
}
#kontakt a {
  text-shadow: 1px 1px 3px grey;
  color: black;
  text-decoration: none; 
}
#kontakt:hover {
  bottom: -5px;
  left: -5px;
}

 #hledat {
  position: fixed;
  top: -10px;
  left: -10px;
  background: radial-gradient(#fff, #202020);
  font-size: 22px;
  padding: 20px;
  border-bottom-right-radius: 60px;
  box-shadow: 2px 2px 6px 1px black;
  text-shadow: 1px 1px 3px grey; 
  transition-duration: 0.4s;
}
#hledat a {
  text-shadow: 1px 1px 3px grey;
  color: black;
  text-decoration: none; 
}
#hledat:hover {
  top: -5px;
  left: -5px;
}

 .seznam:hover {
  -webkit-transform: translate(-1150px, 0px);
  -moz-transform: translate(-1150px, 0px);
  -o-transform: translate(-1150px, 0px);
  -ms-transform: translate(-1150px, 0px);
   transform: translate(-1150px, 0px);
 }

 .seznam {
  position: fixed;
  top: 50px;
  right: -1150px;
  box-shadow: 2px 2px 6px 1px black;
  transition-duration: 1s; 
  }

 #logo {
  position: fixed;
  top: 50px;
  right: 50px;
  border-radius: 15px;
  box-shadow: 6px 6px 6px 6px black;
  }
 
 .ja {
  position: fixed;
  top: 50px;
  right: 50px;
  border-radius: 15px;
  box-shadow: 6px 6px 6px 6px black;
 }
 