.error-page {
  background-color: $color-blue-300;

  .site-search-container {
    input {
      height: 48px;
    }

    @include breakpoint(sm) {
      flex-direction: row;
      align-items: flex-end;
      max-width: 600px;

      label {
        margin-bottom: 0;
      }

      input {
        border-radius: 4px 0 0 4px;
      }

      .btn {
        border-radius: 0 4px 4px 0;
      }

      .form-item {
        flex-grow: 2;
      }
    }
  }
}

.logo-container {
  padding-top: $margin-quadruple;
  text-align: left;
  margin-bottom: 24px;

  @include breakpoint(sm) {
    text-align: right;
  }
}

.error-header {
  background-color: $color-white;
  padding-bottom: $margin-quadruple;
  @include font-size(18);

  h1 {
    margin-bottom: $margin-triple;
  }
}

.error-body {
  padding: $margin-quadruple 0 $margin-double;

  @include breakpoint(sm) {
    margin-bottom: $margin-quadruple;
  }

  .search-button {
    margin-top: 7px;

    @include breakpoint(sm) {
      margin-top: 0;
    }
  }

  a {
    color: $color-blue-500;
  }

  .tui-text-content {
    @include font-size(20);
  }
}

.error-bottom {
  margin-bottom: $margin-double;
}

.wavy-top {
  background: $color-white url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJcAAAAkCAYAAACEwaiiAAAER0lEQVR4nO3cWYgcRRzH8U/MJiZqi+IVjRJvUETwan1QH9VgIBrxCF4EguJJoSgoIh4oKqItInlQjCAE9UEQlXiAb9GkNOZB8YgoKoIKokiRhNl1XR9qBjyI2c3ObM/M9heGZYberh8zP371739X9RwN/yDEtAglzsIZWIJFWIB57cPG0cIv+B6fYAM+qsriy5nW3K/MqVtAPxBiOhNXYjkOxSj2MrXvZzvmYhvewYt4tyqLse6qHRxmrblCTAfjRtyAfTEfe3RxiO2YwDo8XpXF1i6eeyCYdeYKMR2Lh+WUIpuql4zjT2zCHVVZbOzxeH3DrDFXiOlIVFiKEd1NqcnSwhbcXJXF5hrGn1GG3lwhpgIP4Xq5JppbryITGMPruKUqix9r1tMzhtpcIaYrsEYuzns9/U2VP9qvu/B0VRbjNevpOkNprhDTYryAc7BnvWp2SQtf4dKqLL6oW0w3GTpztdPqebknNVKznMkyIafYnXiqKouJmvV0haExV4hpHzyHi/XfFDhZWnIz9vKqLH6pW8x0GQpzhZhOx2s40OAaq8OY3Ii9pCqL9+oWMx0G3lwhptvxiMGZAifLGB7HPVVZ/Fm3mN1hYM3VbjGsw3kGP612RgsbsaIqi1/rFjNVBtJcIaYTsV6+oTysxuowht9wQVUWW+oWMxXq6FJPi/bV4BYcYfiNRb7qPRibQkyr6hYzFQYmuUJMc/GEfKN53i4OH1bG5P7dTYOw2mIgzBViOgBv4BT93xTtNS15/diyqix+rlvM/9H35goxnSbXV/uZvYn1b/7A71halcWHdYvZGX1dc4WYVuMDHKQx1t8ZwQHYEGK6rm4xO6MvkyvEtADP4jKzo2ifDqN4BaursmjVLebv9J25QkxL8BaO1hhrsozia7ld8X3dYjr01bQYYlqBz3CcxlhTYT6Ox+chpuW7Onim6Ivkak+Dz+BqTW01XTrtilvqniZrN1eI6QS5zXC4Jq26RUve8raszo0htZkrxDQHt+IxOa1qN/qQMSHXYrdhTR1rxGr5QUNMR+FlnKxpivaaFjZj5UwX+zNqrhDTCG7HA/pjs8RsYVxuvN4tr3SdkfX6M2auENO5WIvFmrSqixa+w6qqLN7v9WA9N1eI6Rg8ifM1BXu/MIo3cVtVFt/2apCemSvEdCgexDVyP62ZAvuLzk7wtbivF/snu26udlLdi5Xtj5q+VX8z2v77Eu6vyuKbbp24K+YKMe0hT3t3yY8eapJq8Ogk2UY8ivXTXbs/LXO1l8Nci6vk51ctnM75GvqGHXKirZP3gG7enT7ZlMwVYjoEZ+MiXCibaZ4mpYaVcfl2Ugtv41VsqMrih8n883/MFWKaL6/ZPgxH4ST5CXunYv/2QHt3Q3nDwLFNvuLfho/l5uyn2Iqf8VNVFjs6B88JMXV29naepLdAjsSx9vuFmlszDTtnh1yrjcj9y9H2++1/AdMLGxrHx++BAAAAAElFTkSuQmCC') repeat;
  height: 36px;
}

.tui-text-content {
  @include font-size(18);
  margin-bottom: $margin-quadruple;
  margin-top: $margin-quadruple;

  li {
    margin-bottom: $margin-half;
  }
}

.navigation-list {
  @extend %flexbox-row;
  justify-content: flex-start;
  flex-wrap: wrap;
  padding-top: $margin-quadruple;
  border-top: 1px solid rgba($color-blue-500, .15);

  @include breakpoint(md) {
    justify-content: space-between;
  }

  a {
    color: $color-blue-500;
    margin-bottom: $margin-double;
    text-transform: uppercase;
    margin-right: $margin-double;

    @include breakpoint(md) {
      margin-right: 0;
    }
  }
}