.block-region-left{
    padding: 10px 20px;
    margin-top: 10px;
}
.block-region-left-below {
    padding: 10px 20px;
}
.article-title h1{
  font-weight:30px;
  font-weight:normal;
}
.page-node-type-article .article-title h1 {
    font-size: 32px;
}
.page-node-type-article .node--type-article .block-region-left .field-body p{
    text-indent: 2em;
    padding-bottom: 10px;
    /*text-align: justify;*/
}
.page-node-type-article .node--type-article .block-region-left .field-body p.text-align-right{
  text-align: right;
} 
.page-node-type-article .node--type-article .block-region-left .field-body td p{
  text-indent:0;
  padding-bottom: 0;
}
.page-node-type-article .node--type-article .block-region-left .field-body img.align-center{
  padding-bottom:20px;
}
.article-title,.article-submit{
  text-align:left;
}
/********* ht *********/
.region-left .block-region-left .field-type-image{
  text-align:center;
}
.region-left .block-region-left .field-subtitle,.region-bottom .block-region-bottom .field-subtitle{
  margin-top:30px;
  padding-bottom:30px;
  border-bottom:4px solid #FF0000;
  text-align:center;
  font-size:18px;
}
.region-middle .block-region-middle,.region-bottom .block-region-bottom {
    margin-bottom: 40px;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
    box-shadow: 3.864px 1.035px 19.6px 0.4px rgb(0 0 0 / 10%);
    padding: 40px 80px;
}
.block-region-left .block span.node-title,.block-region-bottom .block span.node-title,
.block-region-middle .block span.node-title{
  display:block;
  font-size:28px;
  font-weight:600;
  text-align:center;
  padding: 40px 0;
  line-height: 150%;
}
.jwbht{
  font-size:0 !important;
  height:180px;
  background:url(../images/article/ht-sysujwb.gif) no-repeat center center;
  background-size:100%;
}
.sysuht{
  font-size:0 !important;
  height:180px;
  background:url(../images/article/ht-sysu.gif) no-repeat center center;
  background-size:100%;
}
.block-region-middle .field-subtitle{
  margin-top:0px;
  padding-bottom:30px;
  text-align:right;
}
@media (max-width: 768px){
  .region-middle .block-region-middle {
    margin-bottom:20px;
    margin-top: 0px;
    padding: 0px 20px;
    box-shadow: initial;
}
}
/* .col-md-9 .block-region-left {
    padding: 30px 50px;
    background-color: #ffffff;
    box-shadow: 3.864px 1.035px 19.6px 0.4px rgb(0 0 0 / 10%);
    margin-bottom: 70px;
    margin-top: 10px;
}
*/
.col-md-9 .article-header {
    padding-bottom: 20px;
    border-bottom: 1px solid #ECECEC;
    margin-bottom: 30px;
}
.col-md-9 .field-attachments .field-item,.col-md-9 .field-campus-attachments .field-item, .region-bottom .block-region-bottom .field-attachments .field-item {
    padding: 15px;
    background: #F2f2f2;
    margin: 3px 0;
    border-radius: 5px;
}
.block-region-left-below .field-item:before,.region-bottom .block-region-bottom .field-attachments .field-item:before {
    content: "\e793";
    font-family: "iconfont";
    font-size: 18px;
    position: relative;
    top: 2px;
}
.block-region-left-below .field-attachments .field-item:hover,.block-region-left-below .field-campus-attachments .field-item:hover,.region-bottom .block-region-bottom .field-campus-attachments .field-item:hover{
  background:rgba(0,88,28,0.8);
}
.block-region-left-below .field-item:hover:before,.block-region-left-below .field-item:hover a,.block-region-left-below .field-item:hover a:hover,.region-bottom .block-region-bottom .field-item:hover a:hover{
  color:#FFF;
}
.col-md-9 .block-region-left h3{
  font-size:22px;
  color:#117f48;
  margin-top:20px;
  margin-bottom:20px;
  font-weight:600;
}
.field-attachments .field-item:hover, .field-campus-attachments .field-item:hover{
  background:#ECECEC;
}

