main.css

@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
/*here*/

body{
    background-image: url(./assets/wallpaperbetter.jpg);
    text-align: center;
    background-size: cover;
    font-family: 'Roboto', sans-serif;
    overflow: hidden;
}
svg {
  position: relative;
  top: 50%;
  margin-top: -60px;
  left: 30%;
  margin-left: -225px;
}   

.name-sec{
  position: fixed;
  top: 25%;
  left: 22%;
    
}


.motive{
  position: fixed;
  top: 35%;
  left: 37%;
    font-size: 40px;
    color: black;
}


  .container {
    position: fixed;
    top: 40%;
    left: 37%;
    }
  .btn-outline { 
   margin-top: 15px; 
   border: solid 2px black;    
   font-size: 24px; 
   color: black; 
   background: 0 0; 
   transition: all .3s ease-in-out; 
  }
  .btn-outline:hover, .btn-outline:focus, .btn-outline:active, .btn-outline.active { 
    border: solid 1px whitesmoke;    
    color: whitesmoke; 
    
  }

 
  
  .btn-social { 
    display: flex;
    align-items:center;
    justify-content: center; 
    width: 58px; 
    height: 58px; 
    border: 2px solid black; 
    border-radius: 150%; 
    text-align: center; 
    font-size: 24px; 
    line-height: 46px; 
    font-size: 35px;

  }
 

  .list-inline { 
    padding-left: 0; 
    list-style: none; 
    margin-left: -5px; }
  
  .list-inline > li { 
    display: inline-block;  
    padding-left: 5px; 
    padding-right: 5px; 
  }
  
  .social-links { 
    -webkit-animation: fade-in-down 0.9s; 
    animation: fade-in-down 0.9s; 
    -webkit-animation-delay: 0.2s; 
    animation-delay: 0.2s; 
  }
  
  /* Animations */
  @-webkit-keyframes fade-in-down { 0% 
    { opacity: 0; -webkit-transform: translateY(-10px); transform: translateY(-10px); 
    }
    100% { 
      opacity: 1; 
      -webkit-transform: translateY(0); 
      transform: translateY(0); } }
  @keyframes fade-in-down { 
    0% { opacity: 0; 
      -webkit-transform: translateY(-10px); 
      transform: translateY(-10px); 
    }
    100% { opacity: 1; 
      -webkit-transform: translateY(0); 
      transform: translateY(0); 
    } 
  }