*{
    
    box-sizing: border-box;
    font-family: Andale Mono;
    
}

body{
    
     /* background-image: url("img/Screenshot%202026-02-23%20at%2015.34.50.png");
     
      background-repeat: repeat; /* Prevents repeating */
      background-position: center;
     background-size: cover;       /* Makes image fill the screen */
        background-color: beige;
}

.block {
    
    position: relative;
    float: left;
    width: 100%;
    
}

.column {
    
    position: relative;
    float: left;
    width: 50%;
    background-color: azure;
    padding: 5px;
    
}

.column {
    
    position: relative;
    float: left;
    width: 50%;
    background-color: azure;
    padding: 5px;
    
}


img {
    
    width: 100%;
    position: relative;
    float: left;
}

header {
    
    font-size: 40pt;
 
    

}

.caption {
    
    position: relative;
    float: left;
    width: 100%;
    font-size: 10pt;
}



.column2 {
    
    position: relative;
    float: right;
    width: 50%;
    background-color: azure;
    padding: 5px;
    
}

#c2 {
    
    position: relative;
    float: right;
    width: 50%;
    background-color: azure;
    padding: 5px;
    
}



@keyframes myAnimation {
  0%   {background-color:red; left:0px; top:0px;}
  25%  {background-color:yellow; left:300px; top:0px;}
  50%  {background-color:blue; left:200px; top:200px;}
  75%  {background-color:green; left:0px; top:200px;}
  100% {background-color:red; left:0px; top:0px;}
}

header {
    
  z-index: 99;
  width: 100px;
  height: 100px;
  position: relative;
  background-color: red;
    animation: myAnimation 4s linear infinite;
  animation-name: myAnimation;
  animation-duration: 4s;
}

header2 {
    
    font-size: 60pt;
    float: right;
 
    

}

header3 {
    
    font-size: 30pt;
 
    

}

a{
    
    float: right;
    
}