html,
      body {
          height: 100%;
          margin: 0;
          padding: 0;
          display: flex;
          flex-direction: column;
      }

      main {
          flex-grow: 1;
      }

      .bg-blue {
          background-image: linear-gradient(25deg,
                  #002e5d,
                  #2774ae 30%,
                  #2774ae 70%,
                  #0c8996);
      }

      .text-darkgrey {
          color: darkgrey;
      }

      .border-orange {
          --bs-border-opacity: 1;
          border-color: orange;
      }

      .tech-logo {
          width: 100%;
      }

      @media (min-width: 768px) {
          .tech-logo-md-30 {
              width: 30%;
          }

          .tech-logo-md-60 {
              width: 60%;
          }
      }

      .social {
          font-size: 3rem;
          color: #fff;
          border-radius: 0.75rem;
          padding: 0.5rem;
          box-shadow: none;
          text-shadow: none;
      }

      .social:hover {
          transition-duration: 0.3s;
      }

      .invert-colors {
          filter: invert(1);
      }

      .mkblue {
          color: dodgerblue;
          font-weight: bold;
      }

      #stackoverflow {
          background-color: #f48024;
      }

      #stackoverflow:hover {
          box-shadow: 0 0 10px #fcb800, 0 0 20px #fcb800, 0 0 30px #fcb800,
              0 0 40px #fcb800, inset 2px 2px 10px #fcb80080,
              inset 2px 2px 10px #fcb80080, inset 2px 2px 10px #fcb80080;
      }

      #github {
          background-color: #474747;
      }

      #github:hover {
          box-shadow: 0 0 10px #af69ee, 0 0 20px #af69ee, 0 0 30px #af69ee,
              0 0 40px #af69ee, inset 2px 2px 10px #af69ee80,
              inset 2px 2px 10px #af69ee80, inset 2px 2px 10px #af69ee80;
      }

      #linkedin {
          background-color: dodgerblue;
      }

      #linkedin:hover {
          box-shadow: 0 0 10px #008cff80, 0 0 20px #008cff80, 0 0 30px #008cff80,
              0 0 40px #008cff80, inset 2px 2px 10px #008cff80,
              inset 2px 2px 10px #008cff80, inset 2px 2px 10px #008cff80;
      }

      #email {
          background-color: lightblue;
      }

      #email:hover {
          box-shadow: 0 0 10px #c1dbff, 0 0 20px #c1dbff, 0 0 30px #c1dbff,
              0 0 40px #c1dbff, inset 2px 2px 10px #c1dbff80,
              inset 2px 2px 10px #c1dbff80, inset 2px 2px 10px #c1dbff80;
      }

      #phone {
          background-color: forestgreen;
      }

      #phone:hover {
          box-shadow: 0 0 10px limegreen, 0 0 20px limegreen, 0 0 30px limegreen,
              0 0 40px limegreen, inset 2px 2px 10px limegreen,
              inset 2px 2px 10px limegreen, inset 2px 2px 10px limegreen;
      }