@import "../../theme.scss";

html {
  font-size: 100%;
}

body {
  background-color: $primary-bg;
  font-size: 13px;
  color: #080808;
  margin: 0;

  * {
    box-sizing: border-box;
    font-family: "Open Sans", sans-serif;
  }
}

.sfsyncFrontend {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 935px;
  margin: 0 auto;
  overflow-x: hidden;
}

.sfsyncFrontend-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin: 1.5rem 0;
  padding: 0 0.75rem;
}

.sfsyncFrontend-postsGrid {
  overflow-x: hidden;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  transform: translateX(1px);

  .sfsyncFrontend-gridItem {
    max-width: calc(33.33% - 2px);
    width: 309px;
    margin-inline-end: 2px;
    margin-bottom: 3px;
  }
}