@media only screen and (max-width: 486px) {
  .responsive-sidebar-menu .sidebar-menu-inner {
    max-width: 250px;
  }
  /* .responsive-sidebar-menu .sidebar-menu-inner .menu-wrap p {
    font-size: xx-large;

    margin-left: -0.2rem;
  } */
  .my-projects {
    .allprojects {
      width: 108% !important;
      .project {
        padding: 0.7rem 0.3rem !important;
        margin: 1rem 0.4rem !important;
      }
    }
  }
}

@media only screen and (max-width: 413px) {
  .contact {
    h1 {
      font-size: x-large;
    }
    h2 {
      margin: 1rem 0rem;
      margin-top: 2rem;
    }
    p {
      margin-left: auto;
    }
    .contact-container {
      /* flex-direction: column;
      justify-content: center !important;
      align-items: center; */
      .left-contact {
        /* margin: 2rem 0rem; */
        max-width: 35%;
        overflow: hidden;
        .formmsg {
          width: auto;
        }
      }
      .right-contact {
        /* margin: 0 !important; */
        max-width: 42%;
        overflow: visible;
        .submit-btn {
          a {
            margin: 0;
            padding: 0.5rem;
            width: 7rem;
          }
        }
      }
    }
  }
}

/* ............................Media MAX 480.............................. */
@media only screen and (max-width: 570px) {
  .intro {
    .captions {
      margin-top: 0.5rem;
    }
    .about-heading {
      font-family: "Raleway", sans-serif;
    }
  }

  .container {
    display: none;
  }
  .mobile {
    display: block !important;
  }
  /* .contact {
    h1 {
      font-size: x-large;
    }
    h2 {
      margin: 1rem 0rem;
      margin-top: 2rem;
    }
    p {
      margin-left: auto;
    }
    .contact-container {
      
      .left-contact {
        margin: 2rem 0rem;
        .formmsg {
          width: auto;
        }
      }
      .right-contact {
        margin: 0;
      }
    }
  } */
}

/* ...............................Media Max 768..................................... */

@media only screen and (max-width: 768px) {
  .intro {
    h3 {
      font-size: large;
    }

    h2 {
      font-size: medium;
    }
  }
  main {
    width: 85%;
  }
  .bgtext {
    display: none;
  }
  .mobile {
    display: none;
  }

  /* ..............................For Servces Page.............................................. */
  .services {
    h1 {
      margin-bottom: 2rem;
      font-size: x-large;
    }
    .q1 {
      line-height: 1.5rem;
      margin: 1rem 0.3rem;
      h2 {
        font-size: medium;
      }
      p {
        font-size: medium;
        line-height: 1.5rem;
      }
    }
  }
  .main-footer {
    .footer {
      .f-services {
        h2 {
          font-size: large;
        }
        a {
          font-size: large;
        }
      }
      .footer-icons i {
        font-size: 1rem;
      }
    }
  }
  h2 {
    font-size: large;
  }

  /* ..............................For About Page................................................. */
  .myselft-main {
    /* width: 130%; */
    margin: 1rem 0rem;
    .introduction {
      h1 {
        font-size: xx-large;
      }
      p {
        padding: 1rem;
      }
    }
    .myEducations,
    .myExperience,
    .myTrainings,
    .myResume {
      margin: 1rem 0rem;
      h1 {
        font-size: x-large;
        font-family: "Raleway", sans-serif;
      }
      h2 {
        font-weight: 500;
        font-size: large;
        font-family: "Raleway", sans-serif;
        font-weight: normal;
      }
    }
    .myExperience {
      .company {
        p {
          margin-top: rem;
        }
        h3 {
          font-size: large;
        }
      }
    }
    .mySkills {
      margin: 1rem 0rem;
      h1 {
        font-size: x-large;
      }
      .main-skills {
        .technology {
          h3 {
            font-size: large;
          }
        }
      }
    }
  }
  /*....................................... For Projects or work ...................................*/

  .my-projects {
    .main-work {
      .work-right-img {
        display: none;
      }
    }
  }
  /* ........................................Contact Page................................. */
  .contact {
    h1 {
      font-size: x-large;
    }
    h2 {
      margin: 1rem 0rem;
      margin-top: 2rem;
    }
    p {
      margin-left: auto;
    }
    .contact-container {
      justify-content: space-around;
      .left-contact {
        margin: 2rem 0rem;
        .formmsg {
          width: auto;
        }
      }
      .right-contact {
        /* margin: 0; */
        margin: 2rem 0rem;
      }
    }
  }
  /* ............................Why Me.............................................. */
  .why-me {
    h1 {
      font-size: x-large;
      margin-bottom: 1.5rem;
    }
    p {
      font-size: medium;
      line-height: 1.5rem;
    }
  }
  /* Projects.............. */
  .my-projects {
    .allprojects {
      justify-content: center;
      width: 100%;
      margin: 0;
      .project {
        width: 9rem;
        padding: 1rem;
        img {
          width: 8rem;
        }
        :nth-child(2) {
          font-size: small;
        }
        :nth-child(3) {
          font-size: small;
        }
      }
    }
  }
}

@media only screen and (min-width: 769px) {
  /* tablets and desktop */
  /*....................................... For Projects or work ...................................*/
  .mobile {
    display: none;
  }
  .my-projects {
    .main-work {
      .work-left-description {
        p {
          font-size: large;
        }
      }
      .work-right-img {
        display: none;
      }
    }
  }
  /* ........................... */
  .contact {
    h2 {
      margin: 1rem 0rem;
      margin-top: 2rem;
    }
    p {
      margin-left: auto;
    }
    .contact-container {
      justify-content: space-around;
      .left-contact {
        margin: 2rem 0rem;
        .formmsg {
          width: auto;
        }
      }
      .right-contact {
        margin: 2rem 0rem;
      }
    }
  }
}