@media screen and (max-width:767px) {

  article {
    margin-bottom: 0;
  }

  .right {
    text-align: center;
  }



  .main-wrapper01 {
    width: 95%;
  }

  .logo-menu {
    width: 100%;
    display: block;
    padding: 0;
  }

  .logo-menu-left {
    width: 40%;
    margin: 0 auto;
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 16vw;
  }

  .logo-menu-right {
    width: 100%;
    display: block;
  }



  aside.scroll {
    height: 23vw;
  }

  aside.scroll .logo-menu-left {
    width: 30%;
    top: 12vw;
  }

  aside.scroll .logo-menu-right {
    width: 100%;
  }



  header {
    margin: 0 0 10vw 0;
  }

  .headers {
    margin: 10vw 0 0 0;
  }

  .headers figcaption {
    top: 25vw;
    width: 100%;
    text-align: center
  }

  .headers figcaption span {
    width: 100%;
    font-size: 3.5vw;
    margin: 0;
  }

  .headers figcaption h1 {
    width: 100%;
    font-size: 5vw;
    line-height: 5.5vw;
    margin: -2vw 0 0 0;
  }





  .about-bg {
    background-image: none;
  }

  .about-area {
    padding: 0 0 12vw 0;
  }

  .about-right {
    margin: 0;
  }

  .about-right h2 {
    font-size: 5.5vw;
    margin: 0 0 3vw 0;
  }

  .about-right p {
    font-size: 3.5vw;
    line-height: 5vw;
    margin: 0 0 3vw 0;
  }

  .button01 {
    padding: 0 4vw;
    height: 10vw;
    font-size: 3.5vw;
    margin: 0 auto;
    border-bottom: solid 1.5vw #f4f1ed;
  }

  .services-bg {
    padding: 12vw 0 8vw 0;
  }

  .services-area {
    width: 100%;
    display: block;
    font-size: 0;
    margin: 0 0 8vw 0;
  }



  .services-left {
    width: 100%;
    display: block;
    text-align: center;
  }

  .services-left span {
    font-size: 3vw;
    margin: 0 0 2vw 0;
  }

  .services-left h1 {
    font-size: 5.5vw;
    line-height: 6vw;
  }



  .services-right {
    width: 100%;
    display: block;
    position: static;
    right: auto;
    top: auto;
  }

  .services-box {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2vw;
    padding: 0 2vw;
  }

  .services-box figcaption {
    font-size: 3.8vw;
    top: 18vw;
    padding: 4vw 0;
  }

  .services-box figcaption span {
    font-size: 2.5vw;
    margin: 1vw 0 0 0;
  }

  .services-effect {
    box-shadow: rgba(251, 205, 136, 0) -5px 5px;
  }



  .button02 {
    padding: 0 4vw;
    height: 10vw;
    font-size: 3.5vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5vw;
    border-bottom: solid 1.5vw #f4f1ed;
  }



  .services-bg h2 {
    font-size: 4vw;
    line-height: 5.5vw;
    margin: 0 0 8vw 0;
  }

  .services-bg h3 {
    font-size: 5vw;
    line-height: 5.5vw;
    position: static;
    bottom: auto;
    left: auto;
    text-align: center;
  }



  .projects-slider {
    margin-bottom: 8vw;
  }

  .projects-slider figcaption {
    width: 100%;
    padding: 7vw 4vw 4vw 4vw;
    position: static;
    top: static;
    left: static;
    text-align: center;
  }

  .projects-slider figcaption h4 {
    font-size: 4.5vw;
    line-height: 5.5vw;
    margin: 0 0 2.5vw 0;
  }

  .projects-slider figcaption p {
    font-size: 3.8vw;
    line-height: 5vw;
    margin: 0 0 4vw 0;
  }

  .projects-slider figcaption span {
    font-size: 3.5vw;
    line-height: 4vw;
    margin: 0 0 4vw 0;
  }



  .phead01 {
    font-size: 5.5vw;
    margin: 0 0 8vw 0;
  }

  .phead01 span {
    font-size: 3vw;
    margin: 0 0 2vw 0;
  }

  .brands {
    margin: 7vw 0 32vw 0;
  }



  .team {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: -30vw;
  }

  .team-bg {
    padding: 12vw 0 8vw 0;
    margin-bottom: 12vw;
  }



  .team-member {
    display: block;
    width: 80%;
    margin: 0 auto;
    padding: 4vw 4vw 6vw 4vw;
  }

  .team-member figure {
    margin: 0 0 3vw 0;
  }

  .team-member figcaption h6 {
    font-size: 3.5vw;
  }

  .team-member figcaption h6 span {
    font-size: 3vw;
    margin: 1vw 0 3vw 0;
  }

  .team-member figcaption p {
    font-size: 3vw;
    line-height: 3.5vw;
    margin: 0 0 3vw 0;
  }

  .team-member figcaption strong {
    font-size: 3vw;
  }

  .stats {
    margin: 4vw 0 15vw 0;
  }



  .testimonial-bg-color {
    padding: 0 0 12vw 0;
    margin: 0 0 12vw 0;
  }

  .test-area-main {
    width: 100%;
    display: block;
    right: auto;
    top: auto;
    position: static;
  }



  .test-area {
    width: 95%;
    display: block;
    position: static;
    right: auto;
    top: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: -30vw;
  }

  .test-box {
    padding: 3vw 3vw 5vw 3vw;
    font-size: 3.5vw;
    line-height: 4.5vw;
  }

  .test-box figure {
    max-width: 40%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3vw;
  }

  .test-box p {
    margin: 0 0 4vw 0;
  }



  .news-area {
    width: 95%;
    margin-bottom: 12vw;
    margin-top: -3vw;
  }

  .news-area-box {
    width: 100%;
    margin: 0;
    display: block;
    padding: 3vw;
  }

  .news-area-box figure {
    margin: 0 0 3vw 0;
  }

  .news-area-box figcaption {
    padding: 3vw;
  }

  .news-area-box figcaption span {
    font-size: 3vw;
    margin: 0 0 3vw 0;
  }

  .news-area-box figcaption p {
    font-size: 3.5vw;
  }

  .news-area button {
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 2vw !important;
  }



  .contact-area {
    padding: 12vw 0 12vw 0;
  }

  .contact-area form {
    width: 95%;
    margin: 0 auto;
  }

  .contact-area input {
    width: 100%;
    font-size: 3vw;
    margin: 0 0 3vw 0;
    padding: 4vw;
    border-radius: 2vw;
  }

  .contact-area textarea {
    width: 100%;
    font-size: 3vw;
    margin: 0 0 2vw 0;
    padding: 4vw;
    border-radius: 2vw;
    display: block;
  }

  .contact-area button {
    display: block;
    padding: 0 4vw;
    height: 10vw;
    font-size: 3.5vw;
    margin: 0 auto;
    border-bottom: solid 1.5vw #fff;
  }



  .phead02 {
    font-size: 5.5vw;
    margin: 0 0 8vw 0;
  }

  .phead02 span {
    font-size: 3vw;
    margin: 0 0 2vw 0;
  }



  .map {
    border-top: solid 1vw #fff;
    border-bottom: solid 1vw #fff;
    height: 25vw;
  }

  footer {
    padding: 5vw 0 5vw 0;
  }

  .footer-left {
    width: 100%;
    display: block;
  }

  .footer-left h6 {
    font-size: 4vw;
    text-align: center;
  }

  .footer-right {
    width: 100%;
    display: block;
    text-align: center;
  }



  .footer-right h6 {
    font-size: 3.5vw;
    padding: 3vw 0 0 0;
  }

  .f-icon {
    margin: 0 2vw 0 0;
    font-size: 3vw !important;
  }

  .f-icon02 {
    margin: 0 2vw 0 4vw !important;
    font-size: 3vw !important;
  }

  .footer-hr {
    margin: 5vw 0 6vw 0;
  }



  .footer-left ul {
    margin: 0 0 6vw 0;
  }

  .footer-left li {
    font-size: 3vw;
    line-height: 5vw;
    text-align: center;
  }

     .footer-left li strong {
        margin: 0 0 1vw 0;
        font-size: 16px;
    }

  .footer-left li:nth-child(3) {
    padding: 0;
  }



  .footer-right p {
    margin: 0 0 3vw 0;
    font-size:18px;
  }

  .footer-right strong {
           font-size: 15px;
        margin-bottom: 6px;
    line-height: 3.5vw;
  }

    .footer-right span {
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 10px;
    }



  .footer-right button {
    padding: 3vw;
    font-size: 3vw;
    float: none;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
  }



  .footer-right i {
    margin: 0 3vw;
    font-size: 4vw;
  }

  .copyright {
    font-size: 13px;
    text-align: center;
    margin: 0 0 4vw 0;
  }

  .footer-last {
    margin: 6vw 0 0 0;
  }







  .headers-inside figure {
    display: block;
    height: auto;
  }

  .headers-inside figcaption {
    top: auto;
  }

  .headers-inside figcaption h1 {
    font-size: 6vw;
    margin: 5vw 0 0 0;
    position: static;
  }



  .main-wrapper-inside {
    width: 95%;
    padding: 0;
    position: static;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    z-index: auto;
  }

  .body-txt {
    display: block;
    font-size: 3.5vw;
    line-height: 5vw;
  }

  .body-txt p {
    margin: 0 0 5vw 0;
  }



  .pos {
    padding: 16vw 0 0 0;
    margin: 0;
  }



  .quote {
    margin: 6vw 0;
  }



  .about-boxes {
    width: 95%;
    margin: 0 auto;
    font-size: 0;
    text-align: center;
  }

  .about-boxes-left {
    width: 100%;
    display: block;
    margin: 0 0 7vw 0;
  }

  .about-boxes-right {
    width: 100%;
    display: block;
    margin: 0 0 7vw 0;
  }

  .about-boxes-left figcaption {
    width: 100%;
    margin: 5vw 0;
  }

  .about-boxes-right figcaption {
    width: 100%;
    margin: 5vw 0;
  }

  .phead03 {
    font-size: 5vw;
    margin: 0 0 4vw 0;
  }

  .about-pad {
    display: block;
    margin: 7vw 0;
    text-align: center;
  }





  .contact-inside {
    display: block;
    margin: 0 0 9vw 0;
  }

  .contact-inside li {
    width: 100%;
    display: block;
    padding: 0;
    border-right: none;
  }



  .phead04 {
    font-size: 5vw;
    margin: 0 0 3vw 0;
    text-align: center;
  }

  .phead05 {
    font-size: 3.8vw;
    margin: 0 0 3vw 0;
    text-align: center;
  }

  .phead06 {
    font-size: 3vw;
    margin: 0 0 3vw 0;
    text-align: center;
  }

  .contact-txt {
    font-size: 2.8vw;
    line-height: 3.4vw;
    margin: 0 0 8vw 0;
  }

  .contact-txt02 {
    font-size: 3vw;
    line-height: 3.6vw;
    margin: 0 0 8vw 0;
  }

  .c-icons {
    margin: 0 3vw 0 0;
    max-width: 5vw;
    height: auto;
  }



  .contact-inside label {
    font-size: 2.5vw;
    margin: 1% 0;
  }

  .contact-inside input {
    font-size: 2.8vw;
    margin: 0 0 8% 0;
    padding: 3vw 3vw 2vw 0;
  }

  .contact-inside textarea {
    font-size: 2.8vw;
    margin: 0 0 8% 0;
    padding: 3vw 3vw 2vw 0;
  }

  .contact-inside button {
    padding: 3vw;
    font-size: 3vw;
  }







  .projects-page {
    margin: 0 0 1vw 0;
  }

  .projects-page figcaption {
    width: 100%;
    padding: 7vw 4vw 4vw 4vw;
    position: static;
    top: static;
    left: static;
    text-align: center;
  }

  .projects-page figcaption h4 {
    font-size: 4.5vw;
    line-height: 5.5vw;
    margin: 0 0 2.5vw 0;
  }

  .projects-page figcaption p {
    font-size: 3.8vw;
    line-height: 5vw;
    margin: 0 0 4vw 0;
  }

  .projects-page figcaption span {
    font-size: 3.5vw;
    line-height: 4vw;
    margin: 0 0 4vw 0;
  }



  .projects-page02 {
    margin: 0 0 1vw 0;
  }

  .projects-page02 figcaption {
    width: 100%;
    padding: 7vw 4vw 4vw 4vw;
    position: static;
    top: static;
    left: static;
    text-align: center;
  }

  .projects-page02 figcaption h4 {
    font-size: 4.5vw;
    line-height: 5.5vw;
    margin: 0 0 2.5vw 0;
  }

  .projects-page02 figcaption p {
    font-size: 3.8vw;
    line-height: 5vw;
    margin: 0 0 4vw 0;
  }

  .projects-page02 figcaption span {
    font-size: 3.5vw;
    line-height: 4vw;
    margin: 0 0 4vw 0;
  }





  .main-wrapper-inside02 {
    width: 100%;
    padding: 3vw;
    position: static3;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    z-index: auto;
  }

  .main-wrapper-inside02 figure {
    width: 100%;
    display: block;
  }

  .main-wrapper-inside02 figcaption {
    width: 100%;
    display: block;
    padding: 3vw;
  }



  .main-wrapper-inside02 figcaption h4 {
    font-size: 4.5vw;
    line-height: 5.5vw;
    margin: 0 0 2.5vw 0;
  }

  .main-wrapper-inside02 figcaption p {
    font-size: 3.8vw;
    line-height: 5vw;
    margin: 0 0 4vw 0;
  }

  .main-wrapper-inside02 figcaption span {
    font-size: 3.5vw;
    line-height: 4vw;
    margin: 0 0 4vw 0;
  }



  .project-inside-slider {
    width: 100%;
    padding: 0;
    margin-top: 0;
  }



  .main-wrapper-inside03 {
    width: 95%;
    margin-bottom: 12vw;
  }

  .location-map {
    margin-bottom: 8vw;
  }



  .download-btns-box {
    width: 100%;
    display: block;
    margin: 0 0 8vw 0;
  }

  .download-btns-box figcaption {
    padding: 17vw 4vw 4vw 4vw;
  }

  .download-btns-box figcaption h5 {
    font-size: 7vw;
    display: block;
    margin: 0 0 3vw 0;
    line-height: 6vw;
  }

  .download-btns-box figcaption h5 span {
    font-size: 3vw;
    display: block;
  }



  .team-inside {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5vw;
  }

  .team-member-inside {
    display: block;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 8vw;
    padding: 4vw 4vw 6vw 4vw;
  }

  .team-member-inside figure {
    margin: 0 0 3vw 0;
  }

  .team-member-inside figcaption h6 {
    font-size: 3.5vw;
  }

  .team-member-inside figcaption h6 span {
    font-size: 3vw;
    margin: 1vw 0 3vw 0;
  }

  .team-member-inside figcaption p {
    font-size: 3vw;
    line-height: 3.5vw;
    margin: 0 0 3vw 0;
  }

  .team-member-inside figcaption strong {
    font-size: 3vw;
  }



  /* The Modal (background) */

  .modal {

    padding-top: 10px;
    z-index: 10;

  }



  /* Modal Content */

  .modal-content {

    padding: 4vw;

    width: 95%;

  }

  .modal-left {
    width: 100%;
    display: block;
  }

  .modal-left figcaption {
    margin: 2vw 0 0 0;
  }

  .modal-left i {
    margin: 0 3vw;
    font-size: 5vw;
  }

  .modal-left i:hover {
    margin: 0 3vw;
  }



  .modal-right {
    width: 100%;
    display: block;
    padding: 3vw;
  }

  .modal-right p {
    font-size: 3.5vw;
    line-height: 4.5vw;
  }



  .modal-right h1 {
    font-size: 4vw;
    text-align: center;
  }

  .modal-right h1 span {
    font-size: 3.5vw;
    margin: 1vw 0 3vw 0;
  }

}