.datumswitch-wrap {
  margin: 15px 0;
  padding: 15px;
  background-color: #f1f2f1;
  border-radius: 7px;
  text-align: center;
  position: relative;
}

@media(max-width: 640px) {
  .datumswitch-btn {
    padding: 5px !important;  
  }
  .datumswitch-btn * {
   font-size: 70% !important;  
  }

}

.datumswitch-btn {
  background-color: #10aaff;
  padding: 7px;
}

.datumswitch-btn * {
  color: #fff;
  display: inline-block;
  vertical-align: middle;
  margin: 0 4px;
}
.datumswitch-btn i {
  font-size: 80%; 
}

.dtleft {
  position: absolute;
  left: 7px;
  top: 7px;
}

.dtright {
  position: absolute;
  right: 7px;
  top: 7px;
}

.batable th, .batable td {
  padding: 4px;
  font-size: 80%;
}
.batable th {
  font-weight: bold;
}

.trc:hover {
  background-color: #FFE6E7;
}

.trc1 {
 background-color: #FAFAFA;
}

.boxxx {
 width: 26%;
 min-width: 150px;
 background-color: #f1f1f1;
 padding: 20px;
 text-align: center;
 display: inline-block;
 margin: 0 18px 18px 0;
}
.boxxx h3 {
 font-size: 115%;
 font-weight: bold;
 margin-bottom: 6px;
}
.bubbling {
  width: 128px;
  height: 128px;
  background-color: #c8c8c8;
  margin: 5px auto;
  border-radius: 128px;
}
.bubbling * {
  color: #fff;
}
.bubbling strong {
  font-size: 90%;
  margin: -12px 0 4px 0;
  display: inline-block;
}
.bubbling span {
 font-size: 150%;
 font-weight: bold;
}
.bubbest {
 background-color: #4AB57D;
}
.bubbad {
 background-color: #B5514A;
}
.bubdiff {
 background-color: #4A95B5;
}

.tag {
 display: inline-block;
 padding: 26px;
 background-color: #f1f1f1;
 border-radius: 13px;
 margin: 0 13px 13px 0;
}

ul.paraul {
  margin: 20px 0 20px 25px;
}
.paraul li {
  font-size: 90%;
  line-height: 1.35em;
  padding-left: 7px;
  border-left: 5px solid #c8c8c8;
  color: #777;
  margin: 11px 0;
}