body { margin: 0px; font-family: 'Roboto', sans-serif; font-size: 14px; }

#frame { position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden; }

#header { height: 2rem; line-height: 2rem; font-size: 1.6rem; background-color: black; color: white; font-weight: bold; }

#schema { position: absolute; top: 2rem; left: 0; right: 0; bottom: 0; overflow: hidden; }

.clickable { cursor: pointer; }

#ui-next { position: absolute; width: 128px; top: 0; bottom: 0; right: -128px; background-image: url("../gfx/arrow_next.png"); background-repeat: no-repeat; background-position-y: center; }
#ui-next :hover { background-color: rgba(0, 0, 0, 0.1); }

#ui-prev { position: absolute; width: 128px; top: 0; bottom: 0; left: -128px; background-image: url("../gfx/arrow_prev.png"); background-repeat: no-repeat; background-position-y: center; }
#ui-prev :hover { background-color: rgba(0, 0, 0, 0.1); }

.modal.wait { margin-top: 50%; }

#ui-next { -webkit-transition: right 1s, background-color 0.5s, -webkit-transform 1s; transition: right 1s, background-color 0.5s, transform 1s; }

#ui-prev { -webkit-transition: left 1s, background-color 0.5s, -webkit-transform 1s; transition: left 1s, background-color 0.5s, transform 1s; }