@font-face {font-family:'klee'; src:url('Klee.woff2') format('woff2'); font-weight:normal; font-style:normal;}

*{margin:0; padding:0;}
*,*:before,*:after{-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
html {height:100%; overflow:hidden;}
body {font-family:'klee', sanserif; font-size:20px; margin:0; padding:0; text-align:center; background-color:#fff; height:100%; overflow:hidden;}
#box       {position:relative; border: 1px solid #ccc;margin:0 auto; text-align:left;}
#topbox    {position:absolute; width:100%; height:8%; background-color:#CF232B; color:#fff;}
#logo {position:absolute; width:10%; left:2.08%; top:9%;}
#teachers  {position:absolute; right:3.13%; top:27%;}
#mainspace {position:absolute; width:100%; height:92%; top:8%; background-color:#FFF8DC;}
#herc_map  {position:absolute; width:100%; top:4%; left:0%; text-align:center;}
.label     {position:absolute; cursor:pointer; font-style:italic; text-align:center; text-decoration:none; background-color:#CF232B; padding:0.5%; color:#FFF;}
#ch1 {right:13%; top:4.5%;}
#ch2 {right:2%;  top:28%;}
#ch3 {left:32%;  top:11%;}
#ch4 {right:22%; bottom:46%;}
#ch5 {left:16%;  bottom:66%;}
#ch6 {right:52%; bottom:26%;}