/* latin-ext */
@font-face {
  font-family: 'Fredericka the Great';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./fonts/fredericka-the-great-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Fredericka the Great';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./fonts/fredericka-the-great-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


html, body {margin: 0; height: 100%; overflow: hidden}

BODY {
 background-color:#202020;
}

.Container {
  position:absolute;
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  overflow:hidden;
  background-image:url(bg2.png);
}

.Caption {
  position:absolute;  
  margin:auto;
  left:0px;
  right:0px;
  top:0px;
  bottom:0px;
  text-align:center;
  line-height:350px;
  width:100%;
  height:350px;
  overflow:hidden;    
}

.Lamp {
  width:50px;
  height:50px;
  position:absolute;
  left:-50px;
  top:-50px;
  overflow:hidden;
  background-color:#FEFEfE;
  opacity:0.6;
  border-radius:50%;
  box-shadow:
    0 0 10px #FFFFFF,
    0 0 20px #FFFFFF,
    0 0 30px #FFFFFF,
    0 0 40px #FEFEFE,
    0 0 70px #FEFEFE,
    0 0 80px #FEFEFE,
    0 0 100px #FEFEFE,
    0 0 150px #FEFEFE;
}

.Std {
  font-family: 'Fredericka the Great', cursive;
  color:#202020;
  font-size:4em;
  text-shadow: 0 -1px 1px #666666, 0 1px 1px #FFFFFF;
}

.Std:hover {
  transform: scale(-1,3);
  -webkit-transform: scale(-1,3);
  display:inline-block;
  color:#101010;  
  text-shadow:
    0 0 10px #FFFFFF,
    0 0 20px #FFFFFF,
    0 0 30px #FFFFFF,
    0 0 40px #FEFEFE,
    0 0 70px #FEFEFE,
    0 0 80px #FEFEFE,
    0 0 100px #FEFEFE,
    0 0 150px #FEFEFE;
}