body, html {
   margin: 0;
   padding: 0;
   height: 100%;
   overflow: hidden;
}

#videoBG {
   position: fixed;
   top: 0;
   left: 0;
   min-width: 100%;
   min-height: 100%;
   width: auto;
   height: auto;
   z-index: -1;
}

.title {
   position: absolute;
   top: 45px; /* Adjust top position of the title as needed */
   left: 50%;
   transform: translateX(-50%);
   color: white; /* Adjust title color as needed */
   font-size: 50px; /* Adjust title font size as needed */
   z-index: 2; /* Ensure title is above the video background */
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
}

.content {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   color: white; /* Adjust text color as needed */
   font-size: 24px; /* Adjust font size as needed */
   text-align: center;
   z-index: 1;
}

a {
   display: inline-block;
   margin: 10px;
   position: absolute;
   z-index: 2; /* Ensure images are above the video background */
}

a img {
   width: 100px; /* Adjust image size as needed */
   height: auto;
   transition: transform 0.5s;
}

a:hover img {
   transform: rotate(5deg);
}

.shake:hover img {
   animation: shake 0.5s infinite alternate;
}

@keyframes shake {
   0% { transform: translateX(-5px); }
   100% { transform: translateX(5px); }
}

.link1 {
    position: absolute;
    top: 250px; 
    left: 60px; 
    color: white; 
    font-size: 40px;
    z-index: 2; 
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.link2 {
    position: absolute;
    top: 200px; 
    right: 150px; /* Adjust right position of link 2 as needed */
    color: white; /* Adjust link color as needed */
    font-size: 40px; 
    z-index: 2; 
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.link3 {
    position: absolute;
    bottom: 50px; /* Adjust bottom position of link 3 as needed */
    left: 300px; /* Adjust left position of link 3 as needed */
    color: white; 
    font-size: 40px;
    z-index: 2; 
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.link4 {
    position: absolute;
    bottom: 200px; /* Adjust bottom position of link 4 as needed */
    right: 400px; /* Adjust right position of link 4 as needed */
    color: white; 
    font-size: 40px;
    z-index: 2; 
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.link5 {
    position: absolute;
    top: 50%; /* Adjust top position of link 5 as needed */
    left: 35%; /* Adjust left position of link 5 as needed */
    transform: translate(-50%, -50%);
    color: white; 
    font-size: 40px;
    z-index: 2; 
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white; 
    font-size: 40px;
    z-index: 2; 
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}