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

  h1 {
    margin-top: 100px;
    font-size: 30px;
  }

  h2 {
    margin-bottom: 40px;
  }

  button.main {
    width: 100%;
    margin-top: 40px;
    margin-bottom: 100px;
  }

  /* —————————————————————
     HEADER & START
  ————————————————————— */
  header {
    padding: 30px 0;
  }

  header .row {
    height: auto;
  }

  header p,
  header img {
    margin-bottom: 30px;
  }

  /* —————————————————————
     PROBLEM?
  ————————————————————— */
  #problem h2 {
    margin-bottom: 0;
  }

  .hashtags p {
    color: #0f3272;
  }

  #problem .bg-gray {
    margin-top: 82px;
  }

  #problem > .container > .row:first-child {
    margin-bottom: 20px;
  }

  #body #problem h3 {
    margin: 40px 0 100px;
    white-space: normal;
  }

  /* —————————————————————
     SERVICES
  ————————————————————— */
  #services > .container > .row:first-child {
    display: flex;
    flex-direction: column;
  }

  #services > .container > .row:first-child > div:first-child {
    order: 1;
  }

  video {
    width: 100%;
    height: auto;
    margin: 20px 0;
  }

  img[src="images/services-img-2.png"] {
    margin-bottom: 20px;
  }

  #services p + p.uppercase {
    margin-bottom: 20px;
  }

  /* —————————————————————
     CLIENTS
  ————————————————————— */
  #clients .item {
    height: auto;
    margin-bottom: 15px;
  }

  /* —————————————————————
     SEARCH
  ————————————————————— */
  #search .col-sm-6 {
    order: 1;
  }

  img[src="images/search-img-1.png"] {
    width: 100vw;
    margin-left: -15px;
  }

  .number {
    margin-bottom: 40px;
  }

  .number + div br {
    display: none;
  }

  img[src="images/profit-img-3.png"] {
    width: 100vw;
  }

  #profit .list {
    display: block;
    margin-bottom: 40px;
  }

  #profit .list > * {
    height: 71px;
    margin-bottom: 40px;
  }

  /* —————————————————————
     SUPPORT
  ————————————————————— */
  .item-wrapper {
    margin-bottom: 20px;
  }

  #support > .container .row:nth-of-type(-n+3) {
    padding-left: 15px;
  }

  #body #support .item-2-wrapper {
    width: calc(100% - 15px);
    margin: 0 0 15px;
  }

  #support .row.second {
    display: block;
  }

  /* —————————————————————
     PRICELIST
  ————————————————————— */
  #pricelist {
    padding-bottom: 0;
  }

  #pricelist h2 {
    margin-bottom: 0;
  }

  #pricelist .item {
    margin-top: 0;
    height: 740px;
  }

  #pricelist .item .click {
    transform: scale(0.9);
    height: 100%;
  }

  #pricelist .item.on .click {
    transform: scale(1);
  }

  #pricelist .item {
    background: url(../images/swipe.svg) no-repeat 90% 23px / 50px,
                url(../images/tap.svg) no-repeat 90% 100px / 50px;
    background-color: #E5E5E5;
  }

  #pricelist .item.yellow {
    background-color: #C4C000;
  }

  #pricelist .item.blue {
    background: url(../images/swipe-white.svg) no-repeat 90% 23px / 50px,
                url(../images/tap-white.svg) no-repeat 90% 100px / 50px;
    background-color: #0F3272;
  }

  #pricelist .item.hover {
    filter: blur(0);
    opacity: 1;
  }

  #pricelist .item:hover {
    transform: none;
    box-shadow: none;
  }

  #pricelist .item:hover .click {
    z-index: -1;
    transform: scale(1);
    opacity: 0;
  }

  #pricelist .item.on .click {
    z-index: 2;
    transform: scale(1);
    opacity: 1;
  }

  /* —————————————————————
     FOOTER
  ————————————————————— */
  footer {
    padding: 40px 0;
  }

  footer img {
    margin-bottom: 20px;
  }

  footer .menubar {
    margin-bottom: 20px;
  }

  footer .contact {
    padding-left: 15px;
  }

  /* —————————————————————
     NAVIGTION & FORM
  ————————————————————— */
  .modal header {
    display: none;
  }

  #navigation .menubar a {
    font-size: 15px;
  }

  .modal .row {
    height: 100vh;
    align-items: center;
  }

  button.shut {
    left: auto;
    right: 0;
  }
  /* —————————————————————
  ————————————————————— */
  /* —————————————————————
  ————————————————————— */
  /* —————————————————————
  ————————————————————— */
}
