@media only screen and (max-width: 1104px) {
  .left-aligned-section {
    padding-left: 15px;
    padding-right: 15px;
  }
}
/*-=Tablet screens=-*/
@media only screen and (max-width: 1024px) {
  /*max-width 1024px, tablet screens*/
  .header {
    padding: 22px 0 0 0;
  }
  .header__logo {
    padding-bottom: 22px;
  }

  .hero-image__inner {
    left: 0;
    padding: 0 15px;
  }

  .white-box__row {
    padding: 15px;
  }

  .content-section__col-right {
    padding: 0;
  }

  .top-section_diensten {
    padding-bottom: 100px;
  }
  .top-section_diensten:after {
    bottom: -40px;
  }

  .bottom-box__image {
    margin-bottom: 50px;
  }

  .gfield_label {
    font-size: 16px;
  }
}
/*-=Small screens=-*/
@media only screen and (max-width: 640px) {
  .page-title {
    font-size: 36px;
  }

  .alignright, .alignleft, .aligncenter, .alignnone {
    float: none;
    margin: 0 0 1em;
  }

  .white-box__col:first-child {
    margin-bottom: 20px;
  }
  .white-box_home .white-box__inner {
    padding: 10px 0;
  }
  .white-box_over-ons .white-box__inner {
    padding: 0 0 20px 0;
  }

  .footer {
    text-align: center;
    padding-top: 50px;
  }
  .footer__logo {
    margin-bottom: 50px;
  }
  .footer__top {
    margin-bottom: 30px;
  }
  .footer__contacts {
    margin-bottom: 30px;
  }

  .content-section__col-left {
    padding: 30px 15px;
  }

  .project, .project-box {
    position: relative;
    padding-bottom: 50%;
    max-width: 330px;
    max-height: 330px;
    height: 300px;
    margin: 0 auto 30px;
  }
}
/* max-width 640px and lower. Use this for mobiles only */
/*-=Medium screens=-*/
@media only screen and (min-width: 641px) {
  .footer {
    padding-top: 90px;
  }
  .footer h1, .footer h2, .footer h3, .footer h4, .footer h5, .footer h6 {
    margin-bottom: 27px;
  }
  .footer__top {
    margin-bottom: 48px;
  }

  .created-by {
    text-align: right;
  }

  .white-box__col:first-child {
    position: relative;
  }
  .white-box__col:first-child:after {
    content: "";
    position: absolute;
    top: 0;
    right: -1px;
    width: 2px;
    height: 100%;
    background-color: #88b917;
  }
  .white-box_over-ons .white-box__first-part {
    padding: 0;
  }
  .white-box_over-ons .white-box__first-part img {
    width: 100%;
    margin: 0;
  }
  .white-box_over-ons .white-box__second-part {
    padding: 38px;
    position: relative;
  }
  .white-box_over-ons .white-box__second-part:after {
    content: "";
    position: absolute;
    top: -50px;
    right: -45px;
    z-index: -1;
    width: 92px;
    height: calc(100% + 100px);
    background-image: url("../images/hout.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%;
  }
}
/* min-width 641px */
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
  .white-box__col:first-child {
    padding-right: 4%;
  }
  .white-box__col:last-child {
    padding-left: 4%;
  }
  .white-box_home__inner {
    padding: 20px;
  }
}
/*-=Large screens=-*/
@media only screen and (min-width: 1025px) {
  /*min-width 1025px, large screens*/
  .hero-image .page-title {
    position: relative;
    padding-left: 90px;
    line-height: 1.2;
    margin-bottom: 0;
  }
  .hero-image .page-title:after {
    content: "";
    position: absolute;
    top: 40px;
    left: 0;
    width: 50px;
    height: 2px;
    background-color: #fff;
  }

  .header {
    padding: 22px 0;
  }

  .top-section_home {
    padding: 140px 0 300px 0;
  }
  .top-section_home .top-box {
    margin-bottom: 150px;
  }
  .top-section_over-ons {
    padding: 150px 0 225px 0;
  }
  .top-section_over-ons .top-box {
    margin-bottom: 150px;
  }
  .top-section_diensten {
    padding: 150px 0 180px 0;
  }
  .top-section_inspiratie {
    padding: 150px 0;
  }
  .top-section_vacatures {
    padding: 150px 0 100px 0;
  }
  .top-section_vacatures .top-box {
    margin-bottom: 140px;
  }
  .top-section_contact {
    padding: 150px 0 0 0;
  }

  .top-box__part-2 {
    padding-top: 40px;
  }

  .white-box__col:first-child {
    padding-right: 8%;
  }
  .white-box__col:last-child {
    padding-left: 8%;
  }
  .white-box_home .white-box__inner {
    padding: 68px;
  }
  .white-box_over-ons .white-box__first-part img {
    margin: 0;
  }
  .white-box_over-ons .white-box__second-part {
    padding: 68px;
  }
  .white-box_contact .white-box__inner {
    bottom: -100px;
    z-index: 10;
    padding: 75px 0;
  }

  .bottom-box {
    padding: 150px 0;
  }
  .bottom-box .section-descr {
    font-size: 22.92px;
    margin-bottom: 40px;
  }
  .bottom-box__image-exp {
    position: relative;
    top: -50px;
    margin-bottom: 100px;
  }

  .projects-row {
    position: relative;
    top: -150px;
  }

  .first-project-col {
    padding-bottom: calc(200% + 30px);
  }

  .testimonials-section {
    padding-top: 150px;
  }

  .content-section__item_right {
    position: relative;
    top: -74px;
  }

  .double-cols-section {
    padding: 150px 0;
  }

  .four-cols-section {
    padding: 150px 0 50px 0;
  }
  .four-cols-section .columns {
    margin-bottom: 100px;
  }

  .left-aligned-section {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .left-aligned-section .section-descr {
    font-size: 22.92px;
  }
  .left-aligned-section .section-descr p:last-child {
    margin-bottom: 0;
  }
  .left-aligned-section .section-descr p a {
    text-decoration: none;
    color: #fff;
  }
  .left-aligned-section .section-descr p a:hover {
    color: #522111;
  }

  .simple-section {
    padding: 100px 0 150px 0;
  }
  .simple-section h3 {
    font-size: 29.17px;
  }
  .simple-section p:last-child {
    margin-bottom: 0;
  }

  .contact-form-section {
    padding: 240px 0 100px 0;
  }

  .inspiratie-form-section {
    padding: 150px 0;
  }

  .projecten {
    padding-top: 150px;
  }

  .single-gallery {
    padding: 150px 0;
  }
}
@media only screen and (min-width: 1105px) {
  .left-aligned-section {
    padding-left: calc((100vw - 1076px) / 2);
    padding-right: 15px;
  }
}
@media only screen and (min-width: 1201px) {
  /* min-width 1201px, large screens*/
}
@media only screen and (min-width: 1201px) and (max-width: 1280px) {
  /* min-width 1201px and max-width 1280px, use when QAing MacBook issues */
}

/*# sourceMappingURL=media-screens.css.map */