/* 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." */

      
      body {
        background-image: url(https://t3.ftcdn.net/jpg/02/72/27/36/360_F_272273647_qLVFGVwoWq4RKCXLIfJWO8x0fzCHLbd1.jpg);
        background-size:15%;
        background-repeat: repeat;
        color: white;
        font-family: "Times New Roman", Times, serif;
        font-style: normal;
        margin-top: 3em;
        margin-bottom: 3em;
      }
      
      h1{
        margin:10px;
      }
      
      a{
        color:white;
      }
      
      a:visited {
  color: red;
}
      
      .myButton{
        background-color: #cccccc;
        border-left: 5px solid white;
        border-top: 5px solid white;
        border-right:5px solid black;
        border-bottom:5px solid black;
      }
      
      
      .mainBody{
        background-image: linear-gradient(#c2a19f, #babddb, #636794);
        border-style: solid;
        border-color: #807f8a;
        text-align: center; 
        color:black;
        
        margin: 50px 0px
      }
      
      .about{
      margin:75px 20px 20px 20px;  
        
      
      }
      
      .my-ad {
        margin: 30px;
        position: sticky;
        top: 112px;
        width:100%;
      }
      
      .my-ad img {
    max-width: 80%; /* Adjust image width */
    cursor: pointer; /* Apply cursor style */
}
      
      
      .topnav {
        overflow: hidden;
         font-family: "Handjet", sans-serif;
        background-color: #cccccc;
        margin:5px;
        border-left: 5px solid white;
        border-top: 5px solid white;
        border-right:5px solid black;
        border-bottom:5px solid black;
        
      }
      
      
        .border-crossing {
    margin: auto;
    
  }
      
      
      .topnav a {
        float: left;
        display: block;
        color: black;
        margin: auto;
        border-top: 5px solid white;
        border-left: 5px solid white;
        border-right:5px solid black;
        border-bottom:5px solid black;
        text-align: center;
       
        padding: 14px 16px;
        text-decoration: none;
        
        
      }
      
      .topnav a:hover {
        background-color: #8c8c8c;
        color: black;
      }
      .newButton a{
        color:black;
        padding:20px;
        background-color: #cccccc;
        border-left: 5px solid white;
        border-top: 5px solid white;
        border-right:5px solid black;
        border-bottom:5px solid black;
      }
      
      .newButton a:hover{
        background-color: #8c8c8c;
      }


      /* Align image to left */
      .project {
          display: flex;
          align-items: flex-start; /* Align items to the top */
          margin: 20px 0;
         
      }
      
      .project img {
         display: block; /* Prevents inline spacing issues */
          width: 350px; /* Responsive image */
          height: 350px; /* Preserve aspect ratio */
          margin: 10px; /* Optional: Add vertical spacing */
          object-fit: cover;
          margin-right: 25px; /* Space between image and text */
        
          
      }
      
      
      
      .project .project-text {
  display: flex;
  flex-direction: column; /* Stack elements vertically */
  align-items: flex-start;
  text-align: left;
  margin:0px 80px 0px 0px;
}


    .project .project-text p{
      font-size:18pt;
    }

      
      .project a{
        margin-top:30px;
        font-size: 35pt;
        text-decoration: underline;
        
      }
      
      
      
      
      .clearfix::after {
  content: "";
  clear: both;
  display: table;
}