html {
    background-image: url(/virtual%20reality%20computer%20GIF.gif);
}

body{ 
    
    font-size: clamp(11px, 4vw, 18px);
    margin: clamp(10px, 3%, 50px)
    
}

#pagefront {
    background-color : black;
    border:groove;
    border-color : dimgray;
}

a:link {
    color:#09db09
    
}
a:link:checked {
    color:#053f05
    

}

#subtitle {
    color: white;
    text-align: center;
    padding: auto;
    border: solid 0.5px;
    font-family: Arial, Helvetica, sans-serif;
    
}

#logo {
    text-align: center;
    max-width: 466.5;
    margin: 0 auto;
    border:groove;
    border-color : dimgray;
}

#logo img {
    max-width: 100%; 
    height: auto;
}

#shortbio {
    color : white;
    text-align : center;
    border:groove;
    border-color : dimgray;

}

#linkssection {
     border:groove;
    border-color : dimgray;
}

#linkstitle {
    color : white;
    border-bottom:outset 2px;
    border-color : dimgray;
     display:grid;
    grid-template-columns: auto auto auto; /* Three columns: left GIF, header, right GIF */
    align-items:center; /* Vertically centers the content */
    justify-content: center; /* Horizontally centers the content */
    gap: 7px; /* Adds space between the GIFs and the header text */
}

.gif-left, .gif-right {
    width: auto; /* Adjust the width of the GIFs */
    height: auto; /* Maintains aspect ratio */
    
}
    


#links {
    text-align : center;
    
}

#video-container {
  display: none; /* Hide the container initially */
  text-align: center; /* Center the video horizontally */
  margin-top: 20px;
}

#video-container iframe {
  width: 80%; /* Make the video responsive */
  max-width: 800px; /* Set a maximum width */
  height: auto; /* Maintain aspect ratio */
  aspect-ratio: 16 / 9; /* Standard YouTube video aspect ratio */
}
#tourdates {
    
    color : white;
     border:groove;
    border-color : dimgray;
}
#tourtitle {
    text-align : center;
    border-bottom:outset 2px;
    border-color : dimgray;
      display:grid;
    grid-template-columns: auto auto auto; /* Three columns: left GIF, header, right GIF */
    align-items:center; /* Vertically centers the content */
    justify-content: center; /* Horizontally centers the content */
    gap: 7px; /* Adds space between the GIFs and the header text */
   
    
        
}

table {
    border-top:hidden 1px;
    border-color : dimgray;
}
table, td {
    border-bottom:outset 1px;
    border-color : dimgray;
    margin : auto;
    font-size: clamp(10px, 3vw, 16px);
    padding :  clamp(4px, 3%, 19px);
}

#buttons img {
    max-width: 100%; 
    height: auto;
}