@font-face { font-family: YGUILight; src: url('webdata/fonts/yugothil.ttf'); }
@font-face { font-family: Lato; src: url('webdata/fonts/Lato-Regular.ttf'); }
@font-face { font-family: Comfortaa; src: url(Comfortaa-Bold.ttf); }
@font-face { font-family: Maxwell; src: url(MAXWELL_BOLD.ttf); }
@font-face { font-family: Aleos; src: url(Hind-Regular.ttf); }
@font-face { font-family: Cherry; src: url(CherrySwashR.ttf); }
@font-face { font-family: TechnaSans; src: url(Raleway.ttf); }

body
{
	background: rgba(0,0,0,0.05);
    background-image: url("LighterReflectionien.jpg");
    background-repeat: no-repeat;
    background-size: cover;
	font-family: Lato, sans-serif, monospace;
    /*min-height: 900px;*/
    overflow: scroll;
}

div#app-local-content-app
{
	font-family: Lato, sans-serif, monospace;
	margin: 30px;
	margin-left: 4%; 
	margin-right: 6%;
	padding-bottom: 50px;
	width: 90%;
	overflow-y: auto;
}
div#app-local-content
{
	font-family: Lato, sans-serif, monospace;
	margin: 10px;
	margin-left: 2%; 
	margin-right: 3%;
	padding-bottom: 50px;
	width: 96%;
	overflow-y: auto;
}

iframe {
   width: 35.5vw !important;
   height: 20vw !important;
   position: absolute;
   top: 14.599vw;
   right: 7.221vw;
}

