.bluey {
  color: #cc6d6d
}


.fixheight {
  height: 500px
}

.picwidth{
  max-width: 100%;
}

.bignum{
  font-size: 120%;
  font-weight: bold;
}

.booktitle{
  font-family: 'Passion One', cursive;
}

/* Solid border */
hr.solid {
  border-top: 3px solid #bbb;
}

@media (min-width: 576px) {
  .responsivewidth {
    width: 100%!important;
  }
  .picwidth{
    max-width: 65%;
  }
}

@media (min-width: 768px) {
  .responsivewidth {
    width: 100%!important;
  }
  .picwidth{
    max-width: 50%;
  }
}

@media (min-width: 850px) {
  .responsivewidth {
    width: 768px!important;
  }
  .picwidth{
    max-width: 50%;
  }
}

@media (min-width: 1000px) {
  .responsivewidth {
    width: 768px!important;
  }
  .picwidth{
    max-width: 50%;
  }
}

.footer {
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 90px;
  line-height: 20px;
  /* Vertically center the text there */
  background-color: #f5f5f5;
}

.footer {
  font-size: 85%;
  text-align: center;
  background-color: #24282d
}

.footer a {
  font-weight: 500;
  color: #6c757d
}

.footer a:focus, .footer a:hover {
  color: #007bff
}

.footer p {
  margin-bottom: 0
}


@media (min-width:576px) {
  .footer {
    text-align: left
  }
}

.blubutton {
  background: #00B0F0;
  color: white
}

.blubutton:hover {
  background: #007daa;
}

/* Carousel base class */
.carousel {
  margin-bottom: 1rem;
}

.carousel-item {
  height: 35vh;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 35vh;
}

#carouselitem1 {
  background-image: url(/images/9mm-concealed-carry-001.jpg);
  background-position: center center;
  background-size: cover
}

#carouselitem2 {
  background-image: url(/images/9mm-concealed-carry-002.jpg);
  background-position: center center;
  background-size: cover
}

#carouselitem3 {
  background-image: url(/images/9mm-concealed-carry-003.jpg);
  background-position: center center;
  background-size: cover
}

#carouselitem4 {
  background-image: url(/images/9mm-concealed-carry-004.jpg);
  background-position: center center;
  background-size: cover
}

@media (min-width:576px) {
  .carousel-item {
    height: 40vh;
  }
  .carousel-item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 40vh;
  }
  .carousel {
    margin-bottom: 3rem;
  }
}