img { 
    display: block;
    border-radius: 10px;
    z-index:0;
    justify-content: center;
    width: 20%;
    margin-right: 50px;
    margin-left: 40%;
  }
  
    img:hover {
      filter: blur(0px);
    }
  
  
  
   
   body,html {
      background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    margin: 0;
    width: 100vw;
    height: 100vh;
    font-family: 'Garamond'
  }
  
    
    .topnav {
      position: relative;
      overflow: hidden;
    }
    
    .topnav a {
      float: left;
      color: #8d8d8d;
      text-align: center;
      padding: 14px 16px;
      text-decoration: none;
      font-size: 25px;
    }
    
    .topnav a:hover {
      color: rgb(16, 131, 255);
    }
  
    
    .topnav a.active {
      color: rgb(0, 0, 0);
    }
    
    .topnav-centered a {
      float: none;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
    
    .topnav-right {
      float: right;
    }
    
    @media screen and (max-width: 600px) {
      .topnav a, .topnav-right {
        float: none;
        display: block;
      }
      
      .topnav-centered a {
        position: relative;
        top: 0;
        left: 0;
        transform: none;
      }
    }
      .topnav.responsive a {
        float: center;
        display: block;
        text-align: left;
      } 
     
      ul {
        list-style-type: none;
        margin-left: 0px;
        margin-top: 60px;
        padding: 0;
        width: 25%;
        height: 100%; /* Full height */
        position:  absolute; /* Make it stick, even on scroll */
        overflow: auto; /* Enable scrolling if the sidenav has too much content */
        text-align: right;
      }
      li a {
        color: #8d8d8d;
        padding: 8px 16px;
        text-decoration: none;
        font-style: oblique;
      }
      
      li a.active {
        color: rgb(0, 0, 0);
        text-decoration: underline;
        font-size: large;
      }
      
      li a:hover:not(.active) {
        color: rgb(16, 131, 255);
      }
      .newspaper {
        column-count: 3;
        max-width: 80%;
        margin-right: auto;
        font-family: 'Roboto', sans-serif;
        font-size: small;
      }
      .row {
        display: flex;
        flex-wrap: wrap;
        padding: 0 4px;
        margin-top: 40px;
      }
      
      /* Create four equal columns that sits next to each other */
      .column {
        flex: 25%;
        max-width: 25%;
        padding: 0 4px;
      }
      
      .column img {
        margin-top: 8px;
        vertical-align: middle;
        width: 100%;
      }
      
      /* Responsive layout - makes a two column-layout instead of four columns */
      @media screen and (max-width: 800px) {
        .column {
          flex: 50%;
          max-width: 50%;
        }
      }
      
      /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
      @media screen and (max-width: 600px) {
        .column {
          flex: 100%;
          max-width: 100%;
        }
      }
      
      .ul-divider {
        border-left: 1px solid rgb(0, 0, 0);
        height: 10%;
        position: absolute;
        left: 25%; /* Adjust this value as needed */
        top: 120px;
      }

      .logo {
        position: fixed;
        top: 410px;
        left: 200px;
        z-index: 9999;
        width: 15%;
      }

      .contact-info {
        margin-top: 30px;
      }
      
      .contact-info ul {
        list-style-type: none;
        margin-left: 0;
        margin-top: 10px;
        padding: 0;
        width: 100%;
        text-align: left;
      }
      
      .contact-info li {
        margin-bottom: 10px;
      }
      
      .social-media {
        margin-top: 30px;
      }
      
      .social-media ul {
        list-style-type: none;
        margin-left: 0;
        margin-top: 10px;
        padding: 0;
        width: 100%;
        text-align: left;
      }
      
      .social-media li {
        margin-bottom: 10px;
      }
      
      .social-media a {
        color: #000000;
        text-decoration: none;
      }
      
      
      .social-media-icons {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-top: 20px;
    }
    
    .social-media-item {
        display: flex;
        align-items: center;
        margin-right: 30px;
    }
    
    .social-media-item img {
        width: 40px;
        height: 40px;
        margin-right: 10px;
        margin-left: 0px;
    }
    
    .social-media-item a {
        display: flex;
        align-items: center;
        text-decoration: none;
        color: #000000;
    }
    
    .social-media-item a:hover {
        color: rgb(0, 0, 0);
    }