@charset "UTF-8";
/* CSS Document */

html, body {
	margin: 0 !important;
    padding: 0 !important;
	font-size: 15pt;
	font-family: Arial, "sans-serif";
    background: #f9fbfd;
    overflow: hidden; /* Hide scrollbars */
}

iframe {
    width: 100vw;
    height: 100vh;
    background: #f9fbfd;
}

canvas {
  position: fixed;
  width: 100;
  height: 100vh;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: transparent;
 pointer-events: none;
  z-index: 3;
}

#horizontalMenu {
    position: fixed;
    margin: 0;
    padding: 0;
    top: 20px;
    left: 20px;
    right: 20px;
    width: auto;
  list-style-type: none;
  overflow: hidden;
    z-index: 4;
}

#horizontalMenuItem {
  float: left;
}

#horizontalMenuItem:last-child {
  float: right;
width: 90px;

}

#horizontalMenuItem a {
  display: block;
  text-align: center;
  padding: 14px 22px;
  text-decoration: none;
    box-shadow:none;   /* Prevent blurred border */
    outline:none;      /* Prevent hard outline */
    -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
    cursor: pointer;
}

@media (pointer:none), (pointer:coarse) {
    iframe {
        width:220vw !important; 
        height:222vh !important;
        -moz-transform: scale(0.45, 0.45); 
        -webkit-transform: scale(0.45, 0.45); 
        -o-transform: scale(0.45, 0.45);
        -ms-transform: scale(0.45, 0.45);
        transform: scale(0.45, 0.45); 
        -moz-transform-origin: top left;
        -webkit-transform-origin: top left;
        -o-transform-origin: top left;
        -ms-transform-origin: top left;
        transform-origin: top left;
        text-rendering: optimizeLegibility;
}
}

@media (max-width: 800px) {
    
    canvas {
          width: 100% !important;
  height: 100vh !important;
    }    
    #horizontalMenu {
    position: fixed;
    margin: 0;
    padding: 0;
    top: 14px;
    left: 14px;
    width: 125px !important;
  list-style-type: none;
  overflow: hidden;
}

#horizontalMenuItem {
  float: none;
}

#horizontalMenuItem:last-child {
  float: none !important;
position: fixed;
    margin: 0;
    padding: 0;
    top: 14px;
    right: 14px;
    width: 80px !important;
}    
   
    
#horizontalMenuItem:first-child {
    display: block !important;
    max-width: 80px !important;
}
    
#horizontalMenuItem a {
  border-radius: 36px !important;
    padding: 7px 11px !important;
}
    
}