.chapter-menu-container {
    margin: auto;
}

.book-menu-container {
    width: 100%;
    padding-top: 20px;
}

.book-menu-options {
    width: 50%;
    height: 45px;
    margin: auto;
    padding: 10px 0px;
}

p.menu-buttons {
    margin-bottom: 0;
    margin-top: 2px;
    color: #000000;
    font-size: 12px;
}

.navButtonContainer {
    width: 20%;
    float: left;
}

.navButtonContainer-wide {
    width: 40%;
    float: left;
}

.homeNavButton {
    background: none;
    border: none;
    width: 100%;
    height: auto;
}

#homenavicon {
    width: auto;
    height: auto;
    float: none;
    margin-right: 2px;
}

.categoryNavButton {
    background: none;
    border: none;
    width: 100%;
    height: auto;
}

#categoriesicon {
    width: auto;
    height: auto;
    float: none;
    margin-right: 2px;
    margin-top: 2px;
}

.functionsButton {
    background: none;
    border: none;
    width: 100%;
    height: auto;
}

#functionsnavicon {
    width: auto;
    height: auto;
    float: none;
    margin-right: 2px;
}

.bookmarksButton {
    background: none;
    border: none;
    width: 100%;
    height: auto;
}

#bookmarkssnavicon {
    float: none;
    margin-left: 40%;
    margin-bottom: -2px;
}

.socialShareButton {
    background: none;
    border: none;
    width: 100%;
    height: auto;
    display: block !important;
}

#socialsharenavicon {
    width: auto;
    height: auto;
    float: none;
    margin-right: 2px;
    margin-bottom: 2px;
}


.accountButton {
    background: none;
    border: none;
    width: 100%;
    height: auto;
}

#accountnavicon {
    width: auto;
    height: auto;
    float: none;
    margin-right: 2px;
}

.logInNavButton {
    background: none;
    border: none;
    width: 100%;
    height: auto;
}

#loginnavicon {
    width: auto;
    height: auto;
    float: none;
    margin-right: 2px;
    margin-top: 2px;
}



.readingModeButton {
    background: none;
    border: none;
    width: 25%;
    height: 50px;
}

.functionsIcon {
    width: 35px;
}

/* Preloader */

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  /* change if the mask should have another color then white */
  z-index: 99;
  /* makes sure it stays on top */
  display:none;
}

#status {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  background-image: url(https://raw.githubusercontent.com/niklausgerber/PreLoadMe/master/img/status.gif);
  /* path to your loading animation */
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px;
  /* is width and height divided by two */
}

@media screen and (max-width: 750px) { 
.book-menu-options {
    width: 100%;
}

}