.principles .principles-list {
  padding-bottom: 0;
}

.principles .principles-list-inner {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  justify-content: space-between;
}

.principles .page-intro-title {
  text-transform: none;
  letter-spacing: normal;
}

/* PRINCIPLE MOBILE */

.principle {
  width: 100%;
  margin-top: 40px;
}

.principle:first-of-type {
  margin-top: 0;
}

.principle .principle-image {
  margin-bottom: 20px;
}

.principle .principle-image {
  height: 0;
  width: 100%;
  padding-bottom: 66.66666%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.principle .principle-title {
  margin-bottom: 5px;
  font-size: 28px;
}

.principle .principle-description {
  font-size: 16px;
}


@media (min-width: 600px) {

  /* PRINCIPLE TABLET */

  .principle {
    margin-top: 60px;
  }

  .principle .principle-image {
    margin-bottom: 30px;
  }

  .principle .principle-title {
    font-size: 32px;
  }

  .principle .principle-description {
    font-size: 16px;
  }

}

@media (min-width: 768px) {

  .principles .principles-list-inner {
    max-width: 1140px;
    margin-left: 0;
  }

  /* PRINCIPLE DESKTOP */

  .principle {;
    margin-top: 40px;
  }

  .principle .principle-image {
    margin-bottom: 40px;
  }

  .principle {
    width: calc(50% - 30px);
  }

  .principle:nth-of-type(2) {
    margin-top: 0;
  }

  .principle .principle-title {
    font-size: 30px;
  }

  .principle .principle-description {
    font-size: 18px;
  }

}

@media (min-width: 900px) {

  .principles .page-intro-image {
    height: 110%
  }  

}

@media (min-width: 1200px) {

  .principles .page-intro-image {
    height: 125%
  }

}