/*phone*/
@media all and (max-width: 768px) {
 body{
    
    padding: 0;
    margin: 0;
    width: 100%;
    align-items: center;
    justify-content: center;
 }
 .wrapper{
    
     width: 100%;
     padding: 0;
     margin: 0;
   
 }
 
 main{
    width: 100%;
    justify-content: center;
    align-items: center;
 }
 header{
    
    background: #161616;
    height: 60px;
    top: 0;
    
 }
 nav{
    display: flex;
    justify-content: center;
    align-items: center;
 }
 .nav-container{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    

    top: 0;
    position: fixed;
    
    background: #161616;
    height: 50px;
    width:97%;
    border-radius: 25px;
    border: 1px solid #888686ac;

   
    
 }
 .logo{
    margin-left: 10px;
 }
 .sec-nav a{
    margin-right: 3px;
 }
 .container{
   justify-content: center;
   align-items: center;
    justify-content: center;
    width: 99%;
    flex-direction: column;
 }
 .left-col,.right-col{
    display: flex;
    flex-direction: column;
  
   align-items: center;
    width: 94%;
    height: 100rem;
   
 }
 .right-col{
    margin-top: -390px;
 }
 .left-upper,.left-bottom,.right-center,.right-bottom{
    
   
    align-items: center;
    width: 98%;
    height: 270px;
    
    
}
.seo{
    height: 320px;
}
.left-bottom2{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.right-upper{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.right-upper-row{
    width: 99%;
    
}.bout-sect{
    height: 300px;
}
.about-sect{
    gap: 3rem;
}
.right-upper-row{
    width: 95%;
}
.social-btn{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-left: 10px;
    margin-top: 15px;
}
.brand-arrow{
    display: none;
}
.social-btn{
    
}
.tsup{
    display: none;
}
.resume-sect p{
    margin-top: -6px;
    font-size: 15px;
}
.project p{
    font-size: 16px;
}
.project button{
    margin-top: 25px;
    height: 45px;
}
.collabs{}
.name h3{
    
    white-space: nowrap;
    font-size: 32px;
}
.name p{
    font-size: 20px;
}
.left-center{
    justify-content: space-between;
    align-items: center;
    
    flex-direction: row;
    width: 98%;
}
.left-center-row{
    width: 50%;
    height: 190px;
}
.project-header{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.project-cover{
    background-size: 150%;
    width: 93%;
    
    height: 70%;
    
}
.github{
    padding: 0;
}
.github-count{
    margin-left: 16px;
}
.git-sect{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  
}
.git-arrow{
    margin-right: 16px;
    margin-top: -50px;
}
.git-txt{
    margin-left: 16px;
    width:90%;
    margin-top: -20px;
}
.git-txt p{
    font-size: 14px;
}
.git-txt h3{
    font-size: 20px;
}
.my-skills{
    width: 97%;
}
.skills-arrow{
    display: none;
}
.brand-sect1{
   margin-left: -25px;
}
.brand-sect2{
    
}
.contact-info h3{
  white-space: nowrap;
  font-size: 20px;
}
.contact{
    gap: 0px;
}
.contact-info h2{
    white-space: nowrap;
    font-size: 32px;
}
.brand-txt p{
    white-space: nowrap;
}
.brand{
    gap: 5px;
}
.footer{
    width: 80%;
    margin-top: 0px;
}
.footer-nav{
    gap: 0px;
    display: inline;
}
.footer-nav .logo{
    display: none;
}
.footer-links{
    
}
.footer-links ul{
    align-items: center;
}
.footer-links ul li{
    
    margin: 10px;
}
.social-links{
    width: 280px;
    justify-content: center;
    
}
.social-links li{
    gap: 2px;
    margin: 12px;
}
.footer-bottom{
    width: 100%;
}
.left-bottom1{
    width: 95%;
    display: flex;
    flex-direction: column;
}
.right-bottom1{
    width: 98%;
}
.contact-arrow{
    display: none;
}
.productivity{
    
    width: 98%;
}
.tools{
    margin-left: 30px;
}
#toolicons{
    width: 50px;
    height: 50px;
}
.toolicon{
    margin-left: 25px;
    gap: 10px;
}
.does{
    width: 100%;
    display: flex;
    flex-direction: row;
   align-items: center;
   justify-content: center;
    
}
#dorow{
    width: 45%;
}
}