/*GLOBAL STYLES
-------------------------------------------------- */
 /* Padding below the footer and lighter body text */
 
 body {
     /*padding-bottom: 40px;*/
     color: #5a5a5a;
 }
 
 .carousel-p { 
     width: 85%;
     display: block;
     margin: 5px auto;
     text-align: center;
     font-family: Microsoft YaHei, STXihei;
     font-size: 14px;
     color: #cccccc;
     line-height: 24px;
     animation: fadein 2s;
     -moz-animation: fadein 2s;
     /* Firefox */
     -webkit-animation: fadein 2s;
     /* Safari and Chrome */
     -o-animation: fadein 2s;
     /* Opera */
 }
 
 .carousel-inner {
     margin-bottom: 0px !important;
 }
 
 .carousel-a {
     animation: fadein 2s;
     -moz-animation: fadein 2s;
     /* Firefox */
     -webkit-animation: fadein 2s;
     /* Safari and Chrome */
     -o-animation: fadein 2s;
     /* Opera */
 }
 
 .carousel-indicators li {
     margin: 1px 5px !important;
 }
 /* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */
 /* Special class on .container surrounding .navbar, used for positioning it into place. */
 
 .navbar-wrapper {
     position: absolute;
     top: 0;
     right: 0;
     left: 0;
     z-index: 20;
 }
 /* Flip around the padding for proper display in narrow viewports */
 
 .navbar-wrapper > .container {
     padding-right: 0;
     padding-left: 0;
 }
 
 .navbar-wrapper .navbar {
     padding-right: 15px;
     padding-left: 15px;
 }
 
 .navbar-wrapper .navbar .container {
     width: auto;
 }
 /* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */
 
 .carousel-indicators {
     bottom: 0;
 }
 /* Carousel base class */
 
 .carousel {
     /*height: 382px;*/
     /*margin-bottom: 60px;*/
 }
 /* Since positioning the image, we need to help out the caption */
 
 .carousel-caption {
     z-index: 10;
     background-color: rgba(0, 0, 0, 0.8) !important;
     width: 100%;
     right: 0;
     left: 0;
     bottom: 0;
     margin: 0px;
 }
 
 .carousel-indicators .active {
     width: 10px;
     height: 10px;
 }
 /* Declare heights because of positioning of img element */
 
 .carousel .item {
     height: auto;
     background-color: #777;
 }
 
 .carousel-inner > .item > img {
     position: relative;
     top: 0;
     left: 0;
     width: auto;
     height: auto;
     max-width: 100%;
     max-height: 100%;
     margin: 0px auto;
 }
 
 .carousel-a.focus,
 .carousel-a:focus,
 .carousel-a:hover {
     color: black;
     background-color: white;
 }
 
 .carousel-a {
     background: rgba(215, 215, 215, 0.10);
     border: 1px solid #979797;
     border-radius: 0px;
     width: 96px;
     height: 36px;
     font-family: Microsoft YaHei, STXihei;
     font-size: 14px;
     color: #ffffff;
     text-align: center;
     animation: fadein 2s;
     -moz-animation: fadein 2s;
     /* Firefox */
     -webkit-animation: fadein 2s;
     /* Safari and Chrome */
     -o-animation: fadein 2s;
     /* Opera */
 }
 
 .carousel-indicators .active {
     background-color: #c9151e;
     border: 1px solid #c9151e;
 }
 
 .carousel-header {
     font-family: Microsoft YaHei, STXihei;
     font-size: 23px;
     color: #ffffff;
     text-align: center;
     margin-top: 0px;
     font-weight: bold;
     letter-spacing: 2px;
     animation: fadein 2s;
     -moz-animation: fadein 2s;
     /* Firefox */
     -webkit-animation: fadein 2s;
     /* Safari and Chrome */
     -o-animation: fadein 2s;
     /* Opera */
 }
 /* MARKETING CONTENT
-------------------------------------------------- */
 /* Center align the text within the three columns below the carousel */
 
 .marketing .col-lg-4 {
     margin-bottom: 20px;
     text-align: center;
 }
 
 .marketing h2 {
     font-weight: normal;
 }
 
 .marketing .col-lg-4 p {
     margin-right: 10px;
     margin-left: 10px;
 }
 /* Featurettes
------------------------- */
 
 .featurette-divider {
     margin: 80px 0;
     /* Space out the Bootstrap <hr> more */
 }
 /* Thin out the marketing headings */
 
 .featurette-heading {
     font-weight: 300;
     line-height: 1;
     letter-spacing: -1px;
 }
 /* RESPONSIVE CSS
-------------------------------------------------- */
 
 @media (min-width: 768px) {
     /* Navbar positioning foo */
     .navbar-wrapper {
         margin-top: 20px;
     }
     .navbar-wrapper .container {
         padding-right: 15px;
         padding-left: 15px;
     }
     .navbar-wrapper .navbar {
         padding-right: 0;
         padding-left: 0;
     }
     /* The navbar becomes detached from the top, so we round the corners */
     .navbar-wrapper .navbar {
         border-radius: 4px;
     }
     /* Bump up size of carousel content */
     .carousel-caption p {
         /*margin-bottom: 20px;*/
         font-size: 14px;
     }
     .featurette-heading {
         font-size: 50px;
     }
     /*  .carousel-caption {
    padding-bottom:0px;
  }*/
 }
 
 @media (min-width: 992px) {
     .featurette-heading {
         margin-top: 120px;
     }
 }
 
 @media(max-width: 767px) {
     .carousel-indicators {
         bottom: -7px;
     }
     .carousel-p {
         width: 100%;
         animation: fadein 2s;
         -moz-animation: fadein 2s;
         /* Firefox */
         -webkit-animation: fadein 2s;
         /* Safari and Chrome */
         -o-animation: fadein 2s;
         /* Opera */
     }
     #myCarousel,
     .carousel-inner,
     .item .active,
     .carousel .item {
         height: 290px;
     }
 }
 
 .under-hr {
     display: block;
     border: 0px;
     height: 8px;
     padding: 0px;
     margin: 0px;
     background-image: url("../Images/under.png");
     clear: both;
     background-size: contain;
 }
 
 #myCarousel {
     margin-bottom: 0px;
 }
 
 @media (min-width: 768px) and (max-width: 1280px) {
     .carousel-p {
         width: 85%;
         animation: fadein 2s;
         -moz-animation: fadein 2s;
         /* Firefox */
         -webkit-animation: fadein 2s;
         /* Safari and Chrome */
         -o-animation: fadein 2s;
         /* Opera */
     }
 }
 /*
.carousel-fade .carousel-inner .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.carousel-fade .carousel-inner .active {
  opacity: 1 !important;
}
.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;
}