* {
  font-size: 32px;
  font-family: Arial, sans-serif;
}

.my-margin-top {
    margin-top: 8px;
}

/* Place the navbar at the bottom of the page, and make it stick */
.navbar {
  background-color: #333;
  overflow: hidden;
  position: fixed;
  bottom: 0;
  width: 100%;
}

/* Style the links inside the navigation bar */
.navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 6px 6px;
  text-decoration: none;
  font-size: 0.5em;
}

/* Change the color of links on hover */
.navbar a:hover {
  background-color: #ddd;
  color: black;
}

/* Add a color to the active/current link */
.navbar a.active {
  background-color: #04AA6D;
  color: white;
}

.myprofile-width {
  display: inline-block;
  width: 50%; /* 300px; /* Set a fixed width in pixels */
}

/* Alternatively, for responsiveness */
.responsive-image {
  display: inline-block;
  max-width: 100%; /* Ensures image doesn't exceed its container */
  height: auto;    /* Maintains aspect ratio */
}


/* Portrait and Landscape */
@media only screen 
  and (min-width: 330px) 
/*  and (max-device-width: 812px) 
#  and (-webkit-min-device-pixel-ratio: 3)
*/
{ 
    * {
      font-size: 24px;
    }
    .myprofile-width {
      display: inline-block;
      width: 100% /* 300px; /* Set a fixed width in pixels */
    }
    .navbar {
      font-size: 2.5em;
    }
}

/* Portrait */
@media only screen 
  and (min-width: 770px) 
/*  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
*/  and (orientation: portrait) 
{ 
    * {
      font-size: 64px;
    }
    .myprofile-width {
      display: inline-block;
      width: 300px; /* Set a fixed width in pixels */
    }
}

/* Landscape */
@media only screen 
  and (min-width: 770px) 
/*  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
*/  and (orientation: landscape)
{ 
    * {
      font-size: 64px;
    }
}

/* Desktop Styles */
/* Large devices (laptops/desktops, 992px and up) */
@media only screen 
  and (min-width: 992px) 
{
    * {
      font-size: 32px;
    }
    .myprofile-width {
      display: inline-block;
      width: 300px; /* Set a fixed width in pixels */
    }
}

