/* bricktheme block grids, basic grid and flex grid */
@media screen and (min-width:0) {
  .sm-1 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 4.90109%;
  }
  .sm-1:last-child {
    margin-right: 0;
  }
  .sm-2 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 13.54645%;
  }
  .sm-2:last-child {
    margin-right: 0;
  }
  .sm-3 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 22.1918%;
  }
  .sm-3:last-child {
    margin-right: 0;
  }
  .sm-4 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 30.83716%;
  }
  .sm-4:last-child {
    margin-right: 0;
  }
  .sm-5 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 39.48251%;
  }
  .sm-5:last-child {
    margin-right: 0;
  }
  .sm-6 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 48.12787%;
  }
  .sm-6:last-child {
    margin-right: 0;
  }
  .sm-7 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 56.77322%;
  }
  .sm-7:last-child {
    margin-right: 0;
  }
  .sm-8 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 65.41858%;
  }
  .sm-8:last-child {
    margin-right: 0;
  }
  .sm-9 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 74.06393%;
  }
  .sm-9:last-child {
    margin-right: 0;
  }
  .sm-10 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 82.70929%;
  }
  .sm-10:last-child {
    margin-right: 0;
  }
  .sm-11 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 91.35464%;
  }
  .sm-11:last-child {
    margin-right: 0;
  }
  .sm-12 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 100%;
  }
  .sm-12:last-child {
    margin-right: 0;
  }
}

@media screen and (min-width:640px) {
  .md-1 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 4.90109%;
  }
  .md-1:last-child {
    margin-right: 0;
  }
  .md-2 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 13.54645%;
  }
  .md-2:last-child {
    margin-right: 0;
  }
  .md-3 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 22.1918%;
  }
  .md-3:last-child {
    margin-right: 0;
  }
  .md-4 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 30.83716%;
  }
  .md-4:last-child {
    margin-right: 0;
  }
  .md-5 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 39.48251%;
  }
  .md-5:last-child {
    margin-right: 0;
  }
  .md-6 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 48.12787%;
  }
  .md-6:last-child {
    margin-right: 0;
  }
  .md-7 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 56.77322%;
  }
  .md-7:last-child {
    margin-right: 0;
  }
  .md-8 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 65.41858%;
  }
  .md-8:last-child {
    margin-right: 0;
  }
  .md-9 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 74.06393%;
  }
  .md-9:last-child {
    margin-right: 0;
  }
  .md-10 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 82.70929%;
  }
  .md-10:last-child {
    margin-right: 0;
  }
  .md-11 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 91.35464%;
  }
  .md-11:last-child {
    margin-right: 0;
  }
  .md-12 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 100%;
  }
  .md-12:last-child {
    margin-right: 0;
  }
}

@media screen and (min-width:1024px) {
  .lg-1 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 4.90109%;
  }
  .lg-1:last-child {
    margin-right: 0;
  }
  .lg-2 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 13.54645%;
  }
  .lg-2:last-child {
    margin-right: 0;
  }
  .lg-3 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 22.1918%;
  }
  .lg-3:last-child {
    margin-right: 0;
  }
  .lg-4 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 30.83716%;
  }
  .lg-4:last-child {
    margin-right: 0;
  }
  .lg-5 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 39.48251%;
  }
  .lg-5:last-child {
    margin-right: 0;
  }
  .lg-6 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 48.12787%;
  }
  .lg-6:last-child {
    margin-right: 0;
  }
  .lg-7 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 56.77322%;
  }
  .lg-7:last-child {
    margin-right: 0;
  }
  .lg-8 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 65.41858%;
  }
  .lg-8:last-child {
    margin-right: 0;
  }
  .lg-9 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 74.06393%;
  }
  .lg-9:last-child {
    margin-right: 0;
  }
  .lg-10 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 82.70929%;
  }
  .lg-10:last-child {
    margin-right: 0;
  }
  .lg-11 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 91.35464%;
  }
  .lg-11:last-child {
    margin-right: 0;
  }
  .lg-12 {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 100%;
  }
  .lg-12:last-child {
    margin-right: 0;
  }
}

@media screen and (min-width:0) {
  .sm-shift-1 {
    margin-left: 8.64536%;
  }
  .sm-shift-2 {
    margin-left: 17.29071%;
  }
  .sm-shift-3 {
    margin-left: 25.93607%;
  }
  .sm-shift-4 {
    margin-left: 34.58142%;
  }
  .sm-shift-5 {
    margin-left: 43.22678%;
  }
  .sm-shift-6 {
    margin-left: 51.87213%;
  }
  .sm-shift-7 {
    margin-left: 60.51749%;
  }
  .sm-shift-8 {
    margin-left: 69.16284%;
  }
  .sm-shift-9 {
    margin-left: 77.8082%;
  }
  .sm-shift-10 {
    margin-left: 86.45355%;
  }
  .sm-shift-11 {
    margin-left: 95.09891%;
  }
  .sm-shift-12 {
    margin-left: 103.74426%;
  }
}

