#twocards{
  align-items: unset;
}
@media only screen and (min-width: 600px){
  #twocards .left,
  #twocards .right{
    display: flex;
    flex-direction: column;
  }
}

#twocards .frame{
  height: 100%;
}

@media only screen and (min-width: 600px) and (max-width: 1000px) {

  #twocards .card .card-content{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: calc(var(--gutter-in)/2);
  }
  #twocards .card .card-content-left{
    width: 100%;
  }
  #twocards .card .card-content-right{
    width: 100%;
    justify-content: flex-start;
    margin-top: calc(var(--gutter-in)/2);
  }
}

@media only screen and (min-width: 1000px) {
  #twocards .left{
    padding-right: calc(var(--gutter-in)/4);
  }
  #twocards .frame{
    height: 100%;
  }

  #twocards .left{
    padding-right: calc(var(--gutter-in)/4);
  }
}

.frame-grey h2{
  margin-bottom: calc(var(--gutter-in)/2);
}