[data-page]{
    position:absolute; /* or absolute if the content exceeds the height of the page */
    width: 100%;
    min-height: 100vh;
    transform: translate3d(100%, 0, 0);
    opacity: 0;
    transition: opacity 0.2s ease-in, opacity 0.1s ease-in;
    z-index: 10;
}

[data-page].active{
    transform: translate3d(0, 0, 0);
    opacity: 1;
    z-index: 100;
}


/* #buttonContainer { */
/*   justify-content: space-between !important; */
/* } */

#buttonContainer button,
#buttonInfoContainer article,
#buttonNewContainer button {
  margin-bottom: .40rem !important;
  margin-right: .40rem !important;
  /* margin-right: 1em; */
  /* margin-bottom: 1em; */
}

#buttonInfoContainer article {
    margin-bottom: 1.2em !important;
}

#serverForm {
  padding-left: 0;
}

#serverForm div {
  padding-left: 0;
}

.hero-body, .section {
    padding: 1.5rem 1.5rem !important;
}