@media screen and (min-width:640px) {
  .md-shift-1 {
    margin-left: 8.64536%;
  }
  .md-shift-2 {
    margin-left: 17.29071%;
  }
  .md-shift-3 {
    margin-left: 25.93607%;
  }
  .md-shift-4 {
    margin-left: 34.58142%;
  }
  .md-shift-5 {
    margin-left: 43.22678%;
  }
  .md-shift-6 {
    margin-left: 51.87213%;
  }
  .md-shift-7 {
    margin-left: 60.51749%;
  }
  .md-shift-8 {
    margin-left: 69.16284%;
  }
  .md-shift-9 {
    margin-left: 77.8082%;
  }
  .md-shift-10 {
    margin-left: 86.45355%;
  }
  .md-shift-11 {
    margin-left: 95.09891%;
  }
  .md-shift-12 {
    margin-left: 103.74426%;
  }
}

@media screen and (min-width:1024px) {
  .lg-shift-1 {
    margin-left: 8.64536%;
  }
  .lg-shift-2 {
    margin-left: 17.29071%;
  }
  .lg-shift-3 {
    margin-left: 25.93607%;
  }
  .lg-shift-4 {
    margin-left: 34.58142%;
  }
  .lg-shift-5 {
    margin-left: 43.22678%;
  }
  .lg-shift-6 {
    margin-left: 51.87213%;
  }
  .lg-shift-7 {
    margin-left: 60.51749%;
  }
  .lg-shift-8 {
    margin-left: 69.16284%;
  }
  .lg-shift-9 {
    margin-left: 77.8082%;
  }
  .lg-shift-10 {
    margin-left: 86.45355%;
  }
  .lg-shift-11 {
    margin-left: 95.09891%;
  }
  .lg-shift-12 {
    margin-left: 103.74426%;
  }
}

.o-flex-grid {
  display: flex;
  list-style: none;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  justify-content: center;
}

.o-flex-grid li {
  flex: auto;
  margin: 0 0 1.66666rem;
}