.field.field-additional-info.field-type-string-long.field-label-hidden.field-item{
      line-height: 180%;
    padding-left: 20px;
    color: #999;
}
/***********************  platforms **************************************************/
.platforms ul{
	padding:0;
	margin:0;
}
.platforms li{
    padding: 20px 40px 20px 55px;
    margin: 20px 20px 0 0;
    list-style: none;
    border: 1px solid #CCC;
    /* border-radius: 4px; */
    position: relative;
    float: left;
    width: 240px;
    font-size:18px !important;
    font-weight:600;
    border-left: 6px solid #005826;
}
.platforms li:before{
    position: absolute;
    left: 20px;
    top: 20px;
    height: 32px;
    width: 30px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    content: "";
}
.platforms li:hover::after {
    z-index: -1;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 240px;
    height: 74px;
    -webkit-animation: ripple 1.6s ease-out infinite;
    -moz-animation: ripple 1.6s ease-out infinite;
    -o-animation: ripple 1.6s ease-out infinite;
    animation: ripple 1.6s ease-out infinite;
    opacity: 0;
    background: #005826;
    border-radius: 0px;
}
.platforms li:nth-child(1):before{
	background-image:url(../images/article/platformicon01.jpg);
}
.platforms li:nth-child(2):before{
	background-image:url(../images/article/platformicon02.jpg);
}
.platforms li:nth-child(3):before{
	background-image:url(../images/platformicon03.jpg);
}
.platforms li:nth-child(4):before{
	background-image:url(../images/platformicon04.jpg);
}
.platforms li:nth-child(5):before{
	background-image:url(../images/platformicon05.jpg);
}
.platforms li:nth-child(6):before{
	background-image:url(../images/platformicon06.jpg);
}
.platforms li:nth-child(7):before{
	background-image:url(../images/platformicon07.jpg);
}
.platforms li:nth-child(8):before{
	background-image:url(../images/platformicon08.jpg);
}
.platforms li:nth-child(9):before{
	background-image:url(../images/platformicon09.jpg);
}
.platforms li:nth-child(10):before{
	background-image:url(../images/platformicon10.jpg);
}
.platforms li:nth-child(11):before{
	background-image:url(../images/platformicon11.jpg);
}
@keyframes ripple {
    0%, 35% {
      -webkit-transform: scale(0);
      -moz-transform: scale(0);
      -ms-transform: scale(0);
      -o-transform: scale(0);
      transform: scale(0);
      opacity: 1; }
    50% {
      -webkit-transform: scale(1.01);
      -moz-transform: scale(1.01);
      -ms-transform: scale(1.01);
      -o-transform: scale(1.01);
      transform: scale(1.01);
      opacity: 0.8; }
    100% {
      opacity: 0;
      -webkit-transform: scale(1.05);
      -moz-transform: scale(1.05);
      -ms-transform: scale(1.05);
      -o-transform: scale(1.05);
      transform: scale(1.05); } }
  @-webkit-keyframes ripple {
    0%, 35% {
      -webkit-transform: scale(0);
      -moz-transform: scale(0);
      -ms-transform: scale(0);
      -o-transform: scale(0);
      transform: scale(0);
      opacity: 1; }
    50% {
      -webkit-transform: scale(1.01);
      -moz-transform: scale(1.01);
      -ms-transform: scale(1.01);
      -o-transform: scale(1.01);
      transform: scale(1.01);
      opacity: 0.8; }
    100% {
      opacity: 0;
      -webkit-transform: scale(1.05);
      -moz-transform: scale(1.05);
      -ms-transform: scale(1.05);
      -o-transform: scale(1.05);
      transform: scale(1.05); } }
