body { margin: 0;
     box-sizing: border-box; 
    } 
    
     .header 
     { display: flex; 
      justify-content: space-between; 
      align-items: center; 
      background-color: #f5f5f5; 
      } 
 .header .logo {
 font-size: 25px;
  font-family: 'Sriracha', cursive; 
 color: #000;
   text-decoration: none; 
     margin-left: 30px; 
     } 
 .nav-items {
     display: flex;
     justify-content: space-around; 
    align-items: center;
     background-color: #f5f5f5;
    margin-right: 20px;
     } 
     .nav-items a{ 
     text-decoration: none;
     color: #000; 
     padding: 35px 20px; 
     } 
    
     .intro {
     display: flex;
     flex-direction: column; 
  justify-content: center; 
     align-items: center;
 width: 100%; 
 height: 520px; 
     background:url(image/pexels-mareklevak-2265488.jpg);
     
 background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     } 
     .intro h1 {
     font-family: sans-serif; 
     font-size: 60px;
     color:#333333; 
     font-weight: bold;
     text-transform: uppercase;
     margin:0;
    } 
.intro p {
 font-size: 20px; 
 color:#333333;
  text-transform: uppercase;
   margin: 20px 0;
    }
 .intro button {
  background-color:#eeeeee;
   color: #000;
 padding: 10px 25px;
  border: none;
   border-radius: 5px;
 font-size: 20px;
  font-weight: bold;
   cursor: pointer;
    box-shadow: 0px 0px 20px rgba(255, 255, 255, 0.4)
 }
    
 .achievements {
  display: flex;
   justify-content: space-around;
    align-items: center;
     padding: 40px 80px;
      }
      .achievements .work {
       display: flex;
 flex-direction: column;
  justify-content: center;
   align-items: center;
padding: 0 40px;
     } 
.achievements .work i {
 width: fit-content;
  font-size: 50px;
   color: #333333; 
border-radius: 50%;
 border: 2px solid #333333;
  padding: 12px;
 }
   .achievements .work .work-heading { 
   font-size: 20px;
    color: #333333; 
text-transform: uppercase; 
margin: 10px 0;
 } 
.achievements .work .work-text {
 font-size: 15px;
  color: #585858;
   margin: 10px 0;
    } 
.about-me {
 display: flex; 
 justify-content: center;
  align-items: center;
   padding: 40px 80px; 
   border-top: 2px solid #eeeeee;
    } 
.about-me img { 
width: 500px;
 max-width: 100%; 
 height: auto;
  border-radius: 10px;
   }
  .about-me-text h2 {
   font-size: 30px;
    color: #333333;
     text-transform: uppercase;
      margin: 0;
       } 
.about-me-text p { 
font-size: 15px;
color: #585858; 
margin: 10px 0;
 }
 
 .footer {
     display: flex;
     justify-content: space-between;
      align-items: center; 
      background-color: #302f49;
       padding: 40px 80px;
     } 
     .footer .copy { 
        color: #fff;
     } 
    .bottom-links {
         display: flex; 
         justify-content: space-around;
         align-items: center;
          padding: 40px 0; 
        } 
.bottom-links .links { 
display: flex;
 flex-direction: column;
justify-content: center;
align-items: center; 
padding: 0 40px;
 } 
     .bottom-links .links span {
         font-size: 20px;
          color: #fff;
           text-transform: uppercase;
            margin: 10px 0;
         } 
         .bottom-links .links a { 
            text-decoration: none;
             color: #a1a1a1; 
             padding: 10px 20px;
             }