/* GRID/REPEATED LAYOUT ELEMENTS
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
  position: relative;
  width: 100%;
  max-width: 1140px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0 15px;
}
  @media screen and (min-width: 500px)  {.container {padding: 0 25px;}}
  @media screen and (min-width: 600px)  {.container {padding: 0 35px;}}
  @media screen and (min-width: 768px)  {.container {padding: 0 50px;}}
  @media screen and (min-width: 1024px) {.container {padding: 0 64px;}}
  @media screen and (min-width: 1268px) {.container {padding: 0}}

.container-wide {max-width: 1440px;}
  @media screen and (min-width: 1268px) {.container-wide {padding: 0 64px;}}

.container-narrow {max-width: 920px;}


/* GRID FOR MODULES */
.grid-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-left: -10px;
  margin-right: -10px;
  margin-bottom: -20px;  
}
  @media screen and (min-width: 1024px) {.grid-wrap {margin-left: -15px; margin-right: -15px; margin-bottom: -30px}}

.grid-module {
  -webkit-box-flex: 0;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  width: 100%;
  padding: 0 10px;
  margin-bottom: 20px;
}
  @media (min-width: 768px)  {.grid-module {width: 50%;}}
  @media (min-width: 1024px) {.grid-module {padding: 0 15px; margin-bottom: 30px;}}

  .grid-3wide {} @media screen and (min-width: 1024px) {.grid-3wide {width: 33.333%;}}
  .grid-4wide {} @media screen and (min-width: 1024px) {.grid-4wide {width: 25%;}}
  .grid-5wide {} @media screen and (min-width: 1024px) {.grid-5wide {width: 20%;}}
/* GRID FOR MODULES */