:root {--white-ish:aliceblue; --yellow-ish:hsl(44, 72%, 68%); --info-bor:(lightgoldenrodyellow); --green-ish:rgb(31, 85, 77);
}
em {background-color: rgba(0, 0, 0, 0.5);}      
em {text-decoration: none; font-style: normal; padding-top: 3px; padding-bottom: 3px;}

y-1, t-body, t-2, h1, #infoDiv {color:var(--yellow-ish)}
                           t-3 {color:var(--white-ish)}

#box1span, #box2span, #box3span, #crawlTxt {color: aqua; }
#box1Wrap, #box2Wrap, #box3Wrap 
      {border: 1px solid lightgoldenrodyellow; border-right: none; border-left: none; } 

p, li, #shieldDisp{ color: var(--white-ish);}

#crawlFrame, #crawlTransBot,  #stock1 {border:        1px solid  rgb(31, 85, 77); box-sizing: border-box; }

 .hbutt, .vbutt { border:1px solid   rgb(31, 85, 77);}

@keyframes flash { 0%,48%,  52%, 100%  { color: rgb(211, 227, 233); }
                              49%, 51% { color:white}}


/* #email {background-color:rgba(0, 0, 0, 1); padding:5px 5px; width:100%;} */

h1 { font-size: 1.2rem; line-height:140%; font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Sans', 'Arial', 'sans-serif'; font-weight: bold; }
#docDiv, #shieldDisp {line-height: 1.2; font-family: 'Lucida Sans', 'Arial', 'sans-serif';  }
                        
#box1span, #box2span, #box3span, #box4span {font-size: 1rem; line-height: 1.2;  font-family: 'Calibri', 'Lucida Sans', 'Arial', 'sans-serif';}

#contactH {font-size: .8rem; font-family:  sans-serif; }

#crawlTxt {font-size: 1.8vw; font-family: sans-serif; font-style: italic;}


p, li { padding:0px 6px 0px 12px  }    
            
h1 { padding: 5px 6px 5px 12px;}

p,li { hyphens: auto; max-width: 50ch;   }
        
#Plato, #Aristotle, #Socrates, #Johnny, #court-seal {float: right; max-width: 4rem; padding: 4px; margin: 8px 1% 2% 5%; cursor: pointer;
                                                     border:2px rgb(90, 54, 54) solid; text-align: center; text-align: center;}

  t-body  { font-family: 'Lucida Sans', 'Arial', 'sans-serif'; line-height: 1.25em; hyphens: none; margin: 0px 10px; font-size: 80%;  }

  t-body {background-color: rgba(0.0.0.6); padding-top:2px;}
  t-2 {font-size: 80%; font-style: normal;}
  t-3 { display: block; font-style: italic; font-family:'Times New Roman', Times, serif;
        text-align: center; padding: 1vw 5vw 1vw 5vw; left:10%; background-color: rgba(0,0,0,.6); }
  t-4 {display: block; text-align: center; margin: 1vw 5vw; font-style: normal;  font-family: sans-serif;background-color: rgba(0.0.0.6)}
                                                   




        #Plato {animation: flashborder 2s 0s   infinite, rotColors 10s infinite alternate;}
    #Aristotle {animation: flashborder 2s .5s infinite alternate, rotColors 10s infinite alternate;}
         #usps {animation: opFlash    4s 1s   infinite alternate both; text-decoration: underline;}
     #Socrates {animation: flashborder 2s 1.5s   infinite alternate, rotColors 10s infinite alternate;}
       #Johnny {animation: flashborder 2s 2s infinite alternate}
       #cacd   {animation: opFlash   4s 2.5s infinite alternate both; text-decoration: underline;}
       #arb    {animation: opFlash   4s 3s infinite alternate both; text-decoration: underline;}
   #court-seal {animation: flashborder 4s 3s   infinite alternate both}
      #address {animation: opFlash   4s 3.5s   infinite alternate both; text-decoration: underline;}



   .full {position:fixed; width:100%; height:100%; left:0; top:0px;} 
      
   @keyframes crawlAn  {0%  { transform: translateY(0px); opacity: 1}
                        98% { opacity: 1;}
                        99% { transform: translateY(-10000px); opacity:0 ;}  
                        100%{ opacity:0 ;} }    
   


   @keyframes worldAnX {from { background-position-x:  0px; }
                        to   { background-position-x:  600000px; }  }
   
   @keyframes worldAnY {from { background-position-y: 0px; }
                         50% { background-position-y: 440px; }
                         to  { background-position-y: 0px;}   }
   
   @keyframes worldAnSz {0%, 5%    { transform: scale(1);}
                         40%, 60%  { transform: scale(2.5);}   
                         95%, 100% { transform: scale(1);}   }
   
   @keyframes testAn {0%, 5%    {opacity: 0;}
                      30%, 70%  {opacity: 1;}   
                        95%, 100% {opacity: 0 } }
 
    @keyframes opacityOff { 0% { opacity: 1; display: block}
                           99% { opacity: 0; display: block}
                           100% {opacity: 0; display: none } }

    @keyframes opacityOn { 0% { opacity: 0;}
                           100% {opacity: 1 } }


    @keyframes opFlash { 0%,45%,  95%, 100%  { opacity: .9 }
                          46%, 94%  { opacity: .8; }
                      49%, 51% { opacity: 1; } }

    @keyframes opFlash { 0%,45%,  55%, 100%  { opacity: .65 }
                  47%, 53% { opacity: 1; } }                      

    @keyframes stockAn { 0%        {display: none;  opacity: 0 }
                         1%        {display: block; opacity: 0}
                         5%, 45%  {opacity: 1 } 
                         49%       {display: block; opacity: 0 }
                         50%      {display: none;  opacity: 0 }}
                         

   /* @keyframes  logoColor {0% {background-color: lightblue; }
                         20% {background-color: lightgoldenrodyellow;}
                         40% {background-color: lightgreen;}
                         60% {background-color: lightgrey;}
                         80% {background-color: lightcyan;} 
                        100% {background-color: lightsalmon;}        } */

   @keyframes  logoColor { 0% {opacity: .3;}
                          20% {opacity: 0;}
                          50% {opacity: .3;}
                          95% {opacity: .9;}
                         100% {opacity: .9;}   }

   @keyframes  logoColor2 {0% {opacity: 0;}                        
                       100% {opacity: .4;}}

   @keyframes birdAn {0%,5%  {transform: rotate(0deg) }
                     10%     {transform: rotate(-30deg) }

                     15%,20%  {transform: rotate(-3deg) }
                     25%     {transform: rotate(-20deg) }

                     30%,35%  {transform: rotate(-5deg) }
                     42%     {transform: rotate(-359deg) }

                     55%,60%  {transform: rotate(-370deg) }
                     75%     {transform: rotate(-359deg) }

                     80%,85%  {transform: rotate(-320deg) }
                     90%     {transform: rotate(-359deg) }

                     95%    {transform: rotate(-350deg)}
                     100%      {transform: rotate(-359deg) } }

   @keyframes birdAn2  {0%  {left: -20% }
                          100% {left:20% }} 

   @keyframes birdAn4  {0%   {top:  -24% }
                          100% {top: 0% }} 

   @keyframes birdAn3  {0%  {transform: scale(.5)        translateY(-10%) }

                         64% {transform: scale(.8)        translateY(0%) }
                          100% {transform: scale(.9)    translateY(10%)  }}

   @keyframes birdAn6 {0%,90%   {transform: rotate(0deg) }
                       100% {transform: rotate(359deg) }} 


   
   @keyframes rotColors   {0%  {filter: hue-rotate(0deg) }
                          100% {filter: hue-rotate(359deg) }}



 @keyframes  linkedAn {0%, 90%,100%  { background-color: transparent; }
                       15%  { background-color: red; }
                       30%  { background-color: orange; }
                       45%  { background-color: yellow; }
                       60%  { background-color: lightgreen; }
                       75%  { background-color: violet; }  }

  

   /*  a:link {color: lightyellow; }
    a:visited { color: lightyellow; }
    a:hover {color: hotpink;  }
    a:active {color: lightyellow;}
                            */