/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */
background-image {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
	
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
	
  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;
}

@media screen and (max-width: 1024px) { /* Specific to this particular image */
  background-image {
    left: 50%;
    margin-left: -512px;   /* 50% */
  }
}

/* 1. Regular */
@font-face {
  font-family: 'OpenDyslexic';
  src: url('/font/OpenDyslexic-Regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

/* 2. Bold */
@font-face {
  font-family: 'OpenDyslexic';
  src: url('/font/OpenDyslexic-Bold.otf') format('opentype');
  font-weight: bold;
  font-style: normal;
}

/* 3. Italic */
@font-face {
  font-family: 'OpenDyslexic';
  src: url('/font/OpenDyslexic-Italic.otf') format('opentype');
  font-weight: normal;
  font-style: italic;
}

/* 4. Bold Italic */
@font-face {
  font-family: 'OpenDyslexic';
  src: url('/font/OpenDyslexic-BoldItalic.otf') format('opentype');
  font-weight: bold;
  font-style: italic;
}

body {
  background-image:url("https://c4.wallpaperflare.com/wallpaper/365/667/633/camouflage-abstract-wallpaper-preview.jpg");
  background-position:center;
	background-size:cover;
  background-color: black;
  color: white;
  font-family: 'OpenDyslexic', sans-serif;
  background-repeat: no-repeat;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Safari, Chrome, Edge (Chromium) */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* Internet Explorer/Edge */
  user-select: none;           /* Standard syntax */
}

.connections * {
    text-decoration: none;
}

.connections img {
    width: 32px;
}

.badges * {
    text-decoration: none;
}

.badges img {
    width: 100px;
}

 a {
            color: gray; /* Change this to your desired color */
            text-decoration: none; /* Remove underline */
        }

        /* Visited link color */
        a:visited {
            color: gray; /* Change this to your desired color */
        }

        /* Hover state color */
        a:hover {
            color: gray; /* Change this to your desired color */
        }

        /* Active state color */
        a:active {
            color: gray; /* Change this to your desired color */
        } 
        
.Nav-Bar {
  position: sticky;
  top: 0; /* Stick to the top of the viewport */
  background-color: black; /* Optional: Add a background */
  padding: 10px; /* Optional: Add padding */
  z-index: 10; /* Optional: Ensure it stays on top of other content */