@import url('https://fonts.googleapis.com/css?family=EB+Garamond:400,700|Mukta+Mahee:400,700&display=swap');

/*
font-family: 'EB Garamond', serif;
font-family: 'Mukta Mahee', sans-serif;
*/

body {
  background: #333;
  font-family: 'Mukta Mahee', sans-serif;
  color: #e7dada;
  position: relative;
}
/*------------  Navigation  ------------------*/
.navbar {
  text-transform: uppercase;
  font-weight: 700;
  font-size: 1.2rem;
  letter-spacing: 0.1rem;
  background: rgba(0, 0, 0, 0.9) !important;
  border-bottom: #111111 3px solid;
  opacity: 0.8;
}
.navbar-brand img {
  height: 3.5rem;
}
.navbar-nav li {
  padding-right: 0.6rem;
}
.navbar-dark .navbar-nav .nav-link {
  color: #e7dada;
  padding-top: 0.8rem;
}

.navbar-dark
  .navbar-nav
  .nav-link.active
  .navbar-dark
  .navbar-nav
  .nav-link:hover {
  color: #123524;
}

/*------------  End Navigation  ------------------*/

/*------------    Start Home      ------------------*/
#home-section {
  background: url(../img/YinYangXBlock.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  min-height: 400px;
}

#home-section .dark-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  min-height: 400px;
  background: rgba(0, 0, 0, 0.7);
}

#home-section .home-inner {
  padding-top: 150px;
}

#home-section .caption {
  z-index: 1;
  color: #e7dada;
  text-transform: uppercase;
}
#home-section .caption h1 {
  font-size: 3.8rem;
  font-weight: 700;
  letter-spacing: 0.3rem;
  text-shadow: 0.1rem 0.1rem 0.8 rem black;
  padding-bottom: 1rem;
}
#home-section .caption h3 {
  font-size: 2rem;
  text-shadow: 0.1rem 0.1rem 0.5rem black;
  padding-bottom: 1.6rem;
}
#home-section .btn-lg {
  border-width: medium;
  border-radius: 0;
  padding: 0.6rem 1.3rem;
  font-size: 1.1rem;
}
#home-section .btn-lg:hover {
  color: (0, 0, 0);
  background-color: #123524 !important;
}
/*------------     End Home      ------------------*/

/*------------    Start Six Precepts   ------------*/

#sixprecepts .img {
  margin: auto;
  display: block;
}

#sixprecpage .img {
  margin: auto;
  display: block;
}
/*------------       End Six Precepts  ------------*/

/*------------    Start Footer  -------------------*/
#main-footer {
  background: rgba(0, 0, 0, 0.8) !important;
}

/*------------     End Footer  -------------------*/

/* 
Extra small devices (portrait phones, less than 544px) 
No media query since this is the default in Bootstrap because it is "mobile first"
*/
h1 {
  font-size: 1rem;
} /*1rem = 16px*/
#home-section .caption h1 {
  font-size: 1.5rem;
}
#home-section .caption h3 {
  font-size: 1rem;
}
#sixprecepts img {
  height: 10rem;
  padding-bottom: 1rem;
}
#aikicodex img {
  height: 10rem;
  padding-bottom: 1rem;
}
#aikicodex .codex-pic {
  order: 1;
}
#aikicodex .codex-textblock {
  order: 2;
}
#modokan .carousel-custom-text {
  background: rgba(0, 0, 0, 0.2) !important;
}

#instructors img {
  height: 17rem;
  width: 14rem;
}

#instructors .view:hover {
  background-color: #343a40;
}

#sixprecpage .sixpreceptshomeinner {
  padding-top: 8rem;
}

#codexpage .codexhomeinner {
  padding-top: 8rem;
}

#sectionWUIW {
  background-color: #343a40;
}

/*
####################################################
M E D I A  Q U E R I E S
####################################################
*/

/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Bootstrap 4 breakpoints
*/
/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {
  h1 {
    font-size: 1.5rem;
  } /*1rem = 16px*/
  #home-section .caption h1 {
    font-size: 2rem;
  }
  #home-section .caption h3 {
    font-size: 1.5rem;
  }
  #sixprecepts img {
    height: 15rem;
  }
  #aikicodex img {
    height: 15rem;
  }
  #aikicodex .codex-pic {
    order: 1;
  }
  #aikicodex .codex-textblock {
    order: 2;
  }
  #modokan img {
    height: 15rem;
  }
}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {
  h1 {
    font-size: 2rem;
  } /*1rem = 16px*/
  #home-section .caption h1 {
    font-size: 2.5rem;
  }
  #home-section .caption h3 {
    font-size: 2rem;
  }
  #sixprecepts img {
    height: 18rem;
  }
  #aikicodex img {
    height: 21rem;
    padding-left: 2rem;
    order: 1;
  }
  #aikicodex .codex-pic {
    order: 2;
  }
  #aikicodex .codex-textblock {
    order: 1;
  }
  #modokan img {
    height: 25rem;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  h1 {
    font-size: 2.5rem;
  } /*1rem = 16px*/
  #sixprecepts img {
    height: 21rem;
  }
  #aikicodex img {
    height: 24rem;
    padding-left: 5rem;
  }
  #aikicodex .codex-pic {
    order: 2;
  }
  #aikicodex .codex-textblock {
    order: 1;
  }
  #modokan img {
    height: 30rem;
  }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  h1 {
    font-size: 3rem;
  } /*1rem = 16px*/
  #sixprecepts img {
    height: 24rem;
  }
  #aikicodex img {
    height: 24rem;
    padding-left: 5rem;
  }
  #aikicodex .codex-pic {
    order: 2;
  }
  #aikicodex .codex-textblock {
    order: 1;
  }
  #modokan img {
    height: 35rem;
  }
}