/* Style for the entire body of the webpage */
body {
  /* Set a background with a linear gradient at a 45-degree angle 
     and a background image */
  background: linear-gradient(
      40deg,
      /* 45-degree gradient angle */ rgba(250, 255, 255, 0.1),
      /* Semi-transparent white as the starting color */ hsl(103, 65%, 61%)
        /* A shade of green as the ending color */
    ),
    url(images/videos.png); /* The background image URL */

  /* Ensure the background covers the entire viewport */
  background-size: cover;

  /* Keep the background image fixed in place when scrolling */
  background-attachment: fixed;

  /* Center the background image within the viewport */
  background-position: center;

  /* Prevent the background image from repeating */
  background-repeat: no-repeat;

  /* Set the body height to cover the full viewport height */
  height: 100vh;

  /* Remove any default margin around the body */
  margin: 0px;

  /* Remove any default padding inside the body */
  padding: 0;

  /* Set the font family to Tahoma, with sans-serif as a fallback */
  font-family: "Tahoma", sans-serif;
  text-align:left;
  font-size: medium;
  width: 100%;
  max-width: 100%; 
}


main
 {
  margin: 0; /* Remove margin around main */
  padding: 0; /* Remove padding inside main */
  width: 100%; /* Ensure main takes the full width */
}

footer
 {
position: fixed; /* Keeps the footer at the bottom even when scrolling */
bottom: 0; /* Positions the container at the bottom of the viewport */
left:0;
width: 100%; /* Makes the container stretch across the full width of the page */
color: #ffffff; /* Change the font color to white for all text inside the footer */
background: linear-gradient(to right, #2a3118, #450606); /* Light gradient background */
text-align: center; /* Centers the links horizontally */
box-shadow: 0 -2px 5px rgba(241, 235, 235, 0.1); /* Adds a slight shadow */
border-top: 1px solid #e6b7b7; /* Light top border */
z-index: 1000; /* Ensures the footer stays above other elements */
font-family: Arial, sans-serif; /* Font */
font-size: clamp(15px, 18px, 20px); /* Responsive font size */
transition: color 0.3s ease, text-decoration 0.3s ease; /* Smooth transition for hover effects */
}

footer p
{

margin: 4px;
}


.video-a
{
color: rgb(252, 252, 252);
font-size: 16px;
font-weight: bold;
text-decoration: none;
}

.video-a:hover 
{
color: green;
text-decoration: underline;
}


.video-b
{
color: rgb(2, 2, 2);
font-size: 16px;
font-weight: bold;
text-decoration: none;
}

.video-b:hover 
{
color: rgb(255, 255, 255); 
text-decoration: underline;
}
    

.video-1
{
  z-index: 1000;
  background: #450606;
  border-radius: 5px;
  padding: 10px;
  width: 100%; 
}

.video-1:hover
{
  background-color: #e654d8;
}

.video-2
{
  z-index: 1000;
    background: #ffffff;
  border-radius: 5px;
  padding: 10px;
  width: 100%; 
}

.video-2:hover
{
  background-color: #e7ce12;
}