* {
  margin: 0;
  padding: 0;
  outline: none;
  box-sizing: border-box; }

.container {
  margin: auto;
  width: 100%;
  padding: 0 15px;
  max-width: 1200px; }

.main_header {
  border-bottom: solid 1px #ebebeb; }
  .main_header .container {
    display: flex;
    height: 260px;
    justify-content: space-between;
    align-items: center; }
    .main_header .container h1 {
      font-family: 'Lilita One';
      font-family: 'Astude Uppercase Solid';
      font-family: 'Frits Yello';
      font-family: 'Futuristic Stylish';
      font-family: 'Leviafan'; }

.main_page {
  padding: 80px 0; }
  .main_page > .container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
    .main_page > .container > .tiles {
      flex: 0 0 calc((100%/12)*9 - 15px);
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      flex-wrap: wrap; }
      .main_page > .container > .tiles > div {
        flex: 0 0 calc(100%/3 - 20px);
        background-color: #ebebeb;
        min-height: 400px;
        margin-bottom: 30px; }
        .main_page > .container > .tiles > div:nth-child(5), .main_page > .container > .tiles > div:nth-child(6), .main_page > .container > .tiles > div:nth-child(9) {
          margin-top: -160px;
          background-color: burlywood; }
        .main_page > .container > .tiles > div:nth-child(1), .main_page > .container > .tiles > div:nth-child(2), .main_page > .container > .tiles > div:nth-child(3), .main_page > .container > .tiles > div:nth-child(4) {
          margin-top: 0; }
        .main_page > .container > .tiles > div:nth-child(4n+1) {
          min-height: 560px;
          background-color: aqua; }
      .main_page > .container > .tiles::after {
        content: '';
        flex: 0 0 calc(100%/3 - 20px); }
    .main_page > .container > .side {
      flex: 0 0 calc((100%/12)*3 - 15px); }
      .main_page > .container > .side > div {
        margin-bottom: 30px;
        background-color: #ebebeb;
        min-height: 200px; }