@media screen and (min-width:0) and (max-width:639px) {
  .o-flex-grid li:nth-child(odd) {
    border-left: 0;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .o-flex-grid li:nth-child(3) {
    border-left: 0;
  }
}

@media screen and (min-width:1024px) {
  .o-flex-grid li:nth-child(5) {
    border-left: 0;
  }
}

@media screen and (min-width:640px) {
  .o-flex-grid li {
    flex: 0 0 50%;
    padding: 1rem;
  }
}

@media screen and (min-width:1024px) {
  .o-flex-grid li {
    flex: 0 0 33.333%;
  }
}

@media screen and (min-width:1024px) {
  .o-flex-grid--4.o-flex-grid li {
    flex: 0 0 25%;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .o-flex-grid--5.o-flex-grid li:nth-child(5) {
    border-left: 0;
  }
}

@media screen and (min-width:1024px) {
  .o-flex-grid--5.o-flex-grid li {
    flex: 0 0 25%;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .o-flex-grid--6.o-flex-grid li:nth-child(5) {
    border-left: 0;
  }
}

@media screen and (min-width:1024px) {
  .o-flex-grid--6.o-flex-grid li {
    flex: 0 0 25%;
  }
}

@media screen and (min-width:0) and (max-width:639px) {
  .bg-sm-2>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 48.12787%;
  }
  .bg-sm-2>li:last-child {
    margin-right: 0;
  }
  .bg-sm-2>li:nth-child(2n) {
    margin-right: 0;
  }
  .bg-sm-2>li:nth-child(2n+1) {
    clear: left;
  }
}

@media screen and (min-width:0) and (max-width:639px) {
  .bg-sm-4>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 22.1918%;
  }
  .bg-sm-4>li:last-child {
    margin-right: 0;
  }
  .bg-sm-4>li:nth-child(4n) {
    margin-right: 0;
  }
  .bg-sm-4>li:nth-child(4n+1) {
    clear: left;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .bg-md-1>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 100%;
  }
  .bg-md-1>li:last-child {
    margin-right: 0;
  }
  .bg-md-1>li:nth-child(1n) {
    margin-right: 0;
  }
  .bg-md-1>li:nth-child(1n+1) {
    clear: left;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .bg-md-2>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 48.12787%;
  }
  .bg-md-2>li:last-child {
    margin-right: 0;
  }
  .bg-md-2>li:nth-child(2n) {
    margin-right: 0;
  }
  .bg-md-2>li:nth-child(2n+1) {
    clear: left;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .bg-md-3>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 30.83716%;
  }
  .bg-md-3>li:last-child {
    margin-right: 0;
  }
  .bg-md-3>li:nth-child(3n) {
    margin-right: 0;
  }
  .bg-md-3>li:nth-child(3n+1) {
    clear: left;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .bg-md-4>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 22.1918%;
  }
  .bg-md-4>li:last-child {
    margin-right: 0;
  }
  .bg-md-4>li:nth-child(4n) {
    margin-right: 0;
  }
  .bg-md-4>li:nth-child(4n+1) {
    clear: left;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .bg-md-5>li {
    float: left;
    display: block;
    margin-right: 4.52701%;
    width: 16.37839%;
  }
  .bg-md-5>li:last-child {
    margin-right: 0;
  }
  .bg-md-5>li:nth-child(5n) {
    margin-right: 0;
  }
  .bg-md-5>li:nth-child(5n+1) {
    clear: left;
  }
}

@media screen and (min-width:640px) and (max-width:1023px) {
  .bg-md-6>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 13.54645%;
  }
  .bg-md-6>li:last-child {
    margin-right: 0;
  }
  .bg-md-6>li:nth-child(6n) {
    margin-right: 0;
  }
  .bg-md-6>li:nth-child(6n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-1>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 100%;
  }
  .bg-lg-1>li:last-child {
    margin-right: 0;
  }
  .bg-lg-1>li:nth-child(1n) {
    margin-right: 0;
  }
  .bg-lg-1>li:nth-child(1n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-2>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 48.12787%;
  }
  .bg-lg-2>li:last-child {
    margin-right: 0;
  }
  .bg-lg-2>li:nth-child(2n) {
    margin-right: 0;
  }
  .bg-lg-2>li:nth-child(2n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-3>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 30.83716%;
  }
  .bg-lg-3>li:last-child {
    margin-right: 0;
  }
  .bg-lg-3>li:nth-child(3n) {
    margin-right: 0;
  }
  .bg-lg-3>li:nth-child(3n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-4>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 22.1918%;
  }
  .bg-lg-4>li:last-child {
    margin-right: 0;
  }
  .bg-lg-4>li:nth-child(4n) {
    margin-right: 0;
  }
  .bg-lg-4>li:nth-child(4n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-5>li {
    float: left;
    display: block;
    margin-right: 4.52701%;
    width: 16.37839%;
  }
  .bg-lg-5>li:last-child {
    margin-right: 0;
  }
  .bg-lg-5>li:nth-child(5n) {
    margin-right: 0;
  }
  .bg-lg-5>li:nth-child(5n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-6>li {
    float: left;
    display: block;
    margin-right: 3.74426%;
    width: 13.54645%;
  }
  .bg-lg-6>li:last-child {
    margin-right: 0;
  }
  .bg-lg-6>li:nth-child(6n) {
    margin-right: 0;
  }
  .bg-lg-6>li:nth-child(6n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-7>li {
    float: left;
    display: block;
    margin-right: 3.19229%;
    width: 11.54947%;
  }
  .bg-lg-7>li:last-child {
    margin-right: 0;
  }
  .bg-lg-7>li:nth-child(7n) {
    margin-right: 0;
  }
  .bg-lg-7>li:nth-child(7n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-8>li {
    float: left;
    display: block;
    margin-right: 2.78215%;
    width: 10.06562%;
  }
  .bg-lg-8>li:last-child {
    margin-right: 0;
  }
  .bg-lg-8>li:nth-child(8n) {
    margin-right: 0;
  }
  .bg-lg-8>li:nth-child(8n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-9>li {
    float: left;
    display: block;
    margin-right: 2.4654%;
    width: 8.91964%;
  }
  .bg-lg-9>li:last-child {
    margin-right: 0;
  }
  .bg-lg-9>li:nth-child(9n) {
    margin-right: 0;
  }
  .bg-lg-9>li:nth-child(9n+1) {
    clear: left;
  }
}

@media screen and (min-width:1024px) {
  .bg-lg-10>li {
    float: left;
    display: block;
    margin-right: 2.21341%;
    width: 8.00793%;
  }
  .bg-lg-10>li:last-child {
    margin-right: 0;
  }
  .bg-lg-10>li:nth-child(10n) {
    margin-right: 0;
  }
  .bg-lg-10>li:nth-child(10n+1) {
    clear: left;
  }
}

ul[class^="bg-sm-"],
ul[class^="bg-md-"],
ul[class^="bg-lg-"] {
  padding-left: 0;
  list-style: none;
}
ul[class^="bg-sm-"]:after,
ul[class^="bg-md-"]:after,
ul[class^="bg-lg-"]:after {
  content: "";
  display: table;
  clear: both;
}

.c-card__background {
  background-repeat: no-repeat;
  background-size: cover;
}
.c-card--square {
  position: relative;
  overflow: hidden;
}
.c-card__famous--mask {
  position: absolute;
  text-align: center;
  display: block;
  background-color: rgba(0,19,31, .8);
  height: 25%;
  width: 100%;
  top: 75%;
  color: #fff;
  display: flex;
  align-items: center;
}
.c-card__famous--mask > * {
  color: #fff;
  min-width: 100%;
}

.c-card--square:hover .c-card__famous--mask {
  top: 75%;
}

@media only screen and (min-width: 1025px) {
  .c-card--square .c-card__famous--mask {
    top: 100%;
  }
}

.c-card--square::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
