.container {
  display: flex;
  flex-wrap: wrap;
}

.box {
  height: 100px;
  text-align: center;
  width: 100%;
}

.logo-big {
  display: none;
}

body {
  font-family: 'Open Sans', sans-serif;
}

h1, h2 {
  font-family: 'Poiret One', cursive;
}

.header {
  order: 1;
  height: 100%;
}

.logo {
  width: 25%;
  height: 100%;
  float: left;
  order: 2;
}

.whoami {
  padding: 10px;
  float: right;
  text-align: right;
  width: auto;
  height: 100%;
  order: 3;
}

.hero {
  width: 100%;
  height: 100%;
  order: 4;
}

.featured {
  width: 100%;
  order: 5;
}

.gallery {
  width: 100%;
  order: 6;
  display: flex;
  margin: auto;
}

.photo-box {
  padding: 5px;
  display: inline;
  margin: auto;
}

.photo {
  width: auto;
  margin: 5px;
  height: 100%;
  width: 100%
}

.footer {
  width: 100%;
  order: 7;
}