button#mob-toggle-menu-button {
  display: none;
}



@media only screen and (max-width: 1024px) {
  .container {
    padding: 0 20px;
  }
  .portfolio-one-profile-card-template{
    top: 20px;
  }

  body.header-layout-two .main-navigation ul li a{
    padding-right: 20px;
  }
  

  .cww-about-section .container {
    gap: 85px;
  }

  .counter-wrapp.cww-flex {
    gap: 5%;
  }

  .count-item-wrapp {
    flex: 1 1 45%;
  }

  .cww-contact-section .contact-wrapp.cww-flex .address-wrap {
    margin-left: 3%;
  }

}


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

  .header-cta-wrapp.layout-three{
    margin-top: 15px;
  }
  body.header-layout-two  .cww-nav-container ul li{
    border: none;
  }
  body.header-layout-two .cww-site-content {
   width: 100%;
  }
  

  .cww-site-content .content-area, 
  div#cww-site-content .cww-single-container.sidebar-right div#primary, 
  div#cww-site-content .cww-single-container.sidebar-left div#primary, 
  div#cww-site-content .cww-archive-container.sidebar-right div#primary, 
  div#cww-site-content .cww-archive-container.sidebar-left div#primary{
    width: 100%;
  }

  div#cww-site-content .cww-archive-container.sidebar-right,
  div#cww-site-content .cww-single-container.sidebar-right {
    display: block;
  }

  div#cww-site-content .cww-single-container.sidebar-right div#primary,
  div#cww-site-content .cww-single-container.sidebar-left div#primary,
  div#cww-site-content .cww-archive-container.sidebar-right div#primary,
  div#cww-site-content .cww-archive-container.sidebar-left div#primary {
    width: 100%;
  }

  aside.widget-area.secondary.sidebar-right,
  aside.widget-area.secondary.sidebar-left,
  div#cww-site-content .cww-single-container.sidebar-right aside.widget-area.secondary.sidebar-right,
  div#cww-site-content .cww-single-container.sidebar-left aside.widget-area.secondary.sidebar-right,
  div#cww-site-content .cww-archive-container.sidebar-right aside.widget-area.secondary.sidebar-right,
  div#cww-site-content .cww-archive-container.sidebar-left aside.widget-area.secondary.sidebar-right {
    width: 100%;
  }

  header.site-header {
    position: relative;

  }
.cww-portfolio-lists .inner-wrapp.inner-wrap-pfolio{
  flex-wrap: wrap;
}
.home .cww-portfolio-lists .inner-wrapp.inner-wrap-pfolio .img-wrapp,
.home .cww-portfolio-lists .inner-wrapp.inner-wrap-pfolio .content-wrappp{
  width: 100%;
}
  .pfolio-body-wrapp{
    flex-wrap: wrap;
  }
  .pfolio-body-wrapp .portfolio-meta-info,
  .pfolio-body-wrapp .portfolio-content-wrapp{
    width: 100%;
  }

  /* ============= Toggle Button =================== */
  button#mob-toggle-menu-button {
    display: block;
  }

   body.header-layout-two button#mob-toggle-menu-button {
    position: fixed;
    top: 0;
    right: 0;;
  }
  body.header-layout-two header.site-header.is-opened {
    left: 0;
    position: fixed;
  }
  body.header-layout-two header.site-header {
    left: -2106px;
    position: fixed;
  }

  .button.is-text {
    background-color: transparent;
    border: 0;
  }

  .button-inner-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  #mob-toggle-menu-button {
    width: 48px;
    height: 48px;
    background-color: var(--color-night-dark);
    transition: background-color 2s ease;
  }

  /* Menu toggle button */
  .icon {
    line-height: 0;
  }

  .menu-icon {
    text-align: right;
    width: 27px;
  }

  .menu-icon::after,
  .menu-icon::before {
    background-color: #ffffff;
    content: "";
    display: inline-block;
    height: 3px;
    width: 27px;
    margin: 3px 0;
    transition-duration: 0.5s;
  }

  .menu-icon::before {
    width: 27px;
  }

  .menu-icon::after {
    width: 18px;
  }

  #mob-toggle-menu-button:hover .menu-icon::before {
    width: 18px;
    transition-duration: 0.5s;
  }

  #mob-toggle-menu-button:hover .menu-icon::after {
    width: 27px;
    transition-duration: 0.5s;
  }

  #mob-toggle-menu-button.is-opened {
    background-color: var(--theme-color)
  }

  #mob-toggle-menu-button.is-opened .menu-icon::before {
    transform: rotateZ(135deg) translate(3px, -3px);
    width: 27px;
  }

  #mob-toggle-menu-button.is-opened .menu-icon::after {
    transform: rotateZ(-135deg) translate(3px, 3px);
    width: 27px;
  }

  /* ===================== Menu show hide =================*/
  .cww-menu-outer-wrapp {
    top: -1500px;
    visibility: hidden;
    opacity: 0;
    transition: all 0.3s;
  }

  .main-navigation {
    width: 100%;
  }

  .main-navigation a {
    padding: 20px 19px;
  }

  header.site-header.is-opened .cww-menu-outer-wrapp {
    visibility: visible;
    opacity: 1;
  }
  body.header-layout-two .main-navigation a {
    padding: inherit;
  }
  .cww-menu-outer-wrapp.cww-flex {
    position: absolute;
    top: 120px;
    right: 0;
    background: #fff;
    height: auto;
    width: 100%;
    height: 100vh;
    z-index: 9;
    padding: 5px 20px;
    display: block;
    transition: all 0.3s;
  }
  body.header-layout-two .cww-menu-outer-wrapp.cww-flex{
    background: transparent;
    position: relative;
    top: inherit;
    padding: 0;
  }
  .cww-nav-container ul li {
    display: block;
    border-bottom: 1px solid #f1f1f1;
    text-align: left;
  }

  

  li.blocks-gallery-item {
    flex: 1 1 33.33%;
  }

  /*  */
  .cww-about-section .container {
    flex-wrap: wrap;
  }

  /*  */
  .cww-contact-section .contact-wrapp.cww-flex .address-wrap {
    flex: 1 1 40%;
    margin-top: 25px
  }

}





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

  .site-branding {
    flex: 1 1 50%;
  }




  .count-item-wrapp:last-child {
    margin-top: 25px;
  }

  .cww-service-section .service-wrapper-outer .service-wrapp {
    padding: 0;
  }

  .blog-outer-wrapp:not(:first-child) {
    margin-top: 35px;
  }

  .site-info.cww-flex {
    justify-content: center;
  }

  li.blocks-gallery-item {
    flex: 1 1 50%;
  }
}

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

  .cww-contact-section .form-wrapp,
  .cww-contact-section .address-wrap {
    padding: 30px 15px;
  }

}

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

  

  .header-cta-wrapp a,
  .cww-main-banner .btn-primary a,
  .cww-cta-section .btn-wrapper a,
  .error-404 .button-wrapp a {
    padding: 9px 18px;
  }

  /* section.cww-main-banner .social-icon-wrapp {
    top: 145px;
  }*/
}