/* GLOBAL STYLES
-------------------------------------------------- */

/* Padding below the footer and lighter body text */

body {
	padding-bottom: 3rem;
	color: #5a5a5a;
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.fb-page {
}
._pc_-store-displaytype[data-v-2c96a0ab]:hover{background-color: #cda980;}
.marketing .col-lg-4 {
	margin-bottom: 1.5rem;
	text-align: center;
}

.marketing h2 {
	font-size: 3rem;
	font-weight: 400;
	letter-spacing: .2rem;
}

.marketing h3 {
	font-size: 1.1rem;
	font-weight: 400;
	letter-spacing: .05rem;
	color: darkgoldenrod;
	margin-top: 15px;
}


.marketing h4 {
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.5rem;
	letter-spacing: 0.01rem;

}


.marketing .col-lg-4 p {
	margin-right: .5rem;
	margin-left: .5rem;
}


/* Featurettes
------------------------- */

.featurette-divider {
	margin: 5rem 0;
	/* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */

.featurette-heading {
	font-weight: 200;
	line-height: 1;
	letter-spacing: -.05rem;
	padding-top: 3rem;
position:relative;
}

.carousel-fade .carousel-inner .carousel-item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.carousel-fade .carousel-control {
  z-index: 2;
} 
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .carousel-item.next,
    .carousel-fade .carousel-inner > .carousel-item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .carousel-item.prev,
    .carousel-fade .carousel-inner > .carousel-item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .carousel-item.next.left,
    .carousel-fade .carousel-inner > .carousel-item.prev.right,
    .carousel-fade .carousel-inner > .carousel-item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
} 

    .carousel-item:nth-child(1) {
background-color: white;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
    }

    .carousel-item:nth-child(2) {
background-color: white;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
    }

    .carousel-item:nth-child(3) {
background-color: white;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
    }
/* RESPONSIVE CSS
-------------------------------------------------- */
@media (max-width: 432px) {
.carousel-caption {
position:absolute;
  bottom: -4rem;
  z-index: 10;
}
.carousel-caption h1{
font-size: 1.6rem;
position:relative;
margin-bottom: 2rem;
z-index: 100;
text-align: center;
z-index: 10;
color: #fff;
text-shadow: 4px 3px 2px rgba(0,0,0,.4);
color: white ;
line-height: 1.7rem;
}
.carousel-item img{
margin-top: 0rem;
display:block;
overflow-x: hidden;

-webkit-box-align:left;
align-items:left;
min-width: 100%;
	width: auto;
	height: auto;
	max-height: 100%;
text-align: center;
}
.carouselindex img{
margin-top: 4rem;
display:block;
height:40vh;
overflow-x: hidden;

-webkit-box-align:left;
align-items:left;
min-width: 100%;
text-align: center;
	}

.carousel-indicators{
visibility: hidden;
}
.carousel-caption p {
visibility: hidden;
}
.carousel-control-prev, .carousel-control-next{
visibility: hidden;
}
.carousel-item {
  margin-bottom: 2rem;
margin-top: 5rem;
}

.featurette-heading {
font-size: 2.5rem;
font-weight: 200;
line-height: 1;
letter-spacing: -.05rem;
margin-top: .5rem;

}


}
@media (min-width: 432px) {
.navbar-brand img{
width: 150px;
height: auto;
}
.carousel-item{
  margin-bottom: 1rem;
margin-top: 2rem;

}
.carousel-item img{
display:block;
overflow-x: hidden;

min-width: 100%;
	width: auto;
	height: auto;
	max-height: 100%;
-webkit-box-align:left;
align-items:left;

}
.carouselindex img{
display:block;
height:50vh;
overflow-x: hidden;

align-items:left;
min-width: 100%;
}
.featurette-heading {
font-size: 2.5rem;
font-weight: 200;
line-height: 1;
letter-spacing: -.05rem;
margin-top: 3rem;
}


.carousel-caption {
position:absolute;
  bottom: -2rem;
  z-index: 10;
}

.carousel-caption h1{
font-size: 2.1rem;
position:relative;
margin-bottom: 2rem;
z-index: 10;
color: #fff;
text-align: center;
text-shadow: 3px 2px 1px rgba(0,0,0,.3);
color: white ;
line-height: 3.2rem;
}

.carousel-caption p {
margin-bottom: 0.25rem;
font-size: 1.25rem;
line-height: 1;
color: currentColor;
}
}

@media (min-width: 768px) {
  /* Bump up size of carousel content */
.navbar-brand img{
width: 100px;
height: auto;
}
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }
.carousel-caption h1{
font-size: 2.4rem;
margin-bottom: 0rem;
}

.featurette-heading {
font-size: 2.5rem;
font-weight: 200;
line-height: 1;
letter-spacing: -.05rem;
margin-top: 3rem;
}

.carousel {
  margin-bottom: 1rem;
}
.carousel-caption {
position:absolute;
bottom: 0;
  z-index: 10;
}
.carousel-item {
  margin-bottom: 1rem;
margin-top: 2rem;
}

.carousel-item img {
display: flex;
overflow-x: hidden;
align-items:center;
	width: auto;
	height: auto;
	max-height: 100%;
}

	.carouselindex img{
height:30vh;
display: flex;
overflow-x: hidden;
align-items:center;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}
}

@media (min-width: 992px) {

.navbar-brand img{
width: 100px;
height: auto;
}
  .featurette-heading {
    font-size: 3rem;
  }
.carousel {
  margin-bottom: 2rem;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
position:absolute;
bottom: 0;
  z-index: 10;
    text-shadow: 0 1px 4px rgba(0,0,0,.9);
}

/* Declare heights because of positioning of img element */
.carousel-item {
overflow-x: hidden;
overflow-y: hidden;
margin-top: 0rem;
max-width：100%;
height: auto;
max-height: 60vh;
}
.carousel-item img {

display: flex;
align-items:center;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;

}
.carouselindex img{
height:30vh;
display: flex;
align-items:center;
	width: auto; !important;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}
.carousel-caption h1{
font-size: 3rem;
position:relative;
margin-bottom: 1rem;
z-index: 10;
color: #fff;
text-align: center;
text-shadow: 3px 2px 1px rgba(0,0,0,.3);
color: white ;
line-height: 3.2rem;
}
.carousel-control-prev{
margin-left: 5rem;
}
.carousel-control-next {
margin-right: 5rem;
}

.featurette-heading {
	font-weight: 200;
	line-height: 1;
	letter-spacing: -.05rem;
margin-top: 5rem;
position:relative;
}



}