/* Media Queries */
  @media screen and (max-width: 993px){
    .nav-toggle{
        display: block;
        margin-right: 20px;
    }
    .headings h1, h2{
        font-size: 1.85rem;
    }
}
@media screen and (max-width: 768px){
  .header-section{
    
  }
  .about-right p{
    font-size: 0.60rem;
  }
  .about-left img{
    width: 250px;
  }
  .about-section{
    gap: 12px;
  }
  .btn{
    margin-left: 223px;
  }
  .skills-section {
    padding: 50px 19px 30px 67px;
    justify-content: center;
    display: grid;
    grid-template-columns: auto auto auto;
    column-gap: 23px;
    row-gap: 50px;
}
.skills-card {
    flex-direction: column;
    gap: 20px;
    max-width: 39%;
    text-align: center;
}
.skills-section img {
    width: 155px;
}
.contact-section{
    width: 100%;
    margin: 30px auto;
    background-color: #fff;
  }
  .contact-left {
    flex-basis: 70%;
    padding: 0px 4px;
}
.contact-right{
  padding: 25px;
}
.contact-right h3 {
  font-weight: 600;
  margin-bottom: 4px;
}
.headre-left h2{
font-size: 22px;
}
.headre-left{
  width: 600px;
}
.headre-left h2 span{
  font-size: 22px;
}
.headre-left p{
  font-size: 22px;
}
.header-right img{
  width: 50%;
  margin-left: 100px;
}
.header-section{
  display: flex;
  justify-content: center;
 
}
}
@media screen and (max-width: 478px){
  .header-section{
    
  }
  .about-right {
    padding: 1px 32px;
    max-width: 100%;
}
  .about-right p{
    font-size: 18px;
  }
  .about-left img{
    width: 180px;
  }
  .about-section{
    gap: 12px;
    flex-direction: column;
  }
  .btn{
    margin-left: 50px;
  }
  .skills-section {
    padding: 50px 19px 30px 67px;
    justify-content: center;
    display: grid;
    grid-template-columns: auto auto auto;
    column-gap: 23px;
    row-gap: 50px;
}
.skills-card {
    flex-direction: column;
    gap: 20px;
    max-width: 39%;
    text-align: center;
}
.skills-section img {
    width: 155px;
}
.contact-section{
    width: 100%;
    margin: 30px auto;
    background-color: #fff;
  }
  .contact-left {
    flex-basis: 70%;
    padding: 0px 4px;
}
.contact-right{
  padding: 25px;
}
.contact-right h3 {
  font-weight: 600;
  margin-bottom: 4px;
}
.headre-left h2{
font-size: 17px;
}
.headre-left{
  width: 600px;
}
.headre-left h2 span{
  font-size: 20px;
}
.headre-left p{
  font-size: 10px;
}
.header-right img {
  width: 121%;
  margin-left: -8px;
}
.header-section{
  display: flex;
  justify-content: center;
 
}
.headings h1{
  font-size: 22px;
}
.headings h2{
  font-size: 22px;
}
}