@media (min-width: 992px){
.node--type-article .col-md-9 {
    width: 83.33333333%;
}
.node--type-article .col-md-3{
  width:16.66666%;
}
}
@media (max-width: 768px){
.table-responsive{
    max-width: 100%;
    overflow-y: auto;
    max-height: 600px;
    overflow-x: auto;
    white-space: nowrap;
    overflow: auto !important;
    margin-bottom:20px;
}
.table-responsive::-webkit-scrollbar {
    width: 5px;
    border-radius: 1.5px;
    height:5px;
    background-color: transparent;
}
.table-responsive::-webkit-scrollbar-thumb {
    background: #117f48;
    border-radius: 1.5px;
}
.table-responsive::-webkit-scrollbar-track {
    background: #F5F5F6;
    border-radius: 1.5px;
}
.table-responsive table{
  margin:0;
}
.table-responsive table td,.table-responsive table td p,.table-responsive table td span{
  font-size:14px !important;
}
}
table {
    border-collapse: initial;
}
table.table-striped tbody tr:nth-of-type(odd)
{
background:#f2f2f2;
}
table.table-striped {
   
}
table.table-striped tbody{
  border:1px solid #999;
}
table.table-striped thead th {
    height: 30px;
    background: #005826;
    color: #FFF;
    border:1px solid #005826;
}
figcaption{
  font-size:12px !important;
  padding-top:0;
}
/************ progress ******/

 @-webkit-keyframes load {
    0% {
      stroke-dashoffset: 0;
     }
 }

@keyframes load {
   0% {
     stroke-dashoffset: 0;
   }
}
.datacircle .progress {
   position: relative;
   display: inline-block;
   padding: 0;
   text-align: center;
}
.datacircle .progress > li {
   display: inline-block;
   position: relative;
   text-align: center;
   color: #93A2AC;
   font-family: Lato;
   font-weight: 100;
   margin: 2rem 0.9rem;
   line-height:100% !important;
}
.datacircle .progress > li:before {
   content: attr(data-name);
   position: absolute;
   width: 100%;
   bottom: -2rem;
   font-weight: 400;
}
.datacircle .progress > li:after {
    content: attr(data-percent);
    position: absolute;
    width: 100%;
    top: 40%;
    left: 0;
    font-size: 1.5rem;
    text-align: center;
    line-height:100% !important;
}
.datacircle  .progress svg {
    width: 8rem;
    height: 8rem;
}
.datacircle .progress svg:nth-child(2) {
   position: absolute;
   left: 0;
   top: 0;
   -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.datacircle .progress svg:nth-child(2) path {
    fill: none;
    stroke-width: 25;
    stroke-dasharray: 629;
    stroke: #fff;
    opacity: .9;
    -webkit-animation: load 10s;
    animation: load 10s;
}
.dataline .progress {
    position: relative;
    height: 40px;
    margin-bottom: 20px;
    overflow: hidden;
    /* background-color: #f5f5f5; */
    border-radius: 4px;
    /* -webkit-box-shadow: inset 0 1px 2px rgb(0 0 0 / 10%); */
    /* box-shadow: inset 0 1px 2px rgb(0 0 0 / 10%); */
}
.dataline .progress-bar {
    float: left;
    width: 0%;
    height: 100%;
    font-size: 14px;
    line-height: 40px;
    color: #fff;
    background-color: #337ab7;
    -webkit-box-shadow: inset 0 -1px 0 rgb(0 0 0 / 15%);
    box-shadow: inset 0 -1px 0 rgb(0 0 0 / 15%);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
    line-height:40px !important;
}
.progress-bar-cl1{
  background-color: #039BE7 !important;
}
.progress-bar-cl2{
  background-color: #01ACC0 !important;
}
.progress-bar-cl3{
  background-color: #038779 !important;
}
.progress-bar-cl4{
  background-color: #398E3B !important;
}
.progress-bar-cl5{
  background-color: #6C9F3A !important;
}
.dataline .progress span {
    position: absolute;
    line-height: 40px;
    padding-left: 20px;
    display: block;
    color: rgba(255,255,255,0.8);
}
@media (max-width: 768px){
  .dataline .progress{
    overflow:inherit;
    margin-top: 40px;
  }
  .dataline .progress span{
    color: #999;
    top: -35px;
    left: -20px;
    
  }
}