@media (min-width: 320px) and (max-width: 480px) {
  .section-title {
    font-size: 36px;
  }
  .navbar-collapse {
    background: #222;
    padding-bottom: 16px;
    overflow-y: scroll;
    max-height: 200px;
  }
  #intro .main-text h1 {
    font-size: 32px;
  }
  #intro .main-text h2 {
    font-size: 20px;
  }
  #about .side-left {
    margin-bottom: 50px;
  }
  #why-chose .icon {
    float: left;
  }
  #why-chose .content-left .box-left .content {
    padding-left: 72px;
    padding-right: 0px;
  }
  #why-chose .content-left .box-left .content h4 {
    text-align: left;
  }
  #why-chose .content-left .box-left .content p {
    text-align: left;
  }
  #why-chose .showcase-box {
    margin-bottom: 150px;
  }
  #portfolio .portfolio-items .mix {
    width: 95%;
    margin-bottom: 28px;
  }
  #pricing .btn {
    bottom: -7%;
  }
  #blog .blog-wrapper .content {
    padding: 12px 6px 36px;
  }
  #blog .blog-wrapper .blog-footer {
    padding: 20px 6px;
  }
  #testimonial .testimonial-info p {
    padding: 30px 0px;
    font-size: 16px;
  }
  #clients img {
    margin-left: 24px;
  }
  #contact .contact-form .controls input.contact_input {
    width: 80%;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  #header .navbar-header {
    width: 24%;
  }
  #header .navbar-brand img {
    width: 90%;
    padding: 8px 0px;
  }
  #header .nav li {
    margin: 0 0 5px 12px;
  }
  #header .affix .nav {
    margin-top: 14px;
  }
  #intro .main-text h1 {
    font-size: 52px;
  }
  #intro .main-text h2 {
    font-size: 42px;
  }
  #about .side-left {
    margin-right: 46px;
  }
  #services .content h2 {
    font-size: 16px;
  }
  #portfolio .portfolio-items .mix {
    width: 32%;
  }
  #portfolio .portfolio-items figure:hover a.link-left {
    left: 28%;
  }
  #portfolio .portfolio-items figure:hover a.link-right {
    right: 28%;
  }
  #why-chose .icon {
    float: left;
  }
  #why-chose .content-left .box-left .content {
    padding-left: 72px;
    padding-right: 0px;
  }
  #why-chose .content-left .box-left .content h4 {
    text-align: left;
  }
  #why-chose .content-left .box-left .content p {
    text-align: left;
  }
  #why-chose .showcase-box {
    margin-bottom: 150px;
  }
  #team .content .title h3 {
    font-size: 30px;
  }
  #pricing .price-value {
    left: 38%;
  }
  #pricing .btn {
    left: 34%;
  }
  #contact .contact-form .controls input.contact_input {
    width: 80%;
  }
}