html, body{
  margin:0 !important;
  padding:0 !important;
  font-family: Dosis;


}

#background{
width: 100%;
}
#background img{
  width: 100%;


}
#nav{
  display: none;
}
#nav2{
  display: none;
}
.navbar {
  font-weight: 700;

  overflow: hidden;
  background-color: #FFCF39;
  position: fixed;
  bottom: 0;
  width: 100%;

}
.navbarR {
  font-weight: 700;

  overflow: hidden;
  background-color: #FFCF39;
  position: relative;
  bottom: 0;
  width: 100%;

}


.navbar a {

  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 55px;
}
.navbar a img{
	width: 20%;

}
.navbarR a {

  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 55px;
}
.navbar a:hover

{
  background-color: #2B90CF;

}
.navbarR a:hover

{
  background-color: #2B90CF;

}
#navleft a:hover{
  background-color: #2B90CF;
}
#navleft .logo a:hover{
  background-color: #FFCF39;;
}
#navright .button a:hover{
  background-color: #2B90CF;
}
.button1 a:hover{
  background-color: #2B90CF;
}

.navbar .logo a:hover {
  background: #FFCF39;
}
.navbarR .logo a:hover {
  background: #FFCF39;
}



  .navbar a:not(:disabled) {display: none;}
  .navbar a.icon {
    display: block;

  }
  .navbar.responsive .icon {
    display: none;
    position: absolute;
    right: 0;
    bottom:0;
  }
  .navbar.responsive{
     padding-bottom: 50px;
   }
  .navbar.responsive a {
    float: none;
    display: block;

  }

  @media screen and (orientation: landscape) {
    .navbar{
      display: none;
    }
  }
  @media screen and (orientation: portrait) {
    #navleft{
      display: none;
    }
    #navright{
      display: none;
    }
    #footer{
          display: none;
        }
        .navbar{
          display: block;
        }
  }

  @media screen and (max-height: 440px) and (orientation: landscape) {
#footer{
      display: none;
    }
    .navbar{
      display: none;
    }
}
@media screen and (min-width: 1000px){

  .nextpage{
    display: none;
  }
  .komiks{
    display: flex;
  }
  .komiksapopis .logo{
    display: none;
  }

  .navbarR{
    display: none;
  }
  .crop{

    width: 100%;
  }
  .komiks {

height: 100vh;


  }

  .komiks .picture{


display: flex;
margin-left: 8%;
margin-right: 8%;
justify-content: center;


  }
.komiks .pic{
width: 50%;
height: 100%;

}
.dilo{
  display: flex;
  align-items: center;

}
.diloimg{

 padding-left: 20px;
  width: 150%;
}
.white{


}
.diloimg a img{

}
.whiteS{
  margin: 0 20%;
}
.pic .white{
  padding: 5% 5%;

}


#navleftK{

  height: 100%;
  width: 8%;
  position: fixed;
  background-color: #FFCF39;
}
#navleftK .button a img{
  width: 60%;
}
#navleftK .button a{


      height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;

}


#navleftK .logo{
  height: 19vh;
  text-align: center;
  width: 100%;
  }

#navleftK .logo{
  display: flex;
  align-items:center;
  justify-content:center;
  }


#navleftK .logo a img{
  width: 60%;
  padding-top:20%;


}

#navleftK .button a:hover{
  background-color: #2B90CF;
}
#navrightK{
  right: 0;

  width: 8%;
  position: fixed;
  background-color: #FFCF39;
  height: 100%;

}
#navrightK .button a img{
  width: 50%;
}
#navrightK .button a{
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;

}

#navrightK .button a:hover{
  background-color: #2B90CF;
}

}

@media screen and (max-width: 1000px)
{
  .white{
    padding: 5% 15%;
  }
  .imgeudvz{

    float: left;
    width: 100%;
  }
  .imgeu img{
  width: 100%;
  }
  .imgdvz img{
    padding-bottom: 130px;
  }
#navleftK{
  display: none;
}
#navrightK{
  display: none;
}
.diloimg a img{
  margin: auto;
  width: 190px;
}
}
  #footer{
    position: fixed;
    bottom: 0;
    height: 60px;
    width:100%;
    background-color: #FFCF39;
  }
  #navleft{


    width: 10%;
    background-color: #FFCF39;
    height: 100%;
    position: fixed;
    z-index: 2;
  }
  #navleft .logo{
    height: 19vh;
    text-align: center;
    width: 100%;
  }
#navleft .logo a img{
    width: 60%;
    padding: auto;


  }

  #navleft .button{
    height: 80%;
  }
  #navleft a{
    display: block;
  }

  #navleft .butt .button a img{
  width: 50%;
  }

  #navleft .butt .button img{
  width: 50%;
  }

  #navleft .logo a{
    padding-top: 20px;
    padding-bottom: 20px;
  }

  #navleft .button a{
    height: 80vh;
    display: flex;
    align-items:center;
    justify-content:center;
  }

  #navleft .button a img{
    width: 50%;
  }

  #navright{
    width: 10%;
    background-color: #FFCF39;
    height: 100%;
    position: fixed;
    z-index: 2;
    float: right;
    right: 0;
  }

  #navright .button{

  }
  #navright .button a{
 justify-content: center;

 align-items:center;
 width: 100%;
 height: 50vh;
 display: flex;
 }
  #navright .button1 a{
    justify-content: center;
    align-content: center;
    width: 100%;
    height: 50vh;
    display: flex;
  }
  #navright .button a img{
    padding-top:30%;
    height: 60%;


  }
  #navright .button .soutez a img{
    padding-top: 10vh;
    width: 40%;


  }

  #navright .button1 a img{
width: 30%;
  }
.seznam{
  padding-top: 50px;
  padding-bottom: 50%;
    background-color: #FFCF39;
}
.seznam .logo a{

  width: 100%;
  display: block;
  text-align: center;
}
.seznam .logo a img{

  width: 70px;
  align-self: center;
}
.seznam ul  {
  list-style: none;
  width: 100%;
  text-align: center;
  padding: 0px;
  margin: 0px;

}
.seznam  a{
  display: block;
  color: white;
  text-decoration: none;
  font-weight: 700;
  font-size: 30px;
  padding: 5px;
  padding-left: 20%;
  padding-right: 20%;
  text-align: center;


}
.seznam  .logo a{

  padding: 5px;


}
.seznam ul li a:hover{
  color: #E56092;

}
.seznam .odkaz a:hover{
  color: #E56092;

}
.komiks .logo{


  padding: 20px;
}
.komiksapopis{
  background-color: #fff;



}
.komiksapopis .button{
  width: 100px;
  z-index: 3;
}
.komiksapopis .logo{

  position: absolute;
  padding: 20px;
}

.komiks{

}
.komiks img{

}
.pic .white{
  background-color: white;

  margin-top: 0%;
  margin-bottom: 25%;
}
.white{
  background-color: white;
  margin-top: 0%;
  margin-bottom: 25%;
}
.white .diloimg a img{
  display:flex;
  align-self:center;
  width: 140px;
}

.komiks img{
width: 100%;
}

.zluta{
  height: 80px;
  background-color: #FFff;
  display:block;
}
.strong{
  font-weight: bolder;
}

.imgeudvz{
  text-align: center;
}