/**
 * MAGIC-specific styles
 */

/** To help in creating the sticky footer: */
.mgc-body-content {
  flex: 1 0 auto;
}

.mgc-body-content h1,
.mgc-body-content h2,
.mgc-body-content h3,
.mgc-body-content h4,
.mgc-body-content h5,
.mgc-body-content h6 {
  color: inherit;
}

/**
 * Replacement for a uk-container/uk-container-center where its styling is needed in
 * conjunction with a uk-grid, because uk-container/center and uk-grid do NOT work together
 * correctly in Safari (for UiKit v 2.27.5).
 */
.mgc-container-grid-center {
  /* Mobile-first */
  padding:      0;
  max-width:    980px;
  /* Center the grid horizontally: */
  margin-left:  auto;
  margin-right: auto;
}
@media (min-width: 480px) and (max-width: 767px) {
  .mgc-container-grid-center {
    padding: 0 15px;
  }
}
@media (min-width: 768px) and (max-width: 959px) {
  .mgc-container-grid-center {
    padding: 0 25px;
  }
}
@media (min-width: 960px) and (max-width: 1219px) {
  .mgc-container-grid-center {
    padding: 0 35px;
  }
}
@media (min-width: 1220px) {
  .mgc-container-grid-center {
    max-width: 1200px;
    padding:   0 50px;
  }
}

/**
 * Provides a minimum padding for the smallest screens, and less variations in padding
 * across screen sizes, when used together with mgc-container-grid-center:
 */
.mgc-container-grid-center-padding {
  padding: 0 25px;
}
@media (min-width: 1220px) {
  .mgc-container-grid-center-padding {
    padding: 0 35px;
  }
}


.mgc-footer {
  flex-shrink:      0;
  color:            #fed4a7;
  background-color: #480000;
  font-family:      Lato, sans-serif;
  font-weight:      300;
}

.mgc-bold-text {
  font-weight: 700;
}

.mgc-spaced-list {
  margin-top: 15px;
}

.mgc-disc-list {
  list-style-type: disc;
}

.mgc-padding-small {
  padding: 15px;
}

.mgc-padding-small-top {
  padding-top: 15px;
}

.mgc-padding-small-bottom {
  padding-bottom: 15px;
}

.mgc-padding-small-right {
  padding-right: 15px;
}

.mgc-padding-small-left {
  padding-left: 15px;
}

.mgc-padding-medium {
  padding: 25px;
}

.mgc-padding-medium-top {
  padding-top: 25px;
}

.mgc-padding-medium-bottom {
  padding-bottom: 25px;
}

.mgc-padding-medium-right {
  padding-right: 25px;
}

.mgc-padding-medium-left {
  padding-left: 25px;
}

.mgc-padding-large {
  padding: 50px;
}

.mgc-padding-large-top {
  padding-top: 50px;
}

.mgc-padding-large-bottom {
  padding-bottom: 50px;
}

.mgc-padding-large-right {
  padding-right: 50px;
}

.mgc-padding-large-left {
  padding-left: 50px;
}

.mgc-margin-small-top {
  margin-top: 15px;
}

.mgc-margin-small-bottom {
  margin-bottom: 15px;
}

.mgc-margin-small-right {
  margin-right: 15px;
}

.mgc-margin-small-left {
  margin-left: 15px;
}

.mgc-margin-medium-top {
  margin-top: 25px;
}

.mgc-margin-medium-bottom {
  margin-bottom: 25px;
}

.mgc-margin-medium-right {
  margin-right: 25px;
}

.mgc-margin-medium-left {
  margin-left: 25px;
}