/*======================================
 * MIN WIDTH 0
======================================*/


@media (min-width: 0px) {

  body {
  }

  h1 {
  }

  h2 {
  }

  h3 {
  }

  h4 {
    font-weight: bold;
  }

  .row {
  }

  .tech-cloud {
    height: 235px;
    width: 306px;
  }

  /* .process-flow-chart {
      margin: 20px 0;
  } */

  .project {
    padding: 10px 0 30px 0;
  }

  .project-image {
    margin: 0 auto 5px auto;
  }

  .project-image img { 
      height: 250px;
  }

  /* #site-process ul {
    margin: 0;
    list-style: disc;
  } */

  #site-process .wrapper {
    width:95%;
  }

  .project-text {
        max-width: 450px;
        padding: 0 60px;
        text-align: center;
    }

    .wrapper {
        padding: 0 10px;
    }
}

/*======================================
 * MIN WIDTH 768
======================================*/

@media (min-width: 768px) {
  /* Pull out the header and footer */
  .header {
  }
  .footer {
  }
  /* Start the vertical centering */
  .site-container {
    vertical-align: middle;
  }
  /* Handle the widths */
  .container {
    width: 100%;
  }

  h1 {
  }

  h2 {
  }

  h3 {
  }

  h4 {
  }

  .tech-cloud {
    height: 450px;
    width: 600px;
  }

  /* .process-flow-chart {
    margin: 40px 0;
  } */

  .project {
    padding: 20px 0 50px 0;
  }

  .project-image {
    margin: 0 auto 25px auto;
  }

  .project-image img { 
    height: 350px;
  }

  .project-text {
    max-width: 450px;
    padding: 0;
    text-align: center;
}

  /* #site-process ul {
    margin: 0 20px;
    list-style: none;
  } */

  .wrapper {
    padding: 0 30px;
}

}


/*======================================
 * MIN WIDTH 992
======================================*/

@media (min-width: 992px) {
  .container {
  }

  h1 {
  }

  h2 {
  }

  h3 {
  }

  h4 {
  }

  .tech-cloud {
    height: 562px;
    width: 764px;
  }

  /* .process-flow-chart {
    margin: 140px 0;
  } */

  .project {
    padding: 30px 0 80px 0;
  }

  .project-image {
    margin: 0 0 50px auto;
  }

  .project-image img { 
    height: 420px;
    margin: 0 0 0 auto;
  }

  .project-text {
      max-width: 450px;
      padding: 0 0 0 30px;
     text-align: left;
  }

  /* #site-process ul {
    margin: 0 40px;
    list-style: none;
  } */

  .wrapper {
    padding: 0 30px;
    }

}