/*Big Size Screens*/
/* small Screens & tablets & Smart phone */
@media (max-width: 991px) {
  .header .nav .list {
    display: none;
  }
  .navigation__icon {
    margin-top: 14px;
  }
  .navigation__button, .navigation__nav {
    display: block;
  }
  .navigation__icon,
  .navigation__icon::before,
  .navigation__icon::after {
    width: 20px;
  }
  .navigation__link:link,
  .navigation__link:visited {
    font-size: 25px;
  }
  .navigation__background {
    top: 37px;
    right: 23px;
    height: 30px;
    width: 19px;
  }
  .navigation__button {
    top: 31px;
    right: 15px;
    height: 40px;
    width: 40px;
  }
  .top-section .title p {
    font-size: 35px;
  }
  .top-section .title h2 {
    font-size: 35px;
  }
  .top-section .title span {
    font-size: 25px;
  }
  .aboutMe .pic {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .aboutMe .pic::before {
    display: none;
  }
}

/* Small Screens */
/* Mobile & Tablets */
@media (max-width: 767px) {
  .top-section .title p {
    font-size: 25px;
  }
  .top-section .title .typewriter-effect {
    font-size: 25px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .top-section .title span {
    font-size: 15px;
  }
  .Experience .section .card, .Experience .section h4 {
    padding-left: 55px !important;
  }
  .Experience .section .card .info, .Experience .section h4 .info {
    padding-left: 25px;
  }
  .Skills .flex-wrapper .single-chart {
    width: 25%;
  }
}

/* Tablets */
@media (min-width: 480px) and (max-width: 767px) {
  .header .nav .logo::before {
    content: "<";
    position: absolute;
    color: #64FFDA !important;
    left: 30px;
    top: -10px;
    font-size: 40px;
  }
  .header .nav .logo h2 {
    font-size: 30px;
    padding-left: 55px !important;
  }
  .top-section .title {
    text-align: center;
  }
  .top-section .title p {
    font-size: 35px;
  }
  .top-section .title h2 {
    font-size: 35px;
  }
  .top-section .title span {
    font-size: 25px;
  }
  .top-section .social {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .top-section .img {
    display: none;
  }
  .aboutMe .title, .Skills .title, .Experience .title, .project .title, .Contact .title {
    padding-left: 39px;
  }
  .aboutMe .title::before {
    left: 10px;
  }
  .aboutMe .title::after {
    left: 188px;
  }
  .Skills .title::before {
    left: 10px;
  }
  .Skills .title::after {
    left: 188px;
  }
  .Experience .title::before {
    left: 10px;
  }
  .Experience .title::after {
    left: 200px;
  }
  .project .title::before {
    left: 10px;
  }
  .project .title::after {
    left: 160px;
  }
  .Contact .title::before {
    left: 10px;
  }
  .Contact .title::after {
    left: 160px;
  }
}

/* Mobile */
@media (max-width: 479px) {
  .top-section .title {
    text-align: center;
  }
  .top-section .title p {
    font-size: 35px;
  }
  .top-section .title h2 {
    font-size: 35px;
  }
  .top-section .title span {
    font-size: 25px;
  }
  .top-section .social {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .top-section .img {
    display: none;
  }
  .header .nav .logo::before {
    left: 9px !important;
    top: -13px !important;
  }
  .header .nav .logo::after {
    left: 238px;
    top: -5px !important;
    font-size: 30px !important;
  }
  .header .nav .logo h2 {
    font-size: 25px;
    padding-left: 40px !important;
  }
  .navigation__background {
    top: 33px;
    right: 21px;
    height: 30px;
    width: 19px;
  }
  .navigation__button {
    top: 28px;
    right: 15px;
    height: 40px;
    width: 40px;
  }
  audio,
  canvas,
  progress,
  video {
    width: 100%;
  }
  .aboutMe .title, .Skills .title, .Experience .title, .project .title, .Contact .title {
    padding-left: 45px;
  }
  .aboutMe .title::before {
    left: 10px;
  }
  .aboutMe .title::after {
    left: 188px;
  }
  .Skills .title::before {
    left: 10px;
  }
  .Skills .title::after {
    left: 188px;
  }
  .Experience .title::before {
    left: 10px;
  }
  .Experience .title::after {
    left: 200px;
  }
  .project .title::before {
    left: 10px;
  }
  .project .title::after {
    left: 160px;
  }
  .Contact .title::before {
    left: 10px;
  }
  .Contact .title::after {
    left: 160px;
  }
}
/*# sourceMappingURL=responisve.css.map */