.color-blue {
  color: #28a7e1;
}
hr {
  margin-top: 0px;
}
.color-gray {
  color: #999999;
}
ul {
  padding: 0px;
  margin: 0px;
}
.mdactive a {
  color: #28a7e1;
}
#btn {
  border-radius: 40px;
  padding: 10px 25px;
  background-color: rgba(67, 156, 196, 0.6);
  color: #ffffff;
  border: none;
  font-size: 1em;
  position: absolute;
  border: 1px solid #ffffff;
  text-align: center;
  top: 40%;
  left: 32%;
}
#btn a {
  color: #ffffff;
}
.breadcrumb {
  content: "/ " !important;
  line-height: 25px;
  margin-bottom: 0px;
  width: 100%;
  border-bottom: 1px solid #b9b9b9;
  border-top: 1px solid #b9b9b9;
  margin-top: 53px;
  background-color: #ffffff;
  border: 1px solid #ffffff;
}
.breadcrumb li a {
  color: #000000;
}
.breadcrumb li.active {
  color: #56b4e5;
}
.icon-menu {
  margin-top: -20px;
}
.icon-menu .col-md-2 {
  width: 14.28% !important;
  border-bottom: 1px solid #b9b9b9;
}
.icon-menu .col-md-2 img {
  margin: 10px auto;
}
.icon-menu .col-md-2 p {
  text-align: center;
}
.icon-menu .col-md-2 p:hover {
  cursor: pointer;
}
.icon-menu .mdactive {
  border-bottom: 2px solid #28a7e1;
  position: relative;
}
.icon-menu .mdactive:after {
  position: absolute;
  bottom: 0px;
  border: 1px solid #ff0000;
}
.icon-menu .md-Triangle {
  position: absolute;
  width: 0;
  height: 0;
  border-right: 5px solid transparent;
  border-bottom: 5px solid #28a7e1;
  border-left: 5px solid transparent;
  left: 45%;
  bottom: 0px;
}
#main {
  height: auto;
  margin-top: 60px;
  color: #7a7a7a;
  text-align: center;
}
#main h3 {
  font-size: 1.3em;
}
#main .pagination li a {
  margin-right: 10px !important;
  border: 1px solid #b6bcc1 !important;
  color: #7f8c97;
  border-radius: 10%;
}
#main .pagination li a.active {
  color: #ffffff !important;
  background-color: #28a7e1 !important;
}
#main .thumbnail {
  position: relative;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  transition: all 0.5s;
  z-index: 9;
}
#main .thumbnail h3 {
  font-size: 1.2em;
}
#main .thumbnail img {
  height: 200px;
  margin-top: 20px;
}
#main .mb-main {
  width: 70%;
  margin-left: 15%;
}
#main .mb-main img {
  height: 40px;
  display: block;
  margin: 0px auto;
  cursor: pointer;
}
#main .mb-main p {
  margin-top: 40px;
  margin-bottom: 30px;
  font-size: 1.2em;
}
#main .in-detail img {
  display: block;
  margin: 20px auto;
  height: 400px;
}
/*当屏幕尺寸小于800px时，应用下面的CSS样式*/
@media screen and (max-width: 800px) {
  .icon-menu .container-fluid {
    padding: 0px;
    width: 100%;
    font-size: 0.5em !important;
  }
  .icon-menu .container-fluid .col-xs-3 {
    width: 25% !important;
    padding: 0px;
  }
  .icon-menu .container-fluid .col-xs-3 p {
    margin-top: 10px;
    font-size: 1.8em !important;
  }
  .icon-menu .container-fluid .col-xs-3 img {
    width: 30px;
    height: 30px;
  }
  .icon-menu .container-fluid .col-md-2 {
    border-bottom: 1px solid #ffffff ;
    margin-bottom: 10px;
  }
  .icon-menu .container-fluid .mdactive {
    border-bottom: 1px solid #28a7e1 !important;
    position: relative;
  }
  .icon-menu #main {
    margin-top: -20px;
  }
  #main {
    text-align: left;
  }
  #main .thumbnail {
    padding: 0px !important;
  }
  #main .thumbnail img {
    height: 100px !important;
  }
  #main h3 {
    font-size: 0.9em !important;
  }
  #main p {
    font-size: 0.8em !important;
  }
  #main #btn {
    left: 7%;
  }
  #main .in-detail img {
    display: block;
    margin: 0px auto;
    height: 200px;
  }
  #main .th-mask {
    display: none !important;
  }
}
