@font-face {
  font-family: 'Optician Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Optician Sans'), url('Optiker-K.woff2') format('woff2');
}

html, body, #displayType {
   height: 100%;
   overflow: hidden;
}

html, body {
   border: 0;
   margin: 0;
   padding: 0;
}

body {
   background-color: #fff;
   font-family: 'Lato', sans-serif;
   color: #000;
}

#goFullScreen {
   display: flex;
   float: left;
   position: absolute;
   top: 15%;
   left: 40%;
   background-color: #5B6C6A;
   color: #fff;
   font-size: 32px;
   width: 20%;
   height: 15%;
   align-items: center;
   justify-content: center;
   text-align: center;
}

#q {
   font-size: 14px;
   display: flex;
   float: left;
   position: absolute;
   bottom: 15%;
   left: 25%;
   height: 350px;
   width: 475px;
   align-items: center;
   justify-content: center;
   text-align: center;
   background-color: #5B6C6A;
   color: #fff;
   z-index: 100;
}

#menu1 {
   width: 80%;
   text-align:left;
}

#menu1 .title {
   font-size: 24px;
}

#menu1 .warning {
   color: #ff5f5f;
}

#menu1 hr {
   border: 0;
   padding: 0;
   height: 1px;
   background-image: linear-gradient(to right, rgba(91, 108, 106, 0), rgba(255, 255, 255, 1), rgba(91, 108, 106, 0));
}

#losDft {
   width: 30px;
}

#losDin {
   width: 30px;
}

#pxSize{
   width: 50px;
}

#qReset{
   color: #71a6f0;
   text-decoration: none;
}

#qReset:hover {
   color: #003e95;
}
#acuitySize {
   display: flex;
   float: right;
   position: absolute;
   bottom: 15px;
   right: 15px;
   font-size: 90px;
}

#displayType {
   display: flex;
   align-items: center;
   justify-content: center;
   font-family: 'Optician Sans';
   font-size: 30px;
   z-index: -1;
}

.mirror {
   -moz-transform: scale(-1, 1);
   -webkit-transform: scale(-1, 1);
   -o-transform: scale(-1, 1);
   -ms-transform: scale(-1, 1);
   transform: scale(-1, 1);
}