body {  
    font-family: 'Archivo Narrow', sans-serif;
    background:  #000000;  
    
    

    }  

.bg {
  width: 100vw;
  height: 100vh;
  
  position: fixed;
  top: 0;
  left: 0;
  z-index: -9999;
} 

.beegee {
  width: 100vw;
  height: 100vh;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -9999;
}
header {
    background-image: url('background.jpg');
    width: 100%
}
a:link {color:#000000;
-webkit-transition: color 4s, font-size 12s;
   -moz-transition: color 4s, font-size 12s;
     -o-transition: color 4s, font-size 12s;
        transition: color 4s, font-size 12s;
}
a:visited {color:#666666;}
a:hover {font-size: 400px;
      color:#FC0;}  
a:active {color:#888888;}
h1 {
    
    font-size:3em;
}
h1 span { 
    background-color: cyan; 
    
}
h2 {  
    font-size: 2em;  
    line-height: 1.2em;  
    
    font-style: italic;
}
h2 span { 
    background-color: cyan; 
    padding 5 5 5 5;
}  
h3 {  
    font-size: 1em;  
    line-height: 1.36em;
    padding: 1px 0;  
    font-style: italic;
  } 
h3 span { 
    background-color: yellow; 
    padding 5 5 5 5;
}
.box {
    padding 5 5 5 5;
}

 
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container iframe, .embed-container object, .embed-container embed { z-index: 10; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.shadou {
    
    -moz-box-shadow:35px 25px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:35px 25px 0px rgba(0,0,0,0.5);
    box-shadow:35px 25px 0px rgba(0,0,0,0.5);
    animation-name: varjo;
    animation-iteration-count: infinite;
    animation-duration: 220s;
    transition: box-shadow 0.3s ease-in-out;
}

.shadou2 {
    
    -moz-box-shadow:35px 25px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:35px 25px 0px rgba(0,0,0,0.5);
    box-shadow:35px 25px 0px rgba(0,0,0,0.5);
    animation-name: varjo;
    animation-iteration-count: infinite;
    animation-duration: 239s;
    transition: box-shadow 0.3s ease-in-out;
}

.rowpad {
    padding-right: 0;
    width: 99%;
}

@keyframes varjo {
  
  0% {-moz-box-shadow:35px 35px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:35px 35px 0px rgba(0,0,0,0.5);
    box-shadow:35px 35px 0px rgba(0,0,0,0.5);}
    60% {-moz-box-shadow:5px 5px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:5px 5px 0px rgba(0,0,0,0.5);
    box-shadow:5px 5px 0px rgba(0,0,0,0.5);}
    100% {-moz-box-shadow:35px 35px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:35px 35px 0px rgba(0,0,0,0.5);
    box-shadow:35px 35px 0px rgba(0,0,0,0.5);}
}

.shadou3 {
    
    -moz-box-shadow:25px 15px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:25px 15px 0px rgba(0,0,0,0.5);
    box-shadow:25px 15px 0px rgba(0,0,0,0.5);
    animation-name: varjo2;
    animation-iteration-count: infinite;
    animation-duration: 40s;
    transition: box-shadow 0.3s ease-in-out;
}

@keyframes varjo2 {
  
 0% {-moz-box-shadow:25px 15px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:25px 15px 0px rgba(0,0,0,0.5);
    box-shadow:25px 15px 0px rgba(0,0,0,0.5);}
  10% {-moz-box-shadow:35px 35px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:35px 35px 0px rgba(0,0,0,0.5);
    box-shadow:35px 35px 0px rgba(0,0,0,0.5);}
    70% {-moz-box-shadow:5px 5px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:5px 5px 0px rgba(0,0,0,0.5);
    box-shadow:5px 5px 0px rgba(0,0,0,0.5);}
    100% {-moz-box-shadow:25px 15px 0px rgba(0,0,0,0.5);
    -webkit-box-shadow:25px 15px 0px rgba(0,0,0,0.5);
    box-shadow:25px 15px 0px rgba(0,0,0,0.5);}
}