/* CSS Responsive */

@media screen and (max-width: 1200px) {
  
}

@media screen and (max-width: 992px) {
  .top, .top-category, #menu-md {
    display: none;
  }
  #menu-xs.mm-opened {
    display: block;
  }
  .mm-menu {
    z-index: 10;
  }

  .btn-menu-xs {
    display: block;
    width: 40px;
    height: 40px;
    padding: 10px;
    position: absolute;
    top: 15px;
    right: 0;
    z-index: 99999;
    background: #969593;
    transform: translate(-15px, -15px);
  }
  .btn-menu-xs:before,
  .btn-menu-xs:after {
    content: '';
    display: block;
    background: #fff;
    height: 2px;
  }
  .btn-menu-xs span {
    background: #fff;
    display: block;
    height: 2px;
    margin: 6px 0;
  }

  #mm-blocker {
    opacity: 1;
  }
  #mm-blocker:before {
    content: '';
    display: block;
    background: #969593;
    width: 40px;
    height: 40px;
    padding: 10px;
    position: fixed;
    top: 2px;
    right: 2px;
    z-index: 9999;
    text-align: center;
    line-height: 40px;
  }
  #mm-blocker:after {
    content: 'x';
    display: block;
    width: 40px;
    height: 40px;
    padding: 10px;
    position: fixed;
    top: -14px;
    right: -1px;
    z-index: 9999;
    color: #fff;
    font-size: 30px;
  }
  .header {
    padding: 10px 0;
  }
  .box-img {
    height: auto;
  }
}

@media screen and (max-width: 768px) {
  .dropdown-menu {
    background: #fff;
  }
  .dropdown-item {
    color: #212121 !important;
    border-bottom: 1px solid #212121;
    width: 100%;
    max-width: 315px;
    overflow: hidden;
  }
  .dropdown-item:last-child {
    border-bottom: none;
  }
  .logo {
    height: 40px;
    padding-top: 0
  }
  .slider-wrap .item .content h2 {
    display: none;
  }
  .slider-wrap .item .content h1 {
    font-size: 16px;
    margin: 10px 0;
  }
  .slider-wrap .item .content a {
    font-size: 10px;
    padding: 5px;
    width: 100px;
  }
  section.intro .left h1, section.project-tab .headline h2 {
    font-size: 20px;
  }
  section.intro .left p {
    font-size: 12px;
  }
  .project-tab-ct .nav-tabs .nav-item {
        display: block;
    width: 100%;
  }
  footer .item h4 {
    font-size: 14px;
  }
  footer .item li {
    font-size: 12px;
  }
  footer .bottom {
        font-size: 11px;
    text-align: center !important;
  }
  footer .bottom .text-right {
    text-align: center !important;
  }
  .btn-phone-img-circle {left: 0}
  .btn-phone-circle-fill {left: -5px}
  .right .btn-phone-img-circle {right: -45px;}
  .right .btn-phone-circle-fill {left: inherit;right: -50px;}
}

@media screen and (max-width: 576px) {
  
}