th { color: #fafafa; }

/* Element boundaries debugging */
a, pre, p {
   border: blue 0px solid;
}

.titles {
  overflow: scroll;
}

a.title
{
   height: 4.5vw;
   font-family: "Arista 2.0", Alba, Iceland, Maxwell;
   overflow: visible;
}
a.title:hover {
  text-shadow: 2px 1px 1px rgba(168,167,159,1);
  animation: glowmedium 1.5s ease-in-out infinite alternate;
}

a.placeholder
{
   padding-left: 0.39vw; 
   padding-right: 0.39vw;
   text-shadow: 0px 0px 10px #ffdd1b;
}
a.placeholder:hover
{
  text-shadow: 2px 1px 1px rgba(168,167,159,1);
  animation: glowlower 1.5s ease-in-out infinite alternate;
}

.features
{
   font-size: 1.664vw;
   margin-left: 10px;
   font-family: "Caviar Dreams", "Comfortaa", "Verdana";
   position: absolute;
   top: 12.774vw;
   left: 10.228vw;
   width: auto;
   height: auto;
   line-height: 1.32;
}
pre.features:hover
{
   text-shadow: 2px 1px 1px rgba(168,167,159,1);
   animation: glowtiniest 1.5s ease-in-out infinite alternate;
}

a.link
{
   font-size: 3.90vw;
   margin-left: 10px;
   font-family: "Aleos", "Segoe WP SemiLight";
   max-height: 4.910vw;
   font-stretch: semi-condensed;
   margin-top: -0.2vw;
}
a.link2
{
   font-size: 3.0vw;
   font-family: "Aleos", "Segoe WP SemiLight";
   max-height: 4.910vw;
   font-stretch: semi-condensed;
   margin-top: -0.2vw;
}
a.link:hover, a.link2:hover
{
   text-shadow: 2px 1px 1px rgba(168,167,159,1);
   animation: glowlow 1.5s ease-in-out infinite alternate;
}

a.subtitle
{
   font-family: "Brotherhood", "Cherry", "Verdana";
   font-size: 3.389vw;
   position: absolute;
   top: 4.953vw;
   left: 5.214vw;
   width: auto;
   height: auto;
}

a.subtitle2
{
   font-family: "Brotherhood", "Cherry", "Verdana";
   font-size: 3.389vw;
   position: absolute;
   top: 4.953vw;
   right: 13.556vw;
   width: auto;
   height: auto;
}
a.subtitle:hover, a.subtitle2:hover, a.footer:hover, a.footerel:hover
{
   text-shadow: 2px 1px 1px rgba(168,167,159,1);
   animation: glowtiny 1.5s ease-in-out infinite alternate;
}

#header
{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: center;
   overflow: visible;
   align-items: center;
}
#header a { font-size: 3.910vw; }

#floatcenter
{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: center;
   overflow: visible;
   align-items: center;
   margin-top: calc(17vh + 25vw);
   z-index: 5;
}

#footer
{
   font-size: 2.607vw;
   font-family: "TechnaSans", "Aharoni", "Verdana";
   position: absolute;
   bottom: 0.5vw; 
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
   justify-content: center;
   align-items: center;
   flex: 1;
}
.footerel { color: #000; text-decoration: none; }

.glowhigh
{
   color: black;
   overflow: visible;
   text-decoration: none;
   text-shadow: 0px 0px calc(0.154vw + 3px) #ffdd1b;
}
.glow
{
   color: black;
   overflow: visible;
   text-decoration: none;
   text-shadow: 0px 0px calc(0.102vw + 2px) #ffdd1b;
}
.glowsuddle
{
   color: black;
   overflow: visible;
   text-decoration: none;
   text-shadow: 0px 0px calc(0.054vw + 1px) #ffdd1b;
}

@keyframes glowmedium {
  from {
    text-shadow: 0 0 6px #fff, 0 0 12px #fff, 0 0 16px #fff, 0 0 20px #FFDD1B, 0 0 32px #FFDD1B, 0 0 40px #FFDD1B, 0 0 50px #FFDD1B, 0 0 60px #FFDD1B;
  }
  to {
    text-shadow: 0 0 3px #fff, 0 0 5px #fff, 0 0 8px #fff, 0 0 10px #FFDD1B, 0 0 15px #FFDD1B, 0 0 20px #FFDD1B, 0 0 25px #FFDD1B, 0 0 35px #FFDD1B;
  }
}
@keyframes glowlow {
  from {
    text-shadow: 0 0 0.156vw #fff, 0 0 0.313vw #fff, 0 0 0.417vw #fff, 0 0 0.521vw #FFDD1B, 0 0 0.721vw #FFDD1B, 0 0 0.842vw #FFDD1B, 0 0 1.102vw #FFDD1B, 0 0 1.263vw #FFDD1B;
  }
  to {
    text-shadow: 0 0 0.104vw #fff, 0 0 0.156vw #fff, 0 0 0.208vw #fff, 0 0 0.260vw #FFDD1B, 0 0 0.365vw #FFDD1B, 0 0 0.521vw #FFDD1B, 0 0 0.681vw #FFDD1B, 0 0 0.838vw #FFDD1B;
  }
}
@keyframes glowlower {
  from {
    text-shadow: 0 0 0.104vw #fff, 0 0 0.208vw #fff, 0 0 0.313vw #fff, 0 0 0.365vw #FFDD1B, 0 0 0.781vw #FFDD1B, 0 0 1.260vw #FFDD1B, 0 0 0.938vw #FFDD1B, 0 0 2.104vw #FFDD1B;
  }
  to {
    text-shadow: 0 0 0.104vw #fff, 0 0 0.156vw #fff, 0 0 0.156vw #fff, 0 0 0.208vw #FFDD1B, 0 0 0.260vw #FFDD1B, 0 0 0.365vw #FFDD1B, 0 0 0.521vw #FFDD1B, 0 0 0.781vw #FFDD1B;
  }
}
@keyframes glowtiny {
  from {
    text-shadow: 0 0 0.052vw #fff, 0 0 0.104vw #fff, 0 0 0.156vw #fff, 0 0 0.208vw #FFDD1B, 0 0 0.313vw #FFDD1B, 0 0 0.365vw #FFDD1B, 0 0 0.417vw #FFDD1B, 0 0 0.469vw #FFDD1B;
  }
  to {
    text-shadow: 0 0 0.052vw #fff, 0 0 0.052vw #fff, 0 0 0.104vw #fff, 0 0 0.104vw #FFDD1B, 0 0 0.156vw #FFDD1B, 0 0 0.208vw #FFDD1B, 0 0 0.260vw #FFDD1B, 0 0 0.260vw #FFDD1B;
  }
}
@keyframes glowtiniest {
  from {
    text-shadow: 0 0 0.052vw #fff, 0 0 0.062vw #fff, 0 0 0.104vw #fff, 0 0 0.124vw #FFDD1B, 0 0 0.156vw #FFDD1B, 0 0 0.156vw #FFDD1B, 0 0 0.166vw #FFDD1B, 0 0 0.166vw #FFDD1B;
  }
  to {
    text-shadow: 0 0 0.052vw #fff, 0 0 0.062vw #fff, 0 0 0.104vw #fff, 0 0 0.114vw #FFDD1B, 0 0 0.124vw #FFDD1B, 0 0 0.156vw #FFDD1B, 0 0 0.156vw #FFDD1B, 0 0 0.156vw #FFDD1B;
  }
}