// 
// reboot.scss
// Extended from Bootstrap
// 
html, body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  height: 100%;
  overflow-x: hidden;
  z-index: 0;
  position: relative;
  font-family: $body-font-family;
  font-size: $body-font-size;
  background-color: $body-bg;
}

main {
  height: 100%;
  overflow-x: hidden;
  z-index: 0;
  position: relative;
  padding-top: map-get($spacers, 0);
  padding-bottom: map-get($spacers, 0);
  padding-left: map-get($spacers, 4);
  padding-right: map-get($spacers, 4);
}

#root  {
  height: 100%;
}

header {
  position: relative;
  z-index: $zindex-header;
  background: $body-bg;
}

a {
  transition: $transition-base;
  color: $theme-text-color;
  text-decoration: none;
}

%heading > a{
  color: $headings-color;
  &:hover{
    color: $primary;
  }
}

img {
  max-width: 100%;
  height: auto;
}

video {
  background-size: cover;
  display: table-cell;
  vertical-align: middle;
  width: 100%;
}

// Section padding top and bottom
section {
  padding-top: map-get($spacers, 0);
  padding-bottom: map-get($spacers, 0);
}

@include media-breakpoint-down(md) {
  section {
    padding-top: map-get($spacers, 0);
    padding-bottom: map-get($spacers, 0);
  }
}

// hr {
//   background-color: $light-gray !important;
// }


h4, .h4 {
  font-size: map-get($spacers, 3);
}

h5, .h5 {
  font-size: map-get($spacers, 3);
}

h6, .h6, p {
  font-size: map-get($spacers, 2);
}