.c {
  padding: 1em;
}

.main {
  /*background-color: #8e352e;*/
  margin: 0;
  padding: 0;
  border: 0;
}

.main img {
  align-content: center;
  flex-shrink: 0;
  width: 100%;
  min-width: 100%;
  min-height: 100%
}

.pattern{
  margin: 0;
  padding: 0;
  border: 0;
}
.c{
  margin: 0;
  padding: 0;
  border: 0;
}

.sb {
  /*background-color: #c84c44;*/
  padding: 40px;
}

.sb-2 {
  /*background-color: #a53d36;*/
  padding: 40px;
}

@media screen and (min-width: 56em) {
  .main {
    width: 50%;
    margin-left: 25%;
    float: left;
    padding: 0 0;
  }
  .main img {
    align-content: center;
    flex-shrink: 0;
    min-width: 100%;
    min-height: 100%
  }
  .sb {
    float: left;
    width: 25%;
    margin-left: -75%;
    padding: 20px;
  }
  .sb-2 {
    float: right;
    width: 25%;
    padding: 20px;
  